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