视觉设计 » 网页设计尺寸规范(简易版)

网页设计尺寸规范(简易版)

发表于: 视觉设计. 评论
Sponsor

网页设计的规范其实没有那么复杂,很多教程长篇大论,看完就往,本文浓缩成精华方便查看,如果有不懂的,可以留言提问哦。本文从尺寸、布局到字体、颜色提供有效的设计规范,以及响应式和栅格布局的运用,为网页设计师提供实用的指导参考。

以下是网页设计尺寸规范:

  1. 网页尺寸
    • 分辨率:72像素/英寸
    • 推荐分辨率:1920px * 1080px
    • 内容区的宽度:建议在1000-1200px以内,1200px较常见
    • 一屏幕的高度:一屏高度约为900pxx(加上浏览器本身与插件和底部工具条等距离)
  1. 网页布局
    • 左右布局:左侧为导航栏,右侧为内容展示区域
    • 居中布局:中间为有效显示区域,两侧为留白
  1. 网页字体
    • 总原则:可辨识性和易读性,通常使用非衬线字体
    • 中文字体:宋体、微软黑体、苹果系统黑体
    • 英文字体:Times New Roman、Arial、Comic Sans MS等
    • 字体大小:12px为最小字体,适用于注释;14px适用于正文;16px、18px、20px、26px或30px适用于标题
    • 字体间距:行间距推荐为字体大小的1.5-2倍,段间距为2-2.5倍
  1. 颜色
    • 主字体颜色:建议使用品牌VI颜色
    • 正文字体颜色:易读性深灰色,如#333、#666
    • 辅助性文字:较浅颜色,如#999
  1. 响应式布局
    • 保证不同设备和环境下信息表现一致,可交互可操作
  1. 栅格布局
    • 以8像素为单位,间距为8、16、24、32等8的倍数进行设计,以适应不同屏幕和分辨率

最后,该网页指出设计规范是参考,并不会限制设计师的创意。

如果您需要更详细的信息或有其他问题,请告知。

赞助商链接
赞助商链接
设计达人微信交流社区:shejidaren888
喜欢这篇文章吗?欢迎分享到你的微博、QQ群,并关注我们的微博,谢谢支持。
版权:除非注明,本站文章均为原创文章,转载请联系我们授权,否则禁止转载。

{ 发表评论 }