A UCL website is an important strategic channel for student recruitment, promoting our research and its impact, communicating effectively with students and staff, and engaging with users outside UCL.
Web accessibility is the inclusive practice of ensuring there are no barriers that prevent interaction with, or access to, websites on the World Wide Web by people with disabilities. When sites are correctly designed, developed and edited, generally all users have equal access to information and functionality.
Digital Presence is responsible for ensuring that UCL’s design pattern library (which underpins the front-end styling for UCL websites) is accessible for users with all abilities.
However, as Drupal content editors observing the following guidance will ensure you raise the baseline accessibility of your content. For further guidance and training please visit the ISD Drupal Training and Support pages.
Checklist for accessible Drupal content
Structure your pages properly
- Use headings correctly to give structure to pages and make content scannable. Do not use bold text instead of headings (choose H2, H3, etc.) under style in the text editor. H1 is the page title and will be styled appropriately when you create new pages. For sub-headings you can use H2, H3, H4 headings ensuring you use these correctly to denote the hierarchy of different sections (i.e. do not use H3 above a H2 unless these refer to different subsections.)
- Use the correct text editor mark-up icons for bulleted and numbered lists. This will ensure that screen readers can understand how to navigate (e.g. don’t use dashes instead of bullets).
Create meaningful link titles
Never use ‘click here’, ‘read more’ or ‘here’ for your hyperlink titles. Use a short and descriptive title that describes the link destination e.g. 'BBC website' ‘online accessibility checklist’ etc. This is so that all users regardless of the technology they are using understand the link title (this is a particular issue for users who prefer screen readers to read links first).
Provide alternatives for all media
- Add alt text for images at the point of image upload to the Drupal media library.
- Make text transcripts for audio content available as links where you have audio content.
- Use captions for video content.
Do not convey meaning via visual media alone – especially avoid text on images (this is not screen reader accessible and won’t respond well to resizing on different devices.) We also recommend consulting our guidance on Visuals and use of colour for guidance on choosing and using visual elements.
Write for the web
- Remember reading is more difficult online than in print and that for many of our users, English is their second language.
- Keep copy concise and meaningful. Always use the active voice. Use the simplest word. Use the Hemingway App to check the readability of your content.
Make your documents accessible too
Other web accessibility guidance
- View the LinkedIn Learning course Accessibility for Web Design.
- WebAIM also offer excellent easy-to-digest guidance on making web pages accessible.
- The UCL Digital Accessibility Hub have put together a guide on creating accessible web content and a guide for developers on testing web content for accessibility.
Wikis provide a simple, intuitive way of creating group-authored webpages, such as Wikipedia-style repositories of knowledge. The UCL Wiki provides a wide range of information for different services across UCL e.g. Moodle. It is a Confluence-based platform.
The Guide to the UCL Wiki provides links to resources to help you use the wiki. In addition, the Confluence Support website provides additional guidance on creating pages and blogs.
When adding content to or amending content on a wiki, the same principles should be applied as for websites.
UCL has two centrally provided blogging services.
UCL Reflect provides students and staff with a blogging platform for teaching and learning purposes. Reflect is UCL's branding of the WordPress-based platform hosted by, and called, CampusPress.
UCL Blogs is the blogging service for UCL departments, research groups, centres and other bodies, but it is not a blogging service for personal use. It is a WordPress-based platform and is hosted for UCL by CampusPress/Edublogs. A Quick Guide has been produced on how to customise a UCL Blogs blog.
Whether you are working on a UCL Blogs blog or a Reflect blog, WordPress has produced a Handbook which will guide you through how to make it more accessible. A good first step is to select an accessibility ready theme. It should be noted that not all WordPress themes are available in Reflect.
For more information about accessibility and WordPress you may wish to view the LinkedIn Learning course WordPress: Accessibility.
UCL's Social Media Guide includes a section on accessibility in the Guidelines for staff (UCL login required).
The East London Inclusive Enterprise Zone has produced a very comprehensive Social Communications Guide that includes advice on social media platforms, blogging, infographics, emoticons/emojis, multimedia, live events, writing inclusive content and much more.