网络主题学习课程的导航设计

摘 要：网站导航就好比是航海中的航标灯，需要精心设计。文章以案例分析为基础，详细阐述了自主性学习的同步辅导网络课程导航的理念和框架设计。

关键词：网络课程；导航；设计；理念

中图分类号：G434 文献标识码：A 文章编号：1673-8454（2012）20-0075-02

“江海天骄”（http：//.cn/）是通过教育部基础教育资源中心审定的中小学同步辅导系统课程。该课程涵盖了义务制教育阶段一年级至九年级语文、数学、英语课程学习资源，以各个单元或者是各个课题为网络主题，组织学生的学习资料和测试习题，是学生进行自主学习的网络课程。笔者就该系统的导航设计问题进行一些分析，以供同仁参考。

一、设计理念

1.以学科结构为内容的组织方式

网络课程是通过网络表现的某门学科的教学内容及实施的教学活动的总和。[2]课程内容要与主题相对应，一个内容对应一个主题。主题又概括了内容，是内容的组织线索，内容应该服从主题。针对“江海天骄”是同步辅导系列课程，因而开发者以学科结构作为主题，来组织内容。语文学科以一至九年级语文教材各个单元作为主题，来组织内容；数学学科和英语学科是以教材的课题作为主题的，结构清楚，与教材结构吻合，便于学生学习和寻找，同时也为导航提供了一个较为清晰的思路和框架。

2.以用户为中心的导航设计

以用户为中心的设计强调用户及其需要，并且认为技术是能够调动人们兴趣的工具。理解用户至关重要，而理解用户个体性意味着需要有详细的用户信息，比如态度、行为、知识、技能，以及其他任何能够对Web结构、设计和内容产生强烈影响的特性。

“江海天骄”就是同步辅导课程，是学生课堂学习的一个有益补充，该课程的用户主体是各个年级的学生。这个年龄阶段的学生，拥有一定的信息技术，低年级的孩子只要能熟悉简单的电脑操作，即可在家长的陪护下浏览网页内容；这些学生是思维比较活跃的群体，容易被网络上一些不相关的内容干扰，考虑这些特点，设计者精心打造了课程学习页面，删除与课程学习无关导航链接。还特意开设了“趣味学习”板块，并在学生进入游戏化学习前，提供游戏的操作要点，这些导航的小设计都是以用户为中心。

二、导航框架的设计

1.基于用户登录与浏览的帮助导航

一般网站用户登录填写框在网站主页面的右上角，而“江海天骄”的登录框在左侧，主要是符合浏览者的从左到右的浏览习惯，再次是该网站只有登录才能浏览到学习内容，不同于一般的网站，没有登录的游客依然有许多学习和浏览内容。

点击首页的Flash动态广告栏，学生即可进入帮助导航页面，在帮助导航页面（http：//.cn/studentLogOn.aspx）左侧，设计者创建了“用户指南”的帮助导航，分设用户登录、用户注册、课程选择、在线学习和常见问题五个页面板块的帮助页面链接，其中“用户登录”页面，线性地展示了登录的步骤，导航信息中明确了具体每一步的操作；“课程选择”页面中，指导学生登录后如何选择课程，并点击“学习”按钮进行学习；其中四个帮助导航中，还有动画演示画面，生动地实现了相关功能的导航。

2.基于教材体系的堆叠标签导航[1]

堆叠标签导航以表格导航为基础，表格导航是一种简洁方便的导航手段，利用表格可以将各个对象集成起来，每个表格单元中，加入一个链接。需要注意的是堆叠标签导航是三类学科27个表格堆叠在一起，使用了横向单元标题“一年级”至“九年级”不变的单元格信息，构建了纵向九个年级标签；横向分别是不同年级同一学科的内容列表叠加，即点击不同年级标签，标签上的“铅笔”跟随移动，标示选择到的年级标签，同一学科信息发生变化；纵向分别是语文、数学、英语三门学科的标签叠加，当点击这三个不同的学科纵向标签时，标签底色变白，标示选择到的学科标签，列表中的信息也会发生变化。对于用户来说，目的性很强，一般学生都知道自己所处年级，直接选择年级的纵向标签，然后再选择学科的横向标签，较快地寻找到自己所需的学习内容，实现导航的准确性、简捷性和可视化。

值得一提的是，很多网站不采用堆叠标签导航。主要原因是对于目的性不强的浏览者，很容易造成“迷航”。为了防止很少登录的学生“迷航”，设计者还在“课程选择”这一帮助导航中详细介绍了如何通过堆叠标签导航较快地选择到自己所需的课程。

为了方便用户，设计者在每学期开学切换一次课程，这样在纵向标签“年级”中就不再有“上册”、“下册”二级标签，更加方便了学生。而对于超级用户或者是教师，登录后，还设有“上册”和“下册”纵向的二级标签，这样堆叠标签导航实现了54个表格导航的堆叠。

在首页显要位置展示堆叠标签导航，体现同步辅导课程导航的主体地位，成为网站的“主导航”。只要学生一打开首页，就能看到导航。同时也节约了首页导航的页面，学生不需要拉动首页的垂直滚动条或水平滚动条就能寻找到学科、年级和章节或单元链接，方便用户直接到达学习页面。

3.基于主题学习内容的树形导航[3]

当学生进入学习页面（例：见网址http：//.cn/yhzn/yhzn01_03.htm），左侧呈现出基于主题学习内容的树形导航，以章节、单元主题作为一级导航链接，分设“名师导学”、“在线挑战”、“数学乐园”等二级导航链接，同时在相应的二级导航链接中分设“基础训练”、“综合应用”、“拓展提高”、“趣味学习”、“智力冲浪”等三级导航链接，学生可根据自己的实际情况方便地选择进入同一课程的不同等级板块进行学习，加快了页面打开速度。

在树形导航中，各个节点通过不同的按钮来标识“模块”、“视频”、“练习”、“文本”、“Flash”等不同类型的资源，这使得多媒体网络课程具有独特的导航，让学生对于学习的资源类型一目了然。树形导航中有“+”小加号和“-”小减号节点图标打开和关闭节点的层次，[1] 学习内容的页面采用两栏展示，右侧学习栏的刷新，不会改变左侧的树形导航栏，学生可以清晰地了解自己所处的网站位置。如果要更换学习内容，直接点击首页，进入堆叠标签导航，重新选择学习内容，快捷便利、进退自如。

4.基于备注的提示导航

备注就是注解和说明，起着提示和唤起用户记忆的作用。网站中设置了一些提示导航，如通过显示不同的字体，或者鼠标停留时发生的变化，弹出和浮现备注框。例如：当鼠标停留在“江海天骄”网站堆叠标签导航内容时，会出现备注类的“提示框”，简要介绍鼠标停留部分的内容。当学生进入“测试习题”界面时，有“答案解析”、“下一题”等按钮，提示学生学习进程，为学生自主学习提供支持。

结束语

网络主题学习课程的导航是指引学生进行自主学习的关键因素。网络课程的导航系统要清晰、明确、简单、方便，符合学生的心理特征和认知规律，既能使学生快速寻找到自己所需的学习内容，又能使学生容易全面了解单元知识框架和章节内容。[4]

参考文献：

[1] James Kalbach. Designing Web Navigation[M].American： O’Reilly Media， Inc，2007：63-76.

[2]何克抗，谢幼如，郑咏柏. 教学系统设计[M]. 北京：北京师范大学出版社，2002：304-318.

[3]刘冬，周京伟，马秀峰. 网络课件中的导航设计[J]. 计算机教育，2009，（6）：37-38.

[4]王同明，李新亚. 网络课程中的导航设计[J]. 教育技术导刊，2005，（2-3）：49-50.