Accessibility
We are all responsible to ensure our website is accessible to all of our users.
Website accessibility refers to the way in which online content is developed, designed and written so that users with and without disabilities can use them. The University has a legal responsibility to ensure that everyone can easily access the information on our website.
There are lots of simple things you can do when creating webpages to ensure our website provides every user with the best experience possible.
The Digital Team spend a lot of time ensuring the website is accessible to users. We work with an accessibility auditor and regularly ensure the design of the website meets the required specification in terms of functionality and colour contrast.
However, accessibility should be at the forefront of every editors' mind when working on the website.
Writing
Written content can be interpreted in lots of different ways. It is therefore our job to craft content to ensure it is interpreted by our diverse audience in the correct way.
All text should confirm to both the University's tone of voice and style guide to ensure consistency across our communications.
To ensure the information on your page is accessible to everyone:
| ✅ You should | ⛔️ You should not |
|---|---|
| Write your content in plain english with no complex language and jargon | Use complex language which includes unfamiliar terminology |
| Use tools like Hemingway Editor to check readability | Introduce more than one thought or topic in a single sentence |
| Use language which is appropriate to the target audiences' educational level | Use language which relies on sensory characteristics like sound, colour, shape and location |
| Include definitions of any abbreviations and acronyms | Be vague or abstract when using text links (eg 'click here'). |
| Use short and concise sentences | |
| Use left-aligned text | |
| Ensure headings follow a hierarchy structure | |
| Use hyperlinked text which accurately describes the end destination, but is understandable as a phrase by itself (eg 'Read more about scholarships') | |
| Consider how complex information is displayed through tables and lists to aid understanding | |
| Keep paragraphs between one and two sentences. |
Documents
It is always best to ensure important information is embedded as textual HTML content on webpages.
However, there may be instances where you need to provide supporting documents.
To ensure your documents are accessible:
| ✅ You should | ⛔️ You should not |
|---|---|
| Use headings, alt text for images, descriptive hyperlinks, plain english and simple table structures in documents | Upload PDF documents unless necessary |
| Use a sans-serif font, such as Arial, in your document in a font size of 12pt or 16pt | Use colour to convey meaning in your document |
| Upload documents as Microsoft Word documents | Use different coloured text in documents. |
| Ensure the file size of the document is stated | |
| Accompany Issuu embeds with an accessible Microsoft Word document detailing the same information | |
| Use built-in accessibility functionality in software, like Microsoft's Accessibility Checker tool | |
| If creating documents using Adobe products, research product-specific accessibility best practice. |
Image and video
Rich content like images and videos not only help make our website visually engaging, but can also aid understanding of written content.
When using image and video:
| ✅ You should | ⛔️ You should not |
|---|---|
| Ensure all images have alt tags with meaningful descriptions | Use text within images |
| Name images with an easily identifiable title | Open internal and external links in new windows as it hinders accessibility. |
| Fully explain graphs and charts through a supporting Microsoft Word document or HTML text | |
| Accompany videos with a transcript or subtitles. |
Use of ALT tags
Correct use of ALT tags are a legal requirement for public sector organisations. ALT tags, or ALT descriptions, help screen-readers describe to visually impaired users what the image shows. It also enables search engines to crawl through our website more effectively and rank our pages in terms of the quality of our content.
| Guidelines | ✅ Use | ⛔️ Do not use |
|---|---|---|
| Describe the image and be specific. Limit description to 125 characters to avoid unnecessary detail. | Physics professor pointing at whiteboard with mathematical equations on. | Teacher pointing at whiteboard. |
| Use of keywords sparingly. Your first priority is to describe the picture. | A group of three male students sitting next to Starbucks in the Enterprise Hub. | A group of three male students sitting next to the Starbucks in the Enterprise Hub at the University of Hertfordshire. |
| Do not use 'A picture of...' or 'An image of...' Screen-readers will recognise the file type from the HTML code. | A female student laughing and walking down corridor with laptop under her arm. | A picture of a female student laughing and walking down corridor with laptop under her arm. |
Text in images
Screen-readers and search engines cannot read text which is a part of your image. It is therefore not advisable to do this. If you must use and image with text on, your ALT text must state what the text says.
Graphs and other complex images
Complex images, like graphs, maps and charts, must also include ALT tags. Complex images often require a two-part text description. The first part is to identify what the image shows and, where applicable, signpost to the location of the longer description. The longer description should provide a textual representation of the essential information presented in the image. The most common way to do this is provide a link to the long description next to to the image. For further advice on optimising complex images, get in touch with a member of the website team.
Related Guidance
Get in touch
If you have any questions please contact a member of the team:
| Contact | |
|---|---|
| Web and Digital team, Marketing and Communications | websupport@herts.ac.uk |
| Jak Kimsey, Head of Digital and Creative Experience (he/him) | j.kimsey1@herts.ac.uk |
| Marketing and Communications Business Support | marketinguh@herts.ac.uk |