{"id":14084,"date":"2019-07-27T16:01:06","date_gmt":"2019-07-27T21:01:06","guid":{"rendered":"http:\/\/cat.xula.edu\/food\/?p=14084"},"modified":"2021-09-26T12:46:05","modified_gmt":"2021-09-26T17:46:05","slug":"brightspace-accessibility-tip-alt-text","status":"publish","type":"post","link":"https:\/\/cat.xula.edu\/food\/brightspace-accessibility-tip-alt-text\/","title":{"rendered":"Brightspace Accessibility Tip: Alt Text"},"content":{"rendered":"<p>Brightspace, our Learning Management System (LMS), was designed with accessibility in mind. However, it is the responsibility of the instructor and\/or course designer to ensure their course content is formatted using best practices for accessibility; including the use of good heading structure, text formatting, contrast and color, descriptive links, alternative text, tables, lists, etc.<\/p>\n<p>I am writing a series of accessibility related blog posts that will provide suggestions on how you can make small changes when creating course content to make it accessible. This is the fourth tip in my series of <a href=\"http:\/\/cat.xula.edu\/food\/topic\/accessibility-kneads\/\">accessibility<\/a> related blog posts and it focuses on alternative text (alt text). <\/p>\n<p><div align=\"center\"> <a href=\"https:\/\/www.flickr.com\/photos\/182343195@N08\/49520245268\" title=\"blind student using screen reader\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" src=\"https:\/\/i0.wp.com\/live.staticflickr.com\/65535\/49520245268_ede5d3ea2a_b.jpg?resize=512%2C384&#038;ssl=1\" alt=\"blind female student listening to screen reader describe information on his computer screen\" height=\"384\" width=\"512\"><\/a>\n<\/div>\n<\/p>\n<p>Computers can read text on a screen but images, graphs, and charts are meaningless to visually impaired users. Alt text is an alternate method for supplying information about images to users who are visually impaired. <\/p>\n<p>Alt text is important for screen reader users because a screen reader cannot describe an image. Since screen reader software cannot interpret images, it relies on alt text to communicate image information to the user. When an image does not have alt text the only information the screen reader can relay is that there is an image on the page and provide the file name for the image. <\/p>\n<p>Alt text should describe an image so it makes sense in context. If a picture is worth a thousand words, then a short alt text description may be a poor substitute. While a concise alt text description is important, the alt text should be less than 125 characters. You want to think about what is the most important information you are trying to get across with the image and stay within the 124 or less characters. If the image requires a lengthy description, you should describe the image in the content of the page.<\/p>\n<p>There are several ways to handle complex images (e.g. charts, data, statistics, etc.) where a short description is not possible. The best solution is to include a thorough description of the complex image in the content of the page, immediately before or after the image. If you don't want to add more content to your page, another preferred alternative would be to create another web page with just a description of the complex image and link to it near the image. Additionally, text descriptions of graphs and charts can help all students understand difficult concepts. <\/p>\n<p>How alt text is written will vary depending on the type of image. Most screen reader software announces the presence of an image by appending a word such as \"graphic\" to the alt text, so using words such as \"image\" \"graphic\" and \"photo\" are unnecessary in the alt text, unless it helps to convey further meaning important for a user to know.<\/p>\n<p>Consider this example which uses \u201cGuide Dog and Man\u201d as the alt text:<\/p>\n<p><div align=\"center\"> <a href=\"https:\/\/i0.wp.com\/www.ssa.gov\/accessibility\/checklists\/img\/Missing_Alt_Text_Picture_eg_incorrect.png\" title=\"example of incorrect use of alt text\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" src=\"https:\/\/i0.wp.com\/www.ssa.gov\/accessibility\/checklists\/img\/Missing_Alt_Text_Picture_eg_incorrect.png?resize=536%2C294\" alt=\"example of incorrect use of alt text\" height=\"294\" width=\"536\"><\/a>\n<\/div>\n<\/p>\n<p>The alt text \u201cGuide Dog and Man\u201d is not effective if the intent is to show the dynamic action of guiding in the picture. In this situation a better alt text description is \u201cA guide dog leads the way with her handler holding the guide harness in his left hand\u201d as shown in the following example: <\/p>\n<p><div align=\"center\"> <a href=\"https:\/\/i0.wp.com\/www.ssa.gov\/accessibility\/checklists\/img\/Missing_Alt_Text_Picture_eg_correct.png\" title=\"example of correct use of alt text\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" src=\"https:\/\/i0.wp.com\/www.ssa.gov\/accessibility\/checklists\/img\/Missing_Alt_Text_Picture_eg_correct.png?resize=544%2C294\" alt=\"example of correct use of alt text\" height=\"294\" width=\"544\"><\/a>\n<\/div>\n<\/p>\n<p>There is no need to include \"image of,\" \"picture of,\" or \"photo of\" in the alt text in this example because the screen reader will announce the presence of the image.<\/p>\n<p>Additionally, images that contain text (as in a logo) should generally be coded to just include that text as the alt text. <\/p>\n<p>Many images are used only for visual interest, they aren't meant to convey any meaning or important information. In this case, it is best to use what is called NULL alt text or empty alt text. This is done by entering two quotes (\"\") with no spaces in between in the alt text box.<\/p>\n<p>So, how can you add alt text to images? Listed below are instructions on adding alt text in MS Word documents, PowerPoint presentations, Google Docs and Slides, as well as in Brightspace.<\/p>\n<h3>Add Alt Text to image in MS Word and PowerPoint 2013:<\/h3>\n<ol>\n<li>PC users: right-click on an image<br \/>\nMac users: press control key and click on the image<\/li>\n<li>Select <strong>Format Picture<\/strong><\/li>\n<li>Select the option for Alt Text<\/li>\n<li>Type your alt text in the description field. Leave the Title field blank.<\/li>\n<\/ol>\n<p><div align=\"center\"> <a href=\"https:\/\/i0.wp.com\/webaim.org\/techniques\/powerpoint\/media\/alt-description.jpg?ssl=1\" title=\"example of alt text in MS Word and PowerPoint\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" src=\"https:\/\/i0.wp.com\/webaim.org\/techniques\/powerpoint\/media\/alt-description.jpg?resize=228%2C349&#038;ssl=1\" alt=\"example of alt text in MS Word and PowerPoint\" height=\"349\" width=\"228\"><\/a>\n<\/div>\n<\/p>\n<h3>Add Alt Text to image in Google Docs and Slides:<\/h3>\n<ol>\n<li>PC users: right-click on an image<br \/>\nMac users: press control key and click on the image<\/li>\n<li>Select <strong>Alt text<\/strong><\/li>\n<li>Enter title and description<\/li>\n<li>Click Ok<\/li>\n<\/ol>\n<p><div align=\"center\"> <a href=\"https:\/\/i0.wp.com\/cat.xula.edu\/food\/wp-content\/uploads\/2019\/07\/alt-text-Google.png\" title=\"example of alt text in Google Docs\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" src=\"https:\/\/i0.wp.com\/cat.xula.edu\/food\/wp-content\/uploads\/2019\/07\/alt-text-Google.png?resize=417%2C300\" alt=\"example of alt text in Google Docs\" height=\"300\" width=\"417\"><\/a>\n<\/div>\n<\/p>\n<h3>Add Alt Text to image in Brightspace:<\/h3>\n<p>When adding an image you will be prompted to provide alternative text. Enter the ALT Text in the <strong>Alternative Text<\/strong> field. When an image is decorative, simply check the image is decorative box.<\/p>\n<p align=\"center\"> <a href=\"https:\/\/i0.wp.com\/cat.xula.edu\/food\/wp-content\/uploads\/2019\/07\/alt-text-d2l.png\" title=\"example of alt text in HTML Editor\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" src=\"https:\/\/i0.wp.com\/cat.xula.edu\/food\/wp-content\/uploads\/2019\/07\/alt-text-d2l.png?resize=430%2C349\" alt=\"example of alt text in HTML Editor\" height=\"349\" width=\"430\"><\/a>\n<\/p>\n<p>You will remove significant barriers for the visually impaired if you take these suggestions for adding alt text into consideration when creating course content. An added bonus is that if you take the extra step to include alt text when creating your course content you will be ahead of the game in the event you do have a visually impaired student.<\/p>\n<p>Additional information about alt text can be found at:<\/p>\n<ul>\n<li><a href=\"http:\/\/webaim.org\/techniques\/alttext\/\">WebAIM Alternative Text<\/a><\/li>\n<li><a href=\"https:\/\/www.ssa.gov\/accessibility\/files\/SSA_Alternative_Text_Guide.pdf\">SSA Alternate Text for Images Guide (PDF)<\/a><\/li>\n<li><a href=\"http:\/\/cat.xula.edu\/food\/brightspace-accessibility-tip-when-alt-text-is-not-enough\/\">Describing Complex Images<\/a><\/li>\n<li><a href=\"https:\/\/jakearchibald.com\/2021\/great-alt-text\/\">Writing Great Alt Text: Emotion Matters<\/a><\/li>\n<li><a href=\"https:\/\/community.brightspace.com\/s\/article\/3-Keys-to-More-Accessible-Written-Communications\">3 Keys to More Accessible Written Communications<\/a><\/li>\n<\/ul>\n<p><small>Image credit:<br \/>\n\"<a href=\"https:\/\/www.flickr.com\/photos\/182343195@N08\/49520245268\">Stephanie using visual impairment simulation glasses<\/a>\" by emilylocaldigital is licensed under <a href=\"https:\/\/creativecommons.org\/licenses\/by-nc-sa\/2.0\/\">CC BY-NC-SA 2.0<\/a><\/small><\/p>\n<p><small>Updated: 9\/26\/2021<\/small><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Brightspace, our Learning Management System (LMS), was designed with accessibility in mind. However, it is the responsibility of the instructor and\/or course designer to ensure their course content is formatted using best practices for accessibility; including the use of good heading structure, text formatting, contrast and color, descriptive links, alternative text, tables, lists, etc. I <a href=\"https:\/\/cat.xula.edu\/food\/brightspace-accessibility-tip-alt-text\/\" class=\"more-link\">...continue reading<span class=\"screen-reader-text\"> \"Brightspace Accessibility Tip: Alt Text\"<\/span><\/a><\/p>\n","protected":false},"author":5,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[2,403,14],"tags":[16],"class_list":{"0":"post-14084","1":"post","2":"type-post","3":"status-publish","4":"format-standard","6":"category-accessibility-kneads","7":"category-brightspace","8":"category-tech-tips-a-la-carte","9":"tag-accessibility","10":"h-entry","11":"hentry","12":"h-as-article"},"jetpack_publicize_connections":[],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p82MQk-3Fa","jetpack-related-posts":[{"id":22237,"url":"https:\/\/cat.xula.edu\/food\/brightspace-accessibility-tip-when-alt-text-is-not-enough-2\/","url_meta":{"origin":14084,"position":0},"title":"Brightspace Accessibility Tip: When &#8220;Alt Text&#8221; is not Enough","author":"Janice Florent","date":"March 2, 2026","format":false,"excerpt":"Brightspace, our Learning Management System (LMS), is designed with accessibility in mind. However, it is the responsibility of the instructor and\/or course designer to ensure their course content is formatted using best practices for accessibility; including the use of good heading structure, text formatting, contrast and color, descriptive links, alternative\u2026","rel":"","context":"In &quot;Accessibility Kneads&quot;","block_context":{"text":"Accessibility Kneads","link":"https:\/\/cat.xula.edu\/food\/topic\/accessibility-kneads\/"},"img":{"alt_text":"example of a infographic","src":"https:\/\/i0.wp.com\/live.staticflickr.com\/3911\/14856982297_f0eca53ac1.jpg?resize=350%2C200&ssl=1","width":350,"height":200},"classes":[]},{"id":14088,"url":"https:\/\/cat.xula.edu\/food\/brightspace-accessibility-tip-when-alt-text-is-not-enough\/","url_meta":{"origin":14084,"position":1},"title":"Brightspace Accessibility Tip: When &#8220;Alt Text&#8221; is not Enough","author":"Janice Florent","date":"July 28, 2019","format":false,"excerpt":"Brightspace, our Learning Management System (LMS), was designed with accessibility in mind. However, it is the responsibility of the instructor and\/or course designer to ensure their course content is formatted using best practices for accessibility; including the use of good heading structure, text formatting, contrast and color, descriptive links, alternative\u2026","rel":"","context":"In &quot;Accessibility Kneads&quot;","block_context":{"text":"Accessibility Kneads","link":"https:\/\/cat.xula.edu\/food\/topic\/accessibility-kneads\/"},"img":{"alt_text":"example of a infographic","src":"https:\/\/i0.wp.com\/live.staticflickr.com\/3911\/14856982297_f0eca53ac1.jpg?resize=350%2C200&ssl=1","width":350,"height":200},"classes":[]},{"id":22219,"url":"https:\/\/cat.xula.edu\/food\/brightspace-accessibility-tip-alt-text-2\/","url_meta":{"origin":14084,"position":2},"title":"Brightspace Accessibility Tip: Alt Text","author":"Janice Florent","date":"March 1, 2026","format":false,"excerpt":"Brightspace, our Learning Management System (LMS), is designed with accessibility in mind. However, it is the responsibility of the instructor and\/or course designer to ensure their course content is formatted using best practices for accessibility; including the use of good heading structure, text formatting, contrast and color, descriptive links, alternative\u2026","rel":"","context":"In &quot;Accessibility Kneads&quot;","block_context":{"text":"Accessibility Kneads","link":"https:\/\/cat.xula.edu\/food\/topic\/accessibility-kneads\/"},"img":{"alt_text":"Visually impaired student listening to screen reader describe information on computer screen","src":"https:\/\/i0.wp.com\/live.staticflickr.com\/1892\/29592600237_639b9c8969_z.jpg?resize=350%2C200&ssl=1","width":350,"height":200},"classes":[]},{"id":14006,"url":"https:\/\/cat.xula.edu\/food\/brightspace-accessibility-tip-text-formatting\/","url_meta":{"origin":14084,"position":3},"title":"Brightspace Accessibility Tip: Text Formatting","author":"Janice Florent","date":"July 18, 2019","format":false,"excerpt":"Brightspace, our Learning Management System (LMS), was designed with accessibility in mind. However, it is the responsibility of the instructor and\/or course designer to ensure their course content is formatted using best practices for accessibility; including the use of good heading structure, text formatting, contrast and color, descriptive links, alternative\u2026","rel":"","context":"In &quot;Accessibility Kneads&quot;","block_context":{"text":"Accessibility Kneads","link":"https:\/\/cat.xula.edu\/food\/topic\/accessibility-kneads\/"},"img":{"alt_text":"image showing contrasting text that is effective and text that is not effective","src":"https:\/\/i0.wp.com\/pages.mtu.edu\/~nilufer\/classes\/cs3611\/interesting-stuff\/designing-with-colors-1\/clrart2.jpg?resize=350%2C200&ssl=1","width":350,"height":200},"classes":[]},{"id":14168,"url":"https:\/\/cat.xula.edu\/food\/brightspace-accessibility-tip-lists\/","url_meta":{"origin":14084,"position":4},"title":"Brightspace Accessibility Tip: Lists","author":"Janice Florent","date":"August 6, 2019","format":false,"excerpt":"Brightspace, our Learning Management System (LMS), was designed with accessibility in mind. However, it is the responsibility of the instructor and\/or course designer to ensure their course content is formatted using best practices for accessibility; including the use of good heading structure, text formatting, contrast and color, descriptive links, alternative\u2026","rel":"","context":"In &quot;Accessibility Kneads&quot;","block_context":{"text":"Accessibility Kneads","link":"https:\/\/cat.xula.edu\/food\/topic\/accessibility-kneads\/"},"img":{"alt_text":"bulleted list","src":"https:\/\/i0.wp.com\/cat.xula.edu\/food\/wp-content\/uploads\/2019\/08\/Lists-Example.png?resize=350%2C200","width":350,"height":200},"classes":[]},{"id":22174,"url":"https:\/\/cat.xula.edu\/food\/brightspace-accessibility-tip-text-formatting-2\/","url_meta":{"origin":14084,"position":5},"title":"Brightspace Accessibility Tip: Text Formatting","author":"Janice Florent","date":"February 19, 2026","format":false,"excerpt":"Brightspace, our Learning Management System (LMS), is designed with accessibility in mind. However, it is the responsibility of the instructor and\/or course designer to ensure their course content is formatted using best practices for accessibility; including the use of good heading structure, text formatting, contrast and color, descriptive links, alternative\u2026","rel":"","context":"In &quot;Accessibility Kneads&quot;","block_context":{"text":"Accessibility Kneads","link":"https:\/\/cat.xula.edu\/food\/topic\/accessibility-kneads\/"},"img":{"alt_text":"image showing contrasting text that is effective and text that is not effective","src":"https:\/\/i0.wp.com\/pages.mtu.edu\/~nilufer\/classes\/cs3611\/interesting-stuff\/designing-with-colors-1\/clrart2.jpg?resize=350%2C200&ssl=1","width":350,"height":200},"classes":[]}],"_links":{"self":[{"href":"https:\/\/cat.xula.edu\/food\/wp-json\/wp\/v2\/posts\/14084","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cat.xula.edu\/food\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/cat.xula.edu\/food\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/cat.xula.edu\/food\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/cat.xula.edu\/food\/wp-json\/wp\/v2\/comments?post=14084"}],"version-history":[{"count":29,"href":"https:\/\/cat.xula.edu\/food\/wp-json\/wp\/v2\/posts\/14084\/revisions"}],"predecessor-version":[{"id":17464,"href":"https:\/\/cat.xula.edu\/food\/wp-json\/wp\/v2\/posts\/14084\/revisions\/17464"}],"wp:attachment":[{"href":"https:\/\/cat.xula.edu\/food\/wp-json\/wp\/v2\/media?parent=14084"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/cat.xula.edu\/food\/wp-json\/wp\/v2\/categories?post=14084"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/cat.xula.edu\/food\/wp-json\/wp\/v2\/tags?post=14084"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}