Skip to main content



Iowa State utilizes Siteimprove for web accessibility and compliance

Alt Text  

  • Short for “alternative text”
  • Include alt text as a replacement for images that matter to understand context
  • Cannot be the file name of an image, should be descriptive of the image and not redundant of the caption
  • Remember, it’s a replacement for an image for a screen reader user, so be as consistent and accurate as possible when naming your images
  • A general rule of thumb is to not exceed 250 characters in your basic alt text
  • For complex images, like charts, graphs, infographics, and equations, you will need to provide additional information about the data/information being presented beyond the basic alt text. Some ways you can do this include: visible image descriptions, "screen reader only" descriptions (not visible), data tables, links/toggle to see more information, or even embedded inside of the image if using an SVG format 
    • The W3C website has further information for complex images


  • Use built-in headings, paragraph, and list styles for documents and web pages
  • Assistive technology (like screen readers and keyboard-only users) can navigate easier with headings
  • Using appropriate heading levels (1-6) will give your documents and web pages hierarchy and benefit all users


  • Color contrast is the difference in luminance between two colors, either in print or on screen
  • On the screen, it’s when the foreground is distinguishable from the background and vice versa
  • Small text should have a contrast ratio of at least 4.5:1 against its background, while large text (18pt and larger) should have a contrast ratio of at least 3:1 against its background
  • Do not rely on color alone to convey information to your users (e.g. click on the green button)
  • Icons or other critical visual elements need to meet the contrast ratio of 3:1, but decorative visual elements (including logos) are exempt from contrast ratios
  • Use an online color contract checker: 


  • Assistive technology devices (like screen readers) need to have the correct page/document language set to be able to understand the content of your digital assets
  • The language must be set for your digital asset, plus in sections where the language switches from the base language to a new one
  • For example, here is guidance on how to set the language in an Adobe PDF


  • Bullets and numbered lists help break up your content for readers, making them more user-friendly for a variety of people with disabilities, including: attention-deficit disorders, dyslexia, and cognitive issues, as they provide smaller pieces of digestible content with more white-space
  • Anything that looks like a list, should use list mark-up, not just styles. Adding this structure can help people using assistive technology devices (like screen readers) make sense of the digital asset


  • Buttons/Links need to be descriptive and meaningful
  • Buttons/Link text needs to make sense within the immediate context
  • If buttons or links take a user to a new location, that information needs to be conveyed—especially for people using assistive technology devices and people with cognitive disabilities
  • Make sure your digital asset does not include broken links. This can be an issue for Search Engine Optimization (SEO), accessibility, and general usability as it can frustrate/confuse your users.


  • Tables can be used for both layout and informational purposes—but when used for informational purposes, column/row headers need to be included to give the data context
  • Table summaries and captions are especially helpful for people using assistive technology devices and people with cognitive/learning disabilities

Overall Layout/Structure

  • Construct your navigation and page layout in a clear and consistent way, and have multiple ways of finding content (e.g. search, sitemap, table of contents)
  • Avoid using CSS or other stylistic markup to convey meaning. You should never “fake” an element that should be using HTML markup instead (e.g. using bold to indicate a heading)
  • When appropriate, use accessible HTML5 landmark elements, like <article>, <section>, <header>, <footer>, as those elements are more descriptive and helpful to assistive technology devices than plain <div> or <p> elements

Content Layout

  • For people with some reading or vision disabilities, long lines of text can also be a barrier. It is recommended the number of characters per line in any paragraph or section of text should not exceed 80 characters for alphanumeric languages, and should not exceed 40 characters for logograms (e.g. Chinese language characters)
  • People with certain reading or cognitive disabilities have problems reading text that is fully justified. The uneven spacing between words in fully justified text can cause “rivers of space” to form down the page, making content difficult to read
  • For people with cognitive and attention-deficit disorders, whitespace is helpful to retain reading focus. It is best practice to set the space between each sentence to 1.5 relative to the line-height of your type. Within paragraphs, the spacing should be at least 1.5 times larger than the line spacing to clearly define new sections of content


  • Write in plain-language and avoid jargons, idioms, and highly-technical words when simple words will do
  • Provide links or definitions to help explain complex words or phrases, when there are no simple replacements and be sure to write-out acronyms the first time you introduce it to the audience
  • Limit the length of each paragraph to roughly three sentences and target a reading grade level consistent with your audience. Ideally, for website accessibility you should aim around the 9th-grade level
  • Use images and diagrams to support text, whenever it makes sense to do so


  • Beyond color contrast considerations, use adequate base font size — 14pt at the minimum for onscreen 
  • Limit the use of font variations (ex. italic, bold, ALL CAPS) and do not use underlines for items that are not links
  • Limit the total number of typefaces in your digital assets and pick a font that is considered accessible from the start
  • There are some characteristics that can aid legibility. So when you are looking for your next font family, pay particular attention to the following things and you’ll be on your way to choosing an accessible font:
    • prominent ascenders (ex. the vertical line in d)
    • prominent descenders (ex. the down-pointing line in y)
    • a d/b or p/q combination which are not an exact mirror image of one another
    • uppercase I, lowercase l, and 1 must all have different characteristics from one another
    • avoiding fonts that have tight letter spacing and/or kerning

Related articles