Place important content higher on the page
Make sure to place important links and interactive elements higher up on your pages. This is good practice because most readers, regardless of their physical or mental ability, expect important content closer to the top of a page.
💡 Easy exercise — Identify important hyperlinks and content elements that you want the reader to see. Then, navigate through your content using the tab key and see how long it takes to reach them. Can you reach them easily, or did you have to press the tab key countless times?
Set the right language
Under Foleon Doc settings, you can set your Doc’s language. We highly recommend setting this as it translates certain default text and ensures screen reader software will correctly interpret the content of your Foleon Doc. We support a wide range of languages.
Use headings
Headings are critical to giving your content structure and hierarchy, which makes it easier for screen readers and search engines to interpret your Foleon Docs.
Follow these rules for your header structure:
- Use header 1 (h1) only once per page, for the main heading (e.g., at the top of a page)
- Use header 2 (h2) for main section headings (e.g., per block)
- Use header 3 (h3) for subheadings (e.g., per column)
Provide context for images
If an image is information bearing (like a chart, graph, or functional icon), it's important to provide alternative text (alt text). This text is read by screen readers, conveying the image's meaning to visually impaired readers. In the media library, select an image and add alt text in the Image alt field.
Improve link clarity
Use custom ARIA labels to further increase screen reader clarity for links and buttons. ARIA labels provide clear, descriptive information about where a button leads, which is especially important if you use minimal text in your links or if the element is an icon-only button. You can edit these labels in the "advanced settings" of the edit link panel.
