的基础上，论述了课程优化理由、结果与策略。通过调查、实验、归纳与对比推断,该课程 以HTML5与XHTML1.0作为网页制作标准，采用Dreamweaver cs6为编辑工具，合理整组
课程教学模块与内容，构建“学习包+任务”式课程结构，按照“边做边学+有效指导”教
学方式进行课程改造与实施，是目前该课程改革与实施的一种有效选择。关键词：中职网页制作课程优化实施1引言中职电子商务、计算机应用等专业均会开设“网页 制作”这门课程。该课程以出版的配套教材主要有刘
存、销售、顾客关系管理）各种数据库的网络收集、查询 与利用。按中职电子商务专业人才培养方案，该课程
教学时间一般为96课时左右。焰主编的《电子商务网页制作》、官辛华主编的《边学边
做Dreamweaver cs3网页设计案例教程》、张松炎主编的
2.3紧跟网页制作工具进步在中职“网页制作”课程中，不会用到VC+ +、VC
#、VB、JAVA等语言制作网页，因而网页制作工具只需 考虑Windows自带的\"记事本\"、Frontpage2003及Dre-
《网页设计与制作》、姜华主编的《网页设计与制作项目
教程》一四种教材在编辑工具选择及内容组织上均 存在较大差别。对中职电子商务专业而言，针对“网页
制作”课程教学,哪种教材更适合呢？为此，从提高该
amweaver等编辑工具。“记事本”作为网页制作的编辑
工具，界面与菜单简单,但不具备智能性功能，所有HT-
课程的教学效果出发，结合中职“网页制作”课程改革
与实施加以探讨。ML标记都得靠人熟记并输入,对网页制作初学者而 言，不是好的选择。Frontpage2003软件提供设计、代 码、预览等三种可切换界面,其设计视图工作区与Word 工作区相似,不需要输入标记就能制作网页,且所见即
2中职“网页制作”课程改革背景2.1围绕中职学生特定对象中职“网页制作”课程改革，一定要围绕中职学生
特定对象。第一，中职学生不擅长代码。若网页制作
所得,但表现与行为方面功能不够强大。Dreamweaver
软件也适合初学者用于编辑网页，同样提供设计与代
课被衍化为编写HTML代码课，则对中职学生而言这
码视图，其设计视图工作区是一个智能性的编辑场所， 且具有新建与管理站点功能、新建与编辑CSS（层叠样
是一场灾难。第二，中职学生不擅长脚本。网页制作
中会涉及到脚本，若把诸如javascript语言脚本编写作
式表）功能以及添加更多的网页行为及智能连接数据
为课程的内容，则对初学网页制作的中职学生而言会
一头雾水。当然，若javascript语言脚本能被电脑自动
库功能一通过智能补进VBScript或php语言脚本可
实现对数据库的操作,Dreamweaver能将网页制作过程
产生，则另当别论 Dreamweaver网页编辑软件就能 自动产生某些特定的脚本,反而应被中职“网页制作”
化繁为简;缺点是界面与菜单相对复杂,且没有对扫码
器等设备的智能连接功能。比较而言,Dreamweaver软 件作为编辑工具更体现进步。课程加以采纳。2.2贴近专业岗位工作任务中职电子商务专业“网页制作”课程改革，一定要
2.4追踪网页制作标准发展从技术看,网页制作标准由笼统走向细分,由原先
贴近电子商务专业的岗位工作任务。对电子商务专 仅对HTML标记规范已过渡到对网页结构、表现和行
业，岗位核心工作任务是网络营销，涉及网络品牌、网
为分别制定标准。目前W3C（万维网联盟）起草和发布 的结构化标准语言有XHTML1.0与2.0,表现标准语言
有CSS3.0（可取代HTML表格式布局、帧和其他表现的 语言），行为标准主要为对象模型（如DOM）、ECMAS-
站推广、信息发布、销售促进、网上销售、顾客服务、顾 客关系、网上调研等八大实务。“网页制作”课程至少
与其中的信息发布、网上销售、顾客服务、顾客关系、网
上调研等实务有直接关系。“网页制作”课程对应岗位
cript和ECMAScript262（后两者由欧洲计算机制造商协 会——ECMA发布）。另外,W3C与WHATWG（网页超 文本应用技术工作小组）于2006年共同制定HTML5
任务是从事网络营销中信息发布、网上销售、网上留
言、网上调查等事务，参与电子商务中（商品流通、储
2019年8月中职“网页制作”课程优化及有效实施287标准，解决PC端与移动端网页标准的统一。HTML5
可取代HTML4. 01和XHTML1.0,有两大特点,其一，
音乐（声音）、弹出信息、自动跳转网页页面（实现url转 向）、跳转菜单、打开浏览器窗口、关闭浏览器窗口、创
强化了 Web网页的表现性能，其二，追加了本地数据库
等Web应用的功能。广义的HTML5是包括HTML、
建漂浮广告、功能性标签使用（如文字滚动）、表单的应 用（含与数据库连接）、Spry应用（可验表单制作）、密码 登录等。另外，拓展模块包括模板创建与应用、创建并
CSS和javascript在内的一套技术组合，是目前网页制
作中主推的标准。应用库、Photoshop切片生成网页或Fireworks切片生成 网页等。将上述模块按学习阶段分解成六个学习包,
然后对中职学生就六个学习包从内容重要性、学习难
2.5对接学生学习认知现状对中职“网页制作”课程内容按结构、表现、行为进
行分解，与结构有关模块包括文本编辑、图像应用、超
链接、表格布局、APDiv层（与表格转换）、表单、Spry、框
易程度、学习喜欢程度等三个方面进行调查，得到学生
学习认知调查结果汇总表，如表1所示。其中，内容重
架布局、内框架+代码等，与表现有关模块包括HTML 格式、CSS样式、Div层+CSS、表现代码使用（如外围边
框粗细设置）等,与行为有关模块包括插入媒体、插入
要性结果按重要到不够重要进行排序,学习难易程度
结果按由难到易进行排序，学习喜欢程度结果按喜欢
到不够喜欢进行进行排序。表1学生对“网页制作”课程的学习认知调查结果汇总表第弹自页转开口览创告学信跳面单览关器窗建 漂 三出动页菜浏+
桃色
+息转网++跳打器窗闭浏口+浮 广
第一学习包：
文本+图像
+趙链接+第二学习包：
衰格+ APDiv
HTML格式 +腥架+内
项目排序+ CSS样式
+表现代码 框架+ Div +功能性标 层与CSS签第四学习包： Photoshop 切 片生肢网页
第五学习包： 第六学习包： 第七学习包：
或 Fireworks 夷单+ Spry + 表单+数据 表单+数据库 切片生成网
数据库连接 库连接+网 连接+密码登
页+模板创
+网络问卷 络留言簿（自 录+在线书城
建与应用+
网页（自动产 动产生ASP （自动产生
创建并应用
生ASP脚本）脚本）ASP脚本）库+插入媒
体+皤入音 乐内容重要 性排序①⑦①②④②⑥⑥⑥⑤⑤③③②⑤④③④⑦①⑦学习难易 程度排序学习喜好 程度排序3中职“网页制作”课程优化策略3.1网页制作标准确定与策略首先，观察主流网站网页制作标准。国内主要门
Dreamweaver版本一直在不断升级，之前版本包括 Dreamweaverl 到 Dreamweaver8,中途版本包括 Dreamweaver cs3 到 Dreamweaver cs6，最近版本包括 Dreamweaver 2013到从目前的Dreamweaver 2018o目前，出版 的中职“网页制作”教材中，编辑工具多采用Dream
户网站搜狐、新浪，大部分电子商务网站如淘宝、亚马
逊、京东、携程等，大众传媒网站如人民网，搜索引擎网
站中谷哥，其首页的HTML标记均采用HTML5标准,
weaver cs4 版本（版本 10. 0） □ Dreamweaver cs4 制作网 页默认标准是XHTML 1.0 Transitional,制作出网页仅
而少数电子商务网站如铁路客户服务中心（12306）、大 众传媒网站如央视网、搜索引擎网站中百度，其首页的
面向PC端,不能在移动端浏览。而Dreamweaver cs6
（版本12.0）,其制作网页默认标准是XHTML 1.0,但
HTML标记仍采用XHTML1.0标准。可见，目前主流 网站其首页的网页制作标准已经趋向采用HTML5标
准。其次，比较网页制作标准发展趋势。当今信息技
能有条件地转化为HTML5标准（只要网页代码中不存
在HTML5不认可的元素）。因而，课程优化中,Dream
术已进入智能手机和平板电脑大爆炸的时代,移动优 先已成趋势,HTML5标准的网页能在两种终端上实现
weaver 版本至少应为Dreamweaver cs6或以上。其策
略:先在Dreamweaver cs6的默认标准（XHTML 1. 0标 准）下制作网页,然后将XHTML 1.0标准的网页转化
无障碍浏览，采用HTML5标准可避免分别针对PC端、
移动端制作网页的重复劳动。再者，对比网页制作标 准学习难易。XHTML1. 0标准与HTML5标准只是推
为HTML5标准的网页。Dreamweaver cs6不具备离线 打包（生成apk文件）功能,而在线打包可能涉及付费。
出时间先后，不存在后推出标准就一定难学的问题。
因而，课程优化中，确定将HTML5标准和XHTML1. 0 标准共同作为课程内容的参考标准。其策略:将HT-
为让中职学生尽量免费完成apk生成过程，打包时可
采用国产软件HBuilder（数字天堂DCloud推出的一款 支持HTML5网页制作的集成开发环境）。这样，Dre
ML5标准和XHTML1.0标准隐形地融入教学内容。amweaver cs6作为主要编辑工具加以利用，而HBuilder
作为后备编辑工具进行补充。3.2网页制作工具确定与策略2883.3 “网页制作”课程内容与策略江西化工2019年第4期HTML5标准中新出现的元素补入教学内容一教学内 容中补入 ＜ video ＞、＜/video ＞、＜ audio ＞、＜/audio ＞ 等标记。另外，将建立支持VBScript脚本的IIS网站以
及在Dreamweaver cs6内建立站点列入教学内容。最
在课程课时内（如96课时），为了让学生快速、更
多获得网页制作能力，课程优化中不必把熟记标记作
为教学要求，且应对课程内容进行重新组合。其策略:
对HTML5标准中淘汰的网页标记以及不符合潮流内
容排除在教学内容外、予以删除或简化一例如，可删
后,根据学习包中内容多少与学生学习认知调查结果 分配课时。“网页制作”课程优化后内容与分配课时,
如表2所示。除框架模块，可简化表格模块（表格布局不是潮流），对
表2 “网页制作”课程优化后内容与分配课时第四学习包：
第三学习包： Fireworks 切 第五学习包： 第六学习包：
第七学习包：
新建编辑工 片生成网页 Spry +建立 表单+建立
第一学习包：
第二学习包： 具内站点+ +模板创建 ns网站+新 IIS网站+新 建立IIS网站
+新建编辑工 文本+图像
表格（简化） 弹出信息+ 与血甬+建 建编辑工具 建编辑工具
+超链接+ 具内站点+数
要求与 +表现代码 跳转页面+ 立IIS南站+ 内诂点+薮 内詰点+薮
HTML格式 据库连接+密
课时+ APDiv + 跳转菜单+ 新建编辑工 据库连接+ 据岸建接+ 码登录+在线
+ CSS样式
+功能性称 Div层与CSS 打开/关闭浏 具内站点+ 网络问卷网 网络留言簿 书城（自动产
+内稚架览器窗口 + 插入媒体+ 页（自动产生 （自动产生
圧 VBScript 脚 签创建漂浮广 皤入首乐 VBScript 脚 VBScript 脚
本）本）告（HTML5 代 本）码）岗位要求基础，重要基础，重要拓展,一般拓展，一般应用，重要应用，重要应用，一般学习要求分配课时必修必修选修选修必修必修选修181810144+64 + 16+ 6注:分配课时中“+”后数字为以整周实训形式安排的课时,安排一周实训，共28课时;选修的学习包是否被 选,依据学生对必修学习包的学习能力，若学生对必修学习包不能在分配课时完成学习任务,则选修的学习包可不被选学。3.4 “网页制作”课程结构与策略中职电子商务专业的学生毕业后若从事网页设计 与制作工作,则多数仍然从事前端的部分制作工作,这
一个任务，即制作在线书城网页。4中职“网页制作”课程实施过程4.1教材比较与选择《电子商务网页制作》教材采用Frontpage2003为
网页编辑工具，内容着重围绕静态网页制作进行组织；
样在课程优化重点应放在横向内容选择上而不是放在 层次内容递进上。因而，中职“网页制作”课程结构偏 向采用“学习包+任务”式结构。策略为：以各学习包
为支柱,以教学任务承载教学内容,教学任务不宜设置
《边学边做Dreamweaver cs3网页设计案例教程》教材 以Dreamweaver cs3为编辑工具，内容突出了网页的结
太大，在4~8课时完成，其中2 ~ 4课时知识介绍,2 ~6
课时制作训练，在一个学习包中可设置多个教学任务,
构设计（表格、div、框架）和表现设计（css）,追求页面观
赏性;《网页设计与制作》教材主要从HTML标记和
将关联性较大模块组合在一个任务中。如第一学习包
javascript脚本语言入手介绍网页结构设计（以记事本
为编辑工具）；《网页设计与制作项目教程》教材以Dre
可组合为两个任务，任务一包括文本、超链接、页面属 性、CSS样式（类、标签CSS规则）、功能性标签等模块，
任务二包括图像、超链接、HTML格式、CSS样式（复合
amweaver cs4为编辑工具，安排网页结构设计（表格、
div、框架）、表现设计（css）、行为设计（播放动作及数据 库应用等）以及网络留言簿、在线书城等项目内容。用
当今眼光审视、从学生角度评判，《电子商务网页制作》
内容CSS规则）等模块;第二学习包组合为三个任务， 任务一包括表格（简化）、表现代码、APDiv + CSS等模 块，任务二包括Div + CSS（ID型CSS规则），任务三包
括内框架、Div + CSS（ID、复合内容CSS规则）等模块； 第三学习包组合为两个任务，任务一包括新建编辑工
教材在编辑工具和内容上显得过时;《边学边做Dream
weaver cs3网页设计案例教程》教材侧重网页美观，对 初学者适合的,但对关注数据库利用的电子商务专业
学生并不是好的选择;《网页设计与制作》教材选用网
具内站点、弹出信息、跳转页面、跳转菜单等模块，任务
二包括新建编辑工具内站点、打开/关闭浏览器窗口、 页编辑工具为记事本，内容对初学网页制作的中职学
生显得太难;姜华主编的《网页设计与制作项目教程》
创建漂浮广告等模块;第四学习包组合为三个任务，任 务一为Fireworks切片生成网页，任务二为模板创建与
教材选用编辑工具较新,课程内容符合网页制技术发
应用，任务三包括建立HS网站、新建编辑工具内站点、
展趋势，课程结构以项目化结构呈现。比较后认为， 《网页设计与制作项目教程》应是中职电子商务专业优
插入媒体、插入音乐（HTMI5代码）等模块;第五学习 包含一个任务，即制作网络问卷网页;第六学习包组合
为三个任务，任务一为编辑留言，任务二为查看留言, 任务三为添加留言,任务四为删除留言;第七学习包含
先考虑的教学用书。当然,理想的情况是按优化策略, 重新编写教材。4.2内容增减与处理2019年8月中职“网页制作”课程优化及有效实施289若采用《网页设计与制作项目教程》作为教材，则
应考虑教学内容的增减。首先教材中有关框架等模块
不要被用作教学内容，任务内重复内容不要被用作教
学内容，表格等模块需要简化。其次，诸如Fireworks软
件切片生成网页、Spry构件制作网络问卷网页等教材 中没有的内容，应该增补。对于增补的部分，教师可制
成word文档的电子教案,通过局域网中共享文件夹或
电子教室功能推送给学生，学生借助电子教案（共性指
导）进行学习或完成任务。教学实施中，第五学习包
（除4课时理论知识）、第六学习包（除4课时理论知 识）以及第七学习包,推荐以整周实训形式安排。4.3边做边学与指导从教学过程看，该课程适合采用工学结合、边做边
学的教学方式实施。工学结合就是让学生在“网页制
作”课程学习中将完成网页制作任务与学习网页制作
方法结合起来进行、以边做边学的方式实现课程目标。 教学中，既要让学生明道理、学方法,避免只做不想、防
止“依葫芦化瓢”，又要让学生用工具、练技能,避免只 听不做，防止网页制作动手摸不着边。在学生边做边 学中,离不开指导。课堂教学中采用的指导，既强调教
师亲历指导也安排好的学生对同组其他学生进行互助 指导（小组学习中互助指导对教师指导能起补充作
用），既包含针对全班学生进行的无差别指导也突出针 对小组或个别学生进行的分层指导，既编写指导书
（word文档）进行指导也利用网页开发了 FQA （常见问 题解答）式指导。4.4初步效果与反思以优化后课程、按“边做边学+有效指导”方式进
行教学，每次任务后对学生提交的电子稿作业进行批 改与登记,统计分析表明,70% -80%学生能较好完成
网页制作任务。学习包结束时，安排学生做一次综合
作业（考核）一让学生在没有教师指导下独立完成一
项综合网页制作任务，统计分析表明，超过60%的学生 在没有教师指导下能独立制作基本符合要求的网页。 对照效果好于以往。以优化后课程、按“边做边学+有
效指导”方式进行教学，在保证多数学生掌握的情况下
能按分配课时完成学习包内容,绝对效果认为满意。
通过同行访问与企业人员访问获得，被访者一致认同
优化后课程更有利于学生专业能力提高。之所以初步
效果明显，关键在于:其一，课程优化中将关联模块组
合在一个任务中，使任务结果更加显性,激励学生追求
更好结果,也方便对任务结果评判;其二，课程优化中
删除重复内容，使学习重点突出；其三,边做边学中强
调培养学生主观能动性,而不是仅强调“做”，使“学”贯
穿于边做边学的全过程;其四，教学指导中主张教师将
亲历指导与学生互助相结合、无差别指导与分层指导 相结合、指导书指导与网页智能指导相结合。5结论“网页制作”课程改革应围绕专业课程设置要求与
课程教学目标、特定教学对象及其学习认知现状，以及
网页制作现行标准与流行工具进行。对于“网页制作” 课程与教学优化，以HTML5与XHTML1.0作为网页制
作标准，采用Dreamweaver cs6为编辑工具，合理重组教
学模块，删除或简化重复内容、淘汰的内容与不符合潮 流的内容,构建“学习包+任务”式课程结构，按照“边 做边学+有效指导”教学方式实施教学过程，是一种有
效选择。参考文献[1] 刘焰.电子商务网页制作[M].北京:高等教育出版
社,2009年7月，第2版.[2] 官辛华.边学边做Dreamweaver cs3网页设计案例
教程[M].北京:人民邮电出版社,2010年11月，第
1版.[3] 张松炎.网页设计与制作[M].武汉:华中师范大学
出版社,2011年5月，第1版.[4 ]姜华.网页设计与制作项目教程[M ].北京:科学出
版社,2012年2月，第一版.[5 ]劳飞.基于项目化教学的“网页设计与制作”课程改
革与实践[J].教育与职业,2014（29）.[6]郭祥彬.提高中职学校网页制作课程教学效果方法
研究[J].信息与电脑（理论版）,2018（3）.
因篇幅问题不能全部显示，请点此查看更多更全内容