网页设计三合一教程 主讲教师 2019/6/2.

Presentation on theme: "网页设计三合一教程 主讲教师 2019/6/2."— Presentation transcript:

1 网页设计三合一教程 主讲教师 2019/6/2

2 第1章 网页设计简介 主讲教师

3 本章要点 了解网页的设计理念 了解网页的设计风格 了解网页的创意设计 了解网页的色彩搭配 熟悉Dreamweaver 8的工作环境

4 第1章　网页设计简介 1.1　网页设计概述 1.2　初识Dreamweaver 8

5 1.1　网页设计概述 1.1.1 网页设计遵循的理念 网站整体风格的确定 网页创意 网页色彩搭配简介 常用网页设计工具简介

6 1.1.1　网页设计遵循的理念 （1）考虑访问者的带宽问题。 （2）版面布局合理。 （3）网站标志的设计。 （4）站点内容要精、专，及时更新。

7 1.1.2 网站整体风格的确定 网站的风格 包含的因素 例如： 指网站的整体形象给访问者的综合感受。
1.1.2　网站整体风格的确定 网站的风格 指网站的整体形象给访问者的综合感受。 包含的因素 网站的标志设计、色彩、版面布局、浏览方式、交互性、文字和价值等。 例如： 儿童网站“WaWaYaYa”是生动活泼的；大多商 业网站如IBM，是专业严肃的。 教师演示，打开WaWaYaYa和IBM网站给大家演示，并进行讲解。 7

8 确定网站的整体风格需要注意以下几个方面：
（1）网站标志要放在醒目位置要保持不变。 （2）反应网站精髓的标语并动态显示。 （3）导航放在每一张网页的相同位置。 （4）确定网站的主体颜色并注意颜色。 （5）页面的布局一般采用左边导航右边文字，或者 上面导航下面文字的方法，或两者结合使用。 （6）内容结构简单且分类要简而精。

9 1.1.3 网页创意 什么是创意？ （1）创意是传达信息的一种特殊手段。 （2）创意是将现有的要素重新组合。
1.1.3　网页创意 什么是创意？ （1）创意是传达信息的一种特殊手段。 （2）创意是将现有的要素重新组合。 网络上最多的创意是与现实生活相结合，例如网上购物，电子社区，电子病历，在线拍卖等。而且资料越丰富，越容易产生创意。所以任何人，都可以创造出不同凡响的创意来。

10 1.1.4 网页色彩搭配简介 网页色彩搭配应考虑以下因素： （1）色彩的鲜明性。 （2）色彩的独特性。 （3）色度的合适性。
1.1.4　网页色彩搭配简介 网页色彩搭配应考虑以下因素： （1）色彩的鲜明性。 （2）色彩的独特性。 （3）色度的合适性。 （4）色彩的代表性。

11 1.1.5　常用网页设计工具简介 1．网页设计软件Dreamweaver 2．网络动画制作软件Flash 3．网络图像处理软件Fireworks

12 1．网页设计软件Dreamweaver Dreamweaver是一个方便的网页制作工具，支持最新的DHTMLTT和CSS标准。
它能够快速高效地创建极具表现力和动感效果的网页，同时使制作过程简单化。 不仅提供了强大的网页编辑功能，而且拥有完善的站点管理机制，是一个集网页制作和站点管理于一身的网页创作工作。

13 2．网络动画制作软件Flash Flash是最流行的矢量动画制作软件之一，它只用少量矢量数据就可以描述一个复杂的对象，而且占用的存储空间少，非常适合在网络上使用。 运用它可以制作出栩栩如生、动感十足的动画作品。

14 3．网络图像处理软件Fireworks Fireworks是专门针对Web而设计的图像处 理软件，因此它对图像进行了充分的优化。

15 1.2　初识Dreamweaver 8 1.2.1　工作界面的选择 1.2.2　主窗口简介

16 1.2.1 工作界面的选择 启动Dreamweaver 8后，首先出现的是初始化界面。 接着弹出【工作区设置】对话框。
1.2.1　工作界面的选择 启动Dreamweaver 8后，首先出现的是初始化界面。 接着弹出【工作区设置】对话框。 如果习惯编写代码的，可以选择【编码器】单选钮。 这里选择【设计者】单选钮，然后单击【确定】按钮。 教师切换到Dreamweaver 8环境下进行演示 16

17 1.2.2 主窗口简介 启动Dreamweaver 8后，窗口中央会出现起 始页窗口。
1.2.2　主窗口简介 启动Dreamweaver 8后，窗口中央会出现起 始页窗口。 如果选中左下角的【不再显示此对话框】复选框， 下次启动Dreamweaver 8将不再显示该起始页。 单击【创建新项目】中的【HTML】，将打 开Dreamweaver的工作界面。 教师切换到Dreamweaver 8环境下进行演示