Skip to Main Content

Instructional

1. Text alternative to images

1.1.1 Description: If an image has words in it that are important to understanding the content, then the PDF must have text alternative to describe the image. It does not need to describe the visuals but the text must convey …

1. Small tag used to alter text size

1.1.1 Description: Do not use the ‘small’ tag to alter text size. If the page is written in HTML5, this issue can be ignored. Context: HTML tags should denote semantic meaning instead of just styling. In HTML5 it is acceptable to …

2. Using bookmarks

2.4.5 Description: Users must be able to locate content using bookmarks. An overview of the document helps persons with disabilities navigate the document without traversing through all the pages. How to fix: Convert a table of contents and creating bookmarks …

2. Aria-labelledby has incorrect (ID) reference

1.1.1, 1.3.1, 2.4.4, 3.3.2, 4.1.2 Description: The WAI-ARIA ‘aria-labelledby’ attribute has a reference to an ID that does not exist or an ID that is not unique. Context: All ARIA tags must reference elements that exist on the page, an ID should …

3. Correct tab and reading order

1.3.2, 2.1.1, 2.1.3, 2.4.3 Description: Users must be able to navigate through content in a logical order that is consistent with the meaning of the content with the tab key. For sighted users, the logical order of the content is …

3. Aria-describedby has incorrect (ID) reference

1.3.1, 2.4.4 Description: The WAI-ARIA ‘aria-describedby’ attribute has a reference to an ID that does not exist or an ID that is not unique. Context: All ARIA tags must reference elements that exist on the page, an ID should only be used once …

4. Indicate required form controls

3.3.1, 3.3.2, 3.3.3 Description: Notify the user when a required field must be completed has not been completed in the PDF form. An alert dialog must describe the error if a required field is not completed. How to fix: Creating …

4. s or “strike” tags used to format text

1.3.1 Description: Do not use the ‘s’ or ‘strike’ tags. Context: In HTML5 the ‘del’ tag has been semantically designated for text that should be removed instead of ‘s’ or ‘strike’. The ‘ins’ tag is used to indicate recently inserted, or …

5. Table Elements

1.3.1 Description: Tables must be recognized by assistive technology. When a user tabs through the data in the table, the information must preserve relationship between the row and the column headers. How to fix: Correctly tag tables in Microsoft Word …

5. Big tag used to alter text size

1.3.1 Description: Do not use the ‘big’ tag to alter text size. Context: In HTML 5 the ‘big’ tag has been deprecated, the CSS property ‘font-size’ should be used to handle any text size adjustments that are not related to …

6. Label interactive form controls

1.3.1, 3.3.2, 4.1.2 Description: Users of assistive technology must be able to understand form control labels and how they are used. Assistive technology must be able to recognize and understand form fields, make selections, and provide input to complete the …

6. Bold tag used to format text

1.3.1 Description: The ‘bold’ tag is used to highlight text. Context: Screen-readers and other assistive technology cannot understand the context of a bold tag (as bolded text can play numerous roles). Using semantic elements such as “header” or “strong” tags …

7. Submit button with submit-form action

3.2.2 Description: Forms must have a submit button that submits the data entered in the form. How to fix: Adding a submit button using Adobe Acrobat Pro Techniques: G80, PDF12, PDF23

7. Center tag used to format content

1.3.1 Description: The HTML center tag has been used to center content. HTML should not be used for presentational purposes, but only for semantics to allow for different presentations of the content. Context: Styling-specific tags are discouraged for ADA-compliance, adjustments to appearance …

8. Interactive form controls

2.1.1, 2.1.3 Description: Interactive form controls such as text input fields, check boxes, radio buttons, combo boxes, list boxes, and buttons can be used by keyboard operation. If a user is tabbed over an interactive form control, they must be …

8. Font tag used to format text

1.3.1 Description: Do not use the ‘font’ tag to create changes in typography. Context: Styling-specific tags are discouraged for ADA-compliance, adjustments to appearance strictly for aesthetics should be restricted to CSS. <font color=”#000000″ size=”2″ face=”Arial”> Deans of the <br> Colleges of Arts …

9. Access key is not unique

1.3.1 Description: The same access key is used for several items on the page. Context: Any properties used to assist in navigation (ID’s, access keys, tab orders, etc) must be unique for readers to navigate through the page properly. <a href=”https://kahualike.manoa.hawaii.edu/horizons” title=”Mānoa …

10. HTML is used to format content

1.3.1 Description: Presentational attributes such as ‘border’, ‘align’, or ‘bgcolor’ are used. CSS should be used for styling instead. Context: To prevent extraneous text from being read by screen readers, it is best practice to keep the HTML as uncluttered as possible, …

11. Local link destination does not exist

1.3.1 Description: A local link (anchor link) occurs but the destination does not exist. Context: All references need to be linked properly for a page to allow assistive technology to navigate properly between items. <a href=”#toplink” class=”backup tipsy-tooltip” title=”scroll up”> <span class=”fa …

12. Heading is missing text

1.3.1 Description: An empty heading occurs. Context: HTML without any content can clutter the HTML making it difficult for readers to scan through it properly. It should either be filled with content or removed entirely. <h3></h3> How to fix it: The tag for …

13. Element ID is not unique

1.3.1, 4.1.1 Description: The ID used for an element on the page is also used for another element on the page Context: Any properties used to assist in navigation (ID’s, access keys, tab orders, etc) must be unique for readers to navigate through …

14. Form control label is missing text

1.3.1, 4.1.2, 2.4.6 (AA) Description: The form element has a label but text has not been added (label is empty). Context: HTML without any content can clutter the HTML making it difficult for readers to scan through it properly. It should either be filled with …

15. Label is not connected to a form control

1.3.1 Description: The label for the form control is not explicitly connected to anything, since it refers to an element ID that does not exist on the page. Context: Label elements should be used to provide context to a form element, they …

16. Input field has no description

1.3.1, 3.3.2, 4.1.2 Description: Input fields should always have a description that is explicitly associated with the field to make sure that users of assistive technologies will also know what the field is for. Context: All inputs should have some form of description, such …

17. Form elements are not grouped

1.3.1, 3.3.2 Description: When a form contains elements that are logically connected to each other it is necessary to group them. Context: Screen readers require additional assistance to group related content together correctly, especially for inputs. <label> Announcement Interests </label> <label> <input type=”checkbox” …

18. u tag used to format text

1.3.1 Description: The u tag is used to underline text. Context: Styling-specific tags are discouraged for ADA-compliance, adjustments to appearance strictly for aesthetics should be restricted to CSS. <u> <b> <a href=”summer_housing”>Summer Housing</a> </b> </u> How to fix it: Consider the following: If …

19. Adjacent links used for same destination

1.1.1 Description: Adjacent links, one with a link text, the other with an iconic representation of that link, point to the same destination. Context: To prevent extraneous text from being read by screen readers, it is best practice to keep the HTML …

20. Alternative text for image is identical to link text

1.1.1 Description: The alternative text for an image link is a repetition of the adjacent link text. Context: To reduce redundancy, if the image alt text is not providing any “new” content for a screen-reader, the alt text is unnecessary. <a href=”http://manoa.hawaii.edu/library/research/collections/russia/”> …

21. Alternative text for the image is a file name

1.1.1 Description: The alternative text for an image must reflect the purpose of the image and not contain the image file name. (The problem often occurs with auto-generated alternative texts). The alternative text is used by a screen reader to read …

22. Are there options to control audio that auto-plays?

1.4.2 Description: Audio content starting automatically seems to occur. Context: It is best practices to not have any auto-playing audio content on your website, but if this is not possible, you must provide a way to stop it without adjusting audio outside …

23. Area element is missing alternative text

1.1.1, 2.4.4 Description: On the image map an ‘area’ element occurs with no alternative text. Context: Area tags generally do not have descriptive content within them, making it difficult for readers to understand them without additional information. <area shape=”circle” coords=”687,281,8″ target=”bottom” href=”plantbrochuretour.html#63″> How …

24. Color contrast is insufficient (AA)

1.4.3 Description: The color of the text and the color of the background are not in sufficient contrast to each other. Context: For compliance, all text must be displayed in a way that provides sufficient contrast against it’s background. Users with vision …

25. Does video/audio have an alternative?

1.2.1 Description: If the element is not video or audio this criterion can be disregarded. Context: For compliance, video or audio should not be the only way to obtain information. Alternatives should be available on the page, or at a minimum, information …

26. Element not highlighted on focus

2.4.7 Description: With keyboard navigation it is important that the focused component can be visually identified. If the focused component is not somehow highlighted, the user cannot be sure which component has focus. Context: While browsers should handle this by default, certain …

27. Field label is not visible

3.3.2 Description: The input field does not have a visible label indicating the purpose of the input field. Context: An input field should always have it’s label visible if it is visible. For fields where this isn’t desirable, an ARIA-label is preferred. …

28. Frame is missing a description

4.1.2 Description: The frame has no ‘title’ attribute or the ‘title’ attribute is empty. Context: Titles allow users using screen-readers to understand the content of a given iFrame/frame and elect to skip it if it is not relevant. Preventing them from needing …

29. iFrame is missing a description

4.1.2 Description: The iFrame has no ‘title’ attribute or the ‘title’ attribute is empty. Context: Titles allow users using screen-readers to understand the content of a given iFrame/frame and elect to skip it if it is not relevant. Preventing them from needing …

30. Image button has no description

1.1.1 Description: An image button (‘input’ element) is missing an alternative text. Context: When using different elements as buttons outside of the native ‘button’ element, the element should be clearly marked as button so users may interact with it properly. <input type=”image” …

31. Image link is missing alternative text

2.4.4 Description: The image link is missing an alternative text stating the purpose of the link. Context: All images should provide an alternative <a style=”color: rgb(12, 109, 72);” href=”https://uhmanoa.lib.hawaii.edu/vwebv/searchBasic?sk=manoa”> <img class=”img-responsive” src=”/library/wp-content/uploads/2017/07/canoe-1.png” alt=””> </a> How to fix it: If for instance it links …

32. Image with no alt attribute

1.1.1 Description: The image does not have an ‘alt’ attribute (alt=””). Context: All images are expected to at a minimum have an alt attribute, even if it is empty to allow screen-readers to decide how best to read out content regarding the …

33. Invalid WAI-ARIA role, state or property

4.1.2 Description: A WAI-ARIA element contains roles, states or properties that are not allowed on this type of element. Context: Invalid aria elements could cause the element to be read incorrectly by assistive technology. <span class=”tribe-icon-list” aria-hidden=”true” role=”none”></span> How to fix it: Check …

34. Is multimedia content captioned?

1.2.2 Description: If the element does not contain audio, this criteria can be disregarded. Context: Video content should be subtitled to aid users with hearing impairments. How to fix it: If the element is video or audio, provide an alternative, (unless it is …

35. Is the tabbing sequence logical?

2.4.3 Description: Ensure that the tabbing order defined on the page is logical. Context: Tabbing is very important to assist users who primarily navigate pages with their keyboard, making sure the tab order is set in a logical portion can assist them …

36. Language declaration is invalid

3.1.2 Description: The value for the language attribute is not set to a valid language code. Valid language codes must be used to programmatically determine the human language of pages and parts of content. Context: The language attribute has a strict set …

37. Link identified only by color

1.4.1 Description:It appears that color is the only distinguishing feature about links in blocks of text. If links in blocks of text are identified only by color, the color contrast ratio between the link text and the surrounding text needs …

38. Link text is too generic in its current context

2.4.4 Description: The link text is generic text that does not identify the link purpose. The link does not seem to have any programmatically determined link context that can aid in identifying the purpose either. Context: Information about the link can be …

39. Missing button in form

3.2.2 Description: The page contains a form but there is no submit button. Context: Any form should contain a way to submit directly within the form. If this is not the case, the best approach is most likely to re-organize the content …

40. Missing required WAI-ARIA states or properties

4.1.2 Description: The WAI-ARIA element does not follow the specification in regards to which states and properties should be present for this type of element. Context: ARIA elements have strict guidelines for what states and properties can be used for each element. …

41. No headings on page

1.3.1 Description: No headings on page Context: Heading tags are crucial to allowing content to be divided and scanned intelligently by assistive devices, such as finding titles or important subsections. <p align=”left”> <font face=”Arial” size=”3″> <b> About the Colleges of Arts &amp; …

42. No option to skip repeated content

2.4.1 Description: A means of bypassing blocks of content that are repeated on multiple web pages must be provided. Context: Manually maneuvering through content takes significantly longer on assistive devices, by providing a way to skip directly to relevant content browsing becomes …

43. Page element has no description

1.1.1, 1.2.3 Description: An element of the type ‘object’ is present but the element does not have an alternative text. Provide a description of the content, within the ‘object’-tags. Context: All elements should have a clear indication of what they are. Usually semantic …

44. Provide enough time

2.2.1 Description: This warning will always appear on your pages since your assessment is needed. Context: Assistive technology inherently will take longer to navigate a page, therefore time limits on any content are not best practice. If time limits must be in …