网页设计与制作 —— 学习情境一：网页制作的基础知识 网页设计与制作 —— 学习情境一：网页制作的基础知识 主讲教师：李果、邹珺
网页制作的基础知识 工作内容 工作计划 制定方案 工作过程 工作检查 工作总结 学习情境1 任务： 网页制作的基础知识 1、确定网页结构布局 2、直观展现网页结构效果 框架在页面设计与制作任务中的作用： 制定方案 工作过程 工作检查 工作总结
网页制作的基础知识 工作内容 工作计划 制定方案 工作过程 工作检查 工作总结 学习情境1 学生分组： 继续沿用学习情景一分组。 工作计划： 指导学生根据任务量和时间量安排计划。 工作计划： (示例) 工作过程 工作检查 工作总结
网页制作的基础知识 工作内容 工作计划 制定方案 工作过程 工作检查 工作总结 学习情境1 学生提交计划： 教师抽查，现场指导调整。 指导学生根据任务计划制定实施方案。 实施方案： (示例) 制定方案 工作过程 工作检查 工作总结
网页制作的基础知识 工作内容 工作计划 制定方案 工作过程 工作检查 工作总结 学习情境1 学习内容： 本地磁盘根目录的创建 网页素材的收集及命名方式 在Dreamweaver中创建站点 设置网页头文件 在页面中插入文本 在页面中插入图像 在页面中制作链接 在页面中插入动画 在页面中插入表单元素 在页面中插入音频及视频 首页及子页的保存 学习内容： 工作内容 工作计划 制定方案 工作过程 工作检查 工作总结
网页制作的基础知识 工作内容 工作计划 制定方案 工作过程 工作检查 工作总结 学习情境1 专业能力目标 教学目标： 社会能力目标 方法能力目标 工作过程 工作检查 工作总结
1.Logo标志 Logo标志要做到主题鲜明突出，力求简洁，要点明确，以简单明确的语言和画面告诉大家本站点的主题，吸引对本站点有需求的人的视线，对无关的人员也能留下一定的印象。对于一些行业标志和公司的标志应充分加以利用。 现代21世纪的女性追求时尚，每个女性都希望自己有一个S型身材。根据这个特点设计出一个S型的标志。
2.色彩搭配 色彩的基本知识： 1.用一种色彩。这里是指先选定一种色彩，然后调整透明度或者饱和度，产生新的色彩，用于网页。这样的页面看起来色彩统一，有层次感。 2.用两种色彩。先选定一种色彩，然后选择它的对比色。 3．用一个色系。简单的说就是用一个感觉的色彩，例如淡蓝，淡黄，淡绿；或者土黄，土灰，土蓝。
2.色彩搭配 在网页配色中，还要切记一些误区： 1.不要将所有颜色都用到，尽量控制在三种色彩以内。 1.不要将所有颜色都用到，尽量控制在三种色彩以内。 2.背景和前文的对比尽量要大，(绝对不要用花纹繁复的图案作背景)，以便突出主要文字内容。
3.制作页面 步骤1：打开 Dreamweaver MX 2004，首先首页上面插入一行宽为780的表格，然后是一个778*100一行两列的表格，第一列插入Logo标志“哈韩网”，第二列插入一个600*120的flash。 步骤2：然后做的是韩国潮流。打开 Dreamweaver MX 2004，首先首页上面插入一行宽为780的表格，然后是一个778*100一行两列的表格，第一列插入Logo标志“哈韩网”，第二列插入一个600*120的flash。 接下来则是导航栏，同样是一个780的表格，然后插入背景颜色780*40的图片，如图：
3.制作页面 步骤3：下来则是一个条纹，因为我的背景是咖啡色，所以我插入一个白色条纹，它的是760*2一行一列的表格，表格为居中对齐。 步骤4：设置为顶部对齐，接下来插入一行11行9列的表格，表格为居中对齐，最要写入的内容是最新服装展示，产品列表。在里面嵌入一个2行1列775*10的表格，插入图片，产品列表。然后在下面插入图片；我的最新潮流的内容大至是这样的。如图所示：
3.制作页面
3.制作页面 步骤5:因为是哈韩时装网.所以插了很多图片.当然也是为了让浏览者能有更多的欣赏空间。
网页制作的基本知识 工作内容 工作计划 制定方案 工作过程 工作检查 工作总结 学习情境1 10分钟 学生自我检查： 修改： 20分钟 小组内相互检查： 15分钟 修改： 制定方案 工作过程 10分钟 小组间相互检查： 15分钟 修改： 工作检查 20分钟 教师抽查： 修改： 工作总结
网页制作的基本知识 工作内容 工作计划 制定方案 工作过程 工作检查 工作总结 学习情境1 学生自评项(15分钟) 1.填写“成果评价表”： 学生互评项(25分钟) 工作计划 制定方案 2.教师针对普遍问题进行点评(30分钟) 工作过程 工作检查 3.教师引导学生总结，填写“工作日志” (20分钟) 工作总结