How would you explain web accessibility in less than five minutes to dozens of technophobic writers, and convince them to do something about it?
You explain the three easy ways to simultaneously improve accessibility, search engine optimization (SEO), and usability:
- Structure content with ordered headings and lists;
- Write a meaningful text alternative or use the null value for images;
- Write descriptive link text that makes sense out of context.
And you do it without mentioning the Web Content Accessibility Guidelines (WCAG) or hypertext markup language (HTML).
This post is for anyone accountable for the success of an accessibility program, especially those of us who must win over members of an obstinate culture into doing things a little differently.
The Challenge: Curtailing the Complexities of Accessibility
I was consulting with a web team that invited me to speak about accessibility during an event for the website writers — all of the people who use the content management system’s drag and drop interface to piece together websites. In other words, coding websites and understanding the nuances of WCAG are not part their day jobs.
I needed to figure out how to:
- Summarize accessibility and actionable steps into a five minute minute presentation;
- Convince them that these changes were meaningful, not just more work.
The Solution: Making Accessibility Relevant and Easy
Appreciating that their primary job is writing, I focused on actionable steps from their perspective. For example, I would start explaining a best practice with “when you are writing,” instead of saying “make sure you add a text alternative for all non-text content to comply with Guideline 1.1,” and so on.
Narrowing down the list of what to tell them was even more challenging. I employed two methods to refine the scope of the presentation.
First, I performed a baseline accessibility assessment of their websites and noted quick wins that writers controlled, such as using a true heading instead of a bold font, and avoiding repetitive links on the same page. I noted topics we had to save for future discussion, such as complex infographics.
Second, I simply asked myself, if I could only tell them — these very busy people who are not crazy about change — three things they could do to improve their content, what would it be?
In order to convince them that accessibility was relevant to their work and the success of their websites, I explained the relationship between search engine optimization (SEO) and accessibility in terms of the code (without getting too technical).
But what resonated with them most, were the stories of users and situational disabilities that may affect anyone, including them.
The Outcome: A Focused Resource for Writers
Okay, so only a handful of writers actually attended the event, but I didn’t want the conversation to end there.
I turned the presentation into the following article, which I hope you can share with your writers or tailor to fit your organization’s needs.
The rest of this article is for your writers.
How to Optimize Your Content for Search Engine Optimization and Accessibility
How and what you write for assistive technology users can also improve how you rank in search results to drive more traffic to your website.
Behind the scenes, search engines and assistive technologies read the same website code to interpret the meaning of your content.
But as an author, you don’t have to write in code to advantage content for search engines and make it easier for users to understand your website (and reduce their frustration).
Authors have impact through content structure and word choice — the fundamental variables for content optimization.
Easy Ways to Optimize Your Content
Write a Unique Title for Every Page
The page title orients all users, and it is often the first thing a screen reader user hears.
Use True Headings and Use Them in Order
“True headings” refers to the use of actual headings instead of bold or other styling to indicate a heading. Technology does not recognize styling as a heading.
Use headings to break up blocks of text; this makes it easier for users to scan content and find what they need. Headings also communicate content relationships and hierarchies, so always use headings in order.
Keywords in headings provide clues to users and technologies about the substance of a particular section. In headings, always favor clarity over cleverness.
A key takeaway, assistive technology users must use headings to navigate your content. Imagine listening to your entire page without any headings.
Highlight Key Information with Lists
Like headings, use lists to break up blobs of text. Since lists often contain important information, they can be a cue for both assistive technology users and search engines about the significance of the content.
Use Keywords in Image File Names
In addition to making it easier for you and your colleagues to search for images, technology reads file names too.
Write a Meaningful Text Equivalent for Images
Also referred to as alt text, a text equivalent for an image serves one of four main purposes:
- Describes the image (how would you explain it to someone over the phone?)
- Relates the meaning or mood an image conveys
- Defines the function of the image, such as a link (the alt text should be the link text)
- Tells assistive technology to ignore a purely decorative image, such as a goofy stock image, with the null value — two quotes without a space (“”)
When writing alt text, keep it concise and use plain language.
Avoid writing:
- “Image of” or “photo of” — this is redundant because assistive technologies announce to users that it is an image
- Characters like “* ! #,” emoticons, and excessive punctuation as user settings and the way these are handled by technology varies
Except for logos, never use an image of text. Images of text do not scale well across devices, and neither assistive technologies nor search engines can read the text.
Write Link Text That Makes Sense Out of Context and the Destination Clear
A page full of “learn more” and “click here” links negatively affects your site’s usability, the accessibility of your content, and is a missed opportunity to optimize copy for search engine optimization (SEO).
Alternatively, descriptive link text helps all users. Instead of “learn more” for a link to a conference registration page, for instance, write, “Register for the Name of Your Conference.”
Descriptive links are particularly important for screen reader users who may hear a list of links on a page, and because users may not see a link in the surrounding context. For example, how your content looks on a desktop is different from the way it looks on a mobile device.
Think strategically about the purpose and value of every link; more doesn’t mean better. Consider “every link as an invitation to leave the page,” Mike Shebanek, Sr. Director of Accessibility, Yahoo.
Follow a Few More Best Practices for Web Content
Always:
- Define acronyms
- Use plain language for clarity
- Break up large blocks of text with headings, lists, and white space (it’s acceptable for a sentence to stand on its own) to make content easy to scan and navigate
Avoid:
- All caps. In addition to being perceived as shouting on the web, all caps makes it difficult to distinguish the shapes of letters and thus more difficult to read
- Jargon
- Blobs of text or content just for the sake of having content. Say what you need to say and end it there
For People Who Think They are Too Busy or Consider Accessibility “More Work”
Consider how long it will take you to do the simple things discussed here versus how long and frustrating it is for your users to negotiate unstructured copy and guess as what you mean.
By not taking the time to keep your users in mind, you are placing the onus on them to do the work of figuring out your key messages, backtracking when links don’t take them where they want to go, trying to read blurred text on a picture of a poster advertising an event, etc.
Still not convinced? These days you cannot predict where your content will end up. People still design and write for the desktop, but users may read your content on mobile devices, listen to your content using voice controlled home speakers, or read your content with assistive technologies. To ensure your words behave as intended across all technologies, adhere to the best practices explained in this article.
A final point, you and everyone you know benefits from these best practices. All of us experience situational disabilities that impede the ability to read, understand, and interact with a website.
Examples of situational disabilities include the challenge of reading a screen in bright light; scanning an article on a crowded, noisy train; trying to figure out how to book an airline ticket on a site that bombards you with pop-up ads; or watching a funny video with closed captions at the office — and there are many other examples. Note that closed captions were originally created for the deaf and hard of hearing, yet we all use them.
In closing, consider all of the ways and all of the devices you use to access content, and what makes the content easy or difficult to consume.
Remember, your website is not about you; it’s about your users.
Definitions
Accessibility
Everyone can read, understand, navigate, and interact with your content, regardless of ability
Assistive Technologies
Equipment, devices and software that help people access and interact with the web, including screen readers, screen magnifiers, and switches
Content
Everything on or attached to a website, including text, documents, images, videos, podcasts, PDFs, etc.
Search engine optimization (SEO)
Search engines, such as Google, can find, index, rank and connect users with your content
Free Developer Resources
Join over 3,700 subscribers on my weekly web accessibility email and get free developer resources like WCAG Checklists and special offers.
Over 600 developers like you have learned more about the Web Content Accessibility Guidelines with my guidebook.