W3C

W3C’s Web Accessibility Initiative produces the Web Content Accessibility Guidelines and is a source of many useful resources on accessibility issues.

Contact us

If you have any queries, please contact Sarah Williams, Web Editor in the Digital Team.

Accessibility

This accessibility guide is for staff who manage information on the University website. The T4 content management system is designed for people to use without html knowledge. Some accessibility information may require familiarity with technical aspects of web design, but we also include important principles that are helpful for all website editors and developers to understand, regardless of their technical expertise.

Accessible web design is about making sure webpages are not constructed in ways that inadvertently create barriers, making it difficult or impossible for some people to access the pages’ useful content. These barriers can be the result of not using the features of the underlying html code as they are intended, or assuming that all people will ‘see’ our pages as we see them.

How do people view webpages?

People view webpages on all kinds of hardware and software:

  • PCs
  • laptops
  • Macs
  • tablets
  • personal digital assistants
  • mobile phones

Various different browsers (not necessarily the latest versions)

  • Internet Explorer
  • Firefox
  • Chrome
  • Safari
  • Opera
  • and others

People with certain disabilities such as dyslexia, blindness or partial sight, may use assistive software such as:

  • screenreaders
  • screen magnifiers
  • make adjustments to the settings on their browsers
  • text readers
  • speech input software
  • and others

To accommodate this wide range of display methods, we need to make sure our pages are flexible enough to adapt to these differing requirements.

Information resources

We recommend you read the article on the Web Accessibility Initiative website which describes how people with disabilities use the web. This article helps to put the whole area into context by examining some of the practical realities.

If you would like a more wide-ranging introduction to web accessibility, the WebAim introduction to web accessibility is a good place to start.

For those who would like a deeper understanding of this area, the Web Accessibility Initiative has a wealth of resources and materials to help in both understanding and implementing accessibility. They also produce the international standard for web accessibility, the Web Content Accessibility Guidelines.

It is a legal requirement

  • The Disability Discrimination Act of 1995, extended to include education providers by the Special Educational Needs and Disability Act 2001, places on us as an institution the legal responsibility not to discriminate against disabled students, staff or other users of our services by treating them less favourably in our provision of services and facilities. It also obliges us to make reasonable adjustments to avoid placing people with disabilities at a substantial disadvantage by being denied access to services and facilities that are available to those who are not disabled.
  • Amongst the services we provide to current and prospective students is the provision of information and services, both educational and non-educational, on the University website. We are required by law to make ‘reasonable adjustments’ to enable equal access for all to the information and services we provide via the web.
  • As a university there is a further obligation on us to maintain the accessibility of our website through the QAA’s Code of Practice for the Assurance of Academic Quality and Standards in Higher Education: Section 3 Disabled Students, which states: ‘Websites and any other sources of computer-based information for prospective students, current students and alumni should be designed according to professional standards of accessibility.’
  • The legal obligations on us mean we must:
    • take steps to anticipate and prevent predictable barriers to access to information and services on the website by making appropriate adjustments to avoid potential problems for access
    • respond to the needs of particular individuals who make known to us any specific barriers they encounter when trying to access web-based information and services.

It is a social issue

  • Making information about the University accessible to this wider audience through an accessible website helps to further one of the key strategic themes of the University’s strategic plan - to be ‘tolerant, humane and liberal minded, with the pursuit of truth, openness and equality and diversity at the heart of what we do’.
  • It is essential for our equality and diversity, which is also an important aspect of our corporate social responsibility.
  • Web accessibility focuses on people with all types of disabilities - visual, auditory, physical, speech, cognitive, and neurological disabilities - including older people with age-related impairments. Accessibility barriers to print, audio, and visual media can be much more easily overcome through web technologies, providing people with disabilities with more effective and efficient access to information through accessible websites so they can more actively participate in society.
  • The main focus of web accessibility may be people with disabilities, but accessibility benefits people with or without disabilities. For example:
    • People who are not fluent in English
    • People with low bandwidth connections or using older technologies
    • People using newer technologies, such as web-enabled mobile phones and personal digital assistants
    • People working in a noisy environment
    • People who do not have or are unable to use a keyboard or mouse
    • People with temporary disabilities due to accident, illness or ageing
    • Older people
    • People who have difficulty reading or comprehending text
    • New and infrequent users

It makes our pages more usable for all users

  • Accessible websites are more easily navigable, more flexible and easier to understand.
  • Improving web accessibility has been shown to result in webpages that are more easily findable by search engines. This makes our pages more effective both for the University’s internal search and in the wider web, thereby also increasing the number of users to whom our pages are available.
  • Increased usability means our site allows users to achieve their goals efficiently, effectively and satisfactorily.

It makes good business sense

  • By making sure that the meaningful content of our webpages is freely available to as wide a range of users as possible, we maximise our audience reach, and thus potentially reach a wider market.
  • Greater compatibility and future proofing can help webpages remain accessible as browsing software and web standards change, saving on work needing to be done to amend sites in line with such developments.
  • Simpler, cleaner code and content make pages easier to maintain.
  • If users have a positive experience of our site they are more likely to use it thoroughly, return more often and tell others about our site.

It improves our site’s technical performance

  • For example, the use of stylesheets for presentation and proper mark-up for content outlined in the guidelines means our pages load more quickly, as page file size is reduced, and when developing new pages in the corporate template time and effort is also saved on design.
  • Our pages work more reliably across different browsers and older technology if they are constructed according to published technical standards.

Source material: Developing a Web Accessibility Business Case for Your Organization, S.L. Henry and A.M.J. Arch, eds. World Wide Web Consortium (MIT, ERCIM, Keio), June 2009

  • Isn’t web accessibility just for blind or partially-sighted people?
  • My page looks fine on my machine! Most people will see it on Internet Explorer using Windows XP anyway.
  • Shouldn’t people view the website the way the designer intended?
  • Don’t accessible websites look a bit boring?
  • We don’t need our pages to be accessible as we are not targeting those audiences.

Don’t discriminate

The last statement in that list is the most mistaken - it is actually discriminatory and therefore illegal. We target a number of different audience groups, amongst whom can be included all manner of people with various disabilities that affect how they use the web - we simply cannot predict, and should not make assumptions. The law states we must not discriminate against people with disabilities by excluding them from our service provision in this way. So we need to design our web pages inclusively.

Be flexible

Legislation that has driven web accessibility focuses on web use by people with disabilities, and many of the examples provided in arguing for accessibility are based on blind users, simply because it’s a disability whose affect on the user’s experience of the web can be fairly easily understood. But a fundamental factor to appreciate is that when we design web pages we do not have control over what machinery our users view them on or how it will appear to them.

Some people may be using specialist assistive software such as screen readers, speech browsers, or screen magnifiers, or they may have to rely on a keyboard or joystick instead of a mouse; others may simply be making use of special settings in their browsers. All users, with or without a disability, can be using any combination of operating system, browser, display settings, internet connection, all of which means they may not see what you see on your screen, and you cannot control this.

That is why we need to provide webpages that can be flexible enough to still be accessible in as many of the ways users are reading them as possible.

Don’t be boring

Accessible webpages certainly do not have to be boring! Adhering to accessibility standards does not prevent the use of multimedia technology that makes the web so dynamic, but we need to ensure that the content of webpages is available even when those newer technologies are not turned on or are unavailable to users.

Nor is it necessary to produce alternative text-only versions of all your pages (although it may be decided in some cases that this cannot be avoided). Not only is this unnecessary extra work, the text-only version often becomes ‘secondary’ to the main site and isn’t updated as often as the primary pages.

More popular accessibility myths debunked

Some popular misconceptions about what web accessibility means are debunked in this article on web accessibility myths from Nomensa’s Humanising Technology blog.

  • Valid XHTML and CSS: Our corporate pages are written in valid XHTML 1.0 Transitional and styled using valid CSS2 code. We validate our pages regularly to ensure this standard is maintained.
  • Accessibility: The University recommends compliance with the WCAG 1.0 AA standard, and this is the standard we apply to the corporate webpages. Some of the guidelines require interpretation and we have used informed judgement to implement them with the needs of users foremost in mind. We have working methods in place to try to maintain this level of accessibility.
  • WCAG2.0: We are planning our transition to WCAG 2.0.

Standards and guidelines do not necessarily address all accessibility problems, so we particularly encourage anyone having difficulties using our site to contact us directly so we can fix any outstanding problems. Comments on any matter concerning the University home pages, including the accessibility of our pages, can be sent to the Web Editor.

We have incorporated the following features into the University site to help you find your way around:

  • Search box
    • A search box allowing you to search the University site is available on every page using the standard University page design.
    • Advanced search options are available from the search results page.
  • Site map
    • If you are having any trouble locating the information you are looking for, a full site map is available.
  • Breadcrumb trail
    • We provide a breadcrumb trail feature above the main content of each page to show you the path from the home page to where you are in the site.
  • Links
    • We try to ensure all our link text is written to make sense out of context.
    • We have used title attributes where appropriate to give further information about the target of a link.
  • Access keys
    • Due to the current lack of a consistent standard for the implementation of access keys, and the resulting unreliability in the way they work, we have decided at this stage not to include them on our pages. We do however feel that they are a useful idea in principle, so we will monitor developments on this issue and hope that in due course a standard will be agreed within the web community, at which point we will be willing to adopt it. In the meantime we will be happy to hear any views you may have on this subject.
  • Presentation
    • We use stylesheets for visual layout combined with structured markup of headings, paragraphs and lists to separate content from presentation.
    • The content of our pages is still readable if stylesheets are turned off or unavailable.
    • We have used relative font sizes on our pages to ensure text is resizeable in visual browsers. See instructions for how to resize text in different browsers.
  • Images
    • All content images have alt text providing equivalent text to describe their function.
    • Purely decorative images have empty alt text, i.e. alt="", which means screen readers ignore the images completely.

We test our pages to ensure the information they contain is accessible in a range of different browsers as well as with screenreading software. By adhering to web standards we avoid the use of features specific to one browser. If you experience problems whilst using assistive software to access our site, please do let us know.

Wherever there is a query over how or whether to comply with a specific guideline, the rule of thumb is, ‘if we don't do something about this, will we be making it either impossible or difficult for one or more groups of users to access the information on our pages?’ If the answer is Yes, then you need to find a solution. If you are not sure what to do about a certain issue with your page, contact the Digital Team.

These are the key issues to address from the WAI Priority 1 and 2 guidelines:

  • Images and graphics
    • Include appropriate ALT text with all images, and longer descriptions of complex images and charts.
  • Image maps
    • Use client-side image maps wherever possible.
    • Always specify appropriate ALT text for all linked areas of the image map and for the main image itself.
    • Provide a separate text-based list of links to accompany the image map.
  • Colour
    • Do not rely on colour alone to convey meaning.
    • Use text and background colours that contrast well.
  • Language
    • Clearly identify the language of the page and any changes in language within a page.
    • Use the clearest and simplest language appropriate for your pages and their intended readers.
  • Scripting languages
    • Ensure that pages are usable when scripts, applets or other programmatic objects are switched off or not supported. Otherwise provide equivalent information on an alternative page.
  • Multimedia
    • Ensure that alternative formats accompany multimedia presentations (text transcriptions for audio and video clips, captions for video).
  • PDFs
    • Documents that a particular group of people will want to print out (for example, minutes of University committee meetings) can be published in pdf format only, as long as you can provide an accessible version of the document to anyone who may request it (eg a Word version for use with screen reading software). Provide a link to the Adobe download page for the Acrobat Reader so that users can easily get the latest version if required.
    • If the pdf document contains information that you want to communicate to a much wider audienceyou need to seriously consider providing them as HTML webpages, in addition to PDF for printing, since they are much more accessible than PDF files.
    • PDF format has become more accessible, but taking advantage of this accessibility requires the use of the correct software. Acrobat Reader 5.0 has features that allow screen readers to improve their access to PDF documents. However, not all users have this version installed, and not all PDF documents are text−based (some are scanned in as graphics), which renders them useless to many assistive technologies. It is recommended that an accessible HTML version be made available as an alternative to PDF. Please contact the Digital Team if you require advice.
  • Flash
    • Do not rely on Flash and other plug-ins alone. Ensure content is accessible without the plug-ins.
    • Ensure that any Flash plug-ins used follow Macromedia accessibility guidelines.
  • Tables
    • For data tables, identify row and column headers, and if they have two or more logical levels, use markup to associate data cells and header cells.
    • If you use tables for layout, ensure the table makes sense when linearised and avoid complex nested table layouts.
  • Cascading style sheets
    • Use stylesheets as much as possible.
    • Ensure stylesheet elements validate to CSS 2.
    • Ensure your pages can still be read without stylesheets.
  • Valid code
    • Create documents that validate to published formal grammars (see Valid XHTML and CSS).
  • Frames
    • Avoid the use of frames – there is no provision for them in the University’s corporate template design.
  • Movement
    • Avoid flickering and moving images or text. If unavoidable ensure appropriate refresh rates are used.
  • Links
    • Use appropriate link text to ensure it makes sense when read out of context.
    • Use title attributes where appropriate to give further information about the target of a link, but use them carefully. Do not use them to repeat link text.
  • Provide a way to skip repetitive content
    • We have included a ‘Skip to main content’ link at the start of all our standard pages to enable screenreader users and those tabbing through links to bypass the page banner and navigation links and go straight to the main content of each page. This link is designed to be invisible in graphic browsers most of the time, but if you tab through the page links, it will become visible once you focus on it. The link is also available to be read by screenreaders.
  • Divide large blocks of information into manageable chunks
  • Provide clear and consistent navigation – orientation information, navigation bars, a site map, etc. – to increase the likelihood that a person will find what they are looking for at a site.
    • Provide information about the general layout of a site (eg a site map or table of contents). 
    • We provide a breadcrumb trail feature above the main content of each page to show you the path from the home page to where you are in the site.

Changing page appearance

How to make the text larger and set the text colour in your web browser.

  • Newer versions of Internet Explorer include a zoom feature that allows you to increase the whole web page.
    • Use the keyboard by pressing CTRL and ' + ' to zoom in and CTRL and ' - ' to zoom out.
  • If you are using a mouse with a scrollwheel you can scroll text and images bigger and smaller by holding down the CTRL button on the keyboard and scrolling the scrollwheel at the same time.
  • Or choose the Tools menu at the top of the browser window (Alt+X)
    • A list of options will appear in the drop down menu, choose Internet Options
    • A 'General' window will open, with 'Appearance' at the bottom of the window.
    • Select 'Colors' to change the font colour, or 'Fonts' to change the font size.
    • The text in your browser should now appear in the size and colour you have selected.
    • You may need to use the 'Accessibility' options to choose to ignore font size and colour set by the website.
  • See the Microsoft website for more information about accessibility options in Internet Explorer.

Using a mouse:

  • Click the 'Customise and control Google Chrome' button (the spanner to the right of the address bar).
  • Select the 'Settings' option
  • Select 'Show advanced settings'
  • Scroll down to the 'Web content' heading
  • Next to 'Zoom' in the menu, click the plus or minus buttons to increase or decrease the text size
  • Alternatively you can use the 'Customise fonts...' button to change the font size.

Using the keyboard:

  • To increase the text size press Ctrl + + on the numeric keypad (hold down Ctrl and press +), or Ctrl + = on the main keyboard
  • To decrease the text size press Ctrl + -
  • To return to the default font size press Ctrl + 0

Firefox uses a Zoom feature that resizes the whole web page.

  • You can use the keyboard by holding down the CTRL button whilst pressing the '+' key to zoom in or the '-' key to zoom out.
  • Or go to View > Zoom > Zoom in OR Zoom out
  • If you are using a mouse with a scrollwheel you can scroll text and images bigger and smaller by holding down the CTRL button on the keyboard and scrolling the scrollwheel at the same time.

The default Zoom setting will automatically resize all the images present on the page as well as the text. So if you increase the size of text, images get bigger and vice versa. Our site makes use of large billboard images with graphic text which can be made larger using this feature. However, if you wish to resize only the text without enlarging the images you can disable automatic image resizing in Firefox.

  • Go to View > Zoom and check 'Zoom Text Only'.

Firefox will also remember the preferred Zoom text size setting you have used for individual sites you visit and will display them at the same size when you visit them again.

  • To change hte font colour, go to 'Tools' and then click on the 'Content' tab.
  • Select 'Colors...' to set the colour.

From the View menu:

  • Select 'Make text bigger', or 'Make text smaller'

Using the keyboard:

  • Hold down COMMAND key and press the '+' key on the keyboard to enlarge the text or the '-' key to decrease the text size.

From the View menu:

  • Select Zoom and then the percentage you require to increase or decrease the text.

Using the keyboard:

  • Use the '+' and '-' keys to increase or decrease the text by 10% at a time.