《网页界面设计说明》由会员分享,可在线阅读,更多相关《网页界面设计说明(47页珍藏版)》请在金锄头文库上搜索。
1、第八章网页界面设计 重点与难点 第一节网页的风格定位 第二节网页的版式设计 第三节网页界面的色彩设计 首页 重点与难点 网页的版式设计网页的色彩设计 第一节网页的风格定位 电脑艺术平面设计的特点 根据主题的内容决定其风格与形式网页的应用范围 欢乐谷主题公园网 美国政府的官方网站www firstgov gov 世纪风商务网站 第二节网页的版式设计 版式设计的造型 标题 内容 主体图形 色调 视觉中心 背景和留白都是造型的最基本元素 1 运用自适应宽度技术 1024 768像素环境下的页面效果 800 600像素环境下的页面效果 2 运用背景来适应不同分辨率的版面效果 1024 768像素环境下
2、运用背景填充空白部分 800 600像素环境下 3 使版面保持固定尺寸 禁止滚动出现 页面中的点 线 面及留白的处理 点的作用 www2 coca 线与面的作用 版面的大面积的空白给人以无限的想象空间 留白的运用 点 线 面关系的处理 由文字构成的点 线 面关系的标题与导航按钮 版式设计的构成形式 分割与比例 黄金分割比及画法 黄金分割画法 金星女神维纳斯具体比例标准 重复与渐变 重复的图案有序的排列 并作淡化处理作为背景图案 重复与渐变 运用色块儿见画面分割成马赛克状 并作淡如淡出处理 突出了图片主体部分 使画面层次鲜明 秩序感强 对称与均衡 均衡 故宫紫禁城在对称的造型中有一种威严的宏伟气
3、势 返回 相对对称具有对称的稳定性 同时又富于变化 返回 均衡既是平衡 能使设计版面更具和谐的生命力 节奏与韵律 不规则的流动式排列形成一种律动的美感 给画面增添了动态效果 多样与统一 形式统一 色调统一 版式设计的构成类型 在网页设计中较常见的网页版式构成类型主要有 水平分割式 垂直分割式 水平与垂直分割交叉式 斜线式 S 曲线式 重复式等 水平分割的页面具有较强的视觉稳定性 给人平静 安定的感觉 返回 垂直分割强调的是垂线的视觉冲击力 体现坚强 理智与秩序的感觉 返回 曲线 弧线 曲线形状的应用能够产生运动 韵律的动感 形成富有活力的视觉效果 返回 曲形与直形的综合应用是将以上两种线条和形
4、状结合起来运用 不仅能够丰富网页的表现力 还能使网页更富于变化 艺术效果更丰富多彩 返回 第三节网页界面的色彩设计 非彩色的搭配 色彩的搭配 网页色彩配置的方法 网页色彩搭配方案 第三节网页界面的色彩设计 非彩色的搭配 黑白两色是最简单基本的搭配 黑底白字 白字黑底都能清晰明了表现网页内容 色彩的搭配 色彩的鲜明性色彩的独特性色彩的适合性色彩的联想性 鲜艳的色彩容易引人注目 与众不同的色彩 人印象强烈 所选色彩和表达的内容气氛适合 不同色彩会产生不同的联想 网页色彩配置的方法 同一色彩的不同明度使用对比色使用同类色 类似色非彩色与有彩色结合 首先确定运用一种色彩 然后调整透明度或者饱和度 将网
5、页背景 文字 边框等元素都控制在此色彩中 只是在明度上有所变化 同一色彩的不同明度 返回 需要你熟悉色环 准备一个色环参考 首先选定一种色彩 然后选择它的对比色 影响对比色配色效果的重要因素在于使用的色调 使用对比色 返回 同类色 类似色适合凝造整齐统一的气氛 但是应注意避免缺少对比 而使画面不够响亮 使用同类色 类似色 返回 深浅不同的灰色与较单一的有彩色搭配是比较安全的配色方案 非彩色与彩色搭配时 可以起到突出色彩的效果 非彩色与有彩色结合 返回 网页色彩搭配方案 奔放 激情的配色 自然 静寂的配色 宁静 朴素的配色 亲切的配色 柔和 女性的配色 神秘的配色 职业的配色 动态效果强烈的鲜明对比色彩赋于站点奔放 激情的个性 奔放 激情的配色 返回 自然的 静寂的配色 返回 宁静 朴素的氛围要以整洁的环境为基础 所以在创造这种环境时要避免运用过多的颜色 尽量运用浅淡清爽的色调 才能得到较好的效果 宁静 朴素的配色 返回 亲切的配色 返回 女性带给人的感觉多是柔美 典雅的 粉质的色彩用来表现女性的温柔和典雅魅力再合适不过了 柔和 女性的配色 返回 蓝紫色 金色等能营造神秘的高层感觉 神秘的配色 返回 职业的配色 返回 知识回顾KnowledgeReview