《网站的规划》教学设计2.docVIP

PAGE8/NUMPAGES8

网站的规划——设计制作

MicrosoftFrontPage，是美国微软公司推出的一款网页设计、制作、发布、管理的软件。FrontPage由于良好的易用性，被认为是优秀的网页初学者的工具。

【软件特性】

所见即所得结合了设计、程式码、预览三种模式于一体，也可一起显示程式码和设计检视与MicrosoftOffice各软件无缝连接良好的表格控制能力继承了MicrosoftOffice产品系列的良好的易用性。

我们以制作一个个人网站为例，简单介绍下首页的制作过程。仅此抛砖引玉，希望同学们不要模仿，要有自己的创意！

涉及工具及方法知识点——利用表格建网页框架，合并、拆分单元格，插入图片，单元格背景，首页背景，Logo制作，插入flash、gif动画，保存为“姓名.htm”

操作步骤：打开Frontpage，新建一个空白网页

利用表格制作网页框架——根据规划好的首页布局图，选择表格—插入表格，插入一个4行3列的表格（请按照自己的框架图计算行列数）。并调整大小以充满整个页面。

选择最左上角单元格，插入—图片——来自文件，选择自己中意的Logo图片，插入图片，并调整到合适大小。

选择第一行第2、3个单元格，点击鼠标右键，执行合并单元格

在合并后的单元格点击鼠标右键，选择单元格属性——

选择一幅背景图片作为首页横幅（见下页图）

在横幅上添加滚动字幕

在横幅上写上文字—欢迎来到我的小站，并设置字体大小、颜色、类型

选中字体（抹黑状态），执行插入——web组件

填写文本及属性（方向、速度、表现方式等）

注：动态的字幕在设计界面看不到效果，需要切换到预览界面方可看到效果。Flash动画和gif动画也是如此

制作导航栏

先将第二行第2列和第3列合并，然后点击右键，选择拆分单元格，将此单元格拆分成4列（根据自己的导航数量进行拆分）

依次写上你的栏目名称，在第一个单元格写上首页

给导航栏设置背景

选中第二行导航栏，点击鼠标右键

在单元格属性对话框中，选择一种背景颜色

将第一列第3、4两行合并，点击鼠标右键，选择单元格属性，设置垂直对齐方式为顶端对齐。这样就可以避免出现空白区域。（其余单元格根据需要自己设置）

设置文章列表

选择格式——项目符号和编号方式，选择无项目格式列表

完成文章列表，右侧具体栏目文章列表类似！

注：各个单元格还可以自由选择单元格背景！

设置网页背景和去掉表格边框

去掉边框根据自己需要设置最后效果图

11、最后以“小组成员姓名.htm”命名自己的主页，保存到桌面上的“4.1素材”文件夹，并通过传奇电子教室上交本网页。