随着移动端的大力普及,移动端网站也正日益发挥着越来越大的作用。由于设备尺寸、分辨率、显示效果等方面的差异,移动端网站在设计方面同PC端网站也有着不同。这里我们以字体为例,来看看移动端网站通常采用什么样的字体。
移动端网站通常选用什么字体呢?我们知道,尽管安卓的市场份额很大,但是安卓机是一个开放的底层系统,不易统一。所以设计师通常会选择以苹果手机iPhone上的显示效果为准。那么,在模拟iPhone浏览器默认的文字时设计师就拿不准应该选用什么字体了。在Windows平台下设计iOS产品是一个很严重的问题。那就是Windows下暂时无方法完整渲染出苹果系统的效果。在上图中我们可以看到,在Mac机上模拟iOS默认字体时可以直接使用苹果原生的字体:黑体-简(HEITI-SC )。渲染模式选为苹果渲染模式即可。如果是PC机需要模拟iOS默认字体,那么用黑体简会有比较大的出入,反而使用华文细黑-浑厚模式比较接近默认字体。
首先需要说明的是,由于我们设计图像时的屏幕并不是Retina的屏幕,所以我们需要设计看起来是12像素大小的文字时,我们需要在PS里建立一个24像素的文本框。这就让我们无法直接看到真实手机上显示的效果了。所以我们需要不断地存成图片然后导入到真机里测试效果。那么如果我们需要设计的移动网站里有很多文字文本,那么多大尺寸的文字才是适合阅读的呢?虽然不同的人有着不同的观点,但是总结说来,一般小于22PX的文字基本上是难以阅读的,在进行移动端网站文字调整的时候需要注意。