第8章Web界面设计
第8章 Web界面设计
本章内容简介 ◆互联网上Web站点和页面的设计基 础 ◆Web站点的信息交互模型和结构 ◆Web界面设计的基本思想和原则 ◆Web界面设计的工具和技术 ◆Web界面设计的可用性评估 ◆一些典型的Wb站点实例 人机交互技术编写组
人机交互技术编写组 2 本章内容简介 互联网上Web站点和页面的设计基础 Web站点的信息交互模型和结构 Web界面设计的基本思想和原则 Web界面设计的工具和技术 Web界面设计的可用性评估 一些典型的Web站点实例
8.1Web基础 互联网是近年来对社会影响最大的技术进步,影 响到人类生活的很多方面 ◆互联网已经成为全面支持多媒体,能在多种平 台上运行的庞大信息服务系统。 ◆互联网的应用范围也日趋扩大,被广泛用于商 业办公、业务管理、购物娱乐等人类生活的各 个方面,业已成为一种全球化社会现象 人机交互技术编写组
人机交互技术编写组 3 8.1 Web基础 互联网是近年来对社会影响最大的技术进步,影 响到人类生活的很多方面。 互联网已经成为全面支持多媒体，能在多种平 台上运行的庞大信息服务系统。 互联网的应用范围也日趋扩大，被广泛用于商 业办公、业务管理、购物娱乐等人类生活的各 个方面，业已成为一种全球化社会现象
8.1.1Web的出现与发展 ◆90年代初,瑞士日内瓦的欧洲核能研究中心分 布在世界各地的科学家需要高效率的通讯方式 来进行彼此交流与分享信息 ◆该中心高能核理学家 Tim Berners-Lee研究发展 了万维网( World wide Web,WWW)的雏形, 目的是为了建立一个能够整合各种资源、文件 及多媒体的系统,让使用者方便地取得不同媒 体的资料 人机交互技术编写组
人机交互技术编写组 4 8.1.1 Web的出现与发展 90年代初，瑞士日内瓦的欧洲核能研究中心分 布在世界各地的科学家需要高效率的通讯方式 来进行彼此交流与分享信息。 该中心高能核理学家Tim Berners-Lee研究发展 了万维网（World Wide Web，WWW）的雏形， 目的是为了建立一个能够整合各种资源、文件 及多媒体的系统，让使用者方便地取得不同媒 体的资料
WWW-环球信息网络空间 ◆简单来说,WWw是建立在客户/服务器模型之 上,构成的一个环球信息网络空间,主要使用: 超文本标记语言( Hypertext Markup Language, HTMD) 超文本传输协议( Hypertext Transport Protocols, Http ) 通过 Internet把遍布世界各地的服务器连接起来, 它能够提供各种 Internet服务,具有一致用户界面 的信息浏览功能 人机交互技术编写组
人机交互技术编写组 5 WWW-环球信息网络空间 简单来说，WWW是建立在客户/服务器模型之 上，构成的一个环球信息网络空间，主要使用： ◼ 超文本标记语言（Hypertext Markup Language， HTML） ◼ 超文本传输协议（Hypertext Transport Protocols， HTTP） 通过Internet把遍布世界各地的服务器连接起来， 它能够提供各种Internet服务，具有一致用户界面 的信息浏览功能
Web页面的发展趋势 ◆eb的一个发展趋势,是图形Web页面 的爆炸性发展。网上浏览中包括了大量 使用的动态图形,使图形Web遍布网络 的各个角落 ◆新一代Web信息描述标准ⅹML,能更详 尽地描述文档的结构信息,具有比HTML 有更强大的功能,为Web的发展提供了 强有力的支持。 人机交互技术编写组
人机交互技术编写组 6 Web页面的发展趋势 Web的一个发展趋势，是图形Web页面 的爆炸性发展。网上浏览中包括了大量 使用的动态图形，使图形Web遍布网络 的各个角落。 新一代Web信息描述标准XML，能更详 尽地描述文档的结构信息，具有比HTML 有更强大的功能，为Web的发展提供了 强有力的支持
8.1.2超文本与超媒体 ◆超文本( Hypertext) ■是一种使用于文本、图形或计算机的信息的 组织形式,是一种非线性的信息组织形式 它使得单一的信息元素之间相互交叉引用 这种引用并不是通过复制来实现的,而是通 过指向对方的地址字符串来指引用户获取相 一应的信息 人机交互技术编写组
人机交互技术编写组 7 8.1.2超文本与超媒体 超文本 （Hypertext） ◼ 是一种使用于文本、图形或计算机的信息的 组织形式，是一种非线性的信息组织形式。 它使得单一的信息元素之间相互交叉引用， 这种引用并不是通过复制来实现的，而是通 过指向对方的地址字符串来指引用户获取相 应的信息
8.1.2超文本与超媒体 ◆超媒体( Hypermedia) 利用超文本形式组织起来的文件不仅仅是文 本,也可以是图、文、声、像以及视频等多 媒体形式的文件。这些多媒体信息就构成了 所谓的超媒体 人机交互技术编写组
人机交互技术编写组 8 8.1.2 超文本与超媒体 超媒体 （Hypermedia） ◼ 利用超文本形式组织起来的文件不仅仅是文 本，也可以是图、文、声、像以及视频等多 媒体形式的文件。这些多媒体信息就构成了 所谓的超媒体
8.1.3Web界面设计问题的提出 十Web界面设计是人机交互界面设计的 个延伸,是人与计算机交互的演变 ◆Web界面设计与站点外观直接相关 站点的界面外观是否友好直接关系到是否能 吸引人的关注。 ◆人性化的设计是Web界面设计的核心 ■如何根据人的心理、生理特征,运用技术手 段,创造简单、友好的界面,是Web界面设 计的重点 人机交互技术编写组
人机交互技术编写组 9 8.1.3 Web界面设计问题的提出 Web界面设计是人机交互界面设计的一 个延伸，是人与计算机交互的演变。 Web界面设计与站点外观直接相关 ◼ 站点的界面外观是否友好直接关系到是否能 吸引人的关注。 人性化的设计是Web界面设计的核心 ◼ 如何根据人的心理、生理特征，运用技术手 段，创造简单、友好的界面，是Web界面设 计的重点
8.2Web信息交互模型 ◆用来解释Web的人机界面性质的一个模型, 它提出网页是用户和知识之间的界面。 ◆对于信息提供者来说包括信息的表达 ◆对于使用者来说则是信息的获取 ◆信息的表达与获取分别受到两者认知结构 的制约。 人机交互技术编写组 10
人机交互技术编写组 10 8.2 Web信息交互模型 用来解释Web的人机界面性质的一个模型， 它提出网页是用户和知识之间的界面。 对于信息提供者来说包括信息的表达。 对于使用者来说则是信息的获取。 信息的表达与获取分别受到两者认知结构 的制约