{"id":493,"date":"2025-01-07T09:00:43","date_gmt":"2025-01-07T09:00:43","guid":{"rendered":"https:\/\/blogs.bath.ac.uk\/digital-content-and-development\/?p=493"},"modified":"2025-01-06T14:44:17","modified_gmt":"2025-01-06T14:44:17","slug":"what-weve-learned-about-alt-text","status":"publish","type":"post","link":"https:\/\/blogs.bath.ac.uk\/digital-content-and-development\/2025\/01\/07\/what-weve-learned-about-alt-text\/","title":{"rendered":"What we\u2019ve learned about alt text"},"content":{"rendered":"<p><span data-contrast=\"auto\">We\u2019ve been working on new digital accessibility guidance for everyone at the University to use. The guidance doesn\u2019t just cover the website \u2013 you'll also find out how to create accessible:<\/span><span data-ccp-props=\"{}\">\u00a0<\/span><\/p>\n<ul>\n<li>images<\/li>\n<li>emails<\/li>\n<li>documents<\/li>\n<li>video and audio<\/li>\n<\/ul>\n<p><span data-contrast=\"auto\">One of the things we needed to get to grips with when putting together this guidance was alternative text. You\u2019ve probably seen the phrase \u2018alt text\u2019 while browsing the web or checking your Instagram. Or maybe you\u2019re a web editor who writes alt text on the regular. But do you really understand why we need to use alt text? Or when to use it and when not to?<\/span><span data-ccp-props=\"{}\">\u00a0<\/span><\/p>\n<h1><span class=\"TextRun SCXW258019280 BCX0\" lang=\"EN-GB\" xml:lang=\"EN-GB\" data-contrast=\"none\"><span class=\"NormalTextRun CommentStart SCXW258019280 BCX0\" data-ccp-charstyle=\"Heading 1 Char\">How we put together our alt text guidance<\/span><\/span><span class=\"LineBreakBlob BlobObject DragDrop SCXW258019280 BCX0\"><span class=\"SCXW258019280 BCX0\">\u00a0<\/span><br class=\"SCXW258019280 BCX0\" \/><\/span><\/h1>\n<p><span class=\"LineBreakBlob BlobObject DragDrop SCXW258019280 BCX0\"><span class=\"SCXW258019280 BCX0\">A<\/span><\/span><span class=\"TextRun SCXW258019280 BCX0\" lang=\"EN-GB\" xml:lang=\"EN-GB\" data-contrast=\"auto\"><span class=\"NormalTextRun SCXW258019280 BCX0\">lt text<\/span> <span class=\"NormalTextRun SCXW258019280 BCX0\">is <\/span><span class=\"NormalTextRun SCXW258019280 BCX0\">added to digital images <\/span><span class=\"NormalTextRun CommentStart SCXW258019280 BCX0\">to <\/span><span class=\"NormalTextRun SCXW258019280 BCX0\">describe them to people who <\/span><span class=\"NormalTextRun SCXW258019280 BCX0\">can\u2019t<\/span><span class=\"NormalTextRun SCXW258019280 BCX0\"> see them<\/span><span class=\"NormalTextRun SCXW258019280 BCX0\">. As a <\/span><span class=\"NormalTextRun SCXW258019280 BCX0\">u<\/span><span class=\"NormalTextRun CommentStart SCXW258019280 BCX0\">niversity<\/span><span class=\"NormalTextRun SCXW258019280 BCX0\">, <\/span><span class=\"NormalTextRun SCXW258019280 BCX0\">we're<\/span><span class=\"NormalTextRun SCXW258019280 BCX0\"> legally required to make the content on our website as accessible as possible. <\/span><\/span><span class=\"LineBreakBlob BlobObject DragDrop SCXW258019280 BCX0\"><span class=\"SCXW258019280 BCX0\">\u00a0<\/span><br class=\"SCXW258019280 BCX0\" \/><\/span><span class=\"LineBreakBlob BlobObject DragDrop SCXW258019280 BCX0\"><span class=\"SCXW258019280 BCX0\">\u00a0<\/span><br class=\"SCXW258019280 BCX0\" \/><\/span><span class=\"TextRun SCXW258019280 BCX0\" lang=\"EN-GB\" xml:lang=\"EN-GB\" data-contrast=\"auto\"><span class=\"NormalTextRun SCXW258019280 BCX0\">When we<\/span><span class=\"NormalTextRun SCXW258019280 BCX0\"> started working on the content for our digital accessibility guidance,<\/span><span class=\"NormalTextRun SCXW258019280 BCX0\"> we had various discussions<\/span><span class=\"NormalTextRun SCXW258019280 BCX0\"> as a team<\/span><span class=\"NormalTextRun SCXW258019280 BCX0\"> about alt text <\/span><span class=\"NormalTextRun SCXW258019280 BCX0\">best practice <\/span><span class=\"NormalTextRun SCXW258019280 BCX0\">and <\/span><span class=\"NormalTextRun SCXW258019280 BCX0\">how we want<\/span><span class=\"NormalTextRun SCXW258019280 BCX0\">ed<\/span> <span class=\"NormalTextRun SCXW258019280 BCX0\">everyone at the University to use it.<\/span><span class=\"NormalTextRun SCXW258019280 BCX0\"> This included discussing if every image should have alt text or not<\/span><span class=\"NormalTextRun SCXW258019280 BCX0\">.<\/span> <span class=\"NormalTextRun SCXW258019280 BCX0\">D<\/span><span class=\"NormalTextRun SCXW258019280 BCX0\">uring our alt text journey<\/span><span class=\"NormalTextRun SCXW258019280 BCX0\">, <\/span><span class=\"NormalTextRun SCXW258019280 BCX0\">we learnt that <\/span><span class=\"NormalTextRun SCXW258019280 BCX0\">it<\/span> <span class=\"NormalTextRun AdvancedProofingIssueV2Themed SCXW258019280 BCX0\">actually<\/span><span class=\"NormalTextRun AdvancedProofingIssueV2Themed SCXW258019280 BCX0\"> depends<\/span><span class=\"NormalTextRun SCXW258019280 BCX0\"> on the context of the page and if adding alt text would add value to t<\/span><span class=\"NormalTextRun SCXW258019280 BCX0\">he <\/span><span class=\"NormalTextRun SCXW258019280 BCX0\">user<\/span><span class=\"NormalTextRun SCXW258019280 BCX0\">.<\/span><\/span><span class=\"EOP SCXW258019280 BCX0\" data-ccp-props=\"{}\">\u00a0<\/span><\/p>\n<h1><span data-contrast=\"none\">Rethinking decorative images<\/span><span data-ccp-props=\"{&quot;134245418&quot;:true,&quot;134245529&quot;:true,&quot;335559738&quot;:240,&quot;335559739&quot;:0}\">\u00a0<\/span><\/h1>\n<p><span data-contrast=\"auto\">A good example of when you don\u2019t need to use alt text on Typecase is on decorative images. Decorative images don\u2019t add any valuable information, they're just used to make your page look visually appealing. The full-width Hero images we use at the top of web pages are an example of a decorative image.\u00a0<\/span><span data-ccp-props=\"{}\">\u00a0<\/span><\/p>\n<p><span data-contrast=\"auto\">By marking an image as decorative, assistive technology won\u2019t tell the user there\u2019s an image there, so people who are visually impaired don\u2019t have to listen to a description of an image that adds no useful information to the page. This goes for <\/span><a href=\"https:\/\/www.bath.ac.uk\/guides\/making-images-on-a-web-page-accessible\/\"><span data-contrast=\"none\">any other image added to a web page<\/span><\/a><span data-contrast=\"auto\"> to make it look pretty.<\/span><span data-ccp-props=\"{}\">\u00a0<\/span><\/p>\n<h1><span data-contrast=\"none\">The dilemma about describing people<\/span><span data-ccp-props=\"{&quot;134245418&quot;:true,&quot;134245529&quot;:true,&quot;335559738&quot;:240,&quot;335559739&quot;:0}\">\u00a0<\/span><\/h1>\n<p><span data-contrast=\"auto\">Another important point that we needed to approach was how to describe people in an image. When writing alt text about people\u2019s characteristics, should we be describing things like race, ethnicity, or gender to improve diversity and share these characteristics with a wider audience? Or should we avoid describing people using assumptions based on their appearance?<\/span><span data-ccp-props=\"{}\">\u00a0<\/span><\/p>\n<h2><span data-contrast=\"none\">What other people do<\/span><span data-ccp-props=\"{&quot;134245418&quot;:true,&quot;134245529&quot;:true,&quot;335559738&quot;:40,&quot;335559739&quot;:0}\">\u00a0<\/span><\/h2>\n<p><span data-contrast=\"auto\">We decided to have a look at what other organisations recommended, reading guidance from other universities and organisation websites like <\/span><a href=\"https:\/\/design102.blog.gov.uk\/2022\/01\/14\/whats-the-alternative-how-to-write-good-alt-text\/\"><span data-contrast=\"none\">gov.uk<\/span><\/a><span data-contrast=\"auto\"> and <\/span><a href=\"https:\/\/www.w3.org\/WAI\/standards-guidelines\/wcag\/\"><span data-contrast=\"none\">WCAG (Web Content Accessibility Guidelines)<\/span><\/a><span data-contrast=\"auto\">.\u00a0<\/span><span data-ccp-props=\"{}\">\u00a0<\/span><\/p>\n<p><span data-contrast=\"none\">In October, some of the Digital Content team went to the <\/span><a href=\"https:\/\/www.contentedlive.com\/\"><span data-contrast=\"none\">ContentEd conference<\/span><\/a><span data-contrast=\"none\"> and joined a group discussion about alt text with people from other universities. The group were debating how to describe people in alt text, and it was interesting to see that other organisations were going through the same journey of discovery as us. The group didn't reach a clear decision about it and some people suggested that it's better to describe people, even if you don't know how they identify, for the sake of diversity, and be open and honest about it if they say you got it wrong.<\/span><span data-ccp-props=\"{}\">\u00a0<\/span><\/p>\n<p><span data-contrast=\"auto\">This research and the group discussions were very useful and have helped us with our guidance, but we\u2019re still having ongoing discussions within the Content team, with colleagues in the office, and with ED&amp;I (Equality, Diversity and Inclusion) to work out the best way to describe people.<\/span><span data-ccp-props=\"{}\">\u00a0<\/span><\/p>\n<h2><span data-contrast=\"none\">Realising context is key<\/span><span data-ccp-props=\"{&quot;134245418&quot;:true,&quot;134245529&quot;:true,&quot;335559738&quot;:40,&quot;335559739&quot;:0}\">\u00a0<\/span><\/h2>\n<p><span data-contrast=\"auto\">The consensus we\u2019ve reached for now is that it\u2019s all about context. Only describe people in alt text if the context of the web page makes their race, gender, or another characteristic relevant, and be very careful not to make assumptions about the way people look.<\/span><span data-ccp-props=\"{}\">\u00a0<\/span><\/p>\n<p><span data-contrast=\"auto\">What\u2019s even better is if you know the people in the image. Then things become a lot easier! If you are taking photos or videos of people, ask them in writing how they'd like to be described. Then you know you\u2019re getting it right from the very start and not making any assumptions.<\/span><span data-ccp-props=\"{}\">\u00a0<\/span><\/p>\n<p><span data-contrast=\"auto\">To see an example in practice, here is an image of four postgraduate students on campus.\u00a0<\/span><span data-ccp-props=\"{}\"><br \/>\n<\/span><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone\" src=\"https:\/\/live.staticflickr.com\/65535\/53964882097_141a76f109_b_d.jpg\" alt=\"A diverse group of students laughing together on campus.\" width=\"1024\" height=\"576\" \/><\/p>\n<p><span class=\"TextRun SCXW190135584 BCX0\" lang=\"EN-GB\" xml:lang=\"EN-GB\" data-contrast=\"auto\"><span class=\"NormalTextRun SCXW190135584 BCX0\">When writing alt text for this image, you might be unsure on how much to mention about the <\/span><span class=\"NormalTextRun SCXW190135584 BCX0\">characteristics<\/span><span class=\"NormalTextRun SCXW190135584 BCX0\"> of the students. This is a good ex<\/span><span class=\"NormalTextRun SCXW190135584 BCX0\">ample of when you should think about the context of the page.<\/span><\/span><span class=\"EOP SCXW190135584 BCX0\" data-ccp-props=\"{}\">\u00a0<\/span><\/p>\n<p><span data-contrast=\"auto\">If it\u2019s on a general postgraduate student recruitment page, it probably isn\u2019t necessary to mention the race and gender of the students. In fact, you could even mark it as decorative as it doesn\u2019t add any additional information to the page.<\/span><span data-ccp-props=\"{}\">\u00a0<\/span><\/p>\n<p><span data-contrast=\"auto\">However, if this image was on a page about diversity on campus, the alt text would describe the race and gender of each student.<\/span><span data-ccp-props=\"{}\">\u00a0<\/span><\/p>\n<p><span data-contrast=\"auto\">Check out this article to find some <a href=\"https:\/\/www.makethingsaccessible.com\/guides\/alternative-text-race-gender-and-physical-descriptions\/.\">good examples of writing alt text for people<\/a>.\u00a0<\/span><\/p>\n<h1><span data-contrast=\"none\">Keeping up to date with accessibility<\/span><span data-ccp-props=\"{&quot;134245418&quot;:true,&quot;134245529&quot;:true,&quot;335559738&quot;:240,&quot;335559739&quot;:0}\">\u00a0<\/span><\/h1>\n<p><span data-contrast=\"auto\">As we're legally required to make our website content accessible to all users, it\u2019s vital that we stay up to date with the latest accessibility guidelines. This means that although this guidance is relevant right now, things may change in the future.\u00a0<\/span><span data-ccp-props=\"{}\">\u00a0<\/span><\/p>\n<p><span data-contrast=\"auto\">As discussions about diversity, alt text, and accessibility are ongoing, we will keep reviewing official recommendations and our views on alt text to make sure we\u2019re always doing what we think is right.<\/span><\/p>\n<h1><span data-contrast=\"none\">Find out more about digital accessibility<\/span><span data-ccp-props=\"{&quot;134245418&quot;:true,&quot;134245529&quot;:true,&quot;335559738&quot;:240,&quot;335559739&quot;:0}\">\u00a0<\/span><\/h1>\n<p><span data-contrast=\"auto\">We hope you\u2019ve found this blog post useful, and you feel confident to get out there and write some amazing alt text. If it\u2019s made you want to learn more, we\u2019ve published <a href=\"https:\/\/www.bath.ac.uk\/topics\/digital-accessibility-guidance\/\">digital accessibility guidance<\/a> so you can discover how to make your digital content accessible to everyone. <\/span><\/p>\n","protected":false},"excerpt":{"rendered":"<p>We\u2019ve been working on new digital accessibility guidance for everyone at the University to use. The guidance doesn\u2019t just cover the website \u2013 you'll also find out how to create accessible:\u00a0 images emails documents video and audio One of the...<\/p>\n","protected":false},"author":1907,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":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_post_was_ever_published":false},"categories":[39],"tags":[],"class_list":["post-493","post","type-post","status-publish","format-standard","hentry","category-accessibility"],"acf":[],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/blogs.bath.ac.uk\/digital-content-and-development\/wp-json\/wp\/v2\/posts\/493","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blogs.bath.ac.uk\/digital-content-and-development\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blogs.bath.ac.uk\/digital-content-and-development\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blogs.bath.ac.uk\/digital-content-and-development\/wp-json\/wp\/v2\/users\/1907"}],"replies":[{"embeddable":true,"href":"https:\/\/blogs.bath.ac.uk\/digital-content-and-development\/wp-json\/wp\/v2\/comments?post=493"}],"version-history":[{"count":0,"href":"https:\/\/blogs.bath.ac.uk\/digital-content-and-development\/wp-json\/wp\/v2\/posts\/493\/revisions"}],"wp:attachment":[{"href":"https:\/\/blogs.bath.ac.uk\/digital-content-and-development\/wp-json\/wp\/v2\/media?parent=493"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blogs.bath.ac.uk\/digital-content-and-development\/wp-json\/wp\/v2\/categories?post=493"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blogs.bath.ac.uk\/digital-content-and-development\/wp-json\/wp\/v2\/tags?post=493"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}