网页UI设计规范、布局及提升用户体验设计（一）

网页UI设计规范

1. 网页规范：

网页宽度设定为1920像素，高度不设限制，有效可视区通常在950px至1200px宽度之间，实际尺寸依项目需求、客户要求及目标用户群体而定。

2. 字体规范：

中文常用字体包括宋体（无衬线）、微软雅黑（Windows LCD）和苹方（MAC）。英文常用字体有Times New Roman、Arial和sans-serif字体。

• 中文字常用字号：
  • 导航文字：14px、16px、18px、20px
  • 正文内容：12px、14px
  • 标题：22px、24px、26px、28px、30px
  • 辅助信息：12px、14px
• 英文字常用字号：
  • 标题和内容文字：10-16px
  • 中英文结合：最小12px
  • 全英文网站：最小10px（如底部信息）

3. 网页页面等级：

4. 网页常见板块划分：

5. 网页的颜色选择：

• 源自LOGO的颜色
• 环境启发的颜色
• 产品相关的颜色
• 通过调整四色明度和色相创建平衡
• 从产品相关图片中提取四种颜色作为主色调（常见于服装、饰品、化妆品类网站）

6. 网页设计注意事项：

• 使用高清无水印大图
• 图片旁应配以文字说明，避免大量无文字的图片展示
• 文字排版要避免标点符号在行首，单字不应独占一行
• 文字位于色块中央，不宜留过多空白
• 箭头朝下需有下拉菜单，合起状态时箭头朝右
• banner需原创设计，含文字层次和对比
• 产品分类需展示不同产品
• 每个板块应有明显链接
• 避免重复图片，确保每张图片有独特元素
• 勿直接使用预设计的图片素材
• 板块设计要有文字解释和链接
• 同一版块内图片风格保持一致
• 图片与文字间保持适当距离