网页设计与制作——Dreamweaver 8 教学课件 作者 马书群 第6章 页面配色与修饰.ppt

《网页设计与制作——Dreamweaver 8 教学课件 作者 马书群 第6章 页面配色与修饰.ppt》由会员上传分享，免费在线阅读，更多相关内容在应用文档-天天文库。

1、第6章页面配色与修饰技能目标6.1网页配色6.2Photoshop制作网页的基本操作6.3Flash的动画效果技能目标了解网页配色方案及安全色的概念学会网站风格设计了解Photoshop的基本知识了解Flash的基本知识颜色的使用在网页制作中起着至关重要的作用，合理地配置颜色，可以使自己制作的网站在众多的网站中脱颖而出，给浏览者留下深刻的印象。但是对于初学者来说，往往不容易驾驭好网页的颜色搭配，不仅要学习各种色彩理论和方法，还要多学习一些大型网站的用色方法。6.1网页配色色彩三要素：色相亮度饱和度网页安全色

2、色彩感受网页色彩规则网站风格与色彩设计课堂小练习：上网查看食品、机械、儿童用品和旅游主题的网站，仔细观察每一个页面的颜色选择和搭配，体会网站色彩的选择方法。6.1网页配色在Photoshop中不仅可以制作出更加精美的图片应用到网页中去，达到美化网页的目的，而且还可以在Photoshop中直接做出一个网页的外观，再利用切片工具将做好的图片转换成一个网页文件。互联网上有大量的网页图片模版资源，这些图片模版都是一些PSD或者JPEG等格式的图片，是学习网页布局的优秀案例。作为网页设计的初学者，可以通过Photos

3、hop对这些图片模版进行加工处理生成网页文件，将模版中的布局模式和一些有用的图片等元素引用到自己的页面中来。6.2Photoshop制作网页的基本操作案例6-2使用Photoshop制作网页制作电脑公司产品网站，用Photoshop对现在模版进行修改加工，完成后的效果如图所示。6.2Photoshop制作网页的基本操作案例6-2使用Photoshop制作网页【案例分析】这是一个电子产品网站模版，并且图片是PSD格式的，可以在Photoshop中打开进行编辑，将一些不需要的内容删去，如电子产品的图片和目录，换

4、成电脑产品的信息，然后再利用切片工具生成网页文件。6.2Photoshop制作网页的基本操作案例6-2使用Photoshop制作网页【操作步骤】（演示操作）1．启动Photoshop，打开模版图片2．在Photoshop中对模版进行修改3．使用切片工具划分切片4．保存文件，存储为Web所用格式6.2Photoshop制作网页的基本操作案例6-2使用Photoshop制作网页案例小结：Photoshop是一款非常出色的图像处理软件，在网页制作时，可以在Photoshop中进行对现有模版进行修改加工，然后再进入

5、Dreamweaver中进一步制作。如果选用的模版不是PSD格式，而是JPEG或者其他图片格式，那么就无法直接对模版的内容进行修改，只能用切片工具直接将模版进行切割，然后将生成的网页文件在DW中打开，删除掉模版中的图片，只借用模版的布局。6.2Photoshop制作网页的基本操作案例6-2使用Photoshop制作网页案例小结：用户可以直接在Photoshop中创意制作网页界面，然后使用同样的方法转换成网页文件。图片是网页结构中必不可少的页面元素之一，但图片的大量出现会严重影响页面的下载显示速度，使用Pho

6、toshop中的切片工具可以将一些较大的图片分割成几个小部分，这样可以加快网页下载速度。6.2Photoshop制作网页的基本操作案例6-2使用Photoshop制作网页课堂小练习：在Photoshop中修改本例中的企业名称和产品内容，制作成另一主题的网页。6.2Photoshop制作网页的基本操作Flash是一种交互式矢量多媒体技术，设计人员和开发人员可使用它来创建演示文稿、应用程序和其他允许用户交互的内容。Flash可以包含简单的动画、视频内容、复杂演示文稿和应用程序以及介于它们之间的任何内容。将Fla

7、sh与Dreamweaver结合可以设计出更为丰富多彩的网站作品。本节将通过实例介绍Flash在网页制作中的一些实际应用。6.3Flash的动画效果案例6-3使用Flash制作网页动态效果使用Flash制作动态导航，加入到上节制作的“奔腾电脑网”页面中。6.3Flash的动画效果案例6-3使用Flash制作网页动态效果【案例分析】动态导航按钮在如今的网页中随处可见，这里将利用Flash中的按钮元件，制作随鼠标移动而变换颜色的导航按钮，并添加到网页中去。6.3Flash的动画效果案例6-3使用Flash制作网

8、页动态效果【操作步骤】（演示操作）1．启动Flash2．新建文档，创建按钮元件3．保存并发布Flash文档4．在DW中打开“奔腾电脑网”页面，插入Flash影片文件5．保存网页6.3Flash的动画效果案例6-3使用Flash制作网页动态效果案例小结：随着多媒体技术在网络上的普遍应用，Flash成为网页元素中不可替代的一员。在Dreamweaver中不仅可以插入Flash制作的导航条，而且还可以插入各种Flash