Use <header>, <footer> as often as your content requires – only the main header and footer carry implicit banner and contentinfo roles. At a minimum, use them once (assuming you have a page header and footer, that is).
Always use <nav> for the primary navigation.
Use <main>, but only once per page.
Group items tagged
Bruce Lawson's personal site : Should you use HTML5 header and footer? - 0 views
WebAIM: Keyboard Accessibility - Tabindex - 0 views
-
tabindex="0" and tabindex="-1" have special meaning and provide distinct functionality in HTML. A value of 0 indicates that the element should be placed in the default navigation order. This allows elements that are not natively focusable (such as <div>, <span>, and <p>) to receive keyboard focus. Of course one should generally use links and form controls for all interactive elements, but this does allow other elements to be focusable and trigger interaction.
-
A value of 0 indicates that the element should be placed in the default navigation order. This allows elements that are not natively focusable (such as <div>, <span>, and <p>) to receive keyboard focus.
-
A tabindex="-1" value removes the element from the default navigation flow (i.e., a user cannot tab to it), but it allows it to receive programmatic focus, meaning focus can be set to it from a link or with scripting. This can be very useful for elements that should not be tabbed to, but that may need to have focus set to them. A good example is a modal dialog window - when opened, focus should be set to the dialog so a screen reader will begin reading and the keyboard will begin navigating within the dialog. Because the dialog (probably just a <div> element) is not focusable by default, assigning it tabindex="-1" allows focus to be set to it with scripting when it is presented.
- ...1 more annotation...
Guidelines for Visualizing Links - 0 views
-
Don't underline any text that's not a link
-
The color for unvisited links should be more vivid, bright, and saturated than the color for visited links, which should look "used" (dull and washed out).
-
The two colors should be variants or shades of the same color, so that they're clearly related.
- ...1 more annotation...
WebAIM: Color Contrast Checker - 0 views
-
WAVE can analyze contrast ratios for all page elements at once.
-
Colorzilla is an excellent tool for extracting the color value from any page element.
-
You can append ?fcolor=0000ff&bcolor=ff0000 (where the fcolor value is the foreground color and the bcolor value is the background color) to the URL of this page to analyze colors directly from a link or URL (link example).
1 - 5 of 5
Showing 20▼ items per page