admin 管理员组文章数量: 1086019
2024年6月16日发(作者:进制转换公式十进制转化为二进制)
课程◆实践◆育人
课程
中职学校网页设计教材开发探究
—以
HTML5
基础实训为例——
肖静
(珠海理工职业技术学校,广东珠海519000)
[摘要]
“互联网+”时代的到来,为中职计算机专业学生提供了大量的工作岗位,同时HTML5的广泛应用也给传统网
页设计带来了巨大挑战。网页设计作为中职学校计算机专业主干课程,教材是影响教学的关键因素。通过以
开发HTML5基础实训为例,阐述中职学校网页设计教材开发背景以及对开发过程的思考,并结合教材开发
中的问题提出建议。
[关键词]
中职学校;网页设计;HTML5教材开发
[中图分类号]
G712
[文献标志码]
A
[文章编号]
2096-0603(2019)11-0126-02
中等职业学校是培养社会急需的一线技能型应用人才。中
职学校所
使用的教材是教师“教”与学生“学”的最直接工具,是
传授知识和技能的重要载体,教材的高质量和高适用性直接关
系到人才培养的质量。
以笔者所在中职学校计算机专业为例,网页设计课程作为
一直以来都为选择适合的教材发愁,网上琳琅满目
专业
主干课,
的教材适用群体大多数为本科院校学生或高职院校学生,没有
考虑到中职学生的学习起点低的因素;教材内容过于理论化和
抽象化,没有考虑到中职学生理解能力不足的因素;教材案例
难度偏高,没有考虑到中职学生自学困难的
不
够详细具体,
因素。
中国互联网协会和国家互联网应急中心于2018年1月9
日联合发布了《互联网行业运行指数———中国网站》报告。报告
中显示,截至2017年底,我国网站数量达到526.06万个。这么多
网站需要多少人设计、维护岗位?这么多岗位中又有多少面向中
职学
生呢?据笔者对当地的网站就业情况了解,网站方向的岗位
众
多,尤其当下的中小型网站开发公司需要大量的HTML设计
人员,然后网站方向的中职毕业生能找到对口方向工作岗位的
比例较低。对口就业率低的最重要原因就是中职学生的网页设
计
能力达不到公司岗位要求,而影响学生工作能力的很大原因
在
于教材选择不当。
一、教材开发探究
(一)教材开发思路
笔者查阅了大量有关中职网页设计课程标准的文献,对该
课程标准概括为:网页设计课程是中等职业学校计算机专业一
门重要的专业必修课,定位于Web前端开发类岗位,为后续的动
态网站开发打下基础。课程的教学目标是使学生了解网页技术
的发展、常用制作工具(Dreamweaver);理解HTML语言和CSS语
法;熟练运用Photoshop软件美化、制作网页图片以及Flash软件
制作网页动画;掌握网页设计的工作流程。
网页设计课程标准强调了教学重点是让学生理解和运用
HTML语言,熟练使用Dreamweaver软件开发网页。市面上大多
教
材包括笔者所在学校使用的教材都侧重利用Dreamweaver软
件讲解HTML语言和CSS语法。
2014年10月29日,经过接近8年的艰苦努力,HTML5标
由于HTML5在扫描图形、播放视频和音
准规范
终于制定完成,
频等方面的改进以及多平台支持性,对传统网页设计发起了巨
大挑战。
近几年,HTML5的发展势头猛烈,岗位需求量急增,而为社
会培养一线技能型应用人才的大多数中职学校包括笔者所在学
还一直在使用传统网页设计教材来讲授HTML4语言。
校
在内,
为此,笔者协同其他教师共同开发《HTML5基础实训》教材,
能够了解HTML5的发展趋势及应用领域;
学
生通过学习教材,
知道网页设计的流程;具备扎实的HTML5&CSS3开发基础,代码
的书写符合前端编码规范,具备良好的编程思想;具有良好的沟
通能力,能够关注最新行业动态,具备新技术的研究与学习能
对自己有合理的定位。
力
,
(二)教材使用软件探究
网页设计课程标准中强调熟练使用Dreamweaver软件开发
网页,Dreamweaver软件是集网页制作和管理网站于一身的所见
一直以来都作为网页教学工具软件,然
即
所得网页代码编辑器,
而
正由于Dreamweaver软件的便利性,不利于学生熟悉掌握
HTML语言和CSS语法。
首先,中职学生由于学习习惯上的懒惰,在进行网页设计
时,习惯通过在设计视图添加网页元素来完成网页效果,本质上
没有熟练掌握HTML语言,一旦遇到网页运行效果问题时不会
查找HTML原因,久而久之就培养出一个只会使用所见即所得
网页代码编辑器开发网页而不懂HTML内涵的“空壳子”。其次,
Dreamweaver软件中的CSS面板、属性面板都可以“方便”地让学
生不用熟记CSS语法,就能完成网页样式的设计,这对学生未来
的职业发展
也是不利的。
为此,《HTML5基础实训》教材最终选择了SublimeText3编
-126-
课程◆实践◆育人
辑器作为前端开发工具,SublimeText3是一款免费的文本编辑
器,安装容易,对硬件要求不高,跨平台,同时支持Windows、
项目任务知识点
课程
续表
Linux和MacOSX等操作系统,方便学生课后安装使用。Sublime
Text3
具有漂亮的用户界面以及书签、即时项目切换、多选择和多
窗口等功能方便学生网站开发,同时拼写检查、代码提示功能适
当帮助学生正确掌握HTML语言和CSS语法。
(三)教材内容探究
传统中职网页设计教材,普遍存在知识点过于零散、案例彼
此之间缺乏联系、初学者体验不到网页设计与开发流程感的缺
点,中职学生由于独立建构知识体系能力不足的原因,更难掌握
网页整体设计。
在教材内容安排上,笔者致力于弥补这一缺陷,以某一个具
体
网站开发为主线,将网页设计的知识点融入主线中,每一个项
目对应主线网站中的模块,项目划分为不同的任务,不同的任务
对
应相应的知识点。通过“知识点—案例—任务—项目”一系列
操作,从而熟悉网页开发的整个流程,通过“做中学、学后练、练
后用”的特点来确保学生在进行项目学习后能真正的消化知识
并能灵活使用,最后通过综合实训项目强化开发应用能力。
教材内容包括9个项目,37个任务,具体内容见表。
HTML5
基础实训内容结构
项目
任务知识点
任务一:HTML5简介
HTML的发展史
一、制作第
任务二:开发环境安装与配
HTML5与HTML4的区别
一张网页
置
任
务三:制作第一张网页
编写HTML5文件结构
任务四:运行与调试
编写网页内容
任务一:HTML5语义结构
二、搭建《中
标签
国传统文任务二:H5语义结构标签+HTML5语义结构标签
化网》首页
css
的简单应用
语义标签间关系
结构
任务三:搭建主线网站首页
结构
任务一:HTML5排版标记HTML5排版标记
任务二:文字效果标记HTML5字体效果标记
三、文混排任务三:列表标记HTML5列表标记
网页设计
任务四:图片标记img标记、figure标记
任务六:多媒体标记
任务一:制作基本表格表格标记
四、表格设计
任务二:合并单元格单元格合并属性
任务三:表格嵌套表格嵌套概念
任务一:认识表单
form属性
任务二:创建表单基本结构
文本框、密码域、按钮、定
五、表单的
任务三:表单元素—
义
按钮
制作
任务四:表单元素—<
单选钮、复选钮
textarea>
多行文本框
任务五:表单元素—<列表
select组件、datalist组件
认
识CSS、认识CSS3
任务一:认识CSS3
CSS语法、应用CSS样式
背景样式、文字样式、段落
六、CSS3网
任务二:创建CSS3样式表
页美化
任务三:图文混排样式美化
样式、文字效果、图片样
任务四:表格样式美化
式、文字环绕效果
任务五:超链接及列表美化
表格基本样式、单元格基
本样式
超链接样式、列表样式
任务一:盒子模型
宽高、padding、margin、bor-
任务二:浮动布局
der
float
七、网页布局
任务三:流式布局
任务四:弹性布局
流式布局概念
任务五:定位布局
弹性布局概念
任务六:导航条制作
position
ul、li、a
任务一:搭建首页框架
八、《8号商
任务二:制作头部和快速导
城》首页制
航栏
知识点综合应用
作
任务三:制作中间部分
任务四:制作分类区域
任务五:制作页面底部
任务一:滚动广告的实现
九、综合实训任务二:“乐游出行”页面
@keyframes
重构
视觉延伸概念
二、教材开发体会
(一)教材开发需体现web前端开发工程师的真实工作情景
web前端开发工程师的工作岗位要求具备扎实的
HTML5&CSS3开发基础、编码规范,还要具备良好的编程思想、
沟通能力。选取主流的、学生喜欢且好奇、所用的知识针对性强
的工作案例作为教材项目,教材需体现“做中学、学后练、练后
用”的特点。确保学生在进行项目学习后能真正的消化知识并能
灵活使用。
(二)教材内容需定位在基础实训
基础实训指通过实训的方式掌握基础知识和基本技能,依
据中职学生学情,选取难度适当的基础知识点,反复加强练习,
使学生达到熟练程度,提升学生实际运用能力和解决问题的能力。
(三)教材内容组织需要考虑中职学生学情
中职学生既有活泼好动、操作能力强等优点,同时又有自控
能力差、知识接受能力稍弱等缺点。如何通过教材能使学生有兴
趣学、坚持学、学习之后能灵活使用、激发学生成就感是教材编
写中需要特别注意的问题。
“互联网+”时代的到来给中职计算机专业的毕业生创造了
绝好的就业机会,同时国家的大力支持使中等职业教育快速发
展,
且国家也投入了大量的财力物力,近几年中职学校的办学质
量
和水平也有所提高,如何继续做大做强,增强中职毕业生的就
业竞争力?在这样的环境下,开发适合中职网页设计课程的教材
则是势在必行,尽管教材开发过程中还存在一些问题,如教师编
写教材版权意识不足、信息资源不足、企业参与度低等,但对教
师个人的专业发展和学生的职业能力发展还是起到了一定的促
进作用。
参考文献:
[1]陈颖.中职《网页设计》教材编写的实践与思考[J].广西教
育,
2015(1).
[2]丁春明.中职计算机及应用专业项目课程校本教材开发
的思考[J].职业技术教育,2010,31(8):65-67.
[3]张宝升.中职学校校本教材开发研究:以《网页设计》为例
D].长沙:湖南师范大学,2015.
[4]杜志锋.浅析中职《网页设计》课程改革[J].品牌,2014
9).
[5]林烨.论中职校网页设计课程的教学改革[J].科教导刊,
2014(9).
◎编辑武生智
-127-
[
(
版权声明:本文标题:中职学校网页设计教材开发探究——以HTML5基础实训为例 内容由网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:http://roclinux.cn/b/1718486810a722879.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论