《人机交互技术》 第七章 Web界面设计

第七章 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点

猜你喜欢

转载自blog.csdn.net/shujian_tianya/article/details/80733921
今日推荐