LOGO 《静态网页设计》课程整体设计 电子信息工程系 计算机专业 李超燕. LOGO 2 课程在专业课程体系中的定位 3 岗位分析 目 录 1 课程的基本信息 6 本课程的特色和效果 4 教学整体设计 5 教学基本条件.

Presentation on theme: "LOGO 《静态网页设计》课程整体设计 电子信息工程系 计算机专业 李超燕. LOGO 2 课程在专业课程体系中的定位 3 岗位分析 目 录 1 课程的基本信息 6 本课程的特色和效果 4 教学整体设计 5 教学基本条件."— Presentation transcript:

1 LOGO 《静态网页设计》课程整体设计 电子信息工程系 计算机专业 李超燕

2 LOGO 2 课程在专业课程体系中的定位 3 岗位分析 目 录 1 课程的基本信息 6 本课程的特色和效果 4 教学整体设计 5 教学基本条件

3 LOGO 1 课程的基本信息 essential information 课程名称：静态网页设计 基本学时： 72 学时，性质：专业必修课 授课对象：计算机大类专业大一第二学期 教材： HTML 网页制作从入门到精通

4 LOGO 2 课程在专业课程体系中的定位 专业培养 目标 课程面 向岗位 静态网页制作 课程 衔接 前续课程：计算机基础 后续课程：动态网页设计 学生 分析 大一新生第 2 学期课程，动手能力一般，比较守 纪律，学习风气好。 本专业确定培养能够从事应用软件系统开发与维护、 软件测试、 web 应用开发与维护、软件产品销售等工 作，具有良好的职业道德和素养、较强的专业技术和 团队协作能力、可持续发展的具有创新意识的高素质 技能型专门人才。

5 LOGO 3 岗位分析 --- 课程对应的岗位 软件测试员 软件公司客服 软件界面设计 静态网页设 计人员 程序员 计算机大类专业软件技术方向学生顶岗实习及毕业后主要就业岗位

6 LOGO 3 岗位分析 --- 岗位技能要求 软件测试员 软件公司客服 软件界面设计 静态网页设计人员 程序员 1. 能够进行网站的布局。 2. 能够进行网站图片的处理。 3. 能够进行网站样式的设计。 4. 能够完成网站静态页面的制作。 5. 能够进行表单填写错误的控制。

7 LOGO 3 岗位分析 --- 岗位晋升情况

8 LOGO 课程教学目标 第一堂课设计 教学方法 4 教学整体设计 课程教学内容 考核方案 教学进度设计

9 LOGO 4.1 课程教学内容 用户需 求分析 Title in here 课程共建企业 --- 宁波森蓝网络科技有限公司 该公司开发一个网站的主要流程 静态网 页设计 数据库 设计 程序 设计 测试测试

10 LOGO 森蓝公司部分成功案例展示

11 LOGO 4.1 课程教学内容 森蓝公司网页开发规范 网页图片简单处理 JavaScript 脚本基础 Dreamweaver CSS 样式 HTML 标记

12 LOGO HTML 基本 4.2 课程教学目标 --- 能力目标 HTML 标记 能够编写 HTML 基本标记来设置网页； 能够编写 HTML 文字和段落标记来编辑网页； 能够编写 HTML 列表和表格标记来编辑网页； 能够编写 HTML 超链接标记和框架标记来编辑网页； 能够编写 HTML 表单标记来编辑网页； 能够编写 HTML 图像和多媒体标记来编辑网页； CSS 样式 能够利用 CSS 样式来设置网页的字体、段落、网页的颜色和背景属性； 能够利用 DIV+CSS 来进行网页的布局； 能够利用 CSS 样式来设置网页的边框和列表属性； Dreamweaver 能够使用 Dreamweaver 来进行网页的布局； 能够使用 Dreamweaver 来编辑网页； 网页图片处理 能够利用 PS 制作简单的网页 LOGO 和 Banner; 能够利用 PS 来设计简单的网页页面，并且进行切片处理； JavaScript 能够利用 JavaScript 来处理表单提交数据的部分错误； 能够利用 JavaScript 来实现部分网页特效。 能够利用 DIV+CSS 和布局表格布局二种方式完成网页的布局，利用 PS 进行简单网页图 片的处理，利用 JavaScript 来进行表单错误的控制和网页特效的制作，最后完成静态网 页制作。

13 LOGO 4.2 课程教学目标 --- 知识目标 HTML 标记 理解 HTML 的基本标记； 理解 HTML 文字和段落标记； 理解 HTML 列表和表格标记； 理解 HTML 超链接标记和框架标记； 理解 HTML 表单标记； 理解 HTML 图像和多媒体标记； CSS 样式 理解 CSS 样式的作用和基本语法； 掌握 CSS 样式的常用属性的设置方法； Dreamweave r 掌握 Dreamweaver 的多种布局方法； 掌握 Dreamweaver 编辑网页的方法； 网页图片处理 掌握 PS 处理图片的基本工具使用方法 ; 掌握 PS 切片工具的使用方法； JavaScript 理解 JavaScript 基本语法； 掌握 JavaScript 中的基本事件和浏览器内部对象的使用方法。 掌握利用 JavaScript 实现简单网页特效的方法。

14 LOGO 4.2 课程教学目标 --- 素质目标 1 具备良好的沟通和表达能力 能够与客户沟通，完成让客户满意的网站策化书； 能够向项目组长和项目组成员汇报自己项目的完成情况。 具备自我学习的能力 能够自学 JavaScript 技术来完成网页特效的制作。 具备团队协作的能力 能够服从项目组长的统一安排, 按时完成项目任务 ; 在自己的项目任务完成的情况下, 能够辅助其他成员完成项目任务。 2 3 4 具备重复简单工作的良好的职业态度 能够保质保量自觉自愿的按时完成对于网站中技术重复和技术简单 的其他页面的制作。

15 LOGO 4.3 教学项目设计 --- 项目进度图

16 LOGO 4.4 第一堂课设计 1. 在网上经常看到一些滚动字幕和 flash 动画，是不是属于动态网页？ 2. 什么是静态网页，什么是动态网页 ? 3. 网页中的基本元素有哪些？ 4. 用什么工具可以来编写网页？ 5. 要将我们的网页放在 Internet 上让用户浏览需要怎么做？

17 LOGO 4.4 第一堂课设计 主题网站 制作 课后训练项目 Dreamweaver+PS+ HTML 标记 DIV+CSS+JavaScript 童话故 事网 宁职数 码网 瑞达医 药网 校企 合作 校企合作

18 LOGO 学生在森蓝公司学习 4.4 第一堂课设计

19 LOGO 4.4 第一堂课设计

20 LOGO 做中学做中学 课内项目 任务布置任务布置 课前引入课前引入 学生训练学生训练 课外项目 4.5 教学方法 项目教学法（ Project-Based Learning ） 4.5 教学方法 项目教学法（ Project-Based Learning ） 现场辅导现场辅导 现场打分现场打分 技术分析技术分析 归纳总结归纳总结

21 LOGO 平时 课内项目 课外项目 课程设计 期末考试 20% 15% 4.6 考核方案 20% 30% 兴趣小组加分 1-10 分

22 LOGO 课程设计评分标准 编号项目内容百分比 1 网站主题鲜明，内容丰富 20% 2 网站配色恰当，布局合理 15% 3 脚本运行正确，无语法错误 15% 4 所用到的技术全面（ CSS ， PS ， JS ， DW ， HTML ） 20% 5 导航明确，浏览方便，超链接无错误 15% 6 有自己的创意 15%

23 LOGO 5 教学基本条件 网站建设 课程组 教学实 践条件 校内实训基地：多媒体机房 校外实训基地：森蓝网络技术公司 周军强，李超燕、李可，邱斌，沈德孟，朱炎

24 LOGO 6 本课程的特色和效果 校企共建 课程内容的确定 教学项目的选择 最终效果： 让学生的学习 更接近于实际 实训基地的建设

25 LOGO