服务热线:

021-51085186

021-51085186
2016-11-22

界面设计字体怎么用最好看,有没有什么规范?

您现在的位置:首页 » 文章中心 » 常见问题

      在平日的设计中,至少一次甚至多次在工作中因为字体不协调栽跟头,在上海网站设计工作的实践过程中,小编我决定把平日里总结的和在网络上学到的一些规范跟大家分享一下:

一、喜欢的字体,不知道名字

       当我们欣赏到别人好看的字体时,我们总是想要快速的知道别人用的是什么字体?其实这时候,咱们可以使用一个神器“求字体”。

二、字体样式太多,导致页面杂乱

在每个项目中只使用1-2个字体样式,而在品牌字有明确的规范情况下,只需要一种字体贯穿全文,通过对字体的放大来强调重点文案。字体用的太多,反而显得不够专业。

不同的样式的字体,形式或者系列最好相同,保证字体的风格一致性。

字体与北京的层次要分明,明确字体样式与色调气氛相匹配。

      三、界面中文字使用的规则

      移动端字体:常选用华文黑体或者冬青黑体,尤其是冬青黑体效果最好。比如IOS,就采用的这样的方式。英文的话,建议采用Roboto字体,比如安卓就采用的这样的字体

      移动端字号:导航主标题字号:40-42px,建议采用偏小的40px会显得更加精致一些。正文字号:大的正文采用32px,副文采用26px,小字的话,则建议采用20px。

     温馨提示:

    1、移动App正文采用36px。

    移动APP会有所不同,像新闻类的APP或者文字阅读类的APP更注重于文字的阅读便捷性,因此他的字号会变大一些,选用36px,丙炔选择性的加粗。这点的效果,咱们可以看看自己手机上的今日头条APP。

    2、列表样式、工具化的APP普遍是正文32px,不加粗。副文案26px,小字号20px。比如微信。

    3、划分类文案字号:有些时候,用于划分类别的提示文案,也会采用26px,但是值得注意的是,这里的字一定不能讲过朱列表信息的引导效果。

    4、大按钮的话,可以采用.36px。为了拉开按钮的层次,同时加强按钮引导性,选用了稍大号的字体36px。比如微信。

pc网页版的设计

在制作网页设计的时候,网页中文字字号一般都是宋体12px或14px(无状态),大号字体用微软雅黑或黑体。大号字体是18px、20px、26px、30px,一般使用双数字号,单数的字体在显示的时候会有毛边。

下面介绍一下常用的字体的使用方法:

1>微软雅黑这款字在页面设计中,使用的非常频繁,这款字无论是放大还是缩小,形体都非常的规整舒服。在设计过程中,建议多使用雅黑,大标题的话,可以采用加粗字体,正文用常规字体。

2>中黑系列的字体笔画比较锐利而浑厚,一般运用在标题文字中。但这种字体不适用于正文中,因为边缘相对比较的复杂,文字一多会影响用户的阅读。

     3>汉仪菱心简/造字工房力黑/造字工房劲黑

     这三种字体,有个共同的特点,字体非常的有力而厚实。基本上市以直线和斜线为主。适合广告和专题使用。菱心和造字工房力黑在笔画、拐角的地方采用了圆和圆角。而且笔画也比较的疏松,适合于时尚感比较强的广告使用。劲黑这种厚重和方正,在大图使用中更为广泛一些。

     4>毛笔字生成器。这种更偏用于古典风格的网站,更能体现年代感。怎们可以使用毛笔字体做banner呢,将下载袭来的字体图片AI转路径,编辑文字。首先使用在线生成器输入选择好你需要的文字字形,将文字图片拖至AI中。选中拉入图片,点击[图像描摹],然后继续点击[扩展]按钮,扩展完毕后,图片已经都变成了路径。使用魔棒选择颜色就可以将文字的路径提选出来。最后经过设计后的Banner效果,最后出来的效果下图。

     四、字体常用颜色

     在白色的背景下,字体的颜色层次其实就是黑、深灰、灰色。常用的色值是:#333333深黑色,#666666深灰色,#999999 灰色。

     在界面中常用到的背景色:#eeeeee,分割线想要深一点的话采用#e5e5e5想要浅一点就用#cccccc。

     设计的时候我们还可以将字体进行变形来达到宣传的目的,这个需要设计师对字体设计有一定的了解。

      总结,在制作网站的时候,都是有一定设计规范和体系的,只要咱们合理的使用设计复返,在画画的需求中找到定量,调整起来也会轻松很多哦!