搜索
网页设计和发布流程第一步是对站点进行规划第二步是创建站点的基本结构第三步即可开始具体的网页创作过程最后一步是站点的发布第一节站点的规划与创建【计划课时】：3课时【授课班级】：计算机应用一班【教学目的与要求】【教学方法与手段】多媒体教学：借助多媒体手段，进行课堂理论教学；启发式教学：教学活动关注的重点从结果转向过程。激发思维，师生互动，增强学生学习的主动性、积极性和创造性；【教学重点与难点】：基础知识：。重点知识：【教学组织过程】1．上讲回顾2．教授新知【授课内容】一、规划站点Web站点是一组具有共享属性（如相关主题、类似的设计或共同目的等）的链接文档。本地站点：是本地硬盘中存放远程网站所有文档的地方（文件夹）。建立网站的通常做法是：在要地硬盘中建立一个文件夹用来存放网站的所有文件，往后就在该文件夹中创建和编辑文档。待网页设计和测试好之后，再把它们拷贝到网站上供浏览者浏览。1、规划站点结构注：规划站点的结构之前应先用笔绘出站点的结构图（如下图所示是一个典型的学校站点的结构图）2、规划站点的浏览机制一般可采用以下的方法：创建返回主页的链接显示网站专题目录显示当前位置搜索和索引反馈（将网页创作者或网站管理员公布在网页上，或创建一个E-MAIL超级链接，以使用户能快速地将信息反馈到网站中）二、创建一个站点步骤：1、单击“文件”---“新建”---“站点”命令（或单击常用工具栏中“新建网页”按钮的下拉箭头，从打开的下拉菜单中选择“站点”命令）2、选择一种站点模板或向导3、单击“确定”按钮三、站点的基本操作1、打开站点：“文件”---“打开站点”2、删除站点：方法一：在Windows资源管理器中删除一个站点方法二：在FrontPage中删除站点，在“文件夹”视图或“网页”视图的“文件夹列表”中，右击站点所对应的目录，在快捷菜单中单击“删除”命令3、站点的设置“工具”----“站点设置”，有“常规”、“参数”、“高级”、“语言”、“导航”、“数据库”六个选项卡【课程小结】【作业】1．5课后练习书本课后练习作业第二节利用表格进行网页布局【计划课时】：3课时【授课班级】：计算机应用一班【教学目的与要求】【教学方法与手段】多媒体教学：借助多媒体手段，进行课堂理论教学；启发式教学：教学活动关注的重点从结果转向过程。激发思维，师生互动，增强学生学习的主动性、积极性和创造性；【教学重点与难点】：基础知识：。重点知识：【教学组织过程】1．上讲回顾2．教授新知【授课内容】一、插入表格1、单击常用工具上的“插入表格”按钮2、单击“表格”---“插入”---“表格”命令3、使用表格工具栏（“查看”—“工具栏”---“表格”命令）4、由文本转换（“表格”—“转换”—“文本到表格”）一般以段落为分行标记，以逗号或句号为分列标记。二、单元格的基本操作1、选择单元格（“表格”—“选定”—“单元格”）Ctrl：可选择不相邻的单元格Shift：选择多个相邻的单元格2、插入单元格（“表格”—“插入”—“单元格”）3、合并单元格（“表格”—“合并单元格”或“表格工具栏”上的“合并单元格”按钮）4、拆分单元格（“表格”—“拆分单元格”或“表格工具栏”上的“拆分单元格”按钮）三、填充单元格1、文本与图像填充（“插入”—“图片”）2、对齐文本与图像（“表格”—“属性”—“单元格”，“水平对齐方式”、“垂直对齐方式”）3、修改单元格背景（“表格”—“属性”—“单元格”，“背景”）4、调整边框颜色（“表格”—“属性”—“单元格”，“边框”）5、改变单元格尺寸（“表格”—“属性”—“单元格”，“指定宽度”、“指定高度”）四、修改表格的行与列1、选择行与列2、插入行与列（“表格”—“插入”—“行或列”）3、均分行与列（“表格工具栏”中的“平均分配行高”或“平均分配列宽”）4、删除行与列（“表格工具栏”中的“删除单元格”按钮或“表格”—“删除单元格”命令）【课程小结】【作业】1．5课后练习书本课后练习作业第三节利用框架设计网页布局【计划课时】：3课时【授课班级】：计算机应用一班【教学目的与要求】【教学方法与手段】多媒体教学：借助多媒体手段，进行课堂理论教学；启发式教学：教学活动关注的重点从结果转向过程。激发思维，师生互动，增强学生学习的主动性、积极性和创造性；【教学重点与难点】：基础知识：。重点知识：【教学组织过程】1．上讲回顾2．教授新知【授课内容】一、认识框架网页1、框架的概念框架网页是一种特殊的网页，它将自身分成几个区域，每个区域称作一个框架窗口（通常简称为框架）框架具有以下特性：每个框架都可以独立地显示一个网页，各个框架窗口之间可以设立超链接。每个框架窗口可以赋予一个名字，以便其他URL作为目标调用。2、框架的使用场合（如邮箱、论坛）通常用框架来显示在同一个站点中的多个超链接，这样可以不用浏览器中的“后退”按钮而方便的进行浏览。框架也适用于类似在线书籍的应用，将目录显示在左边的框架中，单击目录，右边框架中显示相关的章节二、创建框架网页1、框架网页的创建“文件”—“新建”—“网页”，选择“框架网页”选项卡2、框架网页模板（10种）“设置初始网页”“新建网页”三、框架网页的保存和打开框架网页的保存包括框架网页自身的保存和框架窗口中网页的保存。1、框架网页的保存“文件”—“保存文件”或“框架”—“保存网页”2、框架网页的打开“框架”—“在新窗口中打开网页”四、框架网页的属性1、框架网页的属性“文件”—“属性”“框架间距”、“显示边框”2、框架的属性“框架”—“框架属性”五、调整框架布局1、调整框架窗口的大小（用鼠标拖动或在“框架属性”对话框中调整）2、框架的拆分方法一：“框架”—“拆分框架”（按行或按列拆分）方法二：用鼠标拖动拆分（按Ctrl键）3、框架的删除“框架”—“删除框架”六、目标框架当在框架网页的某一个框架中定义超链接时，需要指定被链接的网页显示在哪一个框架中，即指定超链接的目标框架。选择要设置超链接的文字或图像，“插入”—“超链接”，单击“目标框架”、“更改目标框架”【课程小结】【作业】1．5课后练习书本课后练习作业第四节使用导航栏【计划课时】：3课时【授课班级】：计算机应用一班【教学目的与要求】【教学方法与手段】多媒体教学：借助多媒体手段，进行课堂理论教学；启发式教学：教学活动关注的重点从结果转向过程。激发思维，师生互动，增强学生学习的主动性、积极性和创造性；【教学重点与难点】：基础知识：。重点知识：【教学组织过程】1．上讲回顾2．教授新知【授课内容】一、定义导航结构在网页内添加导航栏之前，先建立该站点的导航结构“视图”—“导航”按钮二、认识导航栏属性“插入”—“导航栏”按钮“父层”：创建指向当前网页上一级网页的超链接，并将上一级网页的标题名称显示在导航栏内。三、创建导航栏（要在浏览器中才可看到实际导航栏效果）四、创建共享边框用创建导航栏的方法只能在一个网页中创建导航栏，若需要导航栏出现在站点内多个网页的相同位置，则可将导航栏插入网页的共享边框内。右击编辑窗口，单击“共享边框”命令练习二、利用框架设计一个企业网站的布局要求有如下内容：关于我们、商品展示、在线订购、网上留言、联系我们、产品目录、友情链接等。【课程小结】【作业】1．5课后练习书本课后练习作业第五节网页布局功能的应用【计划课时】：3课时【授课班级】：计算机应用一班【教学目的与要求】【教学方法与手段】多媒体教学：借助多媒体手段，进行课堂理论教学；启发式教学：教学活动关注的重点从结果转向过程。激发思维，师生互动，增强学生学习的主动性、积极性和创造性；【教学重点与难点】：基础知识：重点知识：【教学组织过程】1．上讲回顾2．教授新知【授课内容】一、创建布局表格1、创建布局表格打开一个空白网页，并切换到“设计”视图下，单击“表格”菜单中的“布局表格和单元格”命令，随后在右侧弹出一个任务窗口，在该任务窗口下面程序提供了多种表格布局模板，在此单击其中需要的模板即可将该模板添加到网页中。2.绘制布局表格如果你对模板中提供的布局表格不太满意，还可以用手工绘制的方法创建一个布局表格。创建时首先在“新建表格和单元格”项中单击“绘制布局表格”，随后将指针移到操作窗口最左端，然后拖动鼠标即可绘制表格。3、设置表格属性插入表格后，还需对表格属性进行设置。在“表格属性”项中设置该表格所需的属性。提示：在设置表格时，如果要想覆盖网页的默认边距，并让布局表格跨到文档窗口的边缘，可以将表格中的各个边距的属性都设置为0。在设计框架时经常需要调整某一行或列的属性，这时可以通过表格中列宽和行高的标签来完成。在操作窗口中单击布局表格需要调整的边框，每一侧都会出现显示列宽和行高的标签。每个标签都包括一个下拉箭头，如更改行高度时，单击此下拉箭头弹出一个下拉菜单，选择“更改行高”命令，在弹出的“行属性”对话框中重新输入该行高度值即可。练习三、使用布局功能设计学校网站要求包括有以下内容：学校简介、校园新闻、教育教学、学生天地、校园论坛、教师之家等【课程小结】【作业】1．5课后练习书本课后练习作业第六节网页布局设计【计划课时】：3课时【授课班级】：计算机应用一班【教学目的与要求】【教学方法与手段】多媒体教学：借助多媒体手段，进行课堂理论教学；启发式教学：教学活动关注的重点从结果转向过程。激发思维，师生互动，增强学生学习的主动性、积极性和创造性；【教学重点与难点】：基础知识：。重点知识：【教学组织过程】1．上讲回顾2．教授新知【授课内容】一、文本的美化（“格式”—“字体”）1、输入文本2、美化文本（设置文本字体、字号）注：字符的大小共有6级，其中默认级别是3。3、设置文本效果4、改变文本颜色5、设置字符间距二、运用边框与阴影（“格式”—“边框与阴影”）1、设置边框2、设置阴影三、使用列表（“格式”—“项目符号和编号方式”）1、添加项目列表。项目列表也称为无序列表，它将在项目前添加标志符号。可以将图片作为新的项目标志。经常使用的项目符号有3种：实心黑点、空心圆圈和实心方块。2、添加编号列表在网页中的内容存在顺序关系时，可应用编号列表。3、添加定义列表定义列表就是在网页内定义词汇、术语的列表，具体的定义内容将以首行缩进的方式出现在列表的下一行。（格式工具栏的“样式”—“定义的术语”，输入要词汇、术语，按回车键）4、设置嵌套列表要建立组合列表，可以先生成第1级列表，然后再生成第2级列表，依此类推。建立组合列表的具体操作步骤如下：（1）先生成第1级列表（2）将光标移动到拥有第2级列表的第1级列表项目的末尾，然后按回车键。将出现一个空的列表行。（3）单击“格式工具栏”中的“增加缩进”图标。该行变为一个空白行，是没有列表编号或项目符号的。再单击一次“增加缩进”图标。（4）此时再按照建立列表的方法构造第2级列表。（5）输入第2级列表。输入过程中每次接回车键就自动生成第2级列表项目。（6）第2级列表输入完毕后，将光标移到别的位置或者用鼠标在页面的空白处单击一下即可完成第2级列表的设置操作。嵌套列表可以转变为可折叠大纲，这样在浏览器中浏览时，就可以展开或折叠大纲中的各个级次。生成可折叠大纲的具体操作步骤如下：（l）按生成复合列表的方法构造好这个复合列表所有的列表级次。（2）选择“格式”菜单中的“项目符号和编号方式”命令，打开“项目符号和编号方式”对话框，或者在列表中单击右键，从弹出的菜单中选择“列表属性”命令。（3）在打开的对话框中，选中“启用可折叠大纲”复选框。（4）单击“确定”按钮。练习四、设计一个介绍阳江风景及特产的网页要求：设计一个网页介绍阳江的风景及特产，要用到折叠列表的方式来分别介绍阳东、阳西、阳春等的不同地区的风景名胜及特产。【课程小结】【作业】1．5课后练习书本课后练习作业第七节网页装饰设计【计划课时】：3课时【授课班级】：计算机应用一班【教学目的与要求】【教学方法与手段】多媒体教学：借助多媒体手段，进行课堂理论教学；启发式教学：教学活动关注的重点从结果转向过程。激发思维，师生互动，增强学生学习的主动性、积极性和创造性；【教学重点与难点】：基础