11 Links: In Reference Lists

Citation styles often require a URL to be provided for all web-based content. For example, in APA style, the Accessibility Toolkit would be referenced as follows:

Caprette, Heather, A. Goodsett, B. Loomis, E. Zickel (2023). Accessibility Toolkit. Cleveland State University. https://pressbooks.ulib.csuohio.edu/accessibilitytoolkit/

The URL is provided to make it easy for people to navigate to the original source. However, it can be frustrating when screen readers read out the full URL for every source. As such, how can we make this link accessible to people using screen readers while still adhering to citation guidelines?

Option 1: WAI-ARIA labels

One solution is WAI-ARIA.^[1] WAI-ARIA allows you to add attributes to HTML to provide instructions that are recognized by assistive technologies. As such, we can hyperlink the URL and use an ARIA label to specify what the screen reader should read aloud. This way, the URL will still appear visually and can be clicked to navigate to the source, but when a screen reader encounters it, it will read out the ARIA label rather than the URL.

Here is what the citation would look like:

Caprette, Heather, A. Goodsett, B. Loomis, E. Zickel (2023). Accessibility Toolkit. Cleveland State University. https://pressbooks.ulib.csuohio.edu/

Here is what the HTML would look like.

Option 2: Link the citation title

If editing HTML is out of your comfort zone, another option is to use the title in the citation as the link text and leave the URL unlinked.

Here is an example:

Caprette, Heather, A. Goodsett, B. Loomis, E. Zickel (2023). Accessibility Toolkit . Cleveland State University. https://pressbooks.ulib.csuohio.edu/

With this method, screen readers would still read out the URL if references were being read through from beginning to end. However, if a person using a screen reader wanted to navigate through the page by links, they would hear the title rather than the URL.