网页设计课程教学情境设计

【#文档大全网# 导语】以下是®文档大全网的小编为您整理的《网页设计课程教学情境设计》，欢迎阅读！

网页设计课程情境设计

周次

情境

任务

对应章节

理论内容 1、典型网站浏览 2、色彩的基本认识及色彩搭配

3、DREAMWEAVER软件的基本工作环境及界面的基本操作

4.相关概念的理解及掌握

典型实例

相关知识

备注

1

简单网页设计与经典网站赏

析

做一个主题为

第1、2章

《春天》的网页

1、不同类型的大

型网页欣赏、分析（浏览者） 2、个人网页的制作（设计者） PHOTOSHOP：网上图片的搜索、下载能力，图片的简单编辑，图片的羽化及图片的交替出

现

熟悉设计软件的操作；大量进行不同类型网站的浏览欣赏，了解不同主题网站的基本特点，为学生由浏览者到设计者

身份的转变打下基础。

2

《我爱我家》站点创《我爱我家》网建及网页站制作 整体设置

第3、4章

1、站点的创建及规划思想

1、Myweb站点的创

2、站点的管理及编辑

建及编辑与管理

3、首选参数的设置

2、《美丽的春天》

4、页面属性设置

主页设计

5、标尺、网格、辅助线等辅助工具的使用 1、文本操作（简单讲解）

2、图像操作

3、插入简单FLASH动画

4、导航栏制作 1、超链接（三种常用超链接） 2、表格布局 3、布局表格

1、《我爱我家》网

页制作 重点：图像的插入与使用、简单FLASH插入、导航

栏使用 1、《我爱我家》网页中超链设置 2、《我爱我家》网页用表格进行布

局

PHOTOSHOP中文字处理工具的使用

网页布局前，通过本节任务使学生体会没有布局的网页在设计过程中的一些难以突破的问题，为下节网页布局的引入

设置了使用情境。

3

《鲜花速递》网站设计与制作 4

《鲜花速递》网站制作插入导航栏及FALSH （布局前）

第5、6章及8.2、9.3

PHOTOSHOP：图片的进一步处理，网页上鲜花对比没有动感元素的网页与插入动感元速递使者的形象设计 素之后网页的不同视觉效果，体会动感FLASH：网页上鲜花速元素在网页设计中的重要作用 递使者的动作设计 PHOTOSHOP：相关图片的进一步处理，网页上鲜花速递使者的形象

美化设计

FLASH：网页上鲜花速递使者的动作设计

《鲜花速递》网站制作设置超链接

（布局后）

9.1、9.2及7.1、7.2 网页布局前与网页布局后效果比较，从整体效果上体会布局为网页增加的美感


5

《08网络》班级网站制作

7.3、7.4

1、利用层进行网页布局

2、利用框架进行网页的合理布局

1、滚动字幕的设计（代码）

2、布局的分析、选择及综合使用

《个人网站》选择表格、层或框架进行合理网页布局，然后进行效果分

析 《美丽的春天》中的滚动字幕设置



6

《08网络》

班级网站《08网络》班

级网站制作 制作

11.3.10

7

《08网络》班级网站制作



1、表单的概念

10.1、10.2 2、各种表单元素的正

确使用

《个人网站》中

本文来源：https://www.wddqxz.cn/fd9c4c622b160b4e767fcff6.html