Additional Accessibility Guides
WordPress Block Editor
Follow these best practices to create accessible pages and posts in the WordPress block editor.
Title
Each page and post must have a descriptive, brief, and unique title. Select the Add title placeholder to create a title.
Font, Style, and Formatting
Use the default font (Verdana), colour, (#4f4f4f), and size (16px).
For accessibility do not use Langara orange (#f15a22) with white. For decency do not use Langara orange with black.
If using font colours other than default, check text and background for sufficient contrast. The WordPress editor will note insufficient contrast, but if unsure check colours using the WebAIM colour contrast checker.
Use built-in tools for lists and adjusting indent.
Headings and Structure
Use headings to organize content. Headings should be brief (only a few words) and descriptive of the content contained below. Use heading levels in a sequential, nested structure. For example, begin with an H2 for your main point or theme. Use nested H3s for subtopics. Return to H2 for your second point with nested H3 subtopics, etc.
To create a heading type /heading
.
To set heading level open the H2 menu in the editor toolbar and choose the appropriate heading level.
To review heading structure, open the Document Overview and move to the Outline tab.
WordPress will note (Incorrect heading level).
Do not use tables for alignment purposes, use the Columns block.
Alternative Text
Graphics that contain information must have a text equivalent. Often that is provided in the Alt Text field. Alt text is code that is read aloud to screen reader software and describes the information in a graphic to blind and low-vision users. Write a brief description of the graphic in the Alt Text field in the Media Gallery Attachment Details panel. Learn how to write alt text.
If an image does not include information, leave the Alt Text field blank.
Best practice for many images, especially instructions, is to include a text equivalent to compliment and support visual information. If a graphic contains information but is accompanied by adjacent equivalent text or a descriptive figure caption, leave the Alt Text field blank.
Add a figure caption in the Media Gallery Attachment Details panel Caption field. Captions can be longer than alt text, but should be concise. Links and attributions should be in a caption, but never in alt text.
If an image is linked, write the link destination in the Alt Text field.
Links
Do not include bare URLs as they are cumbersome for assistive technology and meaningless to all. Do use “read more” or similar language for links as it is not meaningful.
To create accessible links:
- Write a brief description of the link destination.
- Select the text and choose the Link button in the editor toolbar.
Or, press Control (Command on macOS) k - Paste the URL and press Enter.
Plain Language
Use clear, concise language.
- Avoid assuming recipients’ knowledge.
- Explain abbreviations, initialisms, and acronyms.
- Make clear requests.
- Provide summaries of long emails.
Consider Microsoft Word’s Document Stats for readability stats or AIOSEO Readability scores. However, as the author you know the material best and you are smarter than a computer. Learn more about plain language.