第七章 Web界面设计
1.Web相关概念(第二版 P164)
Web是一个由许多相互链接的超文本(Hyper Text)文档组成的系统,用户通过Internet对其访问,进行交流与共享信息。资源通过超文本传输协议(HTTP)传送给用户。
超文本(Hypertext):是一种使用于文本、图形或计算机的信息的组织形式,是一种非线性的信息组织形式。它使得单一的信息元素之间相互交叉引用,这种引用并不是通过复制来实现的,而是通过指向对方的地址字符串来指引用户获取相应的信息,超文本标记语言(HTML)是超文本最常使用的格式。
Web界面设计的人性化、易用性是Web界面设计的核心,如何根据人的心理、生理特征,运用技术手段,创造简单、友好的界面,是Web界面设计的重点。
2.Web界面设计原则(第二版 P167)
- 以用户为中心:既考虑共性,也考虑差异性
- 一致性:内容和形式的一致性、风格的一致性
- 简洁与明确:网页层次化、显示字体和颜色的数目、减少浏览层次
- 体现特色
- 兼顾不同浏览器
- 明确的导航设计
站点的结构可分为逻辑结构和物理结构:逻辑结构描述文档间的关系,定义文档间的链接;物理结构描述文档的实际位置及显示方式。
WWW网上,最普通的超文本结构是层次结构和树型结构
Web界面设计的3C原则:简洁、一致性、对比度(第一版 P177)
3.Web界面设计要素
(1)规划(第一版 P178)
确定目标(企业 OR 个人)、布局规划、网站规划、建立原型、详细设计、正式实施
(2)设计要素(第一版 P181)
布局:合理、有序、整体化;“同”、“国”、 “匡”、“三” 、“川”字形布局 、左右对称布局、自由式布局
色彩:
确定网站的标准色彩:不同的色彩搭配产生不同的效果,并可能影响到访问者的情绪。
以红、绿、蓝三色称为三基色:其它的色彩都可以用这三种色彩调和而成。
底色应柔和、素雅:柔和的底色配上深色文字,读起来自然,流畅。
网页色彩搭配的原则:鲜明性、独特性、合适性、联想性
文本:(第一版 P174)
文本不要太多,以免转移浏览者注意力。
要选择合适的颜色,以便使文本和其它界面元素一起产生一个和谐的视觉效果;文本的颜色应该一致,让用户可以容 易地确定不同文本和颜色所代表的内容。
选择的字体应和整个界面应融为一体;一旦已经为某些元素选择了字体,应该保证其在整个网站中应用的一致性。
网站中可能会使用多种字体,但是同一种字体应该表示相同类型的数据或者信息。
通过合理设置页边框、行间距等,使Web界面产生丰富变化的外观和感觉。
应该重视标题的处理。标题一般无分级要求,其字形一般较大,字体的选择一般具有多样性,字形的变化修饰则更为丰富。
动画与多媒体:
导航:
4.Web界面设计的基本技术和工具(第二版P175)
超文本标记语言HTML 和CSS (Cascading style sheets层叠样式表)
C#
客户端脚本语言JavaScript
JavaApplet
服务器端脚本语言 ASP PHP JSP
页面编辑器、辅助工具(第一版 P192)
5.Web界面设计的新技术(第一版 P193)
Web 3D图形技术
语音Web技术
6.实例分析(第一版 P198)
商业站点
信息站点
娱乐站点
门户站点
8.交互设计指南 12点