HTML5关于在线学习评估任务开发中的应用外文翻译资料

英语原文共 6 页，剩余内容已隐藏，支付完成后下载完整资料

HTML5关于在线学习评估任务开发中的应用

Kateryna Synytsya,Natalya Prokofyeva,Aleksejs Grocevs,Vladimirs Tomko,

International Research and Training Center for Information Technologies and Systems, Ukraine, 2–4Riga Technical University, Latvia

摘要：本文描述了在在线学习环境下的不同类型的评估任务，并研究了HTML5在开发在线学习系统的用户界面元素中所起到的作用。本文展示了HTML5用户界面设计以及它们在不同浏览器下的实现，并提供了与在线学习环境相关的一些示例。

关键词：评估；在线学习，HTML5；用户界面设计

一、引言

对于许多教师和信息技术专家来说，学习者知识评估一直是并且仍然是学术研究的重点。在过去的三十年中，评估研究一直在不断发展，这些研究以个人的例子和样本为基础，概括了知识和能力的特殊领域的案例，并且阐述了正式模型，数据分析的数学方法，提供了各种评估和评估的策略以及学习者的知识和技能^[1]-[9]。评估任务在在线学习中发挥着重要作用，它不仅是衡量学习者对某个工具的掌握程度，而且是向学生介绍在线学习课程的信息来源，培养技能，能力机制，以及一种将静态课程转变为互动有趣的体验的方法。我们做了很多努力来对评估任务进行分类，确定其组成部分，并且我们建议交换评估描述，内容和结果的通用模型^[8]-[12]。一些类型的评估任务已成为互联网支持的常见做法，比如说：学习创作系统，而其他人仍然是个人编程。考虑到基于评估机制的交互已成为现代在线学习的核心特征，评估任务的实施质量至关重要。因此，在线学习课程和测试的开发人员不仅要有条不紊地考虑教学和评估的内容和种类，也要能够选择适当的方法和技术来实现。在本文中，考虑使用现代互联网技术（如HTML5）实施评估任务。

二、现代互联网技术

多年来，在线学习开发人员一直试图重现功能，这些功能过去只能在本地计算机上（特别是用户交互分析）的在线应用程序中使用。在过去几年中，基于异步通信的所谓富Internet应用程序（RIA）^[13]允许限制服务器和客户端之间通信的数据量，并增强Web应用程序的可用性。

HTML5已经实现了Web开发的重大进步，这项技术可以使在线应用程序更快，开发更简单并更加用户友好。HTML5和CSS3的组合对于许多基于Flash实现的任务具有竞争力。此外，HTML5适用于许多现代移动操作系统，如Android，iOS，Windows Mobile，Blackberry和WebOS^[14]。

根据Chitika公司的研究，截至2010年5月25日，全球46％的互联网用户已经使用支持HTML5的网络浏览器^[15]。截至2014年底，HTML5所支持的开放测试表明，桌面浏览器的成功功能测试成功率为68％至92％，Chrome和Opera的移动设备成功率为67-88％，这两项领域的领导者均已进行测试^[16]。

虽然HTML5的完整规范尚未最终确定，但根据W3C，仅在2022年到期，大多数现代Web浏览器已经支持规范的已发布部分中描述的许多功能。规范的模块化结构有助于HTML5功能的部分实现，这反过来允许Web浏览器生产者改进HTML5支持，从而促进该技术的每个浏览器版本更新。该技术可以为在线学习开发人员提供重要的优势，简化交互的开发，特别是知识评估任务。考虑到通过移动设备越来越多地使用在线资源，以及移动销售最近超过台式机或笔记本电脑的销售，移动设备的HTML5已成为在线学习的推动力^[17]-[19]。

此外，在本文中，HTML5特性被考虑用于在在线学习中创建不同类型的评估，并且针对学习者知识评估的特定情况描述了一些实现的示例。

三、HTML5技术使用示例

我们不能低估HTML5技术在在线学习领域提供的好处。我们可以在下面看到与不同在线学习领域相关的示例列表，这些示例表明了HTML5的优势^[20]。

示例1：语言学习

在计算机辅助语言学习中，提供练习所学技能的活动至关重要^[21]。评估任务的目的也在于此，以向学生提供即时反馈。由于沟通技巧的重要性，除了阅读和写作外，学生还应该练习听力理解。在一些评估中，学生必须在几个音频片段中进行选择以获得最佳响应，或者选择适当的术语来完成一个句子，这需要在页面上方便地放置音频元素。使用HTML5标签lt;audiogt;可以在网页上的单词旁边插入内置音频播放器。

为了描述音频文件再现的选项，HTML5提供了一个标签lt;audiogt;，它作为一个小型音频播放器显示在网页上，能够重现mp3，.wav和.ogg文件。标签示例如下：

lt;audio src='lecture-02-04-part3.mp3' controls autoplaygt;lt;/audiogt;

由于控制元素的表示未在W3C规范中定义，因此浏览器以不同方式显示音频控件，如图1所示，浏览器的开发者也可以通过CSS样式添加控件元素样式。

图1 通过Web浏览器可视化标记lt;audiogt;控制元素

示例2：任何主题的视频课程

目前最流行的在线学习内容制作方式之一是全程录制视频、讲座或特定主题的一小段视频。在在线课程中，视频文件的预览通常由Adobe Flash技术提供，这需要在用户的计算机上安装额外的软件，也就是所谓的插件。出于安全，office电脑上可能禁止插件，Flash也不能在基于ios的设备上运行，HTML5恰好是一种便捷的方式来支持视频在线学习。在当前版本的标准中没有指出浏览器必须支持哪些编解码器（能够执行数据或信号转换的程序）;因此，其实现因开发人员而异。所有现代网络浏览器都可以至少以两种格式再现视频-Ogg Theora和VP8。在某些浏览器中支持H.264编解码器正在讨论与许可政策相关的问题，但是在用户需要时，它也可以设置为单独的包。

示例3：地理，物流，策略任务

在某些情况下，必须在特定的上下文或环境中解决若干任务，因此可以使任务的条件和限制可视化，并且由用户动作引起环境变化。一个典型的例子是来自军事训练中的严肃游戏的任务：找到一种方法来避免物体疏散并确保其周围的区域拥有有限的军事资源。这种情况可以通过HTML5游戏来说明，如图2所示。

图2 HTML5游戏“Pirates Love Daisies”中战斗单位的战术位置示例

出于此目，HTML5标记lt;canvasgt;是合适的。标签在网页上设置某个位置，在该位置内可以发生用户与内部对象的交互，可以为各种类型的任务创建有价值的工具，例如图形编辑器，如图3所示。通常该页面的实现基于HTML5，CSS3和JavaScript技术。

图3 Web浏览器Sketchpad是在HTML5，CSS3，JavaScript的基础上开发的

示例4：测试问卷类型任务

大多数在线学习对象（课程，模块，课程）都有某种测试任务，这些任务用于自我检查或确保学生的知识水平足以达标。通常，简单的测试来检查理解，由多项选择问题（从选项列表中选择）来表示。有时，学生需要在字段中输入答案，如在外语学习中的完形填空练习中。可以在没有HTML5的情况下实现这种测试，但是使用这种技术有利于开发过程，并且还提高了生成代码的可用性并扩展了功能。

信息输入由标记lt;inputgt;处理，标记lt;inputgt;在网页上表示为空字段。为了向用户指定在某个字段中应输入的内容，最初由JavaScipt在字段中添加临时文本，该字符在光标中在字段内单击时消失。在HTML5中，标记lt;inputgt; -placeholder的单独属性作用也是如此。

如果测试时间有限，那么用户希望操作光标以便能够输入下一个答案。为此，标记lt;inputgt; 有一个属性自动对焦，可以在加载页面时将光标定位到所需的字段，以便用户可以立即开始输入答案

在用于在lt;inputgt; -field中指定文本提示的页面代码中，可以使用以下HTML代码：

lt;label for='first_name'gt;First Namelt;/labelgt; :lt;input id='first_name' placeholder='First name goeshere'gt;

这个片段不仅导致输入字段中文本提示“First name goeshere”，而且“First name”标签旁边的输入字段也可用于键入。图4显示了简单输入字段的可视化表示，文本提示。在支持此功能的浏览器中，默认情况下提示的颜色为亮灰色。在过时的Web浏览器中，输入字段为空，但基本功能保持不变。

图4 使用文本提示输入字段

标签lt;inputgt;的属性支持填写必填字段。当学生执行测试，将完整表单发送到服务器，并且之后不会进行任何更改。在这种情况下，在允许用户向服务器发送完整测试之前，网络浏览器将提醒用户他忘记填写必填字段,如图5。

图5 对忘记填写必填字段的用户的反馈

标签lt;inputgt;的属性下数据列表提供了可能值的列表，可以通过按“向上”或“向下”键滚动。在输入字段中输入的每个符号用于过滤列出的值。当学生必须输入答案时，此属性可用作拼写检查的复杂变体。预先下载完整列表，并在本地执行搜索相关性而无需连接到服务器。这种过滤器通常用于在线表格，例如，用于加速从长列表中选择国家，如图6。

图6 通过输入名称的第一个字母自动过滤国家/地区

标签lt;inputgt;的属性中数字允许创建字段，其中只能输入数字值，在移动设备中，除了键盘输入的基本功能，必须向用户显示哪种类型的键盘，可以通过使用输入字段右侧的其他按钮来更改数字，如图7。

图7 “数字”类型字段显示

标签lt;inputgt;的属性中颜色允许从建议的调色板中手动选择颜色。此外，所选颜色的十六进制值可以作为参数传递以进行进一步处理，该参数可用于教小孩识别颜色的程序。使用此元素，浏览器显示一个带有基本颜色的小型下拉菜单;但是，按下“其他...”按钮后，会出现操作系统颜色选择的标准菜单，从中可以选择任何颜色，如图8。

图8 使用Opera网络浏览器标准选项选择颜色。

从所讨论的示例中可以看出，HTML5功能使其成为一个功能强大的工具，能够支持大部分评估任务，这些任务通常在在线学习系统中提供给学生，并且它再次证明了必须在在线学习领域使用这项技术。

四、结论

HTML5技术是开发人员手中的强大工具，可以丰富普通网络浏览器和任何在线学习系统或教学游戏的体验。此外，该技术还有助于Web应用程序开发。用于流行类型的评估任务的大多数控制元素（通常在在线学习领域中使用）可以由HTML5特征表示。

全球领先的IT公司，如苹果，谷歌，Facebook，Twitter和微软，都在积极探索这项技术。甚至公司Adobe也报道了在GNU/Linux和积极参与HTML5开发的基础上停止对移动设备和操作系统的Adobe Flash技术支持^[22]。早期HTML5支持的优势显而易见：它降低了时间和金钱投资的风险，这是未来HTML5传输Web应用程序和支持远程学习系统所必需的^[23]，[24]。

移动设备的市场份额每年都在增长，如今现代网站的所有优势都可以通过平板电脑，iPad或智能手机获得，这使得这些设备成为台式计算机的良好替代品。原因是这些设备随时随地可供用户使用，可以在办公室，家庭或大学上下班途中在公共汽车或火车上都可以使用。HTML5的使用保证了交互可以在大多数移动平台上运行，因此，移动学习是在线学习领域发展的方向之一^[25]，[26].HTML5关于在线学习系统中的应用主题将由本文作者进一步探讨。

参考文献：

[1]L. Nicetsky, Requirements specification for development of the RPI computer-based teaching system first version, Riga, Riga Polytechnic Institute (RTU), 1977, p. 26

[2]L. Rastrigin, M. Erenshtein, Adaptive teaching with a model, Riga, Zinatne, 1986, p. 160

[3]L. Zaitseva, L. Novitsky, V. Gribkova, Computer-aided teaching systems development and using, Riga, Zinatne, 1989, p. 174

[4]I. Galeev, Models and methods of automatized learning systems, Informatics, Edition 1, 1990, pp. 64–72

[5]L. Zaitseva, N. Prokofjeva, “Pr

剩余内容已隐藏，支付完成后下载完整资料

资料编号：[19977]，资料为PDF文档或Word文档，PDF文档可免费转换为Word