Web Accessibility Checklist

All HTML markup follows the HTML5 specification, and as a minimum, does not contain the four errors forbidden by WCAG.
4.1.1 Parsing, W3C validator tool

The interface can be used in all screen orientations (Portrait and Landscape mode).
1.3.4 Orientation (AA)

The layout is responsive and adapts to the viewport size. Should at a minimum go to 320 x 568 size.
1.4.10 Reflow (AA)

No scrolling in more than one direction while browser zoom is at 400% (no both horizontal and vertical).
Exception: where it is required o-dimensional layout or when a toolbar is manipulating another part of the content.
1.4.10 Reflow (AA)

Ensure contents can be presented without loss of information or functionality when zooming to 200%.
1.4.10 Reflow (AA)

All pages have a descriptive title.
2.4.2 Page title (A)

The main language of every page is defined in the code.
3.1.1 Language of Page (A)

Content in a different language than the main language is identified in the code.
3.1.2 Language of Parts (AA)

Elements are placed in a logical order in the source code that matches the visual order of the content.
1.3.2 Meaningful sequence (A)

Text that acts and looks like heading, should be marked with h-element.
1.3.1 Info & Relationships (A)

Every page has to start with an h1 element and follow a hierarchical structure. No skipping levels.
1.3.1 Info & Relationships (A)

Content is divided with landmarks (e.g nav, header, main, footer etc.) ! search field need role attribute.
1.3.1 Info & Relationships (A)

List should be correctly marked as lists (ul, ol, dl).
1.3.1 Info & Relationships (A)

Paragraphs should be marked with p-element and quotes with q or blockqoute.
1.3.1 Info & Relationships (A)

All meaningful images and graphical elements have a text alternative that gives equivalent information to a non-sighted user.
1.1.1 Non-text content (A)

All images or graphical elements that are decorative is marked as such.
Example: Decorative images are images that only serves a visual purpose and does not contribute to enhance the understanding of the content, or create a feeling associated with the text.
1.1.1 Non-text content (A)

Visible text on interactive element, should have the same description given to assistive technology.
Example: If there is a need for further description of an interactive object with visible label, the additional description must start with the same visible text.
2.5.3 Label in name (A)

Text can be resized up to 200% without loss of content or functionality.
1.4.4 Resize text (AA)

The interface does not break when changing text spacing settings (e.g text overlapping, functionality not reachable).
1.4.12 Text spacing (AA), Bookmarklet Text Spacing

All tables are created using appropriate HTML table markup (e.g table, th, td or correspon- ding WAI-ARIA roles).
1.3.1 Info & Relationships (A)

Row or column headings in tables are created with the th element and scope-attribute.
1.3.1 Info & Relationships (A)

Table captions are created with the caption element.
1.3.1 Info & Relationships (A)

Status messages is conveyed to screen reader (e. g success or results of an action, page loading etc.).
4.1.3 Status messages (AA)

Dynamic content is conveyed to screen reader (error-messages, the number of search results.
4.1.2 Name, role, value (A)

Different states, roles and values on interactive objects is conveyed to screen reader (e.g expanded, selected, checked etc.).
4.1.2 Name, role, value (A)

Audio or video should not play automatically. If, it can be turned off.
1.4.2 Audio control (A) Frames and iframes

Frames and iframes has a descriptive title.
1.3.1 Info & Relationships (A) Navigation

All interactive elements can be controlled by keyboard.
2.1.1 Keyboard (A)

Content displayed on hover can also be accessed by users navigating with a touch screen or keyboard.
1.4.13 Content on Hover or Focus (AA)

Content that is displayed on hover or keyboard focus can be dismissable, hoverable and it must be persistent. 1.4.13 Content on Hover or Focus
1.4.13 Content on Hover or Focus (AA)

The tab order is logical. Focus should not go in an unexpected order.
2.4.3 Focus order (A)

Keyboard users can tab through the page without unexpected changes or interruptions and without focus being moved unexpectedly.
3.2.1 On Focus (A)

Navigation behind modals is not possible. 1.3.2 Meaningful Sequence (A)
2.1.2 Keyboard trap (A)

Keyboard users can tab through the whole interface without getting trapped in an area.
2.1.2 Keyboard trap (A)

Keyboard shortcuts consisting of a single alphanumeric key, punctuation or symbol key are not used. Requires at least one other key.
2.1.4 Character Key Shortcuts (A)

The size of an clickable object has a minimum target size of 44 x 44 px, or 48 x 48 dp. For iOS, at least 48 x 48 dp.
2.5.5 Target Size (AAA)

Make sure that all links are properly descriptive.
Best practice: Best practice is that the link is self-descriptive. The user should be able to identify the purpose of the link without moving focus from the link.
2.4.4 Link Purpose (In Context) (A)

Provide a “skip to main content” link on the top of the page for keyboard users. This skip link should be hidden until the user reaches it by tabbing. Then it should appear visually.
2.4.1 Bypass Block (A)

All buttons have an accessible name.
Example: An icon without any visual text requires a textual description in the code, e. g hamburger meny icon reads out ”menu” for screen reader users.
4.1.2 Name, Role, Value (A), AXE

There are a meaningful reading order or sequence with appropriate visual hierarchy for interpreting with Screen readers.
1.3.2 Meaningful Sequence (A)

Form controls needs suitable markup (input type=”email” etc.)
1.3.1 Info & relationships (A)

Input field with recurring information about the user requires autocomplete.
1.3.5 Identify Input Purpose (AA)

Labels and instructions need to be linked to the input field.
1.3.1 Info & relationships (A)

Error messages need to be linked to the input field and conveyed to screen reader.
1.3.1 Info & relationships (A), 4.1.2 Name, role, value (A)

Radio-buttons and checkboxes should be wrapped around fieldset and legend.
1.3.1 Info & relationships (A)

Focus is not moved unexpectedly when the user changes the setting on an interface control.
3.2.2 On input (A)