Skip to Main Content

Accessibility: Content

Headings are used to denote sections

Screen readers navigate through a webpage via the page headers.  The headers allow a screen reader user to "scan" a page as a sighted user would.  For this reason, use headers appropriately throughout the webpage.  Proper header use is the same as an APA document.
Do not use headers to change the look of a standard font. This is not appropriate use of a header.
Don't jump heading levels, for instance going from H2 to an H4 font without an H3 font.

Heading 1 (H1): Webpage Title

Heading 2 (H2): Box Title 

Heading 3 (H3): Box Section

Heading 4 (H4): Box Sub-section


Do not use bold text to denote section breaks; use the appropriate H3 or H4 heading

In, do not change the font color or other settings for the headings. The system settings control the look of the header.



Additional heading examples

Use rich text numbered list for numbered sequence

If any sequence has more than one step, number it.
In order for screen readers to identify a numbered list, you must use the rich text numbered list for any numbered list.  Do not fake a numbered list by typing the numbers 1, 2, 3, or Step One, Step Two, etc.


When you interrupt a numbered list with text or images, most rich text editors will restart the next item with number one. To fix this in LibGuides, right-click on the list to see the numbered list properties. You can adjust the start number here.


Use rich text bullets for a list with two or more items

Any list of two or more items must use bullets.

For screen readers to identify a bulleted list, you must use the rich text bullet list for any bullets. Do not "fake" a bulleted list with dashes, hyphens, asterisks, or any other character.


Bullet list examples

Color may not be the only way to emphasize text

For those who cannot perceive differences in color, color may not be the only way to emphasize text.  In addition to color, use bold or italics to emphasize text.

Note: Underlined text is reserved for identifying links. Do not underline text to emphasize it.

For example

Bad: Draco Malfoy

Bad: Dolores Umbridge

Good: Hermione Granger

Good: Dobby

Text has sufficient color contrast to background

Text must have a contrast ratio of at least 7:1 from the background color.  This includes text on images and the contrast between text and highlight colors.

Use a color contrast checker such as the WebAIM Color Contrast Checker to determine sufficient contrast.  The contrast must meet AAA standards for its size (normal or large).


Color Contrast Examples

Content is readable at 200% magnification

The layout and structure of the page must be intuitive at 200% magnification.  In Springshare products, this level of magnification moves the page to the mobile layout.  

Content must be readable at 200% magnification, including text on images.

Default font and link settings are not changed

The system code controls the font. Do not use the font drop-down to change the font type and do not manually change the look of links, including adding underlines or changing the text color.

If you copy text from another source, you may copy over font formatting along with the text.  Whenever you copy/paste from another source, use the "Remove Format" tool to remove all copied formatting. 


Note: The font style, along with the rest of the system look, does not apply to the guide creation/edit pages and backend. 

No underlined text except for links

Underlined text is reserved for links.  To avoid confusion, no text may be underlined except links and as required by APA citation rules.

Do not manually change the look of links, including adding underlines or changing the text color.  The link look is controlled at the system level.