姚振赵鑫张贵山马登辉陈虹
（北京印刷学院机电工程学院，中国北京102600）
【摘要】新形势下传统的教学方式难以满足印刷设备的教学需求，通过结合互联网技术的混合式教学，有助于学生能更好地理解印刷设备课程的内容。针对这一问题和当下网络上缺少印刷专业知识的现状，设计了这个教学平台，以期解决教学的困境，提高教学质量。教学平台中添加了大量的印刷机械和印刷专业知识的相关知识，在windows操作系统下，使用AdobeDreamweaverCS6软件进行了教学平台的页面设计，并在此基础上添加了后台操作，以便于教学平台的信息更新和其它操作。也为今后的网络教学平台设计提供了借鉴的空间。
教育期刊网 http://www.jyqkw.com
关键词 网站式教学平台；印刷设备；研究流程；界面设计
TheApplicationofTeachingPlatformofWebinTeachingofPrintingEquipment
YAOZhenZHAOXinZHANGGui-shanMADeng-huiCHENHong
（SchoolofMechanicalandElectricalEngineering,BeijingInstituteofGraphicCommunication,Beijing102600,China）
【Abstract】Underthenewsituation,itisthetraditionalwayofteachingthatisdifficulttosatisfytheteachingrequirementsofprintingequipment.IthelpsstudentstounderstandthecontentofthecourseofprintingequipmentpreferablythroughthehybridteachingcombinedwithInternettechnology.Inordertosettletheissuethatthestatusquoofthelackofknowledgeaboutprintingonthenet,todesignedtheteachingplatform.Asaresult,itcansolvetheplightandimprovethequalityofteaching.Addingalotofknowledgeofmachineryandspecializedontheteachingplatform.CarryingonthepagedesignofteachingplatformbyusingAdobeDreamweaverCS6softwareandthenaddbackgroundoperationintheWindowsoperatingsystem,sothattheteachingplatformofinformationupdatesandotheroperations.Also,theycandrawlessonsofnetworkteachingplatformdesignfromthis.
【Keywords】Teachingplatformofweb;Printingequipment;Processofresearch;Interfacedesign
印刷设备原理是一门专业技术基础课程，它的教学从属于基本课程到专业课程的过渡阶段，在印刷机械及印刷机设计学科中有着至关重要的作用，对学生今后的视野开拓和专业基础知识的综合运用起着积极作用。近年来，在机械专业教学方向，多媒体互联网技术成功地应用到了一些专业课程的教学中，比如为辅助力学实验教学开发虚拟实验平台[1]，为辅助课程设计教学开发的相应软件或程序[2]，但是在印刷设备原理这门课程上的应用仍处于真空状态。一些网络平台存在着内容单一、形式单一的问题，不能很好地达到综合教学的目的，从而失去了开发这类教学平台的意义[3]。为此，通过协同专业老师，查阅大量参考书籍，开发了这个复合式的网络教学平台，争取让用户能够以印刷机中单张纸的走线过程为基础，更好的理解和领会印刷机械原理和印刷工艺的知识。
1教学平台的设计
1.1设计理念
教学设计的第一步就是要对学习内容和教学目标进行分析[4]。学习的理念和理念的先进性对于学生学习有着深远的影响，创新型的教学就是要把数字化学习的优势与传统教学的优势二者结合起来的混合式教学[5]。而印刷设备学习中有着很多难点和重点需要掌握，通过使用教学平台作为教学的辅助工具可以更好地完成教学任务，并且保证了教学效果。而要实现教学平台的这个优势，在网页界面的设计问题上，要考虑以下内容：
结构上：教学平台以一张单张纸印刷品所要经历的“走出”过程为主线而设计，通过将工艺过程与机械结构结合起来，使教学由浅入深，由易渐难，由理论到实践，在这种循序渐进的过程中，让用户最大程度地掌握印刷设备及其机械原理。
内容上：强调以学生为使用主体的设计理念，实现与课堂教学的相互匹配，即该教学平台将老师的课本或者讲义进行系统化的展示，同时也为使用者提供了丰富的自主学习资源，将静止的机械原理图变成了动画模型，加强了学生对于知识内容的理解。
操控上：与一般的门户网站的操作风格相近，以导航条目引导逐层展开，方便突出高效快捷、易于使用的使用特点。
1.2研究流程
为了避免在研究创新型事物时出现过多的失误，通过借鉴前辈经验，类比[6]，“机器设计”的一般设计流程，提出以下流程：首先明确设计问题，通过分析提出有利于解决问题的具体要求；进而有针对性地查阅大量的相关文献，提出可行性操作界面方案；通过讨论、评价不断地遴选，最终选定最佳设计方案；之后再确定具体的设计细节，进行细节设计的敲定，如图1和图2所示。要强调的是，这个过程是周而复始的，也是做好学习平台的重要条件。
而针对界面的设计问题，不仅要求学习平台具有严谨性，而且应该考虑到它的简洁性、创意性与个性，因此在界面的制作上必须考虑以下因素：
①界面设计：界面是人与机器之间传递和交换信息的媒介。要求界面朴素、美观、创意，以一种舒服的感觉呈现在用户面前；
②用户导向：明确使用者，站在用户观点和立场上考虑设计；
③导航菜单：简洁易操作；
④布局：栏目选择项目最佳在5～9之间，过少则会在页面中起不到吸引用户的目的，过多则会使用户产生厌倦心理，因此合理分布栏目就显得尤为重要；
⑤视觉平衡：考虑到现在的“快餐阅读”，学习平台将视频和图片占领主导。且注意图片界面要用更多的文字来平衡一幅图片，以做到整体页面的美观[7]。
1.3网站内容
针对前面提到的界面设计问题，依据印刷单元区别将学习平台分为六个一级导航菜单：给纸装置、定位传递装置、印刷装置、输墨装置、输水装置、印后装置；在一级导航菜单下，又依据具体的构成进行了进一步的分类。一级菜单与二级菜单的逻辑联系，如图3所示。而在二级导航菜单下又建立了对应子菜单，对二级菜单内容进行了具体的阐述。二级菜单与子菜单的联系，如图4所示[8-9]。
1.4平台设计过程应用工具
平台界面制作主要使用AdobeDreamweaverCS6、C#语言编程等；
文字输入则使用了MicrosoftWord2010、MicrosoftOneNote2010等；
图片处理使用了AdobePhotoshopCS5、AutoCAD2013、SolidWorks2013等；
视频的制作则使用了Matlab、MacromediaFlashCS3等。
2操作功能的实现
2.1前台学习界面
1）首界面代码设计以及界面展示
为了能更大程度的服务用户，使教学平台具有更好的开放性，在此教学平台学习中没有设计密码验证界面。从首界面（如图5所示）进入一级导航菜单界面（如图6所示）的主要代码设计如下：
<body>
<divid="apDiv1">
<ulid="MenuBar1"class="MenuBarVertical">
<li><ahref="001.html">印刷发展历史视频</a></li>
<li><ahref="#">印刷工作演示视频</a></li>
<li><ahref="01.html">开始学习</a></li>
</ul>
</div>
<p> </p>
2）热点链接制作
利用map热点制作链接，进行单击操作时，跳转到指定页面，即通常的“热区处理”。主要代码如下：
<mapname="Map"id="Map">
<areashape="rect"coords="667,211,923,529"href="02.html"/>
</map>
3）导航菜单制作
利用DIV的定位技术制作导航菜单，鼠标点击可以进入对应内容的学习。主要代码如下（由于六个一级导航菜单的代码相似，这里只列出了“给纸装置”的代码）：
<divclass="column_l">
<divclass="gywm">
<h4><Ahref="/about/?1.html"class="a1">给纸装置</A></h4>
</div>
</div>
图7主要对学习平台子菜单的学习界面进行了展示。
2.2后台操作界面
1）后台登录界面
考虑到程序和后台资源的安全性，进入后台时设置了输入用户名、密码的验证操作（如图8所示）。利用dl创建一个普通列表，dd创建列表中的上层项目，dt创建列表中的下层项目，从而完成登陆界面的制作，主要代码如下：
<dl>
<dt>用户名：</dt>
<dd><inputtype="text"id="username"name="username"size="20"maxlength="20"onfocus="this.style.borderColor=’#239fe3’"onblur="this.style.borderColor=’#dcdcdc’"/>
</dd>
</dl>
<dl>
<dt>密码：</dt>
<dd><inputtype="password"id="password"maxlength="20"name="password"size="20"onfocus="this.style.borderColor=’#239fe3’"onblur="this.style.borderColor=’#dcdcdc’"/>
</dd>
</dl>
2）预览页面连接建立
利用href实现从网站后台（网站后台界面如图9所示）到预览页面的连接，主要代码如下：
<td>给纸装置<ahref="../../../about/?1.html"target="_blank"title="查看"><imgsrc="../../images/view.gif"border=0/></a></td>
<td><ahref="AspCms_AboutEdit.asp?id=1">修改</a></td>
3）添加多媒体文件制作
利用emble添加各种多媒体文件，有Midi、Wav、AIFF、AU、MP3的格式，主要代码如下：
<embedtype="application/x-mplayer2"width="500"height="400"src="[news:videourl]"></embed>
3结语
相对于印刷设备课程的传统教学方法，网络教育平台越来越受到了广大教育者的重视。近年来随着互联网技术的迅速发展，传统的教学模式已经不能满足现代化教学的需求，而网络平台的出现进而解决了这个问题，使得教学趋于普及化。
交互式互联网网站毕竟有一些技术发展还不是很成熟，同学们对于平台式教学还不是特别的了解，可能在使用上会出现一些问题。并且在学习时学生潜意识里可能还在用传统学习方法来看待平台式学习，甚至有些学生把网站教学认为成资源包。这些都足以说明，网络教学平台的功能和角色远远没有得到充分的发挥和体现。
对于这些现象我们应该明确认识到，课堂教学和网站式教学不应该是相互对立的教学方案。必须将二者有机的结合起来,从而实现传统式教学与网络式教学的互补与互动，进而最大限度的提高教学质量。
教育期刊网 http://www.jyqkw.com
参考文献
［1］童长仁,李明周,徐志峰,等.开放式冶金仿真过程在实验教学平台中的应用[J].江西理工大学学报,2011,32(3):61-63.
［2］夏建波,梁成,等.井巷工程课程设计程序开发[J].昆明冶金高等专科学校学报,2011,27(3):41-45.
［3］倪向东,李盛林,曹杰,等.网络教学平台在课程辅助教学应用中的利弊[J].现代教育科学,2010(4):31,70-71.
［4］皮连生.面向21世纪课程教材:教学设计[M].2版.北京:高等教育出版社,2009:9.
［5］王秀玲.引领式网络课程有效教学探究[J].北京印刷学院学报,2013,8.
［6］吴松梅,张殿清.论科学研究中的创造性思维[J].北京印刷学院学报,2001,6.
［7］邢太北,许瑞健.CSS+DIV网页布局技术详解[M].北京:清华大学出版社,2014,3:2-7.
［8］陈虹.印刷设备概论[M].北京:中国轻工业出版社,2010:19-147.
［9］陈虹.现代印刷机械原理与设计[M].北京:中国轻工业出版社,2007:103-263.
［责任编辑：汤静］