Themekraft / _tk

Themekraft Starter Theme
GNU General Public License v3.0
430 stars 158 forks source link

Accessibility Review #40

Open svenl77 opened 9 years ago

svenl77 commented 9 years ago

https://themes.trac.wordpress.org/ticket/21629#comment:25

1) Headings: Headings should be clearly hierarchical, so that no level of heading is skipped. In this case, the widget headings are H3 with no parent-level heading, and the post headings are at the same hierarchy level as the site title. I'd recommend moving post titles down to H2 and move widget titles up to H2 as the simplest change; but the important thing is that the hierarchy is clear. I suggest using the Firefox Add-on "HeadingsMap" to view the headings hierarchy of your page. Use the standard headings mode in the add-on, not the experimental HTML5 mode. 2) ARIA Landmark Roles: Fails. All areas of the page need to be wrapped in ARIA landmark roles if any roles are used. Add: navigation role to main menu. Add: main role to main content area Add: complementary role to sidebar 3) Link Text: the "Continue Reading" link needs to include the text of the post title. It can be hidden using a screen-reader-text class, but must be available for screen readers to use. 4) Controls: All forms should have submit buttons; these don't need to be visible, but must be available for screen reader users to activate. You're using display: none to hide the search form submit button; you should use a screen-reader-text class to hide this. 5) Keyboard Navigation: Good to go. Visible focus appears to be effective in all cases. 6) Color Contrast: Almost all good - the link color in comment author meta boxes gives a contrast ratio of 4.18:1, which is only valid for large text. Large text is defined as anything 18pt equivalent or larger or 14pt bold or larger; the text in question is 14px, but not bold. You can either darken the text slightly, lighten the background, or change the font size. 7) Skip links: There is no skip link. You must have a skip link at the very beginning of the body that grants a user quick access via keyboard to the main content of the page. The skip link must become visible when it receives keyboard focus. 8) Forms: All forms must have explicit labels. Your comment textarea does not have a label, and the widget search element has a label but no labeling text, which is the same as having no label. 9) Images: No image or icon fonts found; looks fine. Featured images include alt attributes. 10) Media. Not present by default. 11) Not allowed: You may not open links in new windows without warning the user. Your credit link must either not use target="_blank" or it must notify the user that it will open in a new window.