Ten best practices for writing accessible web content in Uberflip
Writing for accessibility goes beyond making everything on the page available as text.
Also pivotal are the way you organize content and guide readers through a page or experience.
This post provides some important considerations to help you write web content that is more accessible to people with disabilities. This audience includes readers who may interact with your content in different ways, including via a screen reader, keyboard navigation, or a Braille interface. Following these tips will also help you meet Web Content Accessibility Guidelines (WCAG) requirements.
When you write content, ask yourself these questions:
- Could someone quickly scan the page and understand what is being presented?
- If someone is unable to view images, video, or colors on the page, is the message still clear?
- Does the content work well on mobile devices?
Best practices for writing accessible web content in Uberflip
Use headers
Headers help to organize information on the page and make the text easily scannable. Make the page title H1, subtitles or subheadings H2, and subsequent sections within those H3.
Follow a hierarchy
Put the most important information first. This is especially important for a webpage, campaign destination, or landing page. Group similar information together and use bulleted lists rather than paragraphs for easy scannability.
Use plain language
Don’t say “physician” when “doctor” will do. Use familiar words and keep sentences short. Avoid jargon and if you need to use an acronym like MAP, spell it out on first reference: “Marketing Automation Platform (MAP)”.
Avoid directional language
Try your best not to use language that requires readers to be able to see the layout or design of the page. Don’t assume users can see what you mean, and also don’t count on the design being consistent across devices.
Good: “Select from the following options.”
Bad: “Choose one of the options in the right panel.”
Use descriptive language for links
Links should tell the reader what to expect next. Using descriptive language will provide information on either the associated action or destination.
Good: “Download the report” or “View the video”
Bad: “Click here” or “Learn more”
Use alt text
Applying an alt tag to an image allows those who can’t see the image to come away with the same information as if they could. All images should have alt tags. The language you use for the alt text will depend on the image’s purpose. For example, in most cases, describing what the image depicts is enough. However, if the image is a chart or table, you’ll want to include the exact same data that is in the table.
Label forms and fields
Ensure it’s clear what any forms you include are for and use appropriate tags. Be thoughtful about what fields are necessary to include on the form, keeping in mind that shorter forms are ultimately better. Always label required or mandatory fields clearly.
Provide captions for video content
Captions or transcripts should be available for all videos. This is good practice not simply for accessibility but because playing videos aloud is not always possible (in offices, for example). In addition, the information in videos should also be available in other formats.
Provide transcripts for audio content
Transcripts of audio recordings should be available for all audio content (e.g., podcasts).
Consider visual elements
Visual elements should aid, not hinder, understanding and readability. Always aim for high contrast between font and background colors. Be mindful of using images with text because images may not load or be seen by all users.
Following these best practices will help you ensure your web content is accessible to all users. For more information, have a look at this quick reference guide to the WCAG.