Second best is still best
In an earlier post, we discussed the idea of “second best accessibility”. In short, digital accessibility advice and advocacy should take into account an organization’s current abilities and constraints. Of course, full digital accessibility should always be a north star goal. And some organizations do have the ability to make more significant progress than others. But we also need to remember that “more accessible is better than less accessible.”
At Access Armada, we aim to tailor high impact accessibility improvements and solutions for your specific organization, company, or team’s unique situation. We are looking for recommendations that are tractable and achievable and therefore (second) best for you. For some organizations, those steps are basic while more mature teams might need to operate at the level of process and change management.
Subscribe to our Newsletter
Content accessibility vs. technical accessibility
The overall accessibility of your website depends on how it is built and what you put on it. Technical accessibility relates to the full set of accessibility standards that are encoded into your site. In most cases, you’ll need a developer or coder to remediate any accessibility issues or bugs on your site. Content accessibility comprises the content you add to your site. It’s not an exact divide. It is definitely possible to build a site (or CMS implementation) to enable (or hinder) content accessibility.
In our experience, one of the biggest mental barriers to getting started on accessibility is the misconception that you need to make code updates. While it’s not possible to be fully accessible without addressing the technical side, there is a lot that any marketing or content team can handle on their own with their existing content management system (CMS) and tools.
Add accurate and helpful alternative text
Screen reader users rely on alternative text (or alt text) to describe non-text content such as images. (Providing text alternatives can also improve your SEO and ensure that you get your message across when images can’t load.) Every CMS, digital asset manager, and social media platform supports adding alternative text to images out of the box. But what most people don’t know is that there is an art to writing effective and descriptive alternative text. As you add alt text for all of your non-text media, keep these tips in mind:
- Try to keep in mind what you intended the image to convey to sighted users. Provide details but try to keep it short and sweet.
- The user already knows it’s an image. You don’t need to start your description with “Image of” or “Picture of”.
- Try to avoid using images of text. But if you must, the image alt text should include all of the visible text as part of its description.
- Alt text is not always necessary. If an image is redundant to adjacent text, it usually does not need alt text. For example, if the image contains text that is also adjacent to the image, you should leave the alt text empty.
- If an image does not contribute any meaning to the page, it is considered decorative and doesn’t actually need alt text.
- Alt text for images that also serve as links must describe the link destination as well.
Especially on a larger site, covering all of your non-text media can feel overwhelming. There are tools that can scan your entire site, but every little bit helps. Start with your homepage and make your way through all of the pages in your main navigation. You can also check your analytics for the most trafficked pages and begin there.
Check your videos for captions
Unless you’re running your own Netflix, you probably only have a small number of videos sprinkled around your site. But you also produced this video content to convey something that you can’t get across as well with text alone. That content needs to be made accessible to users who are deaf or hard of hearing by providing captions of all voiceover and audio content. And captions can make your videos more accessible to users who are in areas with loud background noise or unable to leave sound on when out in public.
The good news is that this is one of the easiest accessibility features to check and correct for. Typically, manually creating your captions (or having them professionally transcribed) ensures that captions most accurately match the audio. But many video hosting services also provide auto-generated captions that are close enough to be better than nothing. (However, you’ll definitely want to check to make sure that they accurately transcribe names and specialized terms.) Popular video player services like Youtube, Vimeo, and Wistia all support closed captioning out of the box.
Find and update generic link labels
If you had to guess the most common link label on the internet, it would probably be either “Read more” or “Learn more”. Often the purpose or destination of the link is clear in context, but becomes very ambiguous for screen reader users who often tab between links as a means of quick navigation through a page. For example, on a blog listing, a user might encounter a series of identical links that would be announced like this:
- Read more
- Read more
- Read more
- Read more
- Read more
This accessibility issue straddles the line between technical and content accessibility. Updating link text to be more descriptive of the link purpose or destination is an effective solution. But (especially for links that are hardcoded into a template like our blog listing example above), you can also have a screen reader description coded in. For example, a link to our current post might read “Read More: 5 High Impact Accessibility Improvements You Can Do Right Now”.
Add a skip navigation link at the top of the page
When you first visit a website, you may want to examine the header navigation menu to learn more about what the site contains. But you don’t do that every time you open a page on the website. What if you had to tab through the navigation links on the top of each page in order to get to the page content? This is a common experience for users who rely on screen reader or keyboard-only navigation.
One simple solution you can easily implement is to add a “Skip navigation” at the top of the page. That way, users with no interest in tabbing through the main navigation can jump straight to the main content on the page. It’s even possible to hide the skip link so that it is only visible when navigating via keyboard or screen reader.
Adding semantic page regions in code
This sounds complicated but it couldn’t be simpler. Page regions work just like skip navigation links. Skip navigation links make it easier for screen reader users to jump to the right part of the page without manually tabbing through each item individually. Page regions expose more page sections we can jump straight into via screen reader. In most cases, it’s as simple as wrapping each section of the page into an HTML tag.
- Header: the section at the top of each page that contains sitewide info like the site logo and navigation menus. It should be wrapped in a <header> tag.
- Footer: the section at the bottom of each page that often contains its own navigation, contact information, social media links, and legal links such as privacy policies and terms. It should be wrapped in a a <footer> tag.
- Navigation: All navigation menus should be wrapped in a <nav> tag. Keep in mind that a page can contain multiple navigation menus such as a main navigation, mobile navigation, footer menu. When there's more than one navigation menu on a page, it’s important to add an ARIA label so that the menus can be easily distinguished from one another in a list.
- Main Content: This is the filling in the middle of the sandwich that contains the page contents. Typically, a skip navigation link will jump here, but semantically encoding it as a page region creates another way for screen readers user to navigate here. Within a page’s main content, you can use heading levels to provide more granular subsections. The page’s main content should be wrapped in a <main> tag.
Try to aim higher
In writing for a general audience, we tried to identify some changes that are achievable for any team at any level of maturity. But if you already have these accessibility features and fixes in place, don’t stop there! Even if you’re not ready for a full audit, you can work with your technical and content teams to continue to identify accessibility improvements and make continued progress in your journey.
