We are working toward making blog.ryerson.ca as accessible as possible.

This section is a work-in-progress. It will contain advice on choosing accessible themes and plugins, as well as information on how to ensure your own content is accessible.

Here is what we have to offer so far…

• Select an accessible theme and plugins
• Alternate text in images
• Proper use of links
• Effective use of headings
• Properly format text

Select an accessible theme and plugins

Our testing has found that the following themes are the most accessible options. We highly recommend selecting one of these options for your blog.

Themes

• Twenty Ten
• Twenty Eleven
• Twenty Twelve
• Twenty Thirteen
• Twenty Fourteen
• Twenty Fifteen
• Twenty Sixteen
• Twenty Seventeen
• Twenty Nineteen
• Twenty Twenty
• Twenty Twenty One

Proper use of links

Adding links to our posts and pages allows us to associate what we write with content in the outside world. There is a proper way to present links, so that their purpose is clear to the people visiting our sites.

Link Text

Linked text should describe the content being linked to. It is not appropriate for the link text to be something vague, like “click here” or “link to page”.

Semantically Group Links

We often post groups of links, providing a number of references or similar resources. The way that you group these links can impact whether and how a visitor perceives the links. It is appropriate to group links in a bulleted or numbered list.

In WordPress, just use the List block and select whether it is an ordered list (numbers/letters) or unordered list (dots).

Effective use of headings

Headings in a document are not meant to assist formatting, but to provide information on the structural hierarchy of a document. It is important to use them appropriately to convey document structure, since some users skim through a document by navigating its headings.

How to select the heading type in WordPress

The title of your post or page should, in theory, be an H1 heading – it is important for you to check this before you proceed. Do this by looking at the source code for your site, and finding the title of the post or page.

If you haven’t typed the heading text yet, you can start by selecting the Heading block and then typing your text.

If you have already entered the text into a Paragraph block, you can hover your mouse over the block to get the block options, then click the icon on the very left – this will show the icon for the Paragraph block, and when you click it you will see some options to convert to a different block type. Heading is one of those options.

When in the Heading block, hover your mouse to see the block options – here, you can determine the hierarchy of the headings. H2 will be the first level you can select, while subheadings within that should follow H3, H4 and so on.

Here is an example of using hierarchy in headings:

• H2: Animals
  • H3: Birds
  • H3: Cows
• H2: Spices
  • H3: Spices in Indian Cooking
    • H4: Cumin
• H2: Meals
  • H3: Lunch

Properly format text

After designing our content to be accessible, we have to make sure that the content itself is accessible. The most common presented content on web is text. So, how do we make text accessible?

Avoid underlining text that is not a link

On the web, underlined text is most commonly used to identify a link to another web page. It is best to not add underline to text, and allow the style of your site to dictate the underline on links. This is why you will rarely see an underline option in an online text editor (like WordPress).

Be aware of background-to-text contrast

Have you ever gone to a website, only to find that it was difficult to read the text on the screen? Keep this in mind when choosing the colour and size of the fonts you use. There should be contrast between the text colour and the background colour, and the font should be large enough to easily read.

How to format the text colour and size in WordPress

We try to select themes that, by default, provide text that can easily be read. For the most part, this means that we ask you to be careful when choosing to make changes to the defaults, either in your posts or when selecting alternative text options for the whole theme.

We recommend not manually styling most of the text in your post. If you would like to change the font for your post content, and don’t see a way to do it in the Theme Options, please feel free to contact us for an alternate solution.

Use alternate (alt) text on images

When you add an image to a web page, you can include text that describes the content of the image. This text can be read aloud by screenreaders. The text should concisely convey the meaning of the image, not describe its visual characteristics. Also referred to as “Alt text” or “Alternate text”.

More information about properly using Alternate Text can be found here.

If you haven’t yet uploaded an image to your blog, you can simply add the alternate Text during the upload process. After uploading the file, you will see that Alternate Text is one of the fields in which you can add information.

If you have already uploaded the image to the Media section of your blog, it is beneficial to edit the details for the image and include the Alternate Text. Updating the information here, however, will NOT update any images you have already added to a post or page in the blog.

For any posts or pages you have already added, you will need to go into the post or page to add the text. Simply edit the post/page, and click on the image in the editor window. You will see an icon appear in the upper-left corner of your image that looks like a little photograph, that says ‘Edit Image’ if you roll over it. Click on it, and you will be given some quick editing options – including the alternate text. Add the text, than scroll to the bottom and click the Submit button. Do this for each image, and then make sure to save your post/page to process the changes.