This article was downloaded by: [Memorial University of Newfoundland]On: 04 October 2014, At: 09:55Publisher: RoutledgeInforma Ltd Registered in England and Wales Registered Number: 1072954Registered office: Mortimer House, 37-41 Mortimer Street, London W1T 3JH, UK

Computer Assisted LanguageLearningPublication details, including instructions for authors andsubscription information:http://www.tandfonline.com/loi/ncal20

Creating Hypermedia LearningEnvironments: Guidelines ForDesignersMark PetersonPublished online: 09 Aug 2010.

To cite this article: Mark Peterson (1998) Creating Hypermedia Learning Environments:Guidelines For Designers, Computer Assisted Language Learning, 11:2, 115-124

To link to this article: http://dx.doi.org/10.1076/call.11.2.115.5687

PLEASE SCROLL DOWN FOR ARTICLE

Taylor & Francis makes every effort to ensure the accuracy of all the information(the “Content”) contained in the publications on our platform. However, Taylor& Francis, our agents, and our licensors make no representations or warrantieswhatsoever as to the accuracy, completeness, or suitability for any purposeof the Content. Any opinions and views expressed in this publication are theopinions and views of the authors, and are not the views of or endorsed byTaylor & Francis. The accuracy of the Content should not be relied upon andshould be independently verified with primary sources of information. Taylor andFrancis shall not be liable for any losses, actions, claims, proceedings, demands,costs, expenses, damages, and other liabilities whatsoever or howsoever causedarising directly or indirectly in connection with, in relation to or arising out of theuse of the Content.

This article may be used for research, teaching, and private study purposes.Any substantial or systematic reproduction, redistribution, reselling, loan, sub-licensing, systematic supply, or distribution in any form to anyone is expresslyforbidden. Terms & Conditions of access and use can be found at http://www.tandfonline.com/page/terms-and-conditions

Creating Hypermedia Learning Environments: Guidelines For Designers

Mark PetersonJapan Advanced Institute of Science and Technology

ABSTRACT

The field of network-based second language education has expanded rapidly in recent years.However, few attempts have been made to address the salient design issues facing the individ-ual designer. In this paper the author will propose a set of preliminary guidelines applicable tothe creation of hypermedia-based learning environments that draw on insights gained fromresearch from a number of fields. This framework will encompass the following approaches.First, an acceptance of the importance of modern pedagogy in the shaping of instructionaldesign. Second, a perspective that takes account of the cognitive and instructional design fac-tors that may facilitate the development of second language acquisition. Third, a viewpoint thatdraws on the findings of research from the field of human computer interaction.

1. INTRODUCTION

At the present time the design of world-wide web-based learning materials isa somewhat arbitrary process, dependent largely on the needs and skills ofindividual designers and educators. This diversity in current approaches to sitedesign is to be welcomed in the sense that individual educators may utilise theflexibility inherent in authoring software to design hyermedia materials thatmeet the needs of their learners. However, at the same time there exists theclear need for the creation of a framework that will inform the design process.An important element of any such construct will be based on advances in sec-ond language acquisition research as reflected in modern pedagogy.

Computer Assisted Language Learning 0958–8221/98/1102–0115$12.001998, Vol. 11, No. 2, pp. 115–124 © Swets & Zeitlinger

Correspondence: Mark Peterson, Japan Advanced Institute of Science and Technology, 1-1Asahidai, Tatsunokuchi, Ishikawa, 923-12, Japan.

Manuscript submitted: December 1997.Accepted for publication: March 1998.

Dow

nloa

ded

by [

Mem

oria

l Uni

vers

ity o

f N

ewfo

undl

and]

at 0

9:55

04

Oct

ober

201

4

2. PEDAGOGY AND INSTRUCTIONAL DESIGN

Recent language teaching pedagogy drawing on developments in second lan-guage acquisition research has been greatly influenced by the proficiencymovement. A typical example of this approach can be found in the work ofOmaggio. Omaggio (1986, pp.35–6) has proposed a set of hypotheses thatform the basis of a proficiency approach to language teaching:

Hypothesis 1. Opportunities must be provided for students to practise usinglanguage in a range of contexts likely to be encountered in the target culture.

Corollary 1. Students should be encouraged to express their own meaningas early as possible after productive skills have been introduced in the courseof instruction.

Corollary 2. A proficiency-oriented approach promotes active communica-tive interaction among students.

Corollary 3. Creative language practice (as opposed to exclusively manip-ulative or convergent practice) must be encouraged in the proficiency-oriented classroom.

Corollary 4. Authentic language should be used in instruction wherever andwhenever possible.

Hypothesis 2. Opportunities should be provided for students to practise car-rying out a range of functions (task universals) likely to be necessary in deal-ing with others in the target culture.

Hypothesis 3. There should be concern for the development of linguisticaccuracy from the beginning of instruction in a proficiency-oriented approach.

Hypothesis 4. Proficiency-oriented approaches should respond to the affec-tive needs of students as well as to their cognitive needs. Students should feelmotivated to learn and must be given opportunities to express their own mean-ings in a non-threatening environment.

Hypothesis 5. Cultural understanding must be promoted in various ways sothat students are prepared to live more harmoniously in the target-languagecommunity.

A content-based approach to site design influenced by these hypotheseswould focus on a number of the above factors. Primary emphasis would beplaced on the creation of communicative activities and forums. An example ofthis approach would be the construction within a web site of virtual environ-ments for language learning where learners from many countries interact.Examples of these environments include MOOS such as Schmooze university

116 MARK PETERSON

Dow

nloa

ded

by [

Mem

oria

l Uni

vers

ity o

f N

ewfo

undl

and]

at 0

9:55

04

Oct

ober

201

4

(City University New York 1994) and site-based bulletin boards such as Dave’sEFL cafe (Sperling, 1997). In these forums, interaction is promoted and cultur-al awareness fostered through participation in meaning-focused authentic dis-course. In addition, with regard to the related issues of accuracy and errorcorrection, tracking of student performance may be achieved through the use ofCGI programs. These may be used to create quizzes and feedback forms thatincrease the interactive nature of sites (Peterson, 1997). Moreover, designers mayutilise the multimedia capacities of browser software to incorporate high-quali-ty audio and video materials into web sites. Such materials aim to stimulatelearner interest and participation by creating authentic learning tasks. An exam-ple of this approach to site design may be found in the sites ‘Business DecisionMazes’ (Vallance, 1997) and ‘Learning Oral English On-Line’ (Li, 1996). Aproficiency-based approach to hypermedia design presents educators with a use-ful set of guidelines for the construction of hypermedia courseware. However,the effectiveness of this approach may be enhanced when coupled to an accountof the cognitive factors that play a role in second language acquisition.

3. COGNITIVE LEARNING THEORY AND INSTRUCTIONAL DESIGN

In recent years, second language acquisition research has drawn on insightsgained from cognitive theories of learning. Attempts have been made by anumber of theorists to include aspects of cognitive learning theories in anaccount of L2 acquisition (Bialystock, 1988; O’Malley et al., 1987). Fromthese perspectives, language learning is viewed as a complex cognitive skillthat centres on the processing of information (Ellis, 1990, p.175). As short-term memory is limited (Miller, 1956), proficiency in L2 is dependent to alarge extent on the proceduralisation of knowledge gained through practice(Bialystock, 1988). This view of second language acquisition has a number ofimplications for the design of network-based learning environments.

Network-based learning activities must provide interactive opportunities forthe proceduralisation of knowledge. Thus learners must be given opportunitiesto engage in meaningful tasks that enable them to develop the skills that leadto the automisation of knowledge. The development of these skills enableslearners to participate in authentic communication. Although a consensusregarding the validity of the above approaches to L2 learning in general hasyet to be achieved, cognitive learning theory provides a number of perspectivesthat may guide the instructional designer:

CREATING HYPERMEDIA LEARNING ENVIRONMENTS 117

Dow

nloa

ded

by [

Mem

oria

l Uni

vers

ity o

f N

ewfo

undl

and]

at 0

9:55

04

Oct

ober

201

4

1) As no two learners are identical, designers may utilise the flexibility inher-ent in multimedia technology to create learning environments that accom-modate a variety of learning styles.

2) In terms of content, learning environments must encompass useful materi-als (Wilson et al., 1993, 21.3) that engage learners in meaningful tasks. Theliterature indicates that, in this context, problem-solving activities appear tostimulate learner input and performance (Wilson & Cole, 1991, p.59).

3) The non-linear nature of hypertext should be harnessed to provide oppor-tunities for exploratory learning.

4) Sites should be designed to reduce the cognitive load on learners (Preece etal., 1994).

5) Designers are advised to bear in mind the importance of designingsequenced instruction, as this allows learners to apply newly acquiredknowledge to real world tasks directly.

6) Multimedia sites must also provide access to feedback as an importantmeans of reinforcing positive learning outcomes and learner confidence.

7) Sites should encourage learners to reflect on their learning. This process ofcognitive monitoring and self-regulation is known as metacognition (Paris& Winograd, 1990).

8) Hypermedia learning activities should stretch learners and enable them tooperate in Vygotski’s zone of proximative development (Vygotski, 1978).In sum, hypermedia-based language learning activities must be designed to

help learners manage cognitive load while at the same time providing oppor-tunities for cognitive restructuring. The issue of how new knowledge is pre-sented thus remains a crucial issue in the design of content and, in particular,interface design.

4. GUIDELINES FOR INTERFACE DESIGN

The literature produced by the field of human computer interaction provides anumber of insights to guide the hypermedia designer. Of particular importanceis the omnipresent principle of consistency. This factor is a central theme inthe following main aspects of interface design.

4.1. ColourTufte (1990, p.89) has observed the fact that:

Color can improve the information resolution of a computer screen.

118 MARK PETERSON

Dow

nloa

ded

by [

Mem

oria

l Uni

vers

ity o

f N

ewfo

undl

and]

at 0

9:55

04

Oct

ober

201

4

Moreover, the use of colour adds to the visual appeal of sites. However, colouris most effective when used conservatively (Brown, 1988, p.68). Using fewercolours leads to less visual clutter on screens and more accessible displays(Apple, 1992, p.264). The following observations have been drawn from theliterature on the use of colour in interface design:

• Colours can be used to draw learners’ attention to tasks (Brown, 1988,p.66). However, designers should be aware of the common expectationsrelating to certain colours.

• Siegel (1996, p.254) suggests using red for unvisited links and blue or pur-ple for visited links.

• Schneiderman (1997, p.399) advises using no more than 4 to 7 colours in adisplay.

• Blue on white backgrounds provide the lowest error rates on the part ofusers (Schneiderman, 1997, p.401).

• Incompatible colour combinations such as red/green, blue/yellow,green/blue and red/blue are best avoided (Hempard, 1997, p.21).

4.2. TextAlthough designing for hypertext presents new considerations, many of thetraditional principles of textual and graphical design should not be discarded.

• In sites encompassing extensive text, designers are advised to include a leftmargin on every page, as this acts to draw the reader’s eye to the beginningof a line of text (Siegel, 1996, p.79).

• Most text is best viewed in MS Sans-serif, MS Serif, Macintosh Geneva, orNew York fonts, as these fonts have been specifically designed for low res-olution screens (Lynch, 1994, p.10).

• Minimal use should be made of upper-case characters, underlines and‘blinking’ text, as the overuse of these elements can reduce the prominenceof important information (Berkeley Digital Library Sunsite, 1996).

• Text lines are best kept short — 10 to 12 words per line if possible (Siegel,1996, p.87) — and line spacing should be 1.5 or a double line, dependenton text length (Hempard, 1997, p.22).

• Text is best viewed in paragraphs separated logically or ‘chunks’(Schneiderman, 1997, p.559).

• Very long pages of continuous text should be avoided, as these requireexcessive amounts of scrolling that may confuse learners. Long text pages

CREATING HYPERMEDIA LEARNING ENVIRONMENTS 119

Dow

nloa

ded

by [

Mem

oria

l Uni

vers

ity o

f N

ewfo

undl

and]

at 0

9:55

04

Oct

ober

201

4

can be disorienting, as small movements of the scroll bar can lead to a sud-den movement to a different part of the text.

• Long screens of text are best broken up into linked groups of pages.

4.3. MetaphorDesigners are advised to use intuitive visual and functional metaphors to assistlearners in navigation. These metaphors should be consistently applied to allbuttons, icons, windows and menus.

4.4. OrganisationHypermedia sites can be made more user friendly through the use of graphicmaps and tables of contents which provide learners with a site overview and aconceptual guide to navigation. In addition, the use of tables provides a con-sistent structure to sites.

4.5. Data entryDesigners should take steps to reduce the cognitive load on users, as thisimproves learner performance. Data entry procedures must therefore be assimple as possible. In order to further facilitate learning, task procedures andcommands should form an integral part of the structure of a project.

4.6. Locus of controlEffective learning outcomes are often dependent on the extent to which learn-ers feel that they are in control of the system. A means of achieving this goaland preventing anxiety or frustration is the use of progressive disclosure(Apple, 1992, p.35). In this process, simple choices provide access to morecomplex choices and information. Designers can achieve progressive dis-closure through the provision of buttons that display a number of choices.Alternatively, the designer may provide a number of links from a particularnode while taking care to avoid overwhelming learners. Designing for pro-gressive disclosure facilitates exploratory learning by enabling learners toaccess a richer learning environment at their own pace.

4.7. Feedback and error managementAll interfaces should provide access to an on-screen help link and error mes-sages that offer simple error handling and informative feedback. An exit iconor return to home link should be provided on every page or screen.

120 MARK PETERSON

Dow

nloa

ded

by [

Mem

oria

l Uni

vers

ity o

f N

ewfo

undl

and]

at 0

9:55

04

Oct

ober

201

4

4.8. Graphic imagesImages are best used to assist learners in comprehending interrelationships andconcepts. The overuse of graphics for decorative purposes is best avoided(Shneiderman, 1997). Designers must also consider the fact that graphic-heavypages may impose unacceptable download times for some users.

4.9. AudioDesigners are advised to use only high-quality recordings that are relevant tothe content of a site. The use of distracting sound effects may impede learning.

4.10. Video and animationRecent developments in browser technology give designers the option ofincorporating on-line video and animation into sites. Video and animationsequences are most effective when used to present authentic dialogue.

4.11. Browser softwareDesigners must also inform potential users of the software required to run ahypermedia project, as many authored activities require specific plug-ins.

4.12. TestingDesigners should be prepared to pilot activities. Feedback gained from learn-ers and fellow practitioners will prove invaluable in creating a successfulproject.

5. DESIGNING FOR HYPERMEDIA: PRELIMINARY GUIDELINES

The combination of pedagogical and cognitive approaches to language learn-ing coupled to findings from the field of human computer interaction has con-tributed to the following set of hypermedia design guidelines.

5.1. Content• Accommodate a variety of learning styles• Design meaningful real world tasks• Encourage exploratory learning• Sequence instruction

CREATING HYPERMEDIA LEARNING ENVIRONMENTS 121

Dow

nloa

ded

by [

Mem

oria

l Uni

vers

ity o

f N

ewfo

undl

and]

at 0

9:55

04

Oct

ober

201

4

• Provide feedback• Encourage metacognition• Design for the zone of proximative development

5.2. Interface design• Use colour for tasks• Use colour conservatively• On text-rich screens include a left margin• Use MS Sans-serif, MS Serif, Macintosh Geneva and New York fonts• Keep text lines short• Break up text into logically organised chunks• Be consistent in the use of metaphor• Use graphic maps or tables of contents• Design for progressive disclosure• Provide simple error handling• Use graphics to show relationships• Use high-quality audio and video• Pilot projects

6. CONCLUSIONS

The creation of hypermedia language learning environments presents design-ers with a number of challenges. With no agreed design standards available,the individual designer must strive to meet the needs of their learners by pro-viding tasks that facilitate the complex process of second language acquisi-tion. The primary goal of the designer is therefore to assist learners to acquirea second language in a new domain: the hypertext learning environment.

This paper has attempted to provide designers with a preliminary set of guide-lines to assist them in this task. These guidelines are in no way definitive, as weare in the early stages of the development of hypermedia as an important tool inlanguage education. The individual designer must interpret the above guidelinesas the situation demands. Despite the complex nature of hypermedia design,technological advances are providing exciting new design opportunities. Thenext generation of software browsers will soon provide limited memory featuresthat record user interactions with a program over time (Lynch, 1994, p.27), thusmaking hypertext documents in particular less confusing for learners. Moreover,in the years ahead, authoring software will continue to become more accessible

122 MARK PETERSON

Dow

nloa

ded

by [

Mem

oria

l Uni

vers

ity o

f N

ewfo

undl

and]

at 0

9:55

04

Oct

ober

201

4

to the individual educator. However, the speed of technological change does notnegate the primacy of pedagogy. Only through the development of sound peda-gogy will the potential of hypermedia be fully realised.

REFERENCES

Apple Computer Inc. (1992) Macintosh Human Interface Guidelines. Addison-Wesley.Berkeley Digital Library Sunsite. (1996)‘Guidelines for Web Document Style and Design’.

http://sunsite.berkeley.edu/Web/guidelines.html (15 July 1997).Bialystock, E. (1988) ‘Psycholinguistic dimensions of second language proficiency’, in W.

Rutherford & M. Sharwood-Smith (eds.) Grammar and Second Language Teaching.Rowley, MA: Newbury House.

Brown, C.M. (1988) Human-Computer Interface Design Guidelines. New York: Ablex.Ciolek, M.T. (1994) ‘Information Quality — Catalogue of Potent Truisms’.

http://www.ciolek.com/WWWVLPages/QltyPages/QltyTruisms.html (10 July 1997).City University New York (1994) “SchMOOze university”. http://Schmooze.hunter.cuny.

edu:8888/ (8 August 1997).Ellis, R. (1990) Instructed Second Language Acquisition. Oxford: Blackwell.Hempard, D.P. (1997) ‘Design principles and guidelines for authoring hypermedia learning

applications, System 25 (1).Laurel, B. (ed.) (1991) The Art of Human–Computer Interface Design. Reading: Addison-

Wesley.Li, R.C. (1996) ‘Learning Oral English On-Line’. http://www.lang.uiuc.edu/r-li5/book/ (25 July

1997).Lynch, P.J. (1994) ‘Visual design for the user interface, Part 1: Design fundamentals’, Journal

of Biocommunication 21 (2). Lynch, P.J. (1994) ‘Visual design of the user interface, Part 2: Graphics in the interface’, Journal

of Biocommunication 21 (2). Miller, G. (1956) ‘The magical number seven, plus or minus two: Some limits on our capacity

for processing information’, Psychological Review 60: 81–97.Omaggio, A.C. (1986) Teaching Language in Context: Proficiency-Oriented Instruction.

Boston: Heinle and Heinle.O’Malley, J.M., Chamot, A.U. & Walker, C. (1987) ‘Some applications of cognitive theory to

second language acquisition’, Studies in Second Language Acquisition.Paris, S.G. & Winograd, P. (1990) ‘How metacognition can promote academic learning and

instruction’, in B.F. Jones & L. Idol (eds.) Dimensions of Thinking and CognitiveInstruction. Hillsdale, NJ: Erlbaum.

Peterson, M. (1997) ‘The On-Line Guide to Scientific Presentation’. http://www.jaist.ac.jp/~mark/ScientificPresentation.html (10 August 1997).

Preece, J., Rogers, Y., Sharp, H., Benyon, D., Holland, S. & Carey, T. (1994) Human–ComputerInteraction. Wokingham: Addison-Wesley.

Shneiderman, B. (1997) Designing the User Interface: Strategies for Effective Human–ComputerInteraction. Reading, MA: Addison-Wesley.

Siegel, D. (1996) Creating Killer Web Sites: The Art of Third Generation Site Design. Indiana:Hayden.

CREATING HYPERMEDIA LEARNING ENVIRONMENTS 123

Dow

nloa

ded

by [

Mem

oria

l Uni

vers

ity o

f N

ewfo

undl

and]

at 0

9:55

04

Oct

ober

201

4

Sperling, D. (1997) ‘Dave’s EFL Cafe on the Web’. http://www.pacificnet.net/~sperling/eslcafe.html (15 August 1997).

Tufte, E.R. (1990) Envisioning Information. Cheshire, CT: Graphics Press.Vallance, M. (1997) ‘Business Meetings’. http://www.stir.ac.uk/epd/celt/staff/higdox/

Vallance/Diss/fp.htm (2 August 1997).Vygotsky, L.S. (1978) Mind and Society: The Development of Higher Psychological Process.

London: Harvard Press.Wilson, B. & Cole, P. (1991) ‘A review of cognitive teaching models’, Educational Technology

Research and Development 39 (4): 47–64.Wilson, B.G., Jonassen, D.H. & Cole, P. (1993) ‘Cognitive approaches to instructional design’,

in G.M. Piskurich (ed.) The ASTD Handbook of Instructional Technology,pp. 21.1–21.22. New York: McGraw-Hill.

124 MARK PETERSON

Dow

nloa

ded

by [

Mem

oria

l Uni

vers

ity o

f N

ewfo

undl

and]

at 0

9:55

04

Oct

ober

201

4