{"id":289,"date":"2019-06-04T15:46:23","date_gmt":"2019-06-04T19:46:23","guid":{"rendered":"https:\/\/pressbooks.library.ryerson.ca\/iwacc\/?post_type=chapter&#038;p=289"},"modified":"2019-07-30T21:40:56","modified_gmt":"2019-07-31T01:40:56","slug":"3-2-predictable-level-aa-and-aaa","status":"publish","type":"chapter","link":"https:\/\/pressbooks.library.torontomu.ca\/iwacc\/chapter\/3-2-predictable-level-aa-and-aaa\/","title":{"raw":"3.2 Predictable (Level AA and AAA)","rendered":"3.2 Predictable (Level AA and AAA)"},"content":{"raw":"<div style=\"margin: 1em 0;padding: 1em;border: 1px solid #ddd;border-left: 10px solid #ffcb05\">\r\n<h3><strong><a id=\"3.2.3\"><\/a>Success Criterion 3.2.3<\/strong> Consistent Navigation<\/h3>\r\nLevel AA\r\n\r\nNavigational mechanisms that are repeated on multiple\u00a0<a href=\"https:\/\/www.w3.org\/TR\/WCAG21\/#dfn-web-page-s\">web pages<\/a> within a <a href=\"https:\/\/www.w3.org\/TR\/WCAG21\/#dfn-set-of-web-pages\">set of web pages<\/a> occur in the <a href=\"https:\/\/www.w3.org\/TR\/WCAG21\/#dfn-same-relative-order\">same relative order<\/a> each time they are repeated, unless a change is initiated by the user.\r\n\r\n<\/div>\r\n<h4>Consistent Navigation Explained<\/h4>\r\nWhen designing a website, keep information that is repeated on every page in the same order.\r\n\r\nContent is easier to find when the location of repeated information is predictable. The phrase \u201csame order\u201d does <i>not<\/i> imply that expanding and contracting navigation menus must be avoided. By adding or removing links between existing navigation links, navigation within a subsection is enabled, and the relative order is maintained.\r\n\r\nConforming to <strong>SC 3.2.3<\/strong> helps users predict the location of the content they are looking for and find content more quickly when they encounter it again. Consistencies in site layout are especially helpful to individuals who rely on visual cues or their spatial memory. People with low vision who use screen magnification software consequently see only a small portion of the screen at one time. These users can take advantage of page boundaries and other cues to quickly locate repeated content.\r\n\r\nUsing templates to ensure consistency across a site helps web authors meet <strong>SC 3.2.3<\/strong>.\r\n<div style=\"margin: 1em 0;padding: 1em;border: 1px solid #ddd;border-left: 10px solid #0000ff\">\r\n\r\n<strong>Suggested Reading:<\/strong>\r\n<ul>\r\n \t<li><a href=\"https:\/\/www.w3.org\/WAI\/WCAG21\/Understanding\/consistent-navigation.html\">Understanding Consistent Navigation<\/a><\/li>\r\n \t<li><a href=\"https:\/\/www.w3.org\/WAI\/WCAG21\/quickref\/#consistent-navigation\">How to Meet Consistent Navigation<\/a><\/li>\r\n<\/ul>\r\n<\/div>\r\n<div style=\"margin: 1em 0;padding: 1em;border: 1px solid #ddd;border-left: 10px solid #ffcb05\">\r\n<h3><strong><a id=\"3.2.4\"><\/a>Success Criterion 3.2.4<\/strong> Consistent Identification<\/h3>\r\nLevel AA\r\n\r\nComponents that have the <a href=\"https:\/\/www.w3.org\/TR\/WCAG21\/#dfn-same-functionality\">same functionality<\/a> within a <a href=\"https:\/\/www.w3.org\/TR\/WCAG21\/#dfn-set-of-web-pages\">set of web pages<\/a> are identified consistently.\r\n\r\n<\/div>\r\n<h4>Consistent Identification Explained<\/h4>\r\nWhen designing a website, be consistent when identifying elements that have the same function. For example:\r\n<ul>\r\n \t<li>A newspaper publishes an online edition. Each article spans several web pages. There are four links at the bottom of every page of every article: First Page, Previous Page, Next Page, and Last Page.<\/li>\r\n \t<li>On a company website, an envelope icon indicates that visitors can send a message to an employee. The text alternative always begins with the phrase \u201cSend a message to\u201d followed by the employee\u2019s name.<\/li>\r\n \t<li>On an e-commerce site, there are captions under photographs of products. The caption gives the type of product followed by a short description, e.g., \u201cCD - John Denver\u2019s Greatest Hits,\u201d \u201cBook - Emily Martin - Woman in the Body: A Cultural Analysis of Reproduction.\u201d<\/li>\r\n \t<li>A website has a \u201cSearch\u201d feature on some pages and a \u201cFind\u201d feature on others. Both do the same thing. To conform to <strong>SC 3.2.4<\/strong>, the web author replaces \u201cFind\u201d with \u201cSearch\u201d on every page. The website now uses \u201cSearch\u201d consistently throughout.<\/li>\r\n<\/ul>\r\n<div style=\"margin: 1em 0;padding: 1em;border: 1px solid #ddd;border-left: 10px solid #0000ff\">\r\n\r\n<strong>Suggested Reading:<\/strong>\r\n<ul>\r\n \t<li><a href=\"https:\/\/www.w3.org\/WAI\/WCAG21\/Understanding\/consistent-identification.html\">Understanding Consistent Identification<\/a><\/li>\r\n \t<li><a href=\"https:\/\/www.w3.org\/WAI\/WCAG21\/quickref\/#consistent-identification\">How to Meet Consistent Identification<\/a><\/li>\r\n<\/ul>\r\n<\/div>\r\n<div style=\"margin: 1em 0;padding: 1em;border: 1px solid #ddd;border-left: 10px solid #ffcb05\">\r\n<h3><strong><a id=\"3.2.5\"><\/a>Success Criterion 3.2.5<\/strong> Change on Request<\/h3>\r\nLevel AAA\r\n\r\n<a href=\"https:\/\/www.w3.org\/TR\/WCAG21\/#dfn-change-of-context\">Changes of context<\/a> are initiated only by user request or a <a href=\"https:\/\/www.w3.org\/TR\/WCAG21\/#dfn-mechanism\">mechanism<\/a> is available to turn off such changes.\r\n\r\n<\/div>\r\n<h4>Change on Request Explained<\/h4>\r\nWhen designing a website, give users control over context changes, including:\r\n<ul>\r\n \t<li>Automatically advancing slide shows<\/li>\r\n \t<li>Launching new windows<\/li>\r\n \t<li>Spawning popup windows<\/li>\r\n \t<li>Changing keyboard focus<\/li>\r\n \t<li>Automatically submitting forms after selecting a list item<\/li>\r\n<\/ul>\r\nIn giving users this control, provide an option to disable context changes.\r\n\r\n<strong>SC 3.2.5<\/strong> aims to eliminate confusion caused by unexpected context changes. Unexpected context changes may complicate access for people with motor impairments, people with low vision, people who are blind, and people with certain cognitive disabilities.\r\n\r\nSome context changes are not disruptive to everybody or benefit only certain people. For example, context changes are an integral part of slide shows that automatically advance. Content that automatically changes context conforms to <strong>SC 3.2.5<\/strong>, but users must\u00a0have the option to turn the feature on or off.\r\n\r\nOther examples of conformance to <strong>SC 3.2.5<\/strong>:\r\n<ul>\r\n \t<li>Instead of automatically updating the order form on an e-commerce site, users activate an \u201cUpdate Now\u201d button to refresh the content.<\/li>\r\n \t<li>A user is automatically redirected from an old page to a new page in a way that he or she never realizes the redirect has occurred.<\/li>\r\n<\/ul>\r\n<div style=\"margin: 1em 0;padding: 1em;border: 1px solid #ddd;border-left: 10px solid #0000ff\">\r\n\r\n<strong>Suggested Reading:<\/strong>\r\n<ul>\r\n \t<li><a href=\"https:\/\/www.w3.org\/WAI\/WCAG21\/Understanding\/change-on-request.html\">Understanding Change on Request<\/a><\/li>\r\n \t<li><a href=\"https:\/\/www.w3.org\/WAI\/WCAG21\/quickref\/#change-on-request\">How to Meet Change on Request<\/a><\/li>\r\n<\/ul>\r\n<\/div>","rendered":"<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_80 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Contents<\/p>\n<label for=\"ez-toc-cssicon-toggle-item-69da054cdd107\" class=\"ez-toc-cssicon-toggle-label\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/label><input type=\"checkbox\"  id=\"ez-toc-cssicon-toggle-item-69da054cdd107\"  aria-label=\"Toggle\" \/><nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/pressbooks.library.torontomu.ca\/iwacc\/chapter\/3-2-predictable-level-aa-and-aaa\/#Success_Criterion_323_Consistent_Navigation\" >Success Criterion 3.2.3 Consistent Navigation<\/a><ul class='ez-toc-list-level-4' ><li class='ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/pressbooks.library.torontomu.ca\/iwacc\/chapter\/3-2-predictable-level-aa-and-aaa\/#Consistent_Navigation_Explained\" >Consistent Navigation Explained<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/pressbooks.library.torontomu.ca\/iwacc\/chapter\/3-2-predictable-level-aa-and-aaa\/#Success_Criterion_324_Consistent_Identification\" >Success Criterion 3.2.4 Consistent Identification<\/a><ul class='ez-toc-list-level-4' ><li class='ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/pressbooks.library.torontomu.ca\/iwacc\/chapter\/3-2-predictable-level-aa-and-aaa\/#Consistent_Identification_Explained\" >Consistent Identification Explained<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/pressbooks.library.torontomu.ca\/iwacc\/chapter\/3-2-predictable-level-aa-and-aaa\/#Success_Criterion_325_Change_on_Request\" >Success Criterion 3.2.5 Change on Request<\/a><ul class='ez-toc-list-level-4' ><li class='ez-toc-heading-level-4'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/pressbooks.library.torontomu.ca\/iwacc\/chapter\/3-2-predictable-level-aa-and-aaa\/#Change_on_Request_Explained\" >Change on Request Explained<\/a><\/li><\/ul><\/li><\/ul><\/nav><\/div>\n<div style=\"margin: 1em 0;padding: 1em;border: 1px solid #ddd;border-left: 10px solid #ffcb05\">\n<h3><span class=\"ez-toc-section\" id=\"Success_Criterion_323_Consistent_Navigation\"><\/span><strong><a id=\"3.2.3\"><\/a>Success Criterion 3.2.3<\/strong> Consistent Navigation<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Level AA<\/p>\n<p>Navigational mechanisms that are repeated on multiple\u00a0<a href=\"https:\/\/www.w3.org\/TR\/WCAG21\/#dfn-web-page-s\">web pages<\/a> within a <a href=\"https:\/\/www.w3.org\/TR\/WCAG21\/#dfn-set-of-web-pages\">set of web pages<\/a> occur in the <a href=\"https:\/\/www.w3.org\/TR\/WCAG21\/#dfn-same-relative-order\">same relative order<\/a> each time they are repeated, unless a change is initiated by the user.<\/p>\n<\/div>\n<h4><span class=\"ez-toc-section\" id=\"Consistent_Navigation_Explained\"><\/span>Consistent Navigation Explained<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>When designing a website, keep information that is repeated on every page in the same order.<\/p>\n<p>Content is easier to find when the location of repeated information is predictable. The phrase \u201csame order\u201d does <i>not<\/i> imply that expanding and contracting navigation menus must be avoided. By adding or removing links between existing navigation links, navigation within a subsection is enabled, and the relative order is maintained.<\/p>\n<p>Conforming to <strong>SC 3.2.3<\/strong> helps users predict the location of the content they are looking for and find content more quickly when they encounter it again. Consistencies in site layout are especially helpful to individuals who rely on visual cues or their spatial memory. People with low vision who use screen magnification software consequently see only a small portion of the screen at one time. These users can take advantage of page boundaries and other cues to quickly locate repeated content.<\/p>\n<p>Using templates to ensure consistency across a site helps web authors meet <strong>SC 3.2.3<\/strong>.<\/p>\n<div style=\"margin: 1em 0;padding: 1em;border: 1px solid #ddd;border-left: 10px solid #0000ff\">\n<p><strong>Suggested Reading:<\/strong><\/p>\n<ul>\n<li><a href=\"https:\/\/www.w3.org\/WAI\/WCAG21\/Understanding\/consistent-navigation.html\">Understanding Consistent Navigation<\/a><\/li>\n<li><a href=\"https:\/\/www.w3.org\/WAI\/WCAG21\/quickref\/#consistent-navigation\">How to Meet Consistent Navigation<\/a><\/li>\n<\/ul>\n<\/div>\n<div style=\"margin: 1em 0;padding: 1em;border: 1px solid #ddd;border-left: 10px solid #ffcb05\">\n<h3><span class=\"ez-toc-section\" id=\"Success_Criterion_324_Consistent_Identification\"><\/span><strong><a id=\"3.2.4\"><\/a>Success Criterion 3.2.4<\/strong> Consistent Identification<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Level AA<\/p>\n<p>Components that have the <a href=\"https:\/\/www.w3.org\/TR\/WCAG21\/#dfn-same-functionality\">same functionality<\/a> within a <a href=\"https:\/\/www.w3.org\/TR\/WCAG21\/#dfn-set-of-web-pages\">set of web pages<\/a> are identified consistently.<\/p>\n<\/div>\n<h4><span class=\"ez-toc-section\" id=\"Consistent_Identification_Explained\"><\/span>Consistent Identification Explained<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>When designing a website, be consistent when identifying elements that have the same function. For example:<\/p>\n<ul>\n<li>A newspaper publishes an online edition. Each article spans several web pages. There are four links at the bottom of every page of every article: First Page, Previous Page, Next Page, and Last Page.<\/li>\n<li>On a company website, an envelope icon indicates that visitors can send a message to an employee. The text alternative always begins with the phrase \u201cSend a message to\u201d followed by the employee\u2019s name.<\/li>\n<li>On an e-commerce site, there are captions under photographs of products. The caption gives the type of product followed by a short description, e.g., \u201cCD &#8211; John Denver\u2019s Greatest Hits,\u201d \u201cBook &#8211; Emily Martin &#8211; Woman in the Body: A Cultural Analysis of Reproduction.\u201d<\/li>\n<li>A website has a \u201cSearch\u201d feature on some pages and a \u201cFind\u201d feature on others. Both do the same thing. To conform to <strong>SC 3.2.4<\/strong>, the web author replaces \u201cFind\u201d with \u201cSearch\u201d on every page. The website now uses \u201cSearch\u201d consistently throughout.<\/li>\n<\/ul>\n<div style=\"margin: 1em 0;padding: 1em;border: 1px solid #ddd;border-left: 10px solid #0000ff\">\n<p><strong>Suggested Reading:<\/strong><\/p>\n<ul>\n<li><a href=\"https:\/\/www.w3.org\/WAI\/WCAG21\/Understanding\/consistent-identification.html\">Understanding Consistent Identification<\/a><\/li>\n<li><a href=\"https:\/\/www.w3.org\/WAI\/WCAG21\/quickref\/#consistent-identification\">How to Meet Consistent Identification<\/a><\/li>\n<\/ul>\n<\/div>\n<div style=\"margin: 1em 0;padding: 1em;border: 1px solid #ddd;border-left: 10px solid #ffcb05\">\n<h3><span class=\"ez-toc-section\" id=\"Success_Criterion_325_Change_on_Request\"><\/span><strong><a id=\"3.2.5\"><\/a>Success Criterion 3.2.5<\/strong> Change on Request<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Level AAA<\/p>\n<p><a href=\"https:\/\/www.w3.org\/TR\/WCAG21\/#dfn-change-of-context\">Changes of context<\/a> are initiated only by user request or a <a href=\"https:\/\/www.w3.org\/TR\/WCAG21\/#dfn-mechanism\">mechanism<\/a> is available to turn off such changes.<\/p>\n<\/div>\n<h4><span class=\"ez-toc-section\" id=\"Change_on_Request_Explained\"><\/span>Change on Request Explained<span class=\"ez-toc-section-end\"><\/span><\/h4>\n<p>When designing a website, give users control over context changes, including:<\/p>\n<ul>\n<li>Automatically advancing slide shows<\/li>\n<li>Launching new windows<\/li>\n<li>Spawning popup windows<\/li>\n<li>Changing keyboard focus<\/li>\n<li>Automatically submitting forms after selecting a list item<\/li>\n<\/ul>\n<p>In giving users this control, provide an option to disable context changes.<\/p>\n<p><strong>SC 3.2.5<\/strong> aims to eliminate confusion caused by unexpected context changes. Unexpected context changes may complicate access for people with motor impairments, people with low vision, people who are blind, and people with certain cognitive disabilities.<\/p>\n<p>Some context changes are not disruptive to everybody or benefit only certain people. For example, context changes are an integral part of slide shows that automatically advance. Content that automatically changes context conforms to <strong>SC 3.2.5<\/strong>, but users must\u00a0have the option to turn the feature on or off.<\/p>\n<p>Other examples of conformance to <strong>SC 3.2.5<\/strong>:<\/p>\n<ul>\n<li>Instead of automatically updating the order form on an e-commerce site, users activate an \u201cUpdate Now\u201d button to refresh the content.<\/li>\n<li>A user is automatically redirected from an old page to a new page in a way that he or she never realizes the redirect has occurred.<\/li>\n<\/ul>\n<div style=\"margin: 1em 0;padding: 1em;border: 1px solid #ddd;border-left: 10px solid #0000ff\">\n<p><strong>Suggested Reading:<\/strong><\/p>\n<ul>\n<li><a href=\"https:\/\/www.w3.org\/WAI\/WCAG21\/Understanding\/change-on-request.html\">Understanding Change on Request<\/a><\/li>\n<li><a href=\"https:\/\/www.w3.org\/WAI\/WCAG21\/quickref\/#change-on-request\">How to Meet Change on Request<\/a><\/li>\n<\/ul>\n<\/div>\n","protected":false},"author":100,"menu_order":5,"template":"","meta":{"pb_show_title":"on","pb_short_title":"","pb_subtitle":"","pb_authors":[],"pb_section_license":""},"chapter-type":[],"contributor":[],"license":[],"class_list":["post-289","chapter","type-chapter","status-publish","hentry"],"part":32,"_links":{"self":[{"href":"https:\/\/pressbooks.library.torontomu.ca\/iwacc\/wp-json\/pressbooks\/v2\/chapters\/289","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/pressbooks.library.torontomu.ca\/iwacc\/wp-json\/pressbooks\/v2\/chapters"}],"about":[{"href":"https:\/\/pressbooks.library.torontomu.ca\/iwacc\/wp-json\/wp\/v2\/types\/chapter"}],"author":[{"embeddable":true,"href":"https:\/\/pressbooks.library.torontomu.ca\/iwacc\/wp-json\/wp\/v2\/users\/100"}],"version-history":[{"count":4,"href":"https:\/\/pressbooks.library.torontomu.ca\/iwacc\/wp-json\/pressbooks\/v2\/chapters\/289\/revisions"}],"predecessor-version":[{"id":1167,"href":"https:\/\/pressbooks.library.torontomu.ca\/iwacc\/wp-json\/pressbooks\/v2\/chapters\/289\/revisions\/1167"}],"part":[{"href":"https:\/\/pressbooks.library.torontomu.ca\/iwacc\/wp-json\/pressbooks\/v2\/parts\/32"}],"metadata":[{"href":"https:\/\/pressbooks.library.torontomu.ca\/iwacc\/wp-json\/pressbooks\/v2\/chapters\/289\/metadata\/"}],"wp:attachment":[{"href":"https:\/\/pressbooks.library.torontomu.ca\/iwacc\/wp-json\/wp\/v2\/media?parent=289"}],"wp:term":[{"taxonomy":"chapter-type","embeddable":true,"href":"https:\/\/pressbooks.library.torontomu.ca\/iwacc\/wp-json\/pressbooks\/v2\/chapter-type?post=289"},{"taxonomy":"contributor","embeddable":true,"href":"https:\/\/pressbooks.library.torontomu.ca\/iwacc\/wp-json\/wp\/v2\/contributor?post=289"},{"taxonomy":"license","embeddable":true,"href":"https:\/\/pressbooks.library.torontomu.ca\/iwacc\/wp-json\/wp\/v2\/license?post=289"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}