《网站设计与建设 Website design and developments》课程教学资源（PPT课件讲稿）第一部分 Web基础知识 第3章 图形与Web设计

设计与建设 ebsite design and developments

网 站 设 计 与 建 设 Website design and developments

第一部分Web基础知识 第3章图形与Web设计

第3章 图形与Web设计 第一部分 Web基础知识

3.1网站图像的重要性 图像地图导航、图形按钮、徽标 ■何纯文本相比,图像更加直观、生动、易于理解 和接受。 图像可以将那些文字无法表达的信息传达出来。 口文字的精确性 □图像的模糊性 口在修饰网站和表达网站主题达到了文字不可替代的作 用

3．1 网站图像的重要性 ◼ 图像地图导航、图形按钮、 徽标 ◼ 何纯文本相比，图像更加直观、生动、易于理解 和接受。 ◼ 图像可以将那些文字无法表达的信息传达出来。  文字的精确性  图像的模糊性  在修饰网站和表达网站主题达到了文字不可替代的作 用

3.2网站图像常用规则 ①网站徽标应适宜大小放在主页左上方 口屏幕的左上方是最醒目和最吸引人的位置, 口徽标不易过大,应该与标题文字大小以及网页顶部预 留空间相匹配 ②网站标题应放在主页徽标的右边 口一般放在主页的最上方,位于网站徽标的右侧, 口绝大部分都是特殊的艺术字或名人手写体,应该使用 图像文字 ③图像(图片)颜色要与网站色系协调一致

3．2 网站图像常用规则 ①网站徽标应适宜大小放在主页左上方  屏幕的左上方是最醒目和最吸引人的位置，  徽标不易过大，应该与标题文字大小以及网页顶部预 留空间相匹配。 ②网站标题应放在主页徽标的右边  一般放在主页的最上方，位于网站徽标的右侧，  绝大部分都是特殊的艺术字或名人手写体，应该使用 图像文字 ③图像(图片)颜色要与网站色系协调一致

s elcome to Int c et Explorer ⊙后·因P魏索次收英创国,品回·口 For Intel, china looms large Next generation notebook, Ultra Mobile PCs launched Get connected to Korean Firm wins Intel PC Design Blog with Intel's top technologi DF in Beijing> Contest Products Advanced Technology Featured Processors Software Develope Hardware Developer Processor Technologies INF Utility Processors functi hipset for sp Idrens Intel Chipset I.D. Utility fic Intel ch your motherboard

④图像的文件尺寸应该要足够小 ⑤图像尽量避免使用高分辨率的真彩照片 ⑥在网页中勿滥用图像 ⑦ nternet和 INtranet的图像区别 ⑧切割大幅图像 口对于一个网页确实需要一幅大尺寸的图像,可 以使用一些图形处理工具例如 Photoshop

④图像的文件尺寸应该要足够小 ⑤图像尽量避免使用高分辨率的真彩照片 ⑥在网页中勿滥用图像 ⑦Internet和Intranet的图像区别 ⑧切割大幅图像 对于一个网页确实需要一幅大尺寸的图像，可 以使用一些图形处理工具例如Photoshop

文件①)编指)图像①)图层)选择⑧)源镜①)视图①窗口①)帮助0 y,y99(切道|C用户切一[分片〔原动切片 □回区 划分切片 区hed 回水平划分为 是.多 个纵向切片,均匀分隔□取消一 2.A 像索/切片 回预览 回直划分为 ⊙间个横向切片,均匀分隔 O像素彻片 Final Cut studio 2 回 Toois for realtime video and audoprodxtion %R文档915K915K

3.3数字图像 像素 口让算机显示器是由行列组成栅 个栅格可以显 小 像兀素,这些图像元 像 口像素是计算机显示器显示的最小单元 口每一个像素在某一时刻只能显示一种颜色 3.颜色分辨率 口显示器的分辨率决定了屏幕显示图像的精度 口屏幕分辨率由显示器高度和宽度表示屏幕区域的像素 数自决定 1024X768

3．3 数字图像 1．像素  计算机显示器是由行列组成栅格，每一个栅格可以显 示一个图像元素，这些图像元素叫做像素。  像素是计算机显示器显示的最小单元  每一个像素在某一时刻只能显示一种颜色 3．颜色分辨率  显示器的分辨率决定了屏幕显示图像的精度。  屏幕分辨率由显示器高度和宽度表示屏幕区域的像素 数目决定 ◼ 1024X768

20 15" 832x624/640x480 1024x768/640X480

4.图像分辨率 口图像分辨率以每英寸的像素数(PPl,Pⅸels Per inch)来衡量。 ■例如图像分辨率为500PP,就是每英寸有500个像 素

4．图像分辨率 图像分辨率以每英寸的像素数(PPI， Pixels Per Inch)来衡量。 ◼ 例如图像分辨率为500PPI，就是每英寸有500个像 素。