How to Find and Fix Hidden Accessibility Issues

5 simple but significant things to check in your online content

A librarian finding and fixing hidden accessibility issues

So you’ve heard about the upcoming new accessibility requirements for US state and local government websites, and you’ve implemented an automated accessibility checker and fixed all the issues you found. You’re done, right?

Wrong! (But good job fixing all those errors. That’s huge.)

Automated accessibility checkers can find, at most, just half of all the possible accessibility errors that a website can have. They’re really useful for spotting common issues, such as color contrast problems and broken web forms. But there are some things that automated checkers can’t determine, and that’s where your clever human brain comes in.

Here are five simple but significant things to check when you’re creating or editing web content.

Link text: Banish “click here”

If there’s one thing you take away from this column, it’s that you should never title your link click here. Be wary of similar phrases like “learn more” or “see more.”

Rule of thumb: use descriptive link text. Name the item you’re linking to.

  • Bad example: “To sign up for this workshop, click here.”
  • Good example: “Sign up for this workshop”

Why is the second example better? Imagine you’re only hearing the linked text in both examples, and consider: does it accurately describe what you’re linking to? People who use screen readers can tab their way through the links on the page, and hearing “click here… click here… click here…” is (a) not useful at all and (b) really annoying. Sighted users, too, tend to use links as an aid for skimming through the page, since they usually stand out due to being a different color or underlined.

🌟 Shout-out: The Princeton University Libraries’ Special Collections sub-site uses nice descriptive links for its four big sections, such as “Learn more about access and our collecting areas.”


🔥 Stay up-to-date with LibTech Insights by signing up for our free newsletter. Just one weekly email with our new blog posts, top tech news stories, and other bonus content. Check out some posts from our archive:

🦋 Register for our upcoming webinar, “‘Data’ and Indigenous Studies: Entry Points for Academic Libraries”


Headings: Make it easy to skim and navigate

Usually, people don’t read every single word on a web page; they skim until they find the information that is most relevant to them. (View “How People Read Online: New and Old Findings” from the Nielsen Norman Group for a great rundown.)

Well-written headings help the reader find that info. Headings are visually apparent to sighted readers, since they are displayed as larger text. They are also useful to people using screen reader software, since headings offer a way to navigate a page quickly.

Automated tools can detect the presence of heading tags (<h2>, <h3>, etc.), but they can’t tell if your headings actually make sense or reflect a clear outline. That’s where you, the human, come in! When you’re editing a web page, pretend you can only read the headings. Do they give a sense of the page’s contents? Are they consistently worded?

Note that increasing text size doesn’t make a proper heading. You’ll need to use your content management system to change the text/paragraph style to something like “Heading 2.”

🌟 Shout-out: Washington University Libraries’ “Borrowing & Returns” page splits up the content with nice big headings, making it easy to skim the long page for sections like “Request Chapter Scans” and “Loan Periods.”

Page title: Does it match the content?

This is actually a continuation of the section on headings, since the page’s title is the highest-level heading of them all. It’s what shows up in search engine results, and it’s arguably the most important thing you can implement to aid user navigation. The main thing to consider: Does the page title accurately describe the content?

Sometimes there’s a tension between the page title and where the page lives in your website’s information architecture. For example, if it’s a subpage of “Faculty Services,” should the title be “Teaching Support” or “Teaching Support for Faculty”? It might depend on your institution’s style conventions and your appetite for verbose titles. (I’m pro-verbosity, personally.)

🌟 Shout-out: NYPL’s Digital Collections includes the item name in the page title (example: “Celebrations – Parades – Municipal events – Macy’s Thanksgiving Parade”)—and they’ve opened their site to be indexed externally, so you can find items easily through Google, DuckDuckGo, or your fave search engine.

Alt text: It better not say “IMG_3024.jpg”

The mere presence of alternative (alt) text is not sufficient. The purpose of alt text is to describe what the user is missing out on if they can’t see the image or if the image doesn’t load. So when you’re uploading an image, don’t put just anything into the alt text field—spend as much time crafting thoughtful alt text as you do writing the other content on the page, because your users will encounter it.

Imagine that you’re describing the image to a pal who can’t see it. What’s important about its presence on the page? If the image contains text, such as a graph or a sign, the alt text needs to contain the text, too.

Examples:

  • Bad: “Pie chart.”
    • Better: “54% of respondents said they use the library weekly; 16% said daily; 20% said monthly; 10% said never.”
  • Bad: “Photo of library users.”
    • Better: “Adults and children listen to a librarian at storytime.”
  • Bad: “New art installation” next to the text title that says “New art installation.” That’s redundant!
    • Better: “Large troll made of wooden planks.”

Note: if the image is purely decorative, such as a swooshy line that separates sections, it doesn’t need alt text at all. The alt attribute can be empty.

WebAIM has a practical guide to writing alt text, and it’s full of great examples.

🌟 Shout-out: the British Library has descriptive alt text for every image on its homepage, such as “A woman sat intently studying an old book at a Reading Room desk at the British Library” and “An illustration for the Story Explorers exhibition at the British Library, including a montage of different elements, including two moons, a cat in a spaceship, two birds, a frog, a tree and stars.”

Icons: Are there accompanying labels?

In a user interface, icons alone are usually not sufficient to tell the user what clicking on them will do. (I’m looking at you, Gmail.) If you use an icon, it needs a text label next to it.

Why? Not everyone can decode what the icon might mean, particularly for a library setting in which there might not be a standard icon for things like databases, room reservations, or even the very basic “help.” Pairing icons, which do help people with low reading skills (like kids), with textual labels gives you double the chance of clear communication. And it looks nice!

🌟 Shout-out: Vancouver Public Libraries does a nice job with this—all icons on their homepage are clear and have an accompanying label (except for social media logos, which are fine).

Accessibility work is a process, not a one-time project

It requires consistent effort to find and fix accessibility errors. Every web professional in your library should be building their accessibility knowledge and skills continually, since both regulations and digital tools get updated somewhat frequently.

But don’t despair! If it feels like a never-ending game of whack-a-mole, just remember: every small accessibility issue that you fix makes your website even more useful and usable to your patrons. By making seemingly small changes like the ones described in this article, you’re upholding your library’s commitment to access.