网页视觉设计

网页页面设计第二章总结出来的思维导图，边复习边学习~内容涵盖视觉基础设计，视觉元素设计，视觉层次设计。

网页视觉设计

• 视觉基础设计
  • 点，线，面
    • 点移动成线，线移动成面
    • 线条有划分网页版面的功能，装饰线条使画面变得更加生动有趣
    • 线条有连贯的功能，对阅读顺序起引导视线作用
    • 点与线构成大多体现在细节上，而面构成则直接影响网页整体风格和布局，不同面相状视觉效果也不同
  • 多种构成形式在网页中的综合表现
    • 常见构成形式：重复，渐变，辐射，对比
    • 网页设计并不等同于单纯的构成练习，需考虑到阅读方便和使用功能
    • 渐变是网页中常见构成表达方式
    • 色彩渐变比结构渐变对网页内容和使用功能影响小
• 视觉元素设计
  • 色彩设计
    • 色彩差别，差别越大，对比越强，相反则越弱
    • 色相对比，明度对比，纯度对比
    • 色相对比：同类色相对比，类似色相对比，对比色相对比，互补色相对比
    • 明度对比：色彩的明暗程度对比，也称色彩黑百度对比
    • 纯度色彩对比：具有强烈鲜明的特点，对比色相的高纯度对比易令人产生眩目杂乱的视觉感受
  • 色彩调和
    • 对比是绝对的，是普遍存在的
    • 搭配中会在色相，纯度，明度，面积等方面或多或少地形成差别
    • 相对于色彩对比而言，两者既排斥又相互依存，相辅相成的关系
  • 文字设计
    • 网页文字：文字型标志，标题，超级链接，正文信息
    • 文字型标志：有象征意义的文字作为造型基础，对其变形或抽象地改造
    • 标题：采用文字形式外，信息栏目，网络广告的标题也是通过文字形式体现的
    • 超级链接：
    • 正文信息：主体是动画，图形，影音等，其他任何元素不可取代
  • 文字的使用
    • 实现字义和语义的功能
    • 美学效应
    • 基本只用黑体和宋体
    • 中文网开始采用微软雅黑字体
    • 常用网页字体不超过8种
  • 文字图形化
    • 实现文字的字体效果
    • 合理变形搭配，使之产生趣味
• 视觉层次设计
  • 栅格设计主要功能
    • 处理布局以建立页面秩序
    • 保持页面之间的连贯性
    • 保持特有的美感
  • 层次对比
    • 突出重要内容
    • 建立视觉延续性
  • 层次对比
    • 尺寸对比：创造层次，引导读者视线有效方法
    • 色彩对比加强设计色彩对比能引起更大关注；
    • 对齐对比；左对齐，右对齐，居中对齐，两端对齐
  • 延续
    • 重复：体现色彩，图形，背景等元素之间的关联性
    • 留白：文字，段落，图片，链接，页脚之间都是所谓空白区域
    • 相似性：利用图形，色彩，文字，间隔，分割线等元素关系密切