2.4: Navigable
Guideline 2.4: Provide ways to help users navigate, find content and determine where they are.
This guideline ensures that a page is easy to navigate. Not in it's physical sense, but by making sure that information is presented in a manner that it makes perfect sense, and that multiple ways are available to find information and content. This allows users to effectively find what they are looking for.
2.4.1: Bypass Blocks (Level A)
A mechanism is available to bypass blocks of content that are repeated on multiple Web pages. (Level A)
When certain page elements are repeated on more than one page, such as a navigation menu, it becomes time consuming for people with many disabilities to skip this part when they do not want to specifically use it. While people may want to read the main content on a site every time a new page opens, people will probably read the site slogan only once, or will use the navigation menu less often.
To make it easier to find the main content, provide a way for users to directly skip to it. It is usually done by a skip link, which is a link that points to a bookmark on the same page, which is placed just above the main content. It is a frequent error that this skip navigation link is hidden, due to the assumption that it is only used by blind people, who can read hidden text with a screen reader. The skip links can actually be very useful for people with low vision, or for those who are not able to use the mouse in general, so that they do not have to tab through the navigation every time a new page opens.
2.4.2: Page Titled (Level A)
Web pages have titles that describe topic or purpose. (Level A)
Page titles should be unique and descriptive. Just by reading the title itself, the user should receive indication of what does the page contain exactly. It is allowed to use phrases in several titles, such as the company's name.
2.4.3: Focus Order (Level A)
If a Web page can be navigated sequentially and the navigation sequences affect meaning or operation, focusable components receive focus in an order that preserves meaning and operability. (Level A)
In most cases, the order in which page elements receive focus does not make a practical difference. However, it always makes sense to allow the user to navigate through the page following a logical sequence.
There are certain situations, where the order of page elements is important. For example, when based on the selected country, the list of states is populated. In this instance, always allow the user to navigate to the country list first.
An easy way to ensure that all elements receive focus in the proper order is to tab through a page. All functional items on the page should be a tab stop. This means that just by using the tab and shift-tab keys, the user is able to navigate to any element that requires interaction.
2.4.4: Link Purpose (In Context) (Level A)
The purpose of each link can be determined from the link text alone, or from the link text together with its programmatically determined link context, except where the purpose of the link would be ambiguous to users in general. (Level A)
The function of all links should be easily identified. In an ideal situation, this information should be contained in the link text. For example, "click here" is not sufficient to identify a link. Instead, the content which describes what to click for should be the link text.
Just by reading the link texts on a page the user should have an idea of the functionality of the page.
This is, however, not always possible. If for any reason, not all necessary text can be identified in the link text, relevant information should be easily available, for example in the same sentence, or in the nearest heading above the link. Also, when using a table, which contains a calendar for example, the table headers are sufficient identifications of the links.
There are cases when textual information cannot be attached to a link, for example when using a map with active regions. In such an instance, assign descriptive text to a link programmatically. This is usually done by using an alt tag.
Also, make sure that link texts are consistent. When linking to the same page from two different locations, the link text or programmatic description should be identical. For example, when linking to a calendar, it is not acceptable to use the word "calendar" at one location, and "schedule" at another.
2.4.5: Multiple Ways (Level AA)
More than one way is available to locate a Web page within a set of Web pages except where the Web Page is the result of, or a step in, a process. (Level AA)
Provide more than one way to find a web page. This could be done using any number of methods.
The most common ones are:
- Using a menu system
- Using search
- Using a site map
The only exception is when a page is the result of a functionality, which can only be performed in one way. For example when a web page is generated based on the information the user provides in a form. Obviously, this page cannot be presented to the user without collecting the form data.
2.4.6: Headings and Labels (Level AA)
Headings and labels describe topic or purpose. (Level AA)
When you label page elements, such as forms, or use headings, these should clearly identify the purpose of the element they describe. This also applies to the use of table headers.
A label itself should be sufficient to understand the purpose of an edit field it describes. It does not mean that all information should be included in the label text, as sometimes an entire documentation is needed to determine how to fill in a field. However, assuming that the user has the necessary knowledge, it should be obvious what type of information should be entered in a field.
In case of headings, please make sure that they do not just serve a formatting purpose. Rather, the text contained in document headings clearly tells the user the purpose of the following section. Do not use headings which are repeated on all pages. Rather, headings should provide page specific information.
2.4.7: Focus Visible (Level AA)
Any keyboard operable user interface has a mode of operation where the keyboard focus indicator is visible. (Level AA)
You should always visually indicate where the next action will take place. This way users will know which is the current field that they are entering information into, or the current link that they can activate. In most cases, just by using standard HTML, this is not a problem. However, when you use custom controls or plug-ins, make sure that you check if a visual focus is present as a response to a keyboard action.
2.4.8: Location (Level AAA)
Information about the user's location within a set of Web pages is available. (Level AAA)
As a user navigates through a web site, it is important to indicate which page is viewed in relation to the entire site. It can be part of the page title, the first heading, or it can also be indicated by using bread crumbs. Any way that can be found easily and properly indicates the current position is sufficient.
2.4.9: Link Purpose (Link Only) (Level AAA)
A mechanism is available to allow the purpose of each link to be identified from link text alone, except where the purpose of the link would be ambiguous to users in general. (Level AAA)
This success criterion is very similar to 2.4.4, the only restriction is that a link should be identified by the actual link text or otherwise programmatically. In order to achieve Level AAA conformance, do not use the text surrounding the actual link to identify the links functionality.
2.4.10: Section Headings (Level AAA)
2.4.10: Section headings are used to organize the content. (Level AAA)
This is very similar to 2.4.6. But the requirement is that in order to achieve Level AAA conformance, regardless of the page content, headings must be used to divide content blocks. Also, these headings should be descriptive of what a given content block contains.
Also, use a correct hierarchy of headings. For example, heading 1 cannot be followed by heading 3, there should always be a heading 2 before a heading 3.
Bookmark/Search this post with:
Post new comment