
{"id":61,"date":"2018-08-31T23:50:39","date_gmt":"2018-08-31T23:50:39","guid":{"rendered":"http:\/\/pressbooks.oer.hawaii.edu\/oertraining2018\/chapter\/making-oer-accessible\/"},"modified":"2018-09-01T00:48:08","modified_gmt":"2018-09-01T00:48:08","slug":"making-oer-accessible","status":"publish","type":"chapter","link":"https:\/\/pressbooks.oer.hawaii.edu\/oertraining2018\/chapter\/making-oer-accessible\/","title":{"raw":"Making OER Accessible","rendered":"Making OER Accessible"},"content":{"raw":"<div class=\"textbox learning-objectives\">\r\n<h3>Learning Objectives<\/h3>\r\nBy the end of this lesson, you will be able to:\r\n<ul>\r\n \t<li>Describe techniques for creating accessible OER<\/li>\r\n<\/ul>\r\n<\/div>\r\n<h1>Introduction<\/h1>\r\nContent should be created in a way that makes it accessible to all learners. As you plan an OER adoption or adaptation, plan to check the accessibility of your content before making it available to others. Not only is this a generally good practice, content published by public institutions may be subject to state and\/or federal mandates for accessibility. In short, making your OER accessible from the get-go will help learners consume the content in the way that best suits their needs.\r\n\r\nThis section will explain techniques towards making instructional content more accessible, including OER. More thorough recommendations for making content accessible can be found in this adaptation of the <a href=\"http:\/\/pressbooks-dev.oer.hawaii.edu\/accessibilitytoolkit\/\">Accessibility Toolkit<\/a> originally published by BCCampus.\r\n<h1>Lowest common denominator<\/h1>\r\nWhile it is often fun to use different font types (\"fonts\"), colors, and clip art on your instructional materials, content that follows a more structured approach will likely be more accessible. As OER is passed between authors and editing tools, it's advisable to leave the fancy styling as a last step and share out \"clean\" versions of the content without custom fonts and floating elements. When in doubt, leave your custom styles out.\r\n<h1>Four steps towards authoring accessible content<\/h1>\r\nWhen writing text-based content, sticking to these four suggestions will greatly improve the accessibility of your content. In particular using stricter markup will help screen readers convey the content more clearly.\u00a0MS Word, Google Docs, and many other common tools used for OER editing will have these built in into their menus, making it easy to structure your content cleanly.\r\n<h2>Use heading levels (h1, h2, h3)<\/h2>\r\nText-based OER benefits from being structured with heading levels. Many editing tools support TOC (table of contents) generation based on where these section markers are placed. Individuals using screen readers will also more easily navigate the sections of your content when headings levels have been applied consistently throughout.\r\n<h2>Use true lists (ordered, unordered)<\/h2>\r\nWhile they may \"look\" similar to bulleted lists, using asterisks with hand-spacing to create lists can really jam up a screen reader that is expecting structured content. Whenever listing items, use the true list features of your content editor. This applies to both unordered (often bulleted) and ordered (numbered or lettered) lists.\r\n\r\n<strong>Example<\/strong> \u00a0\u2014 clear and accessible:\r\n<ul>\r\n \t<li>First list item<\/li>\r\n \t<li>Second one<\/li>\r\n \t<li>And a third<\/li>\r\n<\/ul>\r\n<strong>Nonexample<\/strong> \u00a0\u2014 unclear:\r\n\r\n* \u00a0First list item\r\n\r\n* \u00a0Second item\r\n\r\n* \u00a0 And a third\r\n<h2>Give alt text descriptions to images<\/h2>\r\nNo matter the subject of an image or figure used in your content, we need to offer descriptive text to support those with visual impairments. A screen reader will look for a contextual description of an image to share with the learner, which should live in the text surrounding the image (title or caption) or as alternative (\"alt\") text. This is one of the most common overlooked accessibility aspects of content created for instruction, but editors for both online and offline content nearly all include tools for adding alt text to images.\r\n<h2>Use descriptive link text<\/h2>\r\nEnsure that all web pages and weblinks have titles that describe a topic or purpose. The purpose of the link can be determined by the text alone. That is, you don\u2019t need to include additional information justifying the use of the link. You want the link to be meaningful in context. For example, do not use generic text such as \u201cclick here\u201d or \u201cread more\u201d unless the purpose of the link can be determined by meaning in the surrounding content.\r\n\r\n<strong>Example<\/strong> \u00a0\u2014 clear and accessible:\r\n\r\nInformation on the <a href=\"http:\/\/open.bccampus.ca\/\">BC Open Textbook Project<\/a> is available online.\r\n\r\n<strong>Nonexample<\/strong> \u00a0\u2014 unclear:\r\n\r\nClick <a href=\"http:\/\/open.bccampus.ca\/\">here<\/a> for information on the BC Open Textbook Project.\r\n<h1>Use the WAVE tool<\/h1>\r\nA great deal of OER content is displayed on websites, where we can use accessibility-checking tools to identify areas that can make it difficult for assistive technology tools to work properly. The <a href=\"http:\/\/wave.webaim.org\/\">WAVE tool<\/a> does just that: identifies errors and possible issues with the accessibility of webpages.\r\n\r\nFor example, we can see the <a href=\"http:\/\/wave.webaim.org\/report#\/http:\/\/www.opencontent.org\/definition\/\">WAVE tool's accessibility check on opencontent.org\/definition<\/a>. As far as content structure and formatting is concerned, the page looks great. The WAVE tool caught a couple small errors (a missing page title, missing language declaration) and had a couple warnings for parts of the page that may be troublesome from an accessibility perspective.\r\n\r\n<img class=\"alignnone wp-image-60 size-large\" src=\"http:\/\/pressbooks.oer.hawaii.edu\/oertraining2018\/wp-content\/uploads\/sites\/9\/2018\/08\/Screen-Shot-2017-11-08-at-10.41.20-PM-1024x749.png\" alt=\"Screenshot of the WAVE accessibility tool on a webpage\" width=\"1024\" height=\"749\" \/>\r\n<h1>Knowledge Check<\/h1>\r\n[h5p id=\"15\"]","rendered":"<div class=\"textbox learning-objectives\">\n<h3>Learning Objectives<\/h3>\n<p>By the end of this lesson, you will be able to:<\/p>\n<ul>\n<li>Describe techniques for creating accessible OER<\/li>\n<\/ul>\n<\/div>\n<h1>Introduction<\/h1>\n<p>Content should be created in a way that makes it accessible to all learners. As you plan an OER adoption or adaptation, plan to check the accessibility of your content before making it available to others. Not only is this a generally good practice, content published by public institutions may be subject to state and\/or federal mandates for accessibility. In short, making your OER accessible from the get-go will help learners consume the content in the way that best suits their needs.<\/p>\n<p>This section will explain techniques towards making instructional content more accessible, including OER. More thorough recommendations for making content accessible can be found in this adaptation of the <a href=\"http:\/\/pressbooks-dev.oer.hawaii.edu\/accessibilitytoolkit\/\">Accessibility Toolkit<\/a> originally published by BCCampus.<\/p>\n<h1>Lowest common denominator<\/h1>\n<p>While it is often fun to use different font types (&#8220;fonts&#8221;), colors, and clip art on your instructional materials, content that follows a more structured approach will likely be more accessible. As OER is passed between authors and editing tools, it&#8217;s advisable to leave the fancy styling as a last step and share out &#8220;clean&#8221; versions of the content without custom fonts and floating elements. When in doubt, leave your custom styles out.<\/p>\n<h1>Four steps towards authoring accessible content<\/h1>\n<p>When writing text-based content, sticking to these four suggestions will greatly improve the accessibility of your content. In particular using stricter markup will help screen readers convey the content more clearly.\u00a0MS Word, Google Docs, and many other common tools used for OER editing will have these built in into their menus, making it easy to structure your content cleanly.<\/p>\n<h2>Use heading levels (h1, h2, h3)<\/h2>\n<p>Text-based OER benefits from being structured with heading levels. Many editing tools support TOC (table of contents) generation based on where these section markers are placed. Individuals using screen readers will also more easily navigate the sections of your content when headings levels have been applied consistently throughout.<\/p>\n<h2>Use true lists (ordered, unordered)<\/h2>\n<p>While they may &#8220;look&#8221; similar to bulleted lists, using asterisks with hand-spacing to create lists can really jam up a screen reader that is expecting structured content. Whenever listing items, use the true list features of your content editor. This applies to both unordered (often bulleted) and ordered (numbered or lettered) lists.<\/p>\n<p><strong>Example<\/strong> \u00a0\u2014 clear and accessible:<\/p>\n<ul>\n<li>First list item<\/li>\n<li>Second one<\/li>\n<li>And a third<\/li>\n<\/ul>\n<p><strong>Nonexample<\/strong> \u00a0\u2014 unclear:<\/p>\n<p>* \u00a0First list item<\/p>\n<p>* \u00a0Second item<\/p>\n<p>* \u00a0 And a third<\/p>\n<h2>Give alt text descriptions to images<\/h2>\n<p>No matter the subject of an image or figure used in your content, we need to offer descriptive text to support those with visual impairments. A screen reader will look for a contextual description of an image to share with the learner, which should live in the text surrounding the image (title or caption) or as alternative (&#8220;alt&#8221;) text. This is one of the most common overlooked accessibility aspects of content created for instruction, but editors for both online and offline content nearly all include tools for adding alt text to images.<\/p>\n<h2>Use descriptive link text<\/h2>\n<p>Ensure that all web pages and weblinks have titles that describe a topic or purpose. The purpose of the link can be determined by the text alone. That is, you don\u2019t need to include additional information justifying the use of the link. You want the link to be meaningful in context. For example, do not use generic text such as \u201cclick here\u201d or \u201cread more\u201d unless the purpose of the link can be determined by meaning in the surrounding content.<\/p>\n<p><strong>Example<\/strong> \u00a0\u2014 clear and accessible:<\/p>\n<p>Information on the <a href=\"http:\/\/open.bccampus.ca\/\">BC Open Textbook Project<\/a> is available online.<\/p>\n<p><strong>Nonexample<\/strong> \u00a0\u2014 unclear:<\/p>\n<p>Click <a href=\"http:\/\/open.bccampus.ca\/\">here<\/a> for information on the BC Open Textbook Project.<\/p>\n<h1>Use the WAVE tool<\/h1>\n<p>A great deal of OER content is displayed on websites, where we can use accessibility-checking tools to identify areas that can make it difficult for assistive technology tools to work properly. The <a href=\"http:\/\/wave.webaim.org\/\">WAVE tool<\/a> does just that: identifies errors and possible issues with the accessibility of webpages.<\/p>\n<p>For example, we can see the <a href=\"http:\/\/wave.webaim.org\/report#\/http:\/\/www.opencontent.org\/definition\/\">WAVE tool&#8217;s accessibility check on opencontent.org\/definition<\/a>. As far as content structure and formatting is concerned, the page looks great. The WAVE tool caught a couple small errors (a missing page title, missing language declaration) and had a couple warnings for parts of the page that may be troublesome from an accessibility perspective.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-60 size-large\" src=\"http:\/\/pressbooks.oer.hawaii.edu\/oertraining2018\/wp-content\/uploads\/sites\/9\/2018\/08\/Screen-Shot-2017-11-08-at-10.41.20-PM-1024x749.png\" alt=\"Screenshot of the WAVE accessibility tool on a webpage\" width=\"1024\" height=\"749\" srcset=\"https:\/\/pressbooks.oer.hawaii.edu\/oertraining2018\/wp-content\/uploads\/sites\/9\/2018\/08\/Screen-Shot-2017-11-08-at-10.41.20-PM-1024x749.png 1024w, https:\/\/pressbooks.oer.hawaii.edu\/oertraining2018\/wp-content\/uploads\/sites\/9\/2018\/08\/Screen-Shot-2017-11-08-at-10.41.20-PM-300x219.png 300w, https:\/\/pressbooks.oer.hawaii.edu\/oertraining2018\/wp-content\/uploads\/sites\/9\/2018\/08\/Screen-Shot-2017-11-08-at-10.41.20-PM-768x561.png 768w, https:\/\/pressbooks.oer.hawaii.edu\/oertraining2018\/wp-content\/uploads\/sites\/9\/2018\/08\/Screen-Shot-2017-11-08-at-10.41.20-PM-65x48.png 65w, https:\/\/pressbooks.oer.hawaii.edu\/oertraining2018\/wp-content\/uploads\/sites\/9\/2018\/08\/Screen-Shot-2017-11-08-at-10.41.20-PM-225x164.png 225w, https:\/\/pressbooks.oer.hawaii.edu\/oertraining2018\/wp-content\/uploads\/sites\/9\/2018\/08\/Screen-Shot-2017-11-08-at-10.41.20-PM-350x256.png 350w, https:\/\/pressbooks.oer.hawaii.edu\/oertraining2018\/wp-content\/uploads\/sites\/9\/2018\/08\/Screen-Shot-2017-11-08-at-10.41.20-PM.png 1762w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/p>\n<h1>Knowledge Check<\/h1>\n<div id=\"h5p-15\">\n<div class=\"h5p-iframe-wrapper\"><iframe id=\"h5p-iframe-15\" class=\"h5p-iframe\" data-content-id=\"15\" style=\"height:1px\" src=\"about:blank\" frameBorder=\"0\" scrolling=\"no\" title=\"Describe techniques for accessible content\"><\/iframe><\/div>\n<\/div>\n","protected":false},"author":3,"menu_order":2,"template":"","meta":{"pb_show_title":"on","pb_short_title":"","pb_subtitle":"","pb_authors":[],"pb_section_license":""},"chapter-type":[],"contributor":[],"license":[],"class_list":["post-61","chapter","type-chapter","status-publish","hentry"],"part":57,"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/pressbooks.oer.hawaii.edu\/oertraining2018\/wp-json\/pressbooks\/v2\/chapters\/61","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/pressbooks.oer.hawaii.edu\/oertraining2018\/wp-json\/pressbooks\/v2\/chapters"}],"about":[{"href":"https:\/\/pressbooks.oer.hawaii.edu\/oertraining2018\/wp-json\/wp\/v2\/types\/chapter"}],"author":[{"embeddable":true,"href":"https:\/\/pressbooks.oer.hawaii.edu\/oertraining2018\/wp-json\/wp\/v2\/users\/3"}],"version-history":[{"count":2,"href":"https:\/\/pressbooks.oer.hawaii.edu\/oertraining2018\/wp-json\/pressbooks\/v2\/chapters\/61\/revisions"}],"predecessor-version":[{"id":107,"href":"https:\/\/pressbooks.oer.hawaii.edu\/oertraining2018\/wp-json\/pressbooks\/v2\/chapters\/61\/revisions\/107"}],"part":[{"href":"https:\/\/pressbooks.oer.hawaii.edu\/oertraining2018\/wp-json\/pressbooks\/v2\/parts\/57"}],"metadata":[{"href":"https:\/\/pressbooks.oer.hawaii.edu\/oertraining2018\/wp-json\/pressbooks\/v2\/chapters\/61\/metadata\/"}],"wp:attachment":[{"href":"https:\/\/pressbooks.oer.hawaii.edu\/oertraining2018\/wp-json\/wp\/v2\/media?parent=61"}],"wp:term":[{"taxonomy":"chapter-type","embeddable":true,"href":"https:\/\/pressbooks.oer.hawaii.edu\/oertraining2018\/wp-json\/pressbooks\/v2\/chapter-type?post=61"},{"taxonomy":"contributor","embeddable":true,"href":"https:\/\/pressbooks.oer.hawaii.edu\/oertraining2018\/wp-json\/wp\/v2\/contributor?post=61"},{"taxonomy":"license","embeddable":true,"href":"https:\/\/pressbooks.oer.hawaii.edu\/oertraining2018\/wp-json\/wp\/v2\/license?post=61"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}