WCAG HTML Technique |
Notes |
H2: Combining adjacent image and text links for the same resource |
|
H4: Creating a logical tab order through links, form controls, and objects |
|
H24: Providing text alternatives for the area elements of image maps |
|
H25: Providing a title using the title element |
|
H27: Providing text and non-text alternatives for object |
|
H28: Providing definitions for abbreviations by using the abbr and acronym elements |
Acronym deprecated in HTML5, leave ABBR as only example |
H30: Providing link text that describes the purpose of a link for anchor elements |
|
H32: Providing submit buttons |
|
H33: Supplementing link text with the title attribute |
This does not work because the title and the link text compete for the ACCNAME in the accessibility API. Screen readers can't get it. This has caused a lot of confusion over the years. Should probably drop. |
H34: Using a Unicode right-to-left mark (RLM) or left-to-right mark (LRM) to mix text direction inline |
|
H35: Providing text alternatives on applet elements |
Applet deprecated in HTML 5 |
H36: Using alt attributes on images used as submit buttons |
|
H37: Using alt attributes on img elements |
|
H39: Using caption elements to associate data table captions with data tables |
|
H40: Using definition lists |
|
H42: Using h1-h6 to identify headings |
|
H43: Using id and headers attributes to associate data cells with header cells in data tables |
We should revisit our requirements for this. Screen readers such as NVDA and JAWS now read correctly several layers of merged cell <th> tags |
H44: Using label elements to associate text labels with form controls |
|
H45: Using longdesc |
|
H46: Using noembed with embed |
Embed was not part of html 4 but is part of html5 |
H48: Using ol, ul and dl for lists or groups of links |
|
H49: Using semantic markup to mark emphasized or special text |
Screen readers make no distinction between <b> and <strong> or <i> and <em>. <b> and <i> are back in HTML5.
It was a theorectical concept that never helped in AT. Maybe it will in the future but I doubt it. Perhaps drop it... |
H51: Using table markup to present tabular information |
|
H53: Using the body of the object element |
|
H54: Using the dfn element to identify the defining instance of a word |
|
H56: Using the dir attribute on an inline element to resolve problems with nested directional runs |
|
H57: Using language attributes on the html element |
|
H58: Using language attributes to identify changes in the human language |
|
H59: Using the link element and navigation tools |
|
H60: Using the link element to link to a glossary |
|
H62: Using the ruby element |
|
H63: Using the scope attribute to associate header cells and data cells in data tables |
The scope attribute is more important than many previously estimated...Without it Screen readers get mixed up in the the top row of a simple table that has column headers. They read all the <th> elements to the left of a <th> as headers for the cell that has focus |
H64: Using the title attribute of the frame and iframe elements |
|
H65: Using the title attribute to identify form controls when the label element cannot be used |
|
H67: Using null alt text and no title attribute on img elements for images that AT should ignore |
Add that there should also be no wai aria attributes (aria-label, labelledby, describedby) |
H69: Providing heading elements at the beginning of each section of content |
|
H70: Using frame elements to group blocks of repeated material |
No indication anyone ever did this. It is an artifact from WCAG 1, frames are dropped from HTML5, and no indication it is actually useful. I think we should drop this. |
H71: Providing a description for groups of form controls using fieldset and legend elements |
|
H73: Using the summary attribute of the table element to give an overview of data tables |
Summary dropped from HTML5, not coming back. aria describedby on the table element is taking over. Works in NVDA, but not in JAWs yet. describedby can also refer to a paragraph in the details element so hide describtion visually, but discoverable on expand. |
H74: Ensuring that opening and closing tags are used according to specification |
|
H75: Ensuring that Web pages are well-formed |
|
H76: Using meta refresh to create an instant client-side redirect |
|
H77: Identifying the purpose of a link using link text combined with its enclosing list item |
|
H78: Identifying the purpose of a link using link text combined with its enclosing paragraph |
I think we should drop this in favour of giving context in aria-label ARIA8. In 8 years have never seen it screen reader user get link context this way. We should also write an aria-describedby solution referring to the suplementary text. |
H79: Identifying the purpose of a link using link text combined with its enclosing table cell and associated table headings |
|
H80: Identifying the purpose of a link using link text combined with the preceding heading element |
I think we should drop this in favour of giving context in aria-label ARIA8. In 8 years have never seen it screen reader user get link context this way. We should also write an aria-describedby solution referring to the suplementary text. |
H81: Identifying the purpose of a link in a nested list using link text combined with the parent list item under which the list is nested |
I think we should drop this in favour of giving context in aria-label ARIA8. In 8 years have never seen it screen reader user get link context this way. We should also write an aria-describedby solution referring to the suplementary text. |
H83: Using the target attribute to open a new window on user request and indicating this in link text |
|
H84: Using a button with a select element to perform an action |
|
H85: Using OPTGROUP to group OPTION elements inside a SELECT |
|
H86: Providing text alternatives for ASCII art, emoticons, and leetspeak |
|
H87: Not interfering with the user agent's reflow of text as the viewing window is narrowed |
|
H88: Using HTML according to spec |
|
H89: Using the title attribute to provide context-sensitive help |
|
H90: Indicating required form controls using label or legend |
|
H91: Using HTML form controls and links |
|
H92: Including a text cue for colored form control labels |
|
H93: Ensuring that id attributes are unique on a Web page |
|
H94: Ensuring that elements do not contain duplicate attributes |
|