Skip to Main Content

Digital Foundations: Web Accessibility

Online tutorial in digital humanities skills and techniques.

Introduction

"The power of the Web is in its universality.
Access by everyone regardless of disability is an essential aspect."



Tim Berners-Lee, W3C Director and Inventor of the World Wide Web

Ideally you should present your content in a way that is universally accessible. That is, where everyone can get to your material and understand the content. When considering the design of your online resource think about how easily people of different age, ability and disability can interact with it.

Your Content

Can everyone access your material?

Can everyone 'read' it?

Can everyone 'understand' it?

Can you provide your content in multiple formats?


Your Design

Is it easy to navigate through your content?

What is the simplest way to achieve the look you want?

 

 

If you want to design a resource that will be accessible to everyone, then a simple approach is best. It does not necessarily mean you must compromise on quality. It can take extra effort to become familiar with universal design requirements but once you understand what is needed, you can use this knowledge in all aspects of your design work.

Time - By thinking about universal design from the beginning, you will save a lot of time that you would be spent fixing problems after testing.

 

Labour - There are a lot of resources available to guide you through the design and testing but talking to people who are familiar with different user requirements and getting feedback from users will be much more insigthful.

 

Finance - If you have the funds to outsource this job to experts, it will be money well spent. However, unless you specify to a web designer or developer that universal accessibility is a requirement, you may find that this is not prioritised.

 

Equipment - You could test your site with different tools used by people to overcome certain disabilities.

 

Software - Aside from the software you use to create your online site, there are a lot of options, free and paid for, that can help you test your site.

Text

Ensure your text is large enough to read and is adaptable to changing screen sizes.

Use headings (<h1>, <h2>…) to help visitors to understand the structure of the page and hierarchy of the content.

Do not emphasise text using bold or different colours as this will not be read to a user. Instead mark up the text with <strong> or <em> tags.

Make sure any downloadable documents are ‘readable’.

 

Images

Very often, online exhibitions are created to show off the wonderful imagery from your collections. Improving accessibility for potential visitors to your online exhibition does not mean necessarily that you must limit your use of images. Good descriptions of images in your text and captions, and using alternative text tags (alt=”…”) can help those using screen readers to understand your content.

Thinking about how users will interact with your site can also help you reimagine your content and think about alternative ways to present it. If you have an image of texts, for example a letter, including a transcript and perhaps an audio of a reading could enhance the user engagement for all visitors.

 

Audio

Provide a text transcript of the audio recording and turn off ‘autoplay’ so that any embedded players do not interfere with screen readers.

 

Audio-visual

Add captions to your videos to provide subtitles and audio descriptions if appropriate, with tools such as CADET or YouTube Captions.

You can also provide a text transcript if helpful.

Turn off ‘autoplay’ features to avoid interfering with screen readers.

Colour

Some visitors to your site may have trouble interpreting content because of colour choice or poor contrast. You can find out more on colour ratios at WebAIM to help you when choosing your background or text colours.

 

‘Skip to’ links

This feature allows visitors to avoid tabbing through long menu lists and go straight to the main content of the page. This is probably already set on your platform but if you alter a page, make sure the link jumps to the correct spot.

 

Layout

White space is important when using a screen reader so try to avoid justifying and wrapping your text as it can confuse the reader.

You will most likely use a website building platform to create your exhibition. Consider the features and support offered by the platform to help you in planning your design. Some examples are listed below.

WordPress – Make WordPress Accessible Handbook

Google sites – G Suite User Guide to Accessibility

Omeka – Omeka Classic User Guide Accessibility Statement

Be aware that different themes, plugins and widgets will vary in accessibility so check each one to see how they perform.

 

Keyboard

Use the 'tab' key to move around the site. Check whether the tab moves around the page from section to section in a logical way. Try the 'skip to main content' link to see where you jump to. Will the user miss out on important content?

 

Screen reader

You can download free screen readers (for example NVDA) if you do not have one available to you, to test the descriptions, instructions and content on your site.

 

Website checker

Using a website checker such as WAVE to test the accessibility of your site.

 

Find out more about web accessibility at WebAIMAChecker and the W3C web accessibility initiative.

 

 

different devices

Search Engine Optimisation (SEO)

Once your pages are fully accessible it is important that people can find your website. There are many ways of improving the 'findability' of your pages using SEO tips and plugins. You can read more about this on our 'online exhibitions' page.

 

Responsive Design

People will access your website on many different devices, via different browsers and, possibly using different accessibility aids. Ensure your site is responsive and test it on as many browsers as you can. This can often throw up issues that you hadn't noticed if you are used to working on just one browser.

Further Reading

Help and Advice:

Disability Services at the University of Limerick, available at https://ulsites.ul.ie/disabilityservices/

Guidelines:

W3C Web Design and Applications, 'Accessibility', available at https://www.w3.org/standards/webdesign/accessibility

NDA, Centre for Excellence in Universal Design 'Web accessibility techniques' https://www.universaldesign.ie/technology-ict/web-and-mobile-app-accessibility/web-accessibility-techniques/

 

UL logo

undefined

 

This project was seed funded by the Shannon Consortium's 2016 Take 1 Step initiative.

 

© Glucksman Library, University of Limerick