
第4章Web艺犬设计
第4章 Web艺术设计

内容简介 本章主要介绍Web设计所需 的美学原理和设计法则,具体 涉及到影响网页观感的色彩、 文字、图像、导航元件以及版 面设计等方面的知识
内容简介 本章主要介绍Web设计所需 的美学原理和设计法则,具体 涉及到影响网页观感的色彩、 文字、图像、导航元件以及版 面设计等方面的知识

学习目标 ●1.掌握:技术和艺术之间的限制关系;网页色彩 设计的一般原则;网页设计流程、网页元素的基本 知识及基本制作方法;网页创意设计的原则以及设 计要点;导航设计的原则;版式设计的基础知识。 ●2.理解:网页设计中应用到的网络技术与传播特 点、与传统媒体设计的区别;版式设计和平面设计 的基本法则;色彩、文字、图像、版面设计中的一 些概念。 3.了解:不同的制作软件、视听语言基础和网页 设计的未来趋势
学习目标 ⚫ 1.掌握:技术和艺术之间的限制关系;网页色彩 设计的一般原则;网页设计流程、网页元素的基本 知识及基本制作方法;网页创意设计的原则以及设 计要点;导航设计的原则;版式设计的基础知识。 ⚫ 2.理解:网页设计中应用到的网络技术与传播特 点、与传统媒体设计的区别;版式设计和平面设计 的基本法则;色彩、文字、图像、版面设计中的一 些概念。 ⚫ 3.了解:不同的制作软件、视听语言基础和网页 设计的未来趋势

4.1 Web设计环境 在进行网页设计和制作的过程中, 了解网络的相关技术以及访问者的外在 条件(如访问者的访问速度、计算机平 台、使用何种浏览器等)是十分重要的。 这些因素将影响你设计的Wb文件大小 和设计复杂程度。 了解技术和媒体因素是网页艺术设 计的前提,技术和艺术的结合是网页设 计的最高境界
4.1 Web设计环境 在进行网页设计和制作的过程中, 了解网络的相关技术以及访问者的外在 条件(如访问者的访问速度、计算机平 台、使用何种浏览器等)是十分重要的。 这些因素将影响你设计的Web文件大小 和设计复杂程度。 了解技术和媒体因素是网页艺术设 计的前提,技术和艺术的结合是网页设 计的最高境界

4.1.1 Web的技术环境(1) 从技术为人服务的观念出发,应 尽可能地从用户的角度来进行Web 设计。要想有更多的人能很好地访 问你所设计的站点,就应使Web站 点适应不同的浏览器、操作系统和 计算机平台访问的技术环境
4.1.1 Web的技术环境(1) 从技术为人服务的观念出发,应 尽可能地从用户的角度来进行Web 设计。要想有更多的人能很好地访 问你所设计的站点,就应使Web站 点适应不同的浏览器、操作系统和 计算机平台访问的技术环境

4.1.1 Web的技术环境(2) 1、关于浏览器的技术 网页设计者首先面临的问题是如何 使网页在不同浏览器中都能正常显示。 由于每种浏览器对HTML文件标签的解释 都不同,导致对HTML文件的显示方式的 解释存在差异。因此设计者应尽量在多 种浏览器环境中测试自己的工作,以便 对用户使用的浏览器提出要求或说明
4.1.1 Web的技术环境(2) 1、关于浏览器的技术 网页设计者首先面临的问题是如何 使网页在不同浏览器中都能正常显示。 由于每种浏览器对HTML文件标签的解释 都不同,导致对HTML文件的显示方式的 解释存在差异。因此设计者应尽量在多 种浏览器环境中测试自己的工作,以便 对用户使用的浏览器提出要求或说明

4.1.1 Web的技术环境(3) 为适合不同浏览器,可以采用以下几种方式: (1)采用可兼容的技术 尽量使设计的网页可以在各种浏览器中使用。不使用最 新版本的TML规范编码,便于与各种版本的浏览器兼容。 (2)采用最新的技术设计 这就要求用户采用最新的浏览器,还要有能够显示特 殊媒体类型的增强插件,这样才能跟上设计者的步伐。 (3)采用对用户指定特定浏览器的方式
4.1.1 Web的技术环境(3) 为适合不同浏览器,可以采用以下几种方式: (1)采用可兼容的技术 尽量使设计的网页可以在各种浏览器中使用。不使用最 新版本的HTML规范编码,便于与各种版本的浏览器兼容。 (2)采用最新的技术设计 这就要求用户采用最新的浏览器,还要有能够显示特 殊媒体类型的增强插件,这样才能跟上设计者的步伐。 (3)采用对用户指定特定浏览器的方式

4.1.1 Web的技术环境(4) 总之,在对浏览器的选择上,可以采用 一种能促进渐进开发的策略。 例如:在创建站点时使用前一个旧版本 的HTML来编码,然后慢慢向其中加入一些 增强特性,不断向最新版本靠近,使用户 使用新旧版本的浏览器都可访问。若要加 入一些需要插件支持的动画或特殊效果, 则要使用大多数浏览器都支持的开发工具
4.1.1 Web的技术环境(4) 总之,在对浏览器的选择上,可以采用 一种能促进渐进开发的策略。 例如:在创建站点时使用前一个旧版本 的HTML来编码,然后慢慢向其中加入一些 增强特性,不断向最新版本靠近,使用户 使用新旧版本的浏览器都可访问。若要加 入一些需要插件支持的动画或特殊效果, 则要使用大多数浏览器都支持的开发工具

4.1.1 Web的技术环境(5) 2、关于屏幕分辨率的技术 显示器的屏幕分辨率:是指显示器屏幕 所能显示的象素总数,这一指标是由显示器 和显示卡的性能决定的。通常用水平和垂直 方向的象素数目的乘积表示。如:800×600。 随着计算机显示器和显示卡性能的提高, 在网页设计中,很多人已经将800×600作为基 本的分辨率
4.1.1 Web的技术环境(5) 2、关于屏幕分辨率的技术 显示器的屏幕分辨率:是指显示器屏幕 所能显示的象素总数,这一指标是由显示器 和显示卡的性能决定的。通常用水平和垂直 方向的象素数目的乘积表示。如:800600。 随着计算机显示器和显示卡性能的提高, 在网页设计中,很多人已经将800600作为基 本的分辨率

4.1.1 Web的技术环境(6) 3、关于宽带的技术 网站设计者要考虑用户的低带宽连接。如果由于 页面包含庞大的、详细的图形或复杂的动画而导致 下载速度缓慢,用户就会在页面内容显示之前改去 访问别的站点。因此网站设计者应在不同的连接速 度下进行浏览测试,以获得在不同的连接速度下浏 览网页的真实情况。 在设计时应尽量简化页面,少使用图形或将图形 大小限制在10一15KB范围之内
4.1.1 Web的技术环境(6) 3、关于宽带的技术 网站设计者要考虑用户的低带宽连接。如果由于 页面包含庞大的、详细的图形或复杂的动画而导致 下载速度缓慢,用户就会在页面内容显示之前改去 访问别的站点。因此网站设计者应在不同的连接速 度下进行浏览测试,以获得在不同的连接速度下浏 览网页的真实情况。 在设计时应尽量简化页面,少使用图形或将图形 大小限制在10-15KB范围之内