DIVCSS网页布局教和学方式探究.docVIP

DIVCSS网页布局教和学方式探究 　　【摘要】《网页设计》是技工院校计算机应用专业的必修课，随着网页设计前端技术的不断更新，DIV+CSS布局在该课程中的重要性越来越突出。本文介绍DIV+CSS网页布局的优势，阐述教学现状，提出新的教学方式和学习方式。 　　【关键词】DIV+CSS 网页设计 教学方式 学习方式 　　【中图分类号】G71 【文献标识码】A 【文章编号】2095-3089（2018）20-0252-01 　　一直以来，《网页设计》是技工院校计算机应用、数字媒体等专业的必修课。在计算机相关专业毕业生的就业方向中，网页设计师是一个热门的就业岗位。在提倡工学结合的技工教育的背景下，我们可以结合网页设计师岗位的实际要求开展该课程的教学。随着互联网技术的发展，网页设计的前端技术在不断地更新，DIV+CSS网页布局成为网页设计的主流方向，因此，它已成为《网页设计》课程的核心技能要求。在多元化的教育环境下，新的教学方式和学习方式是值得我们研究的课题。 　　1.DIV+CSS网页布局优势 　　采用DIV+CSS网页布局与传统的表格布局相比，有许多的优势： 　　（1）页面加载速度快 　　传统的表格布局必须等表格加载完才显示相应的网页内容，而DIV+CSS网页布局是由一个个松散的DIV盒子组成，它可以实现边加载边显示内容。 　　（2）内容与外观相分离 　　该布局方式实现了内容和外观相分离，不仅提高了网页设计的效率，而且使网页的维护变得更加容易。 　　（3）有利于搜索引擎搜索 　　由于该布局方式内容与外观相互独立，搜索引擎在检索的时候可以避开外观部分的干扰，做好内容部分的检索。 　　2.DIV+CSS?W页布局的教学现状 　　目前，很多教材把DIV+CSS网页布局作为《网页设计》课程中的一个章节，再加上技工院校的学生基础相对薄弱，对英文代码产生畏惧心理。因此，在教学中不是特别重视代码编写能力的培养。更多的是停留在利用网页设计软件（如：Dreamweaver）快速地使用表格布局进行网页设计。由于DIV+CSS网页布局的特殊性，这一章节并没有作为重点来处理，而在企业中该布局已成为主流，因此，我们所培养的学生与实际就业市场的需求存在较大的差距。如果我们继续把教学重点放在表格布局上，必然会导致教学案例无法做到与企业项目一致。因此，我们要做的第一步就是要走进企业，调查目前市场的需求，对教学内容进行改革。 　　另外，网页设计软件大大提高了网页设计的效率，正是因为快速、便捷，很多学生更依赖于此类软件，导致不注重代码编写能力的提升。而作为网页设计师，编写代码是必备的技能要求，因此，在教学中我们更应该注重代码编写能力的培养。 　　3.教学方式转变 　　在教学过程中，很多老师比较注重教学方法的改革，实训课比较提倡任务驱动、项目教学法等等。针对DIV+CSS网页布局的教学，我们可以在这些教学方法的基础上对教学方式做进一步的改革和创新。 　　（1）由设计视图向代码视图转变 　　传统软件的简便操作已无法满足工作的实际需要，向编写代码转变已成为必然的趋势。为了避免学生的产生抵触心理，我们可以借助Dreamweaver中的拆分视图，做好从设计视图到代码视图转变的过渡。在真正实施代码教学的过程中，让学生遇到问题可以借助拆分视图来解决，避免学生对代码的学习失去信心。另外，该软件编写代码具有智能提醒功能，大大降低了学习的难度。通过代码的编写，更有利于学生对网页设计原理的理解，尤其是CSS样式的构成。 　　（2）课程结构的转变 　　往往我们在教学中受教材的影响，形成固有的课程结构：从单一的知识点的讲解，再到最后综合应用。一般在了解HTML的基础上，从CSS基础到盒子模型，再介绍各种样式类型。在前期的教学中，过多的时间用于讲解单一的知识点，不利于学生形成综合应用的意识，并会降低学生学习的兴趣。我们可以尝试对一个完整的案例进行任务分解，再通过子任务的技能要求对知识点进行讲解。这不仅使学生有明确的学习目标，更重要的是理解新知识点的应用。在掌握各知识点的基础上，最终又回归到综合案例的应用上，提高学生的综合应用能力。 　　（3）从单一课程到综合课程转变 　　在传统的教学计划中，我们都以课程为单位进行设计，或者针对一个工作岗位开设几门相关的课程。往往一门课程的独立教学无法达到我们预想的与工作岗位相匹配的效果。DIV+CSS网页布局，可以借助前期所学的Photoshop或者Fireworks相关技能，做好页面设计、切图、取色等等。这不仅能让学生了解DIV+CSS网页布局在真正网页设计流程中的作用，同时能将该课程与其它课程做好实际应用的衔接。 　　4.学习方式转变 　　在教学过程中，我们更加注重学习能力的培养，良好的学习习惯和恰当的学