（教育技术学专业论文）基于web标准的大学英语网络教学系统前端架构.pdf

中文摘要 中国科学技术大学硕士论文 摘要 随着互联网的高速发展，基于w e b 的各种应用环境日趋成熟，越来越多的 人意识到基于网络教学的重要性。由于互联网和计算机的多媒体承载特性非常 适合英语教学，各种各样的大学英语网络教学系统也应运而生。但是在不少主 流的教学系统中，还普遍存在着一些前端架构方面的问题，它一定程度上影响 了教学活动的充分展开，也降低了系统的兼容性和稳定性，同时由于缺乏合理 的前端架构，也给系统开发带来了种种不利因索 针对上述种种亟待解决的大学英语网络教学系统前端架构问题，本文基于 近年来在w e b 应用领域兴起的“w e b 标准”概念，将其结构、表现和行为三 方分离的思想应用于大学英语网络教学系统的前端规划之中，总结和设计出了 一套基于w e b 标准的大学英语网络教学系统前端架构方案，试图解决现有教学 系统中存在的种种前端问题。同时在此方案指导下，开发了一套大学英语网络 教学系统，并在和其他系统的比较中证明了本架构方案的优越性和可行性。 关键词：w e b 标准，前端架构，大学英语，教学系统 英文摘要中匾科学技术大学硪士论文 a b s t r a c t w i t ht h eg r e a ti m p r o v e m e n to ft h ei n t e m e t , a sw e l la st h ee n v i r o n m e n t f o rw e b - b a s e da p p l i c a t i o n s , m o r ea n dm o r ep e o p l es t a r tt or e a l i z et h e i m p o r t a n c e o fw e b - b a s e dl e a r n i n g s y s t e m b e c a u s eo f t h e p o w e r f u l m u l t i m e d i aa b i l i t i e so f f e r e d , i t sv e r ys u i t a b l ef o rt h ea d o p t i o no fe n g l i s h i n s t r u c t i o no nt h ei n t e r n e t h o w e v e r , t h e r ea r ea l w a y si s s u e sa b o u tf r o n t - e n d a r c h i t e c t u r e , w h i c hc u td o w nt h ec o m p a t i b i l i t ya n d s t a b i l i t yo ft h o s es y s t e m s , a n dt om a k et h i n g sw o r s e tp r o b l e m so c c u r r e do nd e v e l o p i n gt h o s es y s t e m s w o u l dn e v e rb ec u r e dd u et ot h el a c ko fa r c h i t e c t u r e t h i sp a p e rf o c u s e s t h ep r o b l e m se x i s t 讯c u r r e n tc o l l e g ee n 酉曲 l e a r n i n gs y s t e m s , a n dt r i e st oa p p l yt h en e w l yd e v e l o p e dt h e o r yo nt h e f r o n t - e n da r c h i t e c t u r ef o rc o l l e g ee n g l i 出l e a r n i n gs y s t e n _ lt h et h e o r yi 协e l f i sb a s e do nt h ew e bs t a n d a r d s , w h i c hs e p a r a t e st h es t r u c t u r e , p r e s e n t a t i o n a n db e h a v i o rl a y e r so fw e ba p p l i c a t i o n t h i sp a p e ra l s o d e v e l o p e da a r c h i t e c t u r es c h e m ef o rt h es y s t e m , w h i c ht r i e st os o l v et h ep r o b l e m si nt h e f r o n t - e n dt e c h n i q u e s f i n a l l y , ac o l l e g ee n g l i s hs y s t e mi sd e v e l o p e da n d d e s i g n e db a s e do n t h i sv e r ys c h e m e , w h i c ha l s op r o v e st h ee f f e c t i v e n e s sa n d a d v a n t a g e so ft h es c h e m e k e yw o r d s w e bs t a n d a r d s , f r o n t - e n da r c h i t e c t u r e , c o l l e g ee r i g l i 机 l e a r n i n gs y s t e m 中国科学技术大学学位论文相关声明 本人声明所呈交的学位论文，是本人在导师指导下进行研究 工作所取得的成果。除已特别加以标注和致谢的地方外，论文中 不包含任何他人已经发表或撰写过的研究成果。与我一同工作的 同志对本研究所做的贡献均已在论文中作了明确的说明。 本人授权中国科学技术大学拥有学位论文的部分使用权， 即：学校有权按有关规定向国家有关部门或机构送交论文的复印 件和电子版，允许论文被查阅和借阅，可以将学位论文编入有关 数据库进行检索，可以采用影印、缩印或扫描等复制手段保存j 汇编学位论文。 保密的学位论文在解密后也遵守此规定。 作者签名：盛( 至荛 年月 e t 第一章前言中国科学技术大学硕士论文 1 1研究背景 第一章前言 1 1 1 大学英语教学的网络化发展 进入2 1 世纪，计算机和通信技术的突飞猛进给教育技术带来了革命性的变 化。教育部2 0 0 4 年1 月颁布了大学英语课程教学要求，并宣布以此在全国 开展大学英语教学改革试点工作。此要求提出了如何利用现代化多媒体网络技 术来达到教学目标和要求的基于计算机的网络化自主学习教学模式：各高等学 校应充分利用多媒体和网络技术，采用新的教学模式改进原来的以教师讲授为 主的单一课堂教学模式。新的教学模式应以现代信息技术，特别是网络技术为 支撑，使英语教学不受时间和地点的限制，朝着个性化学习，自主式学习方向 发展【1 1 1 1 2 富互联网应用和基于w e b 标准的前端架构 富互联网应用( r i c hi n t e m e ta p p l i c a t i o n ，r i a ) 是近年来的新兴概念， 之前也有不成规模的其他叫法，比如微软在1 9 9 8 年提出的r e m o t es c r i p t i n g ， 由f o r r e s t e rr e s e a r c h 公司于2 0 0 0 年1 0 月提出的xi n t e r n e t 等等，但最终由 m a c r o m e d i a 公司在2 0 0 2 年明确提出砒a 的概念 2 1 。它所代表的是一种不同于 传统w e b 的新思想，其核心理念是将桌面应用程序转移至互联网之上，通过提 供可承载已编译客户端应用程序( 以文件形式，用h n p 传递) 的运行环境， 客户端应用程序使用异步客户，服务器架构连接现有的后端应用服务器。这是一 种安全、可升级、具有良好适应性的新的面向服务模型，这种模型由采用的 w 曲服务所驱动，结合了声音、视频和实时对话的综合通信技术使刚a 具有前 所未有的网上用户体验 富互联网应用中的“富”是指数据模型的丰富和用户界面的丰富。数据中 的“富”意思是用户界面可以显示和操作更为复杂的嵌入在客户端的数据模型， 它可以操作客户端的计算和非同步的发送接收数据。这种模式相对于传统的 h t m l 页面的优点是，程序运行子客户端并且程序更多的是和用户进行交互同 时更少的和服务器进行交互。平衡客户端和服务器端的复杂的数据模型可以让 第一章前育中国科学技术大学硕士论文 开发者有更大的空间去创建更高效和更具有交互性的网络应用程序网。用户界 面的丰富表示不同于传统h t m l 界面的简单交互，而有着更加类似于桌面应用 的界面元素，这些需要归功于浏览器功能的增强和各种新的r i a 技术的发展， 例如基于j a v a s c r i p t 和x m l h t t p r e q u e s t 对象的a j a x 技术等。传统的互联网 模型使用线性的设计，提供给用户一些选择然后用户发送选择结果给服务器， 这种单一的模式不符合应用程序的灵活交互的要求和用户的意愿。频繁的服务 器请求和页面刷新有很多的缺点，包括页面打开缓慢和增加网络负载。如果采 用富客户界面，可以从以前的服务器响应影响整个界面，转移到只有收到请求 的应用程序都分才会做出相应的变化这本质上意味着界面被分解成许多独立 的模块，这些模块都会对收到的信息做出相应的反应，有些会和服务器端进行 交互，有些是这些模块之间的通信。 r i a 新思潮的兴起对w 曲内容的构建提出了新的要求：如何在各式各样的 浏览器中保持内容的一致性? 如何兼顾不同用户的使用习惯和操作能力而保持 较高的可访问性? 如何优化资源占用和网络带宽? 如何保证前端代码的易于维 护和修改? 如何给后端程序提供高效可复用地应用接口? 等等这些新的要 求促成了新模式的出现，这就是基于w 曲标准的前端架构。 w 曲标准也是近年来开始逐渐被关注的新名词，它其实是w 曲内容中不同 方面标准的总和。万维网联盟( w o r l dw i d ew e bc o n s o r t i u m ，w 3 c ) 1 推荐 使用一系列技术规范来构建w 曲内容，这些推荐规范即称为w 曲标准使用 w e b 标准构建前端内容的核心思想是，尽可能保证w 曲内容的结构、表现和 行为三方的分离，它改变了传统网站这三方面混杂的状况，大大提高了前端代 码的可复用性和独立性，降低了开发成本和维护成本，同时对使用者而言也从 根本上改善了亲和力和可访问性，为砒a 的实施铺平了道路。 前端( f r o n t - e n d ) 是w 西应用中相对于后端( b a c k - e n d ) 而言的一个术 语，如果说后端是运行在服务器端的业务逻辑，那么前端就是展现在客户端中 的用户界面而前端架构，则是一套在客户端展示和部署w 曲内容的方案，它 着眼于整个w e b 应用整体，除了包括内容、样式、用户交互等各个方面的技术 方案之外，也包括设计、可用性、可访问性等非技术方案脚。前端架构的目的 是创建最佳的用户体验和易于维护和扩展的w e b 应用系统。而基于w e b 标准 的前端架构就是要在前端架构过程中体现w 曲标准的三方分离思想，将前端的 第一章前言 中国科学技术大学硕士论文 结构、表现和行为三方面内容充分分离以体现w e b 标准带来的各种优越性。 1 2问题提出 1 2 1 现有系统前端架构中存在的问题 随着大学英语教学网络化的需求日益增加和r i a 技术的日益成熟，各种网 络教学系统也应运而生。现阶段国内已有多家单位出版发行了大学英语相关的 网络教学系统，较为知名的有上海外语教育出版社出版的新理念大学英语网 络教学系统、外语教学与研究出版社出版的t 新视野大学英语、清华大学出 版社出版的新时代交互英语等。这些教学系统在教学功能上各有特点，充 分体现了网络英语教学的优势。但是由于此类教学系统开发过程中通常将重点 放在教学功能的实现和后端系统功能的开发上，一般没有专门的前端架构过程， 而是由后端功能决定前端内容，所以对于前端内容的合理性和优化都较少涉及， 对w e b 标准这种新的前端架构理念也缺乏应有的关注，因此普遍存在着前端架 构方面的缺陷。 作者在对上述三个系统的调研和分析中：，发现并归纳出以下这些普遍存在 的问题： 1 、结构混杂问题。 几乎所有的系统都是使用 和空白g f f 布局3 ，并使用内联的 j a v a g c r i p t 脚本触发交互，这种方式将表现层和行为层内容混杂在结构层之中， 带来大量的代码冗余，使得结构代码也变得几乎无法阅读和修改，增加了后期 维护成本。 2 、可访问性问题 按照w 3 c 推荐的w e b 内容可访问性指南1 0 4 ，w e b 内容的构建需要注意 诸多问题，包括为视听的内容提供同等的文字替代、不要仅依靠色彩来提供信 息，确保页面能够在新技术下良好呈现、确保使用者能处理时间敏感内容的改 变、设备无关的设计，使用w 3 c 推荐的技术和规范、提供内容引导信息，提 2 由于作者实验室机房是学校教学系绕试用机房，所以这几套系统得以试用安装 3 指不使用a 搭丽使用h t m l 的t a b l e 相关标记，包括 等进行布局，同时使用1 像素的透明g f f 图片进行分隔和占位的捧版方式 4h t l p ：l l w w w w 3 o r g ，n c 眦w 硼o 盯卧盯 第一章前育中田科学技术大学硕士论文 供清晰的内容导航机制、确保文档内容的清晰与简单等。而在作者考察的这些 系统中都普遍存在较为严重的可访问性问题。 3 、浏览器兼容性问题。 现代浏览器种类繁多，虽然主要还是微软w i n d o w s 平台下的i e ( i n t e m e t e x p l o r e r ) 浏览器占据较大的市场份额，但其他浏览器的份额也不容小视。而 且随着微软发布更新的操作系统，i e 浏览器本身也存在着若干不同版本，这些 版本之间也或多或少的存在兼容性问题。在现有系统中，大多只支持i e 6 0 版 本，对于较旧的如i e5 5 和较新的i e7 o 等浏览器的兼容性存在较大问题，同 时对于m o z i l l a 、o p e r a 等测览器也普遍存在兼容性问题。 4 、代码冗余带来的带宽问题。 由于结构表现行为的混杂，没有前端架构的规划，这些系统普遍存在前端 代码冗余的情况，这无谓地增加了服务器带宽和并发连接数，降低了系统性能 和稳定性。 1 2 2 基于w e b 标准前端架构的必要性 正因为现有系统中存在着以上问题，所以需要一种新的前端架构方案来从 整体上对现有系统进行重构，这就是基于w e b 标准的前端架构 w 曲标准不是某一个标准，而是一系列标准的集合，以用它来创建和解释 网页的基本内容四。这些标准中大部分是由w 3 c 起草和制定的，如x h i m i 、 c s s 和d o m 标准等，也有一些由其他标准组织制订，如e c m a s c r i p t s 标准等 这些标准是专门为了那些在网上发布的可向后兼容的文档所设计，使其能够被 大多数人所访问。使用w e b 标准进行前端架构有如下一些特性： 1 ，更简易的开发与维护使用更具有语义和结构化的h i m i ，将让用户( 包 括人和机器) 更加容易、快速的理解他人编写的代码。 2 、更广泛的浏览器兼容性。当使用已定义的标准和规范的代码，那么该文 档就具有了向后兼容性，消除了不能被未来的新的浏览器所识别的后患。同时 可以保证在现代浏览器中的显示保持一致 3 、更快的网页下载、读取速度。更少的 r n 瓜。代码带来的将是更小的文 件和更快的下载速度。如今的浏览器当处于标准模式下将比它在以前的兼容模 5 由e u r o p e a nc o m p u t e rm a n u f a c t u r e sa s s o c i a t i o n ( e c m a ) 制定井维护 第一章前言 中国科学技术大学碗士论文 式下拥有更快的网页读取速度。 4 、更好的可访问性。语义化的h r m i ( 结构和表现相分离) 将让使用浏览 器以及不同的浏览设备的读者都能很容易的看到内容。 5 、更佳的适应性。一个用语义化标记的文档可以很好的适应于打印和其他 的显示设备( 像掌上电脑和智能电话) ，这一切仅仅是通过链接不同的c s s 文 件就可以完成。同样可以仅仅通过编辑单独的一个文件就完成跨站点般的表现 上的转换。 这些特性给系统使用者和系统开发者都带来了很多好处，对于使用者而言： 由于结构和表现的分离，可以方便地使用自定义风格调整页面以适应不同学生 的自主学习需求，如在无需提供一个新的文档的情况下，将一篇课文以不同的 格式打印出来；由于可访问性的加强，内容可以使用不同的用户终端访问，增 加了学生学习的灵活性；同时由于文档结构的优化，装载和显示速度都显著提 升，给学生使用带来更好的用户体验。对于教学系统开发者而言：由于结构、 表现和行为三方面的分离，降低了各模块之间的耦合度，提高了系统开发效率， 减少了维护和修改成本；由于大幅优化了文件尺寸，缓解了带宽和服务器负载 问题；由于良好的可访问性和浏览器兼容性，开发者也节省了为不同设备开发 不同版本的生产成本，并且能够保证系统在以后的新设备中保持更高的兼容性 总之使用w e b 标准进行大学英语网络教学系统的前端架构，可以给系统使 用者和开发者带来诸多有利因素，使得系统在可维护性和使用性上都有较大提 升，所以作者针对此内容进行7 研究探索和实践。 1 3研究内容与课题意义 本研究将主要进行如下一些研究和应用工作： 1 、研究前端架构方案 针对基于w e b 的大学英语网络教学系统的功能需求和教学特点，本研究将 基于w e b 标准的思想总结分析合适的前端架构方式，提出系统前端各个方面的 架构方案。该方案将给教学系统开发团队提供指导性方针，优化开发流程，提 高产品的可访问性和可维护性。 2 、通过实际项目中的开发应用该方案 在确立了前端架构方案之后，将其运用到具体项目中，通过实际操作证明 方案的可行性和优越性。本项目是由某出版社出版的大学英语( 第三版) 精读 第一章前言 中胃科学技术大学硕士论文 教程和大学英语( 第三版) 听说教程，在具体开发中，我们切实体会到基于 w e b 标准的前端架构方案对开发流程的优化作用，同时给用户带来了全新的使 用体验 本研究的意义在于创新性地将w 曲标准思想引入大学英语网络教学系统中 的开发中，使得基于此开发的教学系统获得更佳的用户体验，更快的开发速度 和更低的维护成本同时本方案也将对类似系统的开发提供指导性的参考 1 4 研究方法 本研究采用了理论与实践相结合的方法： 1 、理论分析法 对大学英语网络教学相关的教育理论、w e b 标准理论以及软件工程理论进 行分析研究，得出对系统设计的启示。 2 、对比研究法 针对现有教学系统的前端特性，和现有方案对比，找出最合适的架构方案。 3 、实践法 基于w e b 标准的前端架构方案，完整地设计与开发了一个网络教学系统 1 5 论文结构 第一章本论文相关的研究背景和课题意义等基本问题论述。 第二章论述了本架构方案的相关理论基础和系统需求 第三章从各个层面详细论述了基于w e b 标准的大学英语网络教学系统前 端架构的具体方案。 第四章结合某大学英语教学系统案例论述了方案的实施过程并总结分析 了系统优势。 第五章对论文的成果和创新点进行总结并提出今后进一步研究的方向。 - 6 - 第二章相关理论与技术基础和系统需求中国科学技术大学硕士论文 第二章相关理论与技术基础和系统需求 在进行前端架构方案的具体研究之前，首先要分析大学英语网络教学系统 中涉及到的学习和认知因素、教学因素和软件工程因素等理论基础，同时前端 架构方案也需要建立在一定的教育教学需求和软件开发需求的基础上本章将 分别从理论及技术基础以及系统需求等几个方砸阐述它们对基于w 曲标准前 端架构方案的影响。 2 1学习理论基础 2 1 1 建构主义 近二十年以来，把学生作为知识灌输对象的行为主义学习理论，已经让位 于把学生看作是信息加工主体的认知学习理论。随着心理学家对人类学习过程 认知规律研究的不断深入，近年来，认知学习理论的一个重要分支一建构主 义学习理论在西方逐渐流行建构主义认为，知识不是通过教师传授得到，而 是学习者在一定的情境即社会文化背景下，借助学习时获取知识的过程和其他 人( 包括教师和学习伙伴) 的帮助，利用必要的学习资料，通过意义建构的方 式而获得1 6 1 。由于学习是在一定的情境即社会文化背景下，借助其他人的帮助 即通过人际间的协作活动而实现的意义建构过程，因此建构主义学习理论认为 “情境”、“协作”、“会话”和“意义建构”是学习环境中的四大要素或四大属 性。 建构主义学习理论强调以学生为中心，它不仅要求学生由外部刺激的被动 接受者和知识的灌输对象转变为信息加工的主体、知识意义的主动建构者；而 且要求教师要由知识的传授者、灌输者转变为学生主动建构意义的帮助者、促 进者。这就意味着教师应当在教学过程中采用全新的教学模式( 彻底摒弃以教 师为中心、强调知识传授、把学生当作知识灌输对象的传统教学模式) 、全新的 教学方法和全新的教学设计思想，因而必然要对传统的教学理论、教学观念提 出挑战，从而在形成建构主义学习理论的同时，也逐步形成了与建构主义学习 理论、建构主义学习环境相适应的新一代教学模式、教学方法和教学思想研 大学英语网络教学系统要体现建构主义思想，就需要给学生充分的自主构 第二章相关理论与技术基础和幕统需求中国科学技术大学硕士论文 建知识体系的能力，这要求教学系统提供灵活的导航、可以充分定制的界面、 可以满足不同学习条件下的访问等等诸多个性化需求。 2 1 2 第二语言习得理论 在第二语言习得的研究领域，研究者们基于大量的实证研究提出了种种理论 模式，用以描述第二语言习得的过程、解释第二语言习得的机制。而在诸种理 论模式中，克拉申的“监察模式”是影响最大、解释最全面、最引人关注的。 克拉申把监察理论归结为5 项基本假说：语言习得与学习假说、自然顺序假说、 监察假说，语言输入假说和情感过滤假说 8 1 。这五个假说彼此联系、互相补充， 构成了一个有机整体。语言输入假说是克拉申二语习得模式核心的核心。学习 者是通过对语言输入的理解而逐步习得第二语言的，其必备条件是“可理解的 语言输入” 在本架构方案中，需要创建具有充分语义的结构化文档，并保持高度的可访 问性，这样才能保证内容传递的最优化，给“可理解的语言输入”创造必要条 件 2 1 3 外语教学理论唧 l 、自然法 自然法是由克拉森和特雷尔提出旨在发展教学理论的一种方法。该教学法 强调自然的交际而非正式的语法学习，对学习者的错误持宽容态度。它尤其注 重对语言规则的非正式习得自然法的核心是：要让学生无意识习得语言它 的特点是：在语言习得过程中，教师允许学生犯错误，以此来促使自然顺序的 发生，尽量减轻学生的焦虑痘，不要勉强学生去说外语直到他们自愿说，从而 保持学生对语言的自然习得。 自然法认为任何语言教学项目中输入是最重要因素。当语言是用于传播信 息，而不是为了有意识地学习而被教授的时候，这才是最佳的语言教学途径。 自然法试图把课堂的学习环境模仿成幼儿习得第一语言的环境，在这个环境中 学生可以刨造言语表达思想，同时自然法也不忽视少年和成年人对结构性学习 方式的需求，他们鼓励学生用课外时问去学习语法，这样一来，课堂上的时间 可以完全投入到交际的学习中( 交际性的学习是自然法的重要活动形式) 。这是 在课外学到能力课内进行能力运用的准则 第二章相关理论与技术基础和系统需隶中目科学技术大学硕士论文 2 、交际法 交际法从语言用于交际这一理论发展而来。我们交际时用语言来完成功能， 并且在一定的社交情景中实现这些功能交际法研究人为了在社交环境中与他 人交际而获得语言和使用语言的方式。认为人们所用的现实语言不是在真空中 进行的，它必须在一个适于交际的社交环境中进行，因此除了语言功能和语言 形式以外，还要考虑到进行交际活动的其它方面，至少要考虑到主题、语境和 场合以及所涉及人物的地位。 在过去的二十几年里交际法的范甚扩展了许多。现在许多应用语言学家和 语言教师部普遍认为交际法是常用教学方法中最有效的一种方法。交际法教学 过程的一个明显的特点是对逼真语言材料的运用，角色扮演和模拟活动也被认 为是最有效的一种方法。学习者通常扮演有别于他正常身份的不同角色，参加 模拟的交际活动。 自然发和交际法等外语教学理论体现在网络教学系统中，就需要更加复杂 和具有高交互性的题型来实现。如情景对话功能、小组讨论功能、角色扮演功 能等等。各种新功能给教学系统的前端架构提出了更多要求，它需要更加流畅 的交互界面，更加健壮的前端程序和更加优良的客户端兼容性。所以在进行大 学英语网络教学系统的开发中，必须充分做好合理的前端架构，才能保证各种 教学功能的正常实现和教学活动的顺利展开 2 2w e b 标准理论 w e b 标准化运动由w e b 标准组织( w e bs t a n d a r d sp r o i e c t ) 6 推行，它刨 立于1 9 9 8 年，目的就是终止浏览器大战并试图让各浏览器制造商正确地、完全 地支持标准，减少因为开发的复杂性而增加的成本，保证对所有浏览器简单有 效的访问。 结构、表现和行为三者分离是w e b 标准的核心理论，降低三方的耦合性， 增强每一部分的内聚性，使得三个模块可以独立开发并无缝结合。制作符合标 准的w 曲页面并且让其内容更容易维持，如果代码按照标准的方式来做，可以 使调试和修理故障变的更加简单，不用再需要担心维护不同版本的代码，因为 只会有一种版本在用户的不同终端上出现当一个w e b 应用按照w 曲标准思 第二章相关理论与技术基础和系统需求中国科学技术大学硕士论文 想架构的时候，那表示该文档由符合标准的x h t m l 组成、用c s s 来布局而不 是表格，使用结构化语义化的标记以及能够在任何浏览器中显示等特性。 在本架构方案设计过程中，将自始至终贯彻w 曲标准理论，充分发挥其优 越性。 2 3软件工程中的可维护性理论 软件的可维护性是衡量一个软件好坏的重要指标，软件的维护一般可分为 纠错性维护、适应性维护、改善行维护、预防性维护四类n 哪。纠错性维护是指 为了改正软件系统中存在的错误而进行的活动，用户在使用软件过程中发现软 件的错误是激发该种维护的起因。纠错的可维护性体现在大学英语网络教学系 统中，就表现为对使用过程中出现的异常和b u g 等，可以迅速的定位，方便的 修正。适应性维护是为适应软件运行环境的变化而修改软件的活动，这包括了 两个方面，硬件和软件。改善性维护是根据用户在软件使用过程中提出的建设 性意见而进行的维护活动。如界面的改善，需求的增删等等，这种维护通常占 所有维护工作量的一半以上预防性维护是为了迸一步改善软件系统的可维护 性和可靠性，并为以后的改进奠定基础 软件的可维护性受诸多因素影响，主要包括可理解性、可测试性和可修改 性。可理解性表现为未来读者理解软件的结构、接口、功能和内部过程的难易 程度；诊断和测试的难易程度主要取决于软件容易理解的程度：软件的可修改 性和耦合、内聚、局部化、控制域与作用域的关系等设计原理和规则直接有关 n l l 。使用w e b 标准架构的前端内容，由于结构、表现和行为的三方分离，需要 在这三个方面贯彻软件工程的可维护性要求，以保证教学系统较高的可维护性。 2 4教育和教学需求 英语课是一门实践性很强的课，要进行大量的听说读写的训练。这些训练 需要用到大量的文字、图形、动画、音频和视频等多媒体内容，这样才能使得 教学过程直观生动，搡作简单。而教学系统的前端内容是最终用户直接面对的 使用界面，通常会有如下一些基本需求： l 、清晰的文档结构和内容导航 第二章相关理论与技术基础和系统需求 中国科学技术大学硕士论文 条理清晰的内容是进行有效学习的前提条件。文档结构清晰合理，导航设 计便捷易用，只有这样才能保证教学内容的有效传达。而这些就需要建立在良 好架构的前端内容特别是结构层内容之上 2 、丰富的多媒体内容集成。 系统前端需要将各种文字、图形、动画、音频视频等多媒体内容进行合理 整合，这是英语学习十分重要的部分，所以如何合理整合并提供良好的可访问 性和跨平台性是前端架构方案需要认真考虑的问题。 3 、流畅的用户体验 这包括学习界面的快速加载和渲染，多媒体内容的快速下载和显示，栏目 切换的流畅无停滞等这些都需要架构方案充分考虑系统的资源占用、带宽消 耗等问题上。 4 、定制能力 学习者需要根据自身特点，自我建构学习过程这需要前端给予技术上的 支持，如允许自定个性化的样式，允许改变学习内容的顺序等等。架构方案需 要在规划初期对这些需求做出准备，将表现层和表示学习内容的结构层充分分 离，这样才能方便的实现这些功能。 5 、不同设备不同环境下的访问 为实现学习者可以在不同时间不同地点学习的需求，要求前端内容有着良 好的系统兼容性和设备无关性，这样才能满足学习者实时学习和个性化学习的 要求 2 5软件开发需求 教学系统开发属于教育软件开发范畴，所以会有一些基本的软件开发方面 的需求，这包括： 1 、开发效率需求 同其他软件一样，开发效率是教学系统开发中的一个重要指标。只有在前 期对整个系统有一个合理的规划和架构，才能在开发时让开发人员各司其职， 减少沟通成本，提高工作效率和节省开发时间 2 、可维护性 系统的可维护性体现在对各种系统功能的增删修订等需求变动上，一个具 有较高可维护性的系统可以在使用中对各种问题做出快速反应，使问题能够迅 第二章相关理论与技术基础和系统需求中国科学技术大学硕士论文 速解决。 3 、跨平台性和兼容性 跨平台性和兼容性也是一个衡量软件质量的重要指标。能够在各种平台和 软硬件环境下正常使用的软件无疑有着更大的优势。对于网络教学系统，就需 要兼容各种操作系统和浏览器，以及屏幕色深，分辨率、键盘鼠标等多种客户 端的软硬件配置。 4 、资源占用 一个优秀的系统需要管理好自己使用的资源，对于网络教学系统，则体现 在对带宽的占用，客户端c p u 和存储空间的占用等方面。资源占用低的系统 不仅有利于缩减服务成本也有利于降低使用成本，这就意味着它可以适应更多 的用户和更广泛的教学需求，所以对于资源占用方面的优化也是十分必耍的。 5 、可复用性 系统的可复用性体现在所创建内容的通用性上，所以在前端架构时，需要 考虑结构、内容和行为等各个层面的复用性问题。如使用通用的标签以整合结 构层内容，便于在各种其他系统中的延伸使用。 总之，一个良好的前端架构方案需要解决如上这些软件开发中的需求，这 样才能提高开发效率，减少重复劳动，开发出健壮和有生命力的教学系统。 2 6 本章小结 本章从学习理论，w e b 标准理论和软件工程理论等方面阐述了基于w 曲 标准前端架构的理论基础，并从教育教学需求和软件开发需求等方面说明其对 本方案建立的指导作用，接下来的部分将开始论述系统各个方面的具体架构 第三章大学英语同络教学系统前端架构中圄科学技术大学硕士论文 第三章大学英语网络教学系统前端架构 w e b 前端内容包括结构层( s t r u c t u r e ) 、表现层( p r e s e n t a t i o n ) 和行为层 ( b e h a v i o r ) 三个方面。结构层用于描述w 曲应用所要传达的信息以及这些信 息之间的逻辑关系；表现层决定了这些信息以怎样的方式在终端中显示；行为 层则用于处理用户在获取这些信息对的交互过程和交互逻辑。它们之间的相互 关系如图2 6 1 所示：结构层通过结构化的文档( n m ) 呈递，作为w 曲 应用的内容基石；表现层通过c s s 提供不同风格来格式化结构文档的表现；而 行为层则使用j a v a s e r i p t 通过d o m 接口对结构层和表现层的内容进行操作以 实现各种交互逻辑；最后三个层面作为一个整体和后端内容进行通信。 f r o n t e n dq p - b a c k - e n d 1 | 田2 6 - 1 结构，表现和行为三层结构关系圈 1 3 第三章大学英语阿络教学系统前端架构中嗣科学技术大学硕士论文 前端每个层面具体如何规划管理，各个层面之间又如何相互作用，就是w 曲 前端架构所要解决的问题。本章将基于w e b 标准中结构、表现和行为分离的思 想，对w e b 前端内容的各个部分进行一系列的规划和设计，经过分析总结归纳 出每一部分的指导性架构方案。 3 1结构层架构 3 1 1 使用合适的d o c t y p e 3 1 1 1h t m l 还是x h t m l w e b 从诞生之日开始就是h t m l ( h y p e r t e x t m a r k u p l a n g u a g e ) 的天下， 因其就是为创建网页和其它可在网页浏览器中看到的信息而设计的。m m l 是 一种标记语言，被用来结构化信息例如某句话是标题、某些文字是一个段 落、某部分数据是一个表格等等。随着人们对w 曲信息的需求越来越丰富，仅 靠一系列标记已经不能满足w 曲在表现上的需求，于是m m l 开始加入了样 式方面的支持，这使得h i m l 从纯粹的结构化标记语言变成了一种对w e b 内 容进行架构的松散描述性语言，但这并不是 r n 皿的初衷。由于h t m l 语法 要求的松散性，对网页编写者来说，借助所见即所得编辑器，可以较为方便的 创建所需要的效果，但对于机器来说，语言的语法越松散，处理起来就越困难 对经过不断更新换代和竞争后产生的现代浏览器而言，还有能力兼容松散语法， 但对于许多其他比如掌上设备，难度就比较大了。 因此产生了由文档类型声明( d o c u m e n tt y p ed e c l a r a l i o n ，d t d ) 定义规 则，语法要求更加严格的x h t m l ( e x t e n s i b l eh y p e r t e x tm a r k u pl a n g u a g e ) 作为当前h m l 的继承者。虹m l 是一种基于 r r m l 的标记语言，不同的 是它加入了x m l 严格的语法需求，同时去除了许多表现层的标签和属性，这 使得使用 t m l 编写的文档结构更清晰、语义更明确、内容更纯粹同时也更 容易被各种终端处理 1 2 1 。大部分常见的浏览器郡可以正确地解析x h i m l ，即 使老一点的浏览器，许多也可以解析也就是说，几乎所有的网页浏览器在正 确解析耵眦的同时，可兼容删， 介于w 曲标准的架构推荐使用玎m l ，从 r r m l 到订，过渡的变 化比较小，主要是为了适应x m l 的严格语法。具体的改变应该包括以下几个 方蔼： 第三章大学英语同络教学系统前螭架构中田科学技术大学碗士论文 1 、所有的标签都必须要有一个相应的结束标签。 包括h t m l 中原本就需要闭合的元素，比如 ， 等，也包括h t m l 中没有结束标记的元素，比如 ， 第二种情况需要在元素结束 处插入斜杠以闭合该元素，如 等。 2 、所有标签的元素名和属性名都必须使用小写。 和h n 缸不同，x m m l 是基于) 0 v f l 的，它的属性和标记名称都是区分 大小写的x h t m l 要求所有的标签名和属性名都必须使用小写，大小写混杂 也是不被认可的，比如由d r e a m w e a v e r 7 动产生的o n m o u s e o v e r 属性等也 必须改为o n m o u s e o v e r 3 、所有的标记都必须合理嵌套。 因为x h t m l 有着严谨的结构。他不允许嵌套混乱的情况出现。比如在传 统h t m l 下 这种错误的嵌套是可以被浏览器接受并尝试解析 的，但由于h t m l 对于错误的标记没有明确的说明应该如何纠错，所以各家测 览器的解析方式可能会有不同，这就造成了潜在的问题，也使得在编写如 ，a v a s 田p t 脚本对出现难以调试的错误。所以在x h t m l 中这种不规范的写法 将被摒弃而变为 等严格形式。 4 、所有的属性必须用引号一括起。 h t m l 中并不是所有的属性值都需要有引号，但在x h m l 中，属性的引 号是必需的，这样会减少很多潜在的错误可能，也使得代码更易读 5 、所有 和等特殊符号都必须使用m m l 转义符。 任何文档中和属性中出现的大于号( ) 和与号( ) 都是x m m l 的保留字，所以都需要做相应转义工作而变为1 t j 、& g t ；和& a m p ；。 6 、给所有属性赋值。 m 。中不允许空属性的存在，) q n m 是) 0 m 。化的h t m l ，所以也保留 了这种严格的限定。因此传统m m l 中的很多无值属性如d i s a b l e d ， m u l t i p l e 等需要添加相应的属性值。如 将变为 以适应新变化 7 ，不要在注释内容中使“一” 传统h t m l 中的注释是以。 ”结尾的，在h t m l 中 依然保留了这种注释形式，不同的是x 眦m l 更严格的需要注释中不能出现一 7d 睫卸删崩n 懈，m a c r i o m e d i a 公司( 现为a d 曲e 公司并购) 出品的所见即所得同页编辑软件 第三章大学英语厢络教学系统前墒架构中田科学技术大学硕士论文 符号以免对解析器的处理造成冲突。 将h t m l 转化为删是w e b 标准化的第一步，这一过程中最重要转 变并不是语法，而是对待标记语言的态度。h t m l 不再是以前隐藏在 d r e a m w e a v e r ，p h o t o s h o l 蟮所见即所得编辑器外表下混乱不堪的代码，每个 h t m l 标签都有了它切实的意义，不再是单纯为了某个特效而存在的无意义代 码，关于意义的问题将在第3 1 2 1 节具体阐述。 3 1 1 2 选择d o c t y p e d o c t y p e 是d o c u m e n t t y p e ( 文档类型) 的简写，用来说明你用的x h t m l 或者h t m l 是什么版本其中的d t d 包含了文档的规则，浏览器就根据定义 的d t d 来解释页面的标识，并展现出来 要建立符合标准的网页，d o c t y p e 声明是必不可少的关键组成部分，除 非你的x h t m l 确定了一个正确的i x ) c i y p e ，否则文档的标识和c s s 都不会 生效。 x h n m 1 0 提供了三种d t d 声明可供选择： 1 、过渡的( t r a n s i t i o n a l ) ：要求非常宽松的d t d ，它允许继续使用 h t m l 4 0 1 的标识( 但是要符合x h t m l 的写法) 完整代码如下： 2 ，严格的( s t r i c t ) ：要求严格的d t d ，不能使用任何表现层的标识和属性， 例如 。完整代码如下： 3 、框架的( f r a m e s e t ) 专门针对框架页面设计使用的d t d ，如果页面中 包含有框架，需要采用这种d t d 。完整代码如下： 在教学系统中我们选择什么样的d o c t y p e ? 尽可能使用严格型的d t d 可以帮助编写者更快的从传统h t m l 思维中转变过来，本研究的案例中即使用 了严格型的r d 声明 8n i o t 棚h 叩。a d o b e 公司出品的知名留像处理软件，常用于出版界和网页制作业 1 6 第三章大学荚语同络教学系统前靖架构中国科学技术大学硕士论文 3 1 2 使用合适的标签和属性 3 1 2 1 结构化标签和表现型标签 确定了文档载体之后，就开始着手考虑内容的具体架构，合适的标签和属 性的使用是重要的一环x h t m l 中的标签都是从h t m l 中而来，这些标签可 以被分为以下两种：结构化标签和表现型标签 结构化标签用来描述文档的语义，比如 系列标签表示标题、 标签 表示段落、 标签表示一段引用、 表示一个数据表等等， 这些标签的一个共同特点就是具体描述了该段内容是什么，具有什么意义。而 另外一种是由于历史原因遗留下来的表现型标签，比如表示斜体的 ，表示 粗体的 等等这类标签的特点是不具有特定的意义，无论是人还是机器阅 读文档时，都无法根据这种标签来判断其中内容的含义，浏览器可能将其显示 为粗体或者斜体，但是，它没有意义，我们不知道粗体或者斜体里面到底是什 么，也就无法了解文档编写者的意图。所以表现型标签是不推荐使用的，它不 利于信息的传递。如果需要实现某种样式，正确的方法是首先考虑这个样式的 目的比如需要加租一段文字，其实是因为它比较重要，那么就可以使用 或 标签来处理，这两个标签都标识着重、强调的意思，之后再 利用c s s 来将其处理成粗体或者放大字号、变成红色等其他任何样式，c s s 的 架构将在3 2 节中阐述。 h t m l 中的属性也有两种，一种是表示具体意义的属性如c i t e ，s u m m a r y 等，另外一种是纯粹用于表现的属性，如c o l o r ，a l i g n 等等。同理用于描述 具体意义的属性是应该使用的，而用来表现的属性都是推荐用c s s 来代管的。 除了使用具有语义的结构化标签和属性之外，还要保证每个标签的正确使 用比如 就表示一个文档的一级标题，而不是加粗加大的文字，虽然它在 绝大多数浏览器中被渲染成这样； 就应该表示一段引用文字， 而不是整段左缩进两个字符单位，虽然在很多所见即所得编辑器中它被错误地 用来缩进。 总之应当将每个的x h 孙仉标签看成内容的描述而不是样式的表现，只有 语义才是决定使用什么标