{"id":1106,"date":"2017-01-24T11:00:17","date_gmt":"2017-01-24T19:00:17","guid":{"rendered":"http:\/\/blogs.lanecc.edu\/webteam\/?p=1106"},"modified":"2019-09-17T23:56:54","modified_gmt":"2019-09-18T06:56:54","slug":"understanding-wcag-2-0-3-1-1-language-of-page","status":"publish","type":"post","link":"https:\/\/blogs.lanecc.edu\/webteam\/2017\/01\/24\/understanding-wcag-2-0-3-1-1-language-of-page\/","title":{"rendered":"Understanding WCAG 2.0: 3.1.1 – Language of Page"},"content":{"rendered":"

The next standard we’ll explore in our series on understanding WCAG 2.0 is 3.1.1 Language of Page<\/a>. This standard is required for WCAG level A compliance, which is part of what Section 508 requires. Here’s the complete text:<\/p>\n

\n
\n

3.1.1 Language of Page:<\/strong> The default human language of each Web page can be programmatically determined. (Level A)<\/p>\n<\/div>\n<\/blockquote>\n

When a screen reader reads a page, it needs a voice to use. Here’s the default voice on my Mac reading some words in Spanish:<\/p>\nhttps:\/\/blogs.lanecc.edu\/webteam\/wp-content\/uploads\/sites\/25\/2017\/01\/en_us.mp3<\/a><\/audio>\n

That’s not too dissimilar from how I sound, which isn’t a coincidence. The default voice tried to pronounce words like an American English speaker (IETF code<\/a> EN_US), which is what I am. The problem in the audio file above is that we told my computer to pronounce Spanish words (“\u00a1Hola! C\u00f3mo est\u00e1s!<\/span>“) as though they were in English.<\/p>\n

If we’d instead told the computer the words were in Spanish, we’d have heard this:<\/p>\nhttps:\/\/blogs.lanecc.edu\/webteam\/wp-content\/uploads\/sites\/25\/2017\/01\/es_es.mp3<\/a><\/audio>\n

That uses the ES_ES voice (which, on a Mac, is named Monica<\/a>). And it sounds totally natural (or, at least, as natural as computer generated language can be).<\/p>\n

To specify a language for your entire document, simply add a lang<\/code> attribute<\/a> to the html<\/code> tag:<\/p>\n

<html lang=\"en\"><\/pre>\n
Confusingly, the language codes we use in HTML are different from the IETF codes. Instead, we use ISO-639-1<\/a>.<\/p>\n
Sometimes it isn’t possible to modify the tags on the page. For instance, you might be using a platform that generates HTML, and you don’t have access to change the output. In those cases, you can instead add a Content-Language header to your server:<\/p>\n
Content-Language: en<\/pre>\n
But sometimes, that’s not an option either. You might be stuck with a platform that can only generate HTML 4.01, or you might only be able to insert tags into the header and body, but not modify html<\/code> tag directly.<\/p>\n
For those times, your only option is to use the absolute wrong way to specify a language:<\/p>\n
<meta http-equiv=\"content-language\" content=\"en\"><\/code><\/p>\n
This meta tag (meaning a tag that’s about a page, rather than part of a page), is now considered obsolete<\/a>. But if it’s your only option, it’s your only option.<\/p>\n
If you’d like to read more document language codes, you may also be interested in these techniques<\/a>, which provides more detail. I also found this blog post<\/a> very helpful, as well as this page on w3.org<\/a>.<\/p>\n
Interested in more? Check out the listing of all the posts in this series<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"
The next standard we’ll explore in our series on understanding WCAG 2.0 is 3.1.1 Language of Page. This standard is required for WCAG level A compliance, which is part of what Section 508 requires. Here’s the complete text: 3.1.1 Language of Page: The default human language of each Web page can be programmatically determined. (Level … Continue reading “Understanding WCAG 2.0: 3.1.1 – Language of Page”<\/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],"tags":[6],"class_list":["post-1106","post","type-post","status-publish","format-standard","hentry","category-wcag-20","tag-accessibility"],"_links":{"self":[{"href":"https:\/\/blogs.lanecc.edu\/webteam\/wp-json\/wp\/v2\/posts\/1106","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=1106"}],"version-history":[{"count":4,"href":"https:\/\/blogs.lanecc.edu\/webteam\/wp-json\/wp\/v2\/posts\/1106\/revisions"}],"predecessor-version":[{"id":1306,"href":"https:\/\/blogs.lanecc.edu\/webteam\/wp-json\/wp\/v2\/posts\/1106\/revisions\/1306"}],"wp:attachment":[{"href":"https:\/\/blogs.lanecc.edu\/webteam\/wp-json\/wp\/v2\/media?parent=1106"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blogs.lanecc.edu\/webteam\/wp-json\/wp\/v2\/categories?post=1106"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blogs.lanecc.edu\/webteam\/wp-json\/wp\/v2\/tags?post=1106"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}