Creating Accessible Learning And Teaching Resources: The e-MapScholar Experience

Background

e-MapScholar, a JISC 5/99 funded project, aims to develop tools and learning and teaching materials to enhance and support the use of geo-spatial data currently available within tertiary education in learning and teaching, including digital map data available from the EDINA Digimap service. The project is developing:

• A range of Teaching Case Studies in various subject disciplines.
• An online Learning Resource Centre providing access to resources in Working with Digital Map Data, Integrating Spatial Data and Data Visualisation. These will include interactive tools for use by students that illustrate key concepts and perform some basic analytical tasks.
• A Content Management System that allows lecturers to customise online learning units and interactive tools through provision of discipline and place specific examples.
• A Virtual Work Placement - based on a wind farm development in Wales.

The Disability Discrimination Act (1995) (DDA) aimed to end discrimination faced by many disabled people. While the DDA focused mainly on the employment and access to goods and services, the Special Education Needs and Disability Act (2001) (SENDA) amended the DDA to include education. The learning and teaching components of SENDA came into force in September 2002. SENDA has repercussions for all projects producing online learning and teaching materials for use in UK education because creating accessible materials is now a requirement of the JISC rather than a desirable project deliverable.

This case study describes how the e-MapScholar team has addressed accessibility in creating the user interfaces for the learning resource centre, case studies, content management system and virtual placement.

Figure 1: Screenshot of the case study index	Figure 2: Screenshot of the learning resource centre resource selection page
Figure 3: Screenshot of the content management system	Figure 4: Screenshot of the Virtual Placement (temporary - still under development)

Why Online Learning And Teaching Materials Should Be Accessible

An accessible Web site is a Web site that has been designed so that virtually everyone can navigate and understand the site. A Web site should be informative, easy to navigate, easy to access, quick to download and written in a valid hypertext mark up language. Designing accessible Web sites benefits all users, not just disabled users.

Under SENDA the e-MapScholar team must ensure that the project deliverables are accessible to users with disabilities including mobility, visual or audio impairments or cognitive/learning issues. These users may need to use specialist browsers (such as speech browsers) or configure their browser to enhance the usability of Web sites (e.g. change font sizes). It is also a requirement of the JISC funding that the 5/99 projects should reach at least priority 1 and 2 of the Web Accessibility Initiative (WAI) standards and where appropriate, priority 3.

The Approach Taken

The project has been split into four major phases:

1. Planning: Early in the project the team looked at technical standards and constraints and went on to develop an Instructional Design document which looked partly at accessibility as well as good practice in terms of Web design, e-learning and online assessment. Accessibility therefore became an integral part of the project rather than an add on to be considered at a later date.
2. Development of tools and materials alongside user interfaces. It must be added that the design of the interfaces are being reviewed and updated as feedback from learning technologists and users suggest where improvements can or need to be made.
3. Testing with different browsers and also using tools such as Bobby.
4. Evaluation an evaluation team based at the Open University is evaluating software and tools directly with users and feeding back their findings to the developers and authors.

Overall Content Design

While the CMS and learning units are inter-connected, the other components can exist separately from one another.

The project has employed a simple and consistent design in order to promote coherence and also to ease navigation of the site. Each part employs similar headings, navigation and design.

The basic Web design was developed within the context of the learning units and was then adapted for the case studies and virtual placement.

Summaries, learning objectives and pre-requisites are provided where necessary.

User Support

Links to help page are provided. The help page will eventually provide information on navigation, how to use the interactive tools and FAQ in the case of learning units and details of any plug-ins/software used in the case studies.

Text formatting

Font size will be set to be resizable in all browsers.

Verdana font has been used as this is considered the most legible font face.

CSS (Cascading style sheets) have been used to control the formatting of text; this cuts out the use of non-functional elements, which could interfere with text reader software.

Navigation and Links

Navigation has been used in a consistent manner.

All navigational links are in standard blue text.

All navigation links are text links apart from the learning unit progress bar, which is made up of clickable images. These images include an ALT tag describing the text alternative.

The progress bar provides a non-linear pathway through the learning units, as well as providing the user with an indication of their progress through the unit.

The link text used can be easily understood when out of context, e.g. "Back to Resource" rather than "click here".

'Prev' and 'Next' text links provide a simple linear pathway through both the learning units and the case studies.

All links are keyboard accessible for non-mouse users and can be reached by using the tab key.

Where possible the user is offered a choice of pathway through the materials e.g. the learning units can be viewed as a long scrolling page or page-by-page chunks.

Colours

Web safe colours have been used in the student interface.

The interface uses a white background ensuring maximum contrast between the black text, and blue navigational links.

Images

Very few graphics have been used in the interface design to minimise download time.

Content graphics and the project logo have ALT tags providing a textual description.

Long descriptions will be incorporated where necessary.

Graphics for layout will contain "" (i.e. null) ALT tags so they will be ignored by text reader software.

Tables

Tables have been used for layout purposes complying with W3C standards; not using structural mark-up for visual formatting.

Technical

HTML 4.0 standards have been complied with.

JavaScript has been used for the pop-up help menu, complying with JavaScript 1.2 standards.

The user is explicitly informed that a new window is to be opened.

The new window is set to be smaller so that it is easily recognised as a new page.

Layout is compatible with early version 4 browsers, both in Netscape, Internet Explorer and Opera.

Specific software or plug-ins are required to view some of the case study materials e.g. GIS or AutoCAD software has been used in some of the case studies. Users will be advised of these and where possible will be guided to free viewers. Where possible the material will be provided in an alternative format such as screen shots, which can be saved as an image file.

Users are warned when non-HTML documents (e.g. PDF or MS Word) are included in the case studies and where possible documents are also provided in HTML format.

Problems Experienced

Problems experienced have generally been minor.

• Input errors such as forgetting an ALT tag can be monitored by using testing software such as Bobby.
• Conflicts can arise between desired appearance/style and limitations imposed by creating accessible web pages. This is affected by the use of different browsers. One example of this has occurred when trying to set the font size. We originally set up font size using a fixed size:
  .bodytext { font-family: verdana, arial; font-size: 10pts; font-style: normal}
  This could be changed by the user in Netscape but not in IE. This has been changed to:
  .bodytext { font-family: verdana, arial; font-size: small; font-style: normal}
  However this solution also has problems. There are differences in the way that browsers view the page e.g. in Netscape the text is much smaller than in IE. When text is a legible size in Netscape it looks less appealing in IE.
• The case studies were originally developed with a navigation bar at the top and the bottom of the page containing approximately seven links. However it was pointed out that users with speech browsers would find this repetition extremely annoying. This has been resolved with the inclusion of 'next','prev' and a 'back to top' link at the bottom of the page instead of the full button bar. Also a 'skip header' button has been included for users to jump the top navigation buttons if preferred.

Things We Would Do Differently

Throughout the project accessibility has been thought of as an integral part of the project and this approach has generally worked well. Use of templates and CSS have helped in minimising workload when a problem has been noted and the materials updated.

It is important that time and thought goes into the planning stage of the project as it is easier and less time consuming to adopt accessible Web design in an early stage of the project than it is to retrospectively adapt features to make them accessible.

User feedback from evaluations, user workshops and demonstrations has been extremely useful in identifying potential problems.

Resources

1. Bobby, Watchfire Corporation,
   <http://bobby.watchfire.com/bobby/html/en/>
2. EDINA Digimap, EDINA
   <http://edina.ac.uk/digimap/>
3. e-MapScholar Project home page, EDINA,
   <http://edina.ac.uk/projects/mapscholar/>
4. Joint Information Systems Committee (JISC),
   <http://www.jisc.ac.uk/>
5. TechDis,
   <http://www.techdis.ac.uk/>
6. About Accessible Information, RNIB,
   <http://www.rnib.org.uk/access/>
7. Access All Areas: Disability, Technology And Learning, TechDis and ALT,
   <http://www.techdis.ac.uk/accessallareas/AAA.pdf>
8. Special Educational Needs and Disability Act 2001, The Stationery Office,
   <http://www.hmso.gov.uk/acts/acts2001/10010--d.htm>
9. Web Content Accessibility Guidelines 1.0, W3C,
   <http://www.w3.org/TR/WCAG10/>

Contact Details

Deborah Kent
EDINA National Data Centre
St Helens Office
ICT Centre
St Helens College
Water St
ST HELENS
WA10 1PZ

Email: dkent@ed.ac.uk

Lynne Robertson
Geography
School of Earth, Environmental and Geographical Sciences
The University of Edinburgh
Drummond Street
Edinburgh EH8 9XP

Email: lr@geo.ed.ac.uk