Accessibility Checklist

The information in the 'Pages Titles and Headings' section of our Accessible Content Guidance, provides advice on how to insert page titles and structure heading elements.

Page Titles

• Does every page of your website have a unique page title?

Headings

• Use heading elements to introduce content.  It is advised that content creators and editors do not use panels to break up or space out content.
• Use only one h1 element per page.  For the majority of the Page Layouts provided by the CMS, the Heading 1 element is reserved for the title of the page, so content creators and editors should only use headings 2 to 6 in the page content.
• Heading elements should be written in a logical sequence.
• Don't skip heading levels, even if you think that the style added by another heading level looks better.  

Content

• Think about the information architecture of your website.  What web pages will your website consist of and how will they be structured?  You can easily map this out using a chart or a sketch to envisage the hiearchical structure starting with your top level pages i.e. Home, About Us, News.  
• Plan out the content for each of your webpages.  Think about the content you have and how that could presented in a simple and logical way for the reader using the content types available. 
• Use plain language and avoid figures of speech, idioms, and complicated metaphors.  This cannot always be adhered to due to the topic, subject matterand required descriptive language, but for simple text it is encouraged to follow this guide.
• Use left-aligned text for left-to-right languages, and right-aligned text for right-to-left languages. 
• Do not apply any styling or formatting to a link or link text. These elements will already be styled to meet accessibility requirements. 
• If your content does not fit into a content type then do not use that content type.  This is often an indication that another content types is a better fit.
• Do not add HTML elements such as span, div, h1 or otherwise to any of the form elements to change the structure of the content types in order to make your content fit.  You will be asked to remove this content, or it will be removed by the Web Support Team, as it will fail to comply with accessibility. 

The information in the 'Text Alternatives for Images' section of our Accessible Content Guidance, provides advice on appropriate text alternatives (alt text) based on the purpose of an image.

It is important for content creators and editors to decide on the purpose of the images used and then take the correct course of action.  If alt text is required this should be added to the 'Description' field in the Media Details of the asset.  If alt text is not required, leave the 'Description' field blank and the system will output the required null alt text markup.  

• Make sure that decorative images have empty alt attribute values.
• For images containing text, make sure the alt description includes the image's text.

Tips and tricks for creating effective alt text can be found on the W3C WAI website.

Image Dimensions and Optimisation

It is important to ensure that all images you intend to use on your website have the correct dimensions and are optimised for the web.  Where required, image dimensions are provided for each content type in our content type guidance.  For users that do not have access to Adobe Photoshop or a similar image editing resource, we would recommend the use of PIXLR, a free online image editing platform.  This platform can be used to resize and optimise images.    

The information in the 'Descriptive Links' section of our Accessible Content Guidance, provides advice on best practice for descriptive links.

Screen readers typically have a mode where they can extract all the links from a web page and put them into a list for easy navigation. Therefore, each link needs to be descriptive so that it makes sense out of context.

• Don’t create links that say "click here", "read more" or "view more."  These have no meaning when extracted and listed out of context.
• Create meaningful and unique descriptive links. For example:
  • 'Find out more about how we look after our staff by reading our Health and Wellbeing at Queen's information
  • 'To learn more about our Accommodation facilities, read 6 Reasons Why Queen’s accommodation beats renting privately
• If there is more than one link to the same destination, it is important that the URL's are exactly the same.  Search engines treat the following URL's differently:
  https://www.qub.ac.uk/about/website/accessibility-statement/
  https://www.qub.ac.uk/about/website/accessibility-statement
  Note the trailing forward slash (/) missing from the end of the second URL.

The information in the 'Using Tables' section of our Accessible Content Guidance, provides advice on how to structure and add tables to content.

• Tables should never be used to create page layouts or used to present other types of information, even if you think it looks better.
• Tables should be created within the HTML Editor and should never be pasted in from another source.
• A table caption should be provided to describe what kind of information the table contains.

Please see our updated guidance on the use of the Code Only content type.  It is very important that users adhere to this guidance and use the content type to embed approved third party content only.  This content type should not be used under any circumstances to alter website styling, to include HTML snippets or to embed unapproved third party content.  These usage cases will be identified by our web governance platform, Siteimprove, and the content in question will be taken off line until fixed or removed from the CMS entirely.   

If you are embedding media from sources such as Mediasite and Youtube, the embed code that they generate to enable the media to run on your webpage, must also include a title attribute. 

Here is an example of non-accessible embed code:

<iframe width="450" height="300" frameborder="0" scrolling="auto" marginheight="0" marginwidth="0" src="https://mediasite.qub.ac.uk/Mediasite/Play/0920d80a35624589b75d130c2d12ef121d"></iframe>

Here is an example of accessible embed code:

<iframe title="Learn how to create sections within the CMS in our 3 minute long video" width="450" height="300" scrolling="auto" src="https://mediasite.qub.ac.uk/Mediasite/Play/0920d80a35624589b75d130c2d12ef121d"></iframe>

Note how the title attribute was added to the accessible embed code.

Documents published on our website must meet accessibility standards.  This is so they can be used by as many people as possible, including those with disabilities.  If your document does not meet the standards, you could be breaking the law.

The information in the 'Document Accessibility' section of our Accessible Content Guidance, provides advice on how you can make your documents accessible.

1. Think About Format - Can the content in your document be published as a HTML webpage?  It's the best way to reach as many people as possible.
2. Document Format - Should the document and content be editable?  If not, it should be provided in and accessible Portable Document Format (PDF).
3. Document Content - Keep the language of the document simple and follow document element advice.
4. Document Structure - If the information must be provided in document format, it must have a structure, just like a webpage.  The document must use styles to create a hierarchy of headings, tables, bullet lists and so on. 
5. Complex Documents and Other Formats - If you are using another type of office document or application, follow the appropriate product guidance to make those documents accessible.  

You should use the following guidance on structuring and tagging your document in an accessible way:

• Create Accessible PDF's in Microsoft Office
• Creating accessible PDFs in Adobe Acrobat
• Create and verify PDF accessibility in Adobe Acrobat Pro