如何使我的Photoshop文字像在网络上一样显示?


11

我是否真的必须在Photoshop中将抗锯齿设置为“无”的所有东西进行设计?我敢肯定有更好的方法。

我想要一个设置,以便在Photoshop中选择基本的网络安全(例如Tahoma)时,可以看到它在网络上的实际外观。

例如:Tahoma在Photoshop中将抗锯齿设置为“ crisp”和在Firefox中呈现的方式之间的区别是很大的。它在Photoshop中看起来不错且流畅,并且看起来像是网上的垃圾。

在计划将内容发布到网络上时,是否有一个最佳的防锯齿选择(效果最相似)?


1
字体在网络上的外观完全取决于浏览器,浏览器设置,操作系统和操作系统设置。换句话说,对于不同的人,它看起来有所不同。
2012年

Answers:


10

大多数操作系统和浏览器使用抗锯齿或亚像素抗锯齿进行渲染。亚像素抗锯齿在台式机平台上很常见,例如Windows(带有ClearType)和OSX。标准单色抗锯齿在移动平台上很常见,其中设备的亚像素顺序可能会随设备方向而变化,而亚像素渲染则不会。至关重要,因为它们通常具有较高的像素密度显示器。

混淆文本呈现在Windows XP上很常见,默认情况下禁用了ClearType。Windows Vista和更高版本默认情况下启用ClearType。


Photoshop,Windows,OS X,iOS,Android,WebKit,Firefox(Gecko)中的渲染通常都不同。因此,除非您截取屏幕截图并将其作为位图图层添加到文档中,否则绝对不可能在Photoshop中构建某些内容并知道文本渲染将是相同的。


2
自回答了这个问题以来,Adobe在使用系统字体渲染的Photoshop中添加了“ Mac”和“ Mac LCD”选项(以及Windows上的等效选项)。现在它通常与Safari非常接近或完全相同。
马克·爱德华兹

8

否。新思路是避免使用Photoshop进行布局和版式设计,并尽早在浏览器中启动。

通过向客户传递一个实际的URL(而不是Photoshop组件),可以避免当最终产品在他们选择的浏览器中与Photoshop组件相比略有不同时,客户的期望被打乱了。

最终,教育客户并让他们意识到浏览器和操作系统之间不可避免的印刷差异是我们的责任。


1
在我的公司,我创建设计并将其交给前端开发人员。我从不接触代码。话虽如此,我需要一个不涉及实际构建网页即可查看文本内容的解决方案。
jonn_g 2012年

2

在Photoshop CC中,我们为您的字体添加了新的别名模式。尝试使用新的“ Mac LCD”而不是“酥脆”或“强壮”。您将获得100%的网络安全设计。


1
鉴于没有跨浏览器,字体和操作系统的100%一致性,因此没有“ 100%Web安全设计”之类的东西。
DA01 2013年

1

简短的回答:不能。

Photoshop不仅永远不适合了解您的字体如何在其外部进行渲染,而且对于一般使用字体也不是很理想。(当我在设计公司/印刷厂工作时,出于同样的原因,必须将PS中设计的所有内容都导出为PDF)。然后是网络问题,即浏览器和运行这些浏览器的操作系统。到目前为止,据我所知,就适当地呈现字体而言,OS X是最好的,而Linux位居第二,Windows当然位居第二。现实情况是,它们都使用不同的算法来渲染字体,并且您不会在各处获得相同的结果。如果有解决方案,那就是我们都切换到Linux,Mac或等待,直到微软下一次使用Windows Metro成功(抱歉,我讨厌称它为Windows 8)或完全失败之后,

只是我的2美分

补丁


0

在我看来,在浏览器中进行渲染的位置在Mac上介于Photoshop的“ Sharp”和“ Crisp”之间,而在Windows上介于“ Crisp”和“ Strong”之间。我建议对与我合作的图形设计师使用“ Crisp”实时文本。默认的“强”总是使他们失望。;)

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.