Accessible WordPress Pages

A Guide for Creating Accessible WordPress Pages

Accessible WordPress Pages

Page Template

Use one of the most current WordPress site templates. (Templates are provided by Academic Technologies and applied automatically upon request.)

1. Examples of WordPress site templates. Use this Help Wiki guide to request/self-select academic resources, Selecting Academic Technologies. Questions? Contact Academic Technologies through help.evergreen.edu.

Headings

Properly format headings, and Use headings in the correct (hierarchical) order When in edit mode for a Page or Post:

1. At the editor (in Visual mode), click on the Toolbar Toggle icon at far right of the row of tools.
2. Highlight the text you want to apply a header to.
3. Click on the Paragraph drop-down to select and apply a header

A WordPress page/post title uses Heading 1. There should be only one h1 per page but there can be multiple h2, h3, h4, h5, h6. DO NOT skip main heading levels and apply consistently throughout page. Examples: Heading 2 is great for headlines, Heading 3 is good for separating sections of content, and Heading 4 can be used for sub-sections or general sections of content. You can also apply styling using CSS in Text mode.

Images:

Add alternative (Alt) text to images.

1. In the Page or Post, click on the image once to highlight it.
2. From the pop-up mini-menu, click on the Edit (pencil icon) button
3. At the Image Details page, enter a description of the image in the Alternative Text field
4. Click the blue Update button in the lower right corner to save.

Lists:

Format a list as a list using ordered or unordered lists.

1. In the Editing field, highlight the content you want to format as a list

If the order doesn’t matter, click on the Bulleted list button and desired bulleting shape from the drop-down menu. For an ordered list, click on the Numbered list button and desired formatting option from the drop-down menu. You can also insert a list using CSS in Text mode.

Links

Write meaningful link text that indicates the link’s destination. To insert a link to a page or post:

1. Highlight text you want to link to.
2. Select the “Insert/edit link” icon (resembles a chain link) from the toolbar
3. Paste the URL of the site you want to link to into the entry field and click the arrow to apply link

Tables

Use the TablePress plugin available in WordPress at sites.evergreen.edu and blogs.evergreen.edu.

1. Use the TablePress plugin to create and manage tables on your WordPress site.
2. No HTML knowledge is needed, table data can be easily edited. Tables can contain any type of data, even formulas that will be evaluated.
3. Tables can be inserted into posts, pages, or text widgets.
4. After installing the plugin, you can add, import, export, edit, copy, and delete tables via the “TablePress” section in your admin menu. Everything should be self-explaining there.
5. To show one of your tables in a post, on a page, or in a text widget just include the Shortcode [tableid=<the-ID> /] into your post/page/text widget, where <the-ID> is the ID of your table (can be found on the left side of the “All Tables” screen in TablePress).
6. You can also click on the “Table” button in the toolbar of the post/page editor to see a list of your tables. If you click “Insert” then, the correct Shortcode will be inserted for you automatically.
7. See also the TablePress Usage page for more information.
8. Tables can be imported from Excel (.xls and xlsv) CSV and HTML files and also be exported

Color

Color choices are handled by your site’s theme and may not be easily editable. If you are using a recommended site template you are already using a theme that adheres to best practices for use of color

Math & Science

Write math and science equations using LaTeX.

1. Use the WP LaTeX plugin in WordPress.

For more information, go to the Math & Science page of the handbook.

Multimedia:

1. Eliminate or blinking/flashing content to 3 seconds
2. Make sure all mouse actions can also be completed with a keyboard alone (without a mouse.)
3. Use an accessible media player like YouTube or Vimeo.

Accessible media embeds are built-in with WordPress. Simply paste the URL to your media object hosted at YouTube, Vimeo, etc., on its own line in your page or post.