Apply Best Practices

Articles in this Section

• Color
• Writing
• Layout
• Typography
• Hyperlinks
• Visuals
• Tables

Writing

• Organize the document based on the task the user needs to perform or the steps the user needs to complete. (See more technical communication best practices.)
• Use plain language that is highly readable and easy to understand.
• Use active voice and avoiding passive voice where possible.
• Write bullet points and headings in parallel structure.
• Reference the section or page instead of directional language like “at bottom right” or “below.” (See more about directional language.)
• Limit headings to levels H1 – H4.  (H5 and H6 are seldom used. Consider editing your content instead.)
• Use inclusive language.
• Avoid directional language.

Typography

• Use real lists (bullets and numbers). 
  • Don’t use decorative characters to simulate real lists. Stick with standard bullet characters if you don’t want to remediate them in PDF.
  • Review this article to hear how bullet characters sound to screen reader users.
  • Follow these tricks for InDesign if you need to use “creative” bullets.
  • Make sure you are formatting lists properly using the software’s built-in list tool, not typing dots or other characters to make them look like lists.
  • Lists must have two or more items.  It is not a list if there is only one item. 
  • Always use parallel structure for lists.  
• Follow these typographical “rules”:
  • Use real headings. Do not use direct formatting (manual edits) to change the appearance of text to make it look like a heading. 
  • Make logical page breaks to keep related information together.  Don’t allow related information to get split across two pages.  Insert a page break at a logical point between paragraphs or headings instead.
  • Avoid orphans, widows, and runts. These are typographical terms for paragraphs, words, and snippets of text hanging at the bottom or top of pages – these are to be avoided because they waste space, break concepts apart and make the narrative harder to follow.
  • Use left-aligned text.
  • Do not hyphenate.
  • Ensure sufficient leading (line spacing) is used throughout for readability.
  • Use space before or space after, not hard or soft returns. Returns signal the end of the paragraph.
  • Don’t use excessive spaces made with the spacebar to move text onto another line.
  • Use page breaks, not repeatedly hitting the enter key.
  • Arrange text with tab stops and columns, not tables.
• Follow best practices for fonts.
  • Do not use fonts smaller than 10 pts. (10 pts is the minimum.)
  • Choose readable fonts such as Open Dyslexic or Atkinson Hyperlegible.
  • Favor UTA brand fonts
  • Use san serif fonts such as Frutiger or Arial for reading on screens.
  • Use serif fonts such as Georgia or Times for reading in print.
  • Use all caps sparingly.
  • Avoid small caps.
  • Use only 2-3 fonts per project.
  • Add emphasis to text with strong (not bold) and emphasis (not italics). 

Visuals

Visuals are images, charts, graphs, data visualizations, videos, GIFs, graphics, et cetera.

• Be mindful of blinking elements.
  • Blinking or flashing elements can create barriers for users with disability and may cause seizures.
  • Do not add video or GIFs that flash or blink more than three times in a second.
  • Ensure that the flashing element doesn’t occupy more than 3% of the screen space.
• Follow best practices for alt-tagging visuals that convey meaning.
  • Alternative text, alt-text, and alt-tag all refer to the same thing. An alt-tag is a brief description to announce the image and is available only to screen reader users.
  • Visuals that convey meaning need alt-text to describe the visual’s purpose in relation to the text. Alt-texts should be brief and avoid excessive punctuation.  See this article to learn how to write alt-texts. 
  • Avoid the option in MS Word to “Generate a description for me” because it is rarely useful or accurate.
  • Separate letters in acronyms with spaces in alt-tags and document titles: U T A. Otherwise, the screen reader cannot correctly interpret it and voices it as word like “Yuta.”
  • Alt-tag the first instance of a logo but mark subsequent instances as artifacts to avoid repetition.
• Follow best practices for artifacting visuals that do NOT convey meaning.
  • Visuals that do not convey meaning and are simply decorative (such as solid background blocks, leader dots, lines or borders) should be “marked as decorative.” 
  • This is also known as “artifacting,” and allows the screen reader to skip the visual, rather than voice irrelevant information. Mark decorative elements like borders, lines, other items as “decorative” or “artifact”.
• Use best practices for figure captions.
  • Include a figure caption on all visuals to explain the details presented in the figure and key takeaways.
  • The figure caption is available to all users, whereas the alt-text is voiced only to screen reader users.
  • Figure captions should not repeat the alt-text.  They should provide more detail for all users.
  • Figure captions support more detail than alt-text and can be a paragraph or two long. 
  • Figure captions are not required on images that are purely decorative.
  • See Poet Image Description for tips on how to describe images.
• Use best practices for visuals.
  • Prepare visuals using best practices for accessible colors.
  • Provide a legend explaining any color-coding used in the data visualization. Don’t use color as a single identifier.
  • Group Smart Art and provide alt-tags and figure captions. Don’t leave Smart Art as ungrouped (separate) elements.