4.1.1Web的技术环境.ppt

* 第4章 Web艺术设计 4.1 Web设计环境 一、关于浏览器的技术 二、关于屏幕分辨率的技术 三、关于带宽的技术 4.1.1 Web的技术环境 1、采用可兼容技术 2、采用最新技术 3、采用声明浏览器技术 4.1.2 Web的媒体环境 1、计算机屏幕的形状 2、颜色和对比的特性 3、分辨率问题 4.1.3 Web的设计流程 一、概述 第一阶段：了解客户需求，体会他们的设计意向 第二阶段：制作出页面样例 二、设计的一般步骤 1、先要明确网站的性质、目的 2、分析网站的用户 3、确定页面的结构和框架 4、测试网页 4.2 Web设计元素 4.2.1 色彩 Web设计元素包括：色彩、文本、图像和VI设计、动画、视频、音频、导航和交互设计 一、色彩基础 1、颜色的产生 2、色彩的属性 3、色彩的三元素和色环 二、色彩感觉 1、心理感受 2、颜色的联想 三、色调和色彩搭配 1、色调 2、配色 四、计算机色彩 1、色彩模式 2、色深 3、混色 4、网络安全色 五、网页色彩搭配的原则 1、色彩的合理性 2、色彩的独特性 3、色彩的艺术性 六、搭配技巧 1、非彩色的搭配 2、彩色的搭配 3、网页色彩掌握的过程 ?邻近色的应用 ?对比色的应用 ?同类色的应用 4.2.2 文本 一、字体 1、英文字体 2、中文字体 3、衬线和字族 一、字号和字距 1、字号 2、字距与行距 3、文本的编排形式 4、网页中文本使用的注意事项 4.2.3 图像和VI设计 一、网页图像和文件格式 1、数字图像类型 2、图像文件格式基础知识 ?JPG格式文件 ?PNG格式文件 ?GIF格式文件 ?BMP格式文件 ?TIF格式文件 ?TGA格式文件 3、Web图像的应用 二、选择图形工具 三、网页中的图像 四、网页版面中图像的编排 1、图像的选择与剪裁 2、图片形状的变化 ?尽可能少选图片 ?应遵循相邻原则、互补原则和主次原则 ?说明文字应放在图片下边或右边 3、虚实的变化 五、视觉标识设计(VI设计) 1、设计网站的标志 ?选用公司具有代表性的人物、动物或植物 ?以本专业具有代表性的物品 ?采用网站名称的中英文字 2、选择网站的标准色彩 3、选择网站的标准字体 4、构思网站的广告词 4.2.4 动画 一、Web动画的发展状况 1、Web动画的初级阶段 2、无处不在的GIF 3、动画的新贵——Shockwave 4、扮演GIF89a杀手的Java 5、Flash和streaming技术 二、动画制作的工具 三、动画原理 四、网页中的动画广告 4.2.5 视频和音频 一、音频 1、网上音乐格式 ?MIDI格式 ?RA格式 ?MP3格式 ?MP4格式 ?VQF格式 ?WMA格式 ?WAV格式 ?AIF格式 ?AU格式 2、相关概念 ?数字音乐 ?音频流 ?音乐的编辑 ?音乐的网上发布 二、视频 1、MOV格式 2、AVI格式 3、RM格式 4、ASF格式 ● 将文件放入HTML的方法 (1)、链接 (2)、嵌入 三、虚拟现实 4.2.6 导航和交互设计 一、人机交互的常用方式 1、问答式对话 2、菜单交互 3、功能键 4、图符 5、查询语言界面 6、自然语言界面 二、人机交互的特性 1、简易性 2、友好性 3、灵活性 4、明确性 5、一致性 ?交互功能应完全适应各类用户的使用需要，提供满足各种要求的界面交互形式 ?用户可以根据需要制定或修改交互方式，这在很多网站的个性化服务中有所体现 6、容错性 7、反馈性 8、图形化 ?快速识别 ?快速学习掌握 ?快速使用和快速解决问题 ?快速记忆 ?更接近自然 ?促进具体形象思维 ?增加控制感 三、超链接设计 1、超文本 2、友好交互设计 ?我在哪儿？ 3、组织网页上的信息 ?我如何回到起点？ ?我能去哪儿？ ?我怎样去哪儿？ ?使用超文本 ?建立易于管理的信息段 ?控制页面长度 4、增加合理的导航链接 (2)其它链接设计 (1)导航栏 ● 链接页面的导航总结如下： ?从目录页至各章 ?链接至各主要页面 ?链接至各章顶端 ?从目录页至各章中的主题 四、网站目录结构和链接结构对页面设计的影响 4.3.1 版式设计基础 4.3 Web页面设计 ● 设计基本原则： (1)主题鲜明，形象突出 (2)便于阅读，形式美观 (3)编排有序，布局合理 ?从各章至各主题 ?前后翻页 ?使用上下文链接至相关内容 版面，是页面稿件编排所具有的外在形式，是各种内容编排布局的整体表现形式。版面设计的任务是吸引读者的视线，增强阅读的兴趣，帮助读者理解信息。 1、潜在的结构 2、点的结构 一、平面构成基础 ●所谓抽象，即在造型活动中，不以现实形态为依据，而专门研究点、线、面、体在空间的相对排列关系及形成的一定表现力。 ●空间排列的根本所在便是创造