{"id":947,"date":"2016-10-25T11:00:12","date_gmt":"2016-10-25T18:00:12","guid":{"rendered":"http:\/\/blogs.lanecc.edu\/webteam\/?p=947"},"modified":"2016-12-12T13:06:49","modified_gmt":"2016-12-12T21:06:49","slug":"understanding-wcag-2-0-sensory-characteristics","status":"publish","type":"post","link":"https:\/\/blogs.lanecc.edu\/webteam\/2016\/10\/25\/understanding-wcag-2-0-sensory-characteristics\/","title":{"rendered":"Understanding WCAG 2.0: 1.3.3 – Sensory Characteristics"},"content":{"rendered":"

The second standard we’ll explore in our series on understanding WCAG 2.0 is 1.3.3, Sensory Characteristics<\/a>. This standard is required for WCAG level A compliance, which is part of the level AA compliance that Section 508 requires. Here’s the complete text:<\/p>\n

1.3.3 Sensory Characteristics:<\/strong> Instructions provided for understanding and operating content do not rely solely on sensory characteristics of components such as shape, size, visual location, orientation, or sound. (Level A)<\/p><\/blockquote>\n

As a mostly non-technical requirement, this one is actually pretty easy to understand, and it isn’t too different from a standard that’s already in section 508 (\u00a71194.22(c)<\/a>), which says you’re not allowed to convey information strictly through color. Standard 1.3.3 simply expands that requirement to cover visual and auditory impairments.<\/p>\n

This doesn’t mean that you can’t convey information using some sort of sensory characteristic. You often should. If you have a button on a page to proceed to the next page, I’d encourage you make it look like a green arrow, and tell people to look for a green arrow right in the instructions. But you then also have to very carefully label the arrow as linking to the next page – you can’t rely on someone seeing green or being able to identify the arrow shape.<\/p>\n

You also need to be careful referring to an element on a page by position. You can’t have instructions that say “Click on the link in the top right corner of the page”. But you can have instructions that say “Click on the link titled ‘College Catalog’ in the top right corner of the page”. Again, you need to provide an alternate method of locating that link. In this case, we’re using the link text.<\/p>\n

The exception to this is above and below. In English, it’s generally acceptable to refer to content preceding the current reading position as being “above”, and content that follows to be “below”. Since your page should have sequence, you can usually refer to content above and below.<\/p>\n

Here’s a final example:<\/p>\n\n\n\n\n\n\n
Time<\/th>\n8<\/th>\n9<\/th>\n10<\/th>\n11<\/th>\n12<\/th>\n1<\/th>\n2<\/th>\n3<\/th>\n4<\/th>\n<\/tr>\n<\/thead>\n
Underwater Basketweaving<\/th>\n<\/td>\n<\/td>\n<\/td>\n<\/td>\n<\/td>\n<\/td>\n<\/td>\n<\/td>\n<\/td>\n<\/tr>\n
Quidditch<\/th>\n<\/td>\n<\/td>\n<\/td>\n<\/td>\n<\/td>\n<\/td>\n<\/td>\n<\/td>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

Above, you’ll see a table with my schedule for this academic year. I’m not taking a particularly demanding schedule, but this way of presenting my schedule only conveys when classes are through color. So this doesn’t even pass existing 508 rules.<\/p>\n\n\n\n\n\n\n
Time<\/th>\n8<\/th>\n9<\/th>\n10<\/th>\n11<\/th>\n12<\/th>\n1<\/th>\n2<\/th>\n3<\/th>\n4<\/th>\n<\/tr>\n<\/thead>\n
Underwater Basketweaving<\/th>\n<\/td>\n\u25c7<\/td>\n\u25c7<\/td>\n\u25c7<\/td>\n<\/td>\n<\/td>\n<\/td>\n<\/td>\n<\/td>\n<\/tr>\n
Quidditch<\/th>\n<\/td>\n<\/td>\n<\/td>\n\u25b3<\/td>\n\u25b3<\/td>\n\u25b3<\/td>\n<\/td>\n<\/td>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

This one isn’t ok either. We’ve just traded colors for shapes. But you can probably see where this is going:<\/p>\n\n\n\n\n\n\n
Time<\/th>\n8<\/th>\n9<\/th>\n10<\/th>\n11<\/th>\n12<\/th>\n1<\/th>\n2<\/th>\n3<\/th>\n4<\/th>\n<\/tr>\n<\/thead>\n
Underwater Basketweaving<\/th>\n<\/td>\n\u25c7<\/td>\n\u25c7<\/td>\n\u25c7<\/td>\n<\/td>\n<\/td>\n<\/td>\n<\/td>\n<\/td>\n<\/tr>\n
Quidditch<\/th>\n<\/td>\n<\/td>\n<\/td>\n\u25b3<\/td>\n\u25b3<\/td>\n\u25b3<\/td>\n<\/td>\n<\/td>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

This one is probably ok, according to a strict reading of the guideline. But we could improve it further, by providing span<\/code>‘s that are visible only to screen readers, which describe when the classes take place. We can’t be sure those symbols are readable by a screen reader either.<\/p>\n

If you’d like to read more about sensory characteristics, you may also be interested in Guideline 96: Providing textual identification of items that otherwise rely only on sensory information to be understood<\/a>, which provides an example and a bit more detail.<\/p>\n

Interested in more? Check out the listing of all the posts in this series<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"

The second standard we’ll explore in our series on understanding WCAG 2.0 is 1.3.3, Sensory Characteristics. This standard is required for WCAG level A compliance, which is part of the level AA compliance that Section 508 requires. Here’s the complete text: 1.3.3 Sensory Characteristics: Instructions provided for understanding and operating content do not rely solely … Continue reading “Understanding WCAG 2.0: 1.3.3 – Sensory Characteristics”<\/span><\/a><\/p>\n","protected":false},"author":86,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"ngg_post_thumbnail":0,"footnotes":"","_wpscppro_dont_share_socialmedia":false,"_wpscppro_custom_social_share_image":0,"_facebook_share_type":"","_twitter_share_type":"","_linkedin_share_type":"","_pinterest_share_type":"","_linkedin_share_type_page":"","_instagram_share_type":"","_medium_share_type":"","_threads_share_type":"","_google_business_share_type":"","_selected_social_profile":[],"_wpsp_enable_custom_social_template":false,"_wpsp_social_scheduling":{"enabled":false,"datetime":null,"platforms":[],"status":"template_only","dateOption":"today","timeOption":"now","customDays":"","customHours":"","customDate":"","customTime":"","schedulingType":"absolute"},"_wpsp_active_default_template":true},"categories":[31,26],"tags":[6,25],"class_list":["post-947","post","type-post","status-publish","format-standard","hentry","category-wcag-20","category-web","tag-accessibility","tag-drupal"],"_links":{"self":[{"href":"https:\/\/blogs.lanecc.edu\/webteam\/wp-json\/wp\/v2\/posts\/947","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blogs.lanecc.edu\/webteam\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blogs.lanecc.edu\/webteam\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blogs.lanecc.edu\/webteam\/wp-json\/wp\/v2\/users\/86"}],"replies":[{"embeddable":true,"href":"https:\/\/blogs.lanecc.edu\/webteam\/wp-json\/wp\/v2\/comments?post=947"}],"version-history":[{"count":5,"href":"https:\/\/blogs.lanecc.edu\/webteam\/wp-json\/wp\/v2\/posts\/947\/revisions"}],"predecessor-version":[{"id":1050,"href":"https:\/\/blogs.lanecc.edu\/webteam\/wp-json\/wp\/v2\/posts\/947\/revisions\/1050"}],"wp:attachment":[{"href":"https:\/\/blogs.lanecc.edu\/webteam\/wp-json\/wp\/v2\/media?parent=947"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blogs.lanecc.edu\/webteam\/wp-json\/wp\/v2\/categories?post=947"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blogs.lanecc.edu\/webteam\/wp-json\/wp\/v2\/tags?post=947"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}