{"id":7721,"date":"2023-04-27T11:37:22","date_gmt":"2023-04-27T10:37:22","guid":{"rendered":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/?p=7721"},"modified":"2023-08-23T15:43:21","modified_gmt":"2023-08-23T14:43:21","slug":"text-contrast-made-easy","status":"publish","type":"post","link":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/2023\/04\/27\/text-contrast-made-easy\/","title":{"rendered":"How can we make accessible text colour choices at the University of Southampton?"},"content":{"rendered":"\n<p>When text does not have enough contrast, it is hard to read. This not only affects those who have a visual impairment but can also make situational impacts worse. For example, if we try to read text on a screen in poor lighting conditions (too much or too little light), low-contrast text can make it even more difficult.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"595\" height=\"304\" src=\"https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2021\/04\/nl-con-4.png?resize=595%2C304\" alt=\"\u201cYour feedback\u201d appears in white text with a yellow background, with a contrast ratio of 1.7:1. The image has a reflection of an open window on it, making the text much harder to read. In some places the contrast of the text is as low as 1.0001:1.\" class=\"wp-image-6165\" srcset=\"https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2021\/04\/nl-con-4.png?w=595&amp;ssl=1 595w, https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2021\/04\/nl-con-4.png?resize=300%2C153&amp;ssl=1 300w\" sizes=\"auto, (max-width: 595px) 100vw, 595px\" \/><figcaption class=\"wp-element-caption\">Text with insufficient contrast is even harder to read when we encounter situational impairments such as screen glare.<\/figcaption><\/figure>\n\n\n\n<p>In the latest <a class=\"\" href=\"https:\/\/webaim.org\/projects\/million\/\" target=\"_blank\" rel=\"noreferrer noopener\">WebAIM survey of the million most popular webpages<\/a>, low contrast text was found on 83.6% of pages. Here at the University of Southampton, materials uploaded to Blackboard have over 140,000 contrast issues and it\u2019s also common to find contrast issues on the University website.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>How do we measure text contrast?<\/strong><\/h2>\n\n\n\n<p id=\"paragraph_kTR80h2uyq_\">The <a class=\"\" href=\"https:\/\/www.w3.org\/\" target=\"_blank\" rel=\"noreferrer noopener\">Worldwide Web Consortium (W3C)<\/a> has a set of <a class=\"\" href=\"https:\/\/www.w3.org\/WAI\/\" target=\"_blank\" rel=\"noreferrer noopener\">Accessibility Guidelines<\/a>, which include a method for checking whether the background and text colour have enough contrast.<\/p>\n\n\n\n<p id=\"paragraph_7oR80houyq_\">In simple terms, this involves <a class=\"\" href=\"https:\/\/planetcalc.com\/7779\/\" target=\"_blank\" rel=\"noreferrer noopener\">comparing the relative luminance of the two colours<\/a>. The result is a contrast ratio. We should be aiming for a <a class=\"\" href=\"https:\/\/www.w3.org\/WAI\/WCAG21\/Understanding\/contrast-minimum.html\" target=\"_blank\" rel=\"noreferrer noopener\">contrast ratio of at least 4.5:1 or higher<\/a> between the background colour and the text colour to meet the minimum \u201cAA\u201d accessibility requirement. Ideally we should aim for a contrast ratio of <a class=\"\" href=\"https:\/\/www.w3.org\/WAI\/WCAG21\/Understanding\/contrast-enhanced\" target=\"_blank\" rel=\"noreferrer noopener\">7:1 or higher<\/a> to meet the enhanced \u201cAAA\u201d level.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>How can I check that I am using sufficient contrast?<\/strong><\/h2>\n\n\n\n<p id=\"paragraph_qsgmaQ1Ntl_\">If you use a University PC it\u2019s easy to find out if text, you are composing has sufficient contrast.<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>From Additional Software on the desktop, install the TPGi Colour Contrast Picker.<\/li>\n\n\n\n<li>When you open this tool, you can enter the code for a foreground and background colour or use the colour dropper to look up a colour.<\/li>\n\n\n\n<li>The tool will tell you if your colour combination passes the Web Content Accessibility Guideline for text contrast and at which level.<\/li>\n<\/ol>\n\n\n\n<figure class=\"wp-block-image size-full\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"662\" height=\"898\" src=\"https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2023\/04\/CCA.png?resize=662%2C898&#038;ssl=1\" alt=\"The foreground colour #FFFFFF is checked against the background colour #015A84. The tool shows an example text using this colour combination and the resulting contrast ratio of 7.5:1. It shows that all tests have passed, meeting the enhanced, AAA, level.\" class=\"wp-image-7722\" srcset=\"https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2023\/04\/CCA.png?w=662&amp;ssl=1 662w, https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2023\/04\/CCA.png?resize=221%2C300&amp;ssl=1 221w\" sizes=\"auto, (max-width: 662px) 100vw, 662px\" \/><figcaption class=\"wp-element-caption\">Checking the contrast of two colours using the TPGi Colour Contrast Picker.<\/figcaption><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Top tips<\/strong><\/h2>\n\n\n\n<p id=\"paragraph_llxBRppiIS_\">Here\u2019s a list of other useful strategies, tools and websites that can help you to present text in an accessible way.<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>A straightforward way to think about it is that dark text on a light background or light text on a dark background are likely to have sufficient contrast. For example, white text on a yellow background is highly unlikely to be sufficient, but black text on a yellow background should.<\/li>\n\n\n\n<li>If you are using the University brand, you can quickly find out <a class=\"\" href=\"https:\/\/matthewdeeprose.github.io\/matrix\/matrix.html\" target=\"_blank\" rel=\"noreferrer noopener\">which colour combinations meet accessibility guidelines<\/a>.<\/li>\n\n\n\n<li>If a colour combination does not have sufficient contrast, the <a class=\"\" href=\"https:\/\/contrast-finder.tanaguru.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">Tanaguru contrast finder<\/a> can help you to find accessible alternatives.<\/li>\n\n\n\n<li>Putting text over an image? The <a class=\"\" href=\"https:\/\/codepen.io\/yaphi1\/live\/oNbEqGV\" target=\"_blank\" rel=\"noreferrer noopener\">Optimal Overlay Finder<\/a> will help you identify what level of opacity should be added between the image and the text to ensure the text has sufficient contrast.<\/li>\n\n\n\n<li>Writing content with links but don\u2019t want to underline your links? Use the <a class=\"\" href=\"https:\/\/webaim.org\/resources\/linkcontrastchecker\/\" target=\"_blank\" rel=\"noreferrer noopener\">WebAIM Link Contrast Checker<\/a> to find out if you have enough contrast between the body text and link text so that there is sufficient contrast that an underline would not be necessary.<\/li>\n<\/ol>\n","protected":false},"excerpt":{"rendered":"<p>Simple tools and techniques are available that help University of Southampton staff make accessible colour choices when presenting text.<\/p>\n","protected":false},"author":918,"featured_media":7724,"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":[209,3],"tags":[86,284,260,261],"class_list":["post-7721","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-accessibility","category-creating-content","tag-accessibility","tag-ask-us","tag-colour","tag-contrast"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.4 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>How can we make accessible text colour choices at the University of Southampton? - Digital Learning<\/title>\n<meta name=\"description\" content=\"Simple tools and techniques are available that help University of Southampton staff make accessible colour choices when presenting text.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/2023\/04\/27\/text-contrast-made-easy\/\" \/>\n<meta property=\"og:locale\" content=\"en_GB\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How can we make accessible text colour choices at the University of Southampton? - Digital Learning\" \/>\n<meta property=\"og:description\" content=\"Simple tools and techniques are available that help University of Southampton staff make accessible colour choices when presenting text.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/2023\/04\/27\/text-contrast-made-easy\/\" \/>\n<meta property=\"og:site_name\" content=\"Digital Learning\" \/>\n<meta property=\"article:published_time\" content=\"2023-04-27T10:37:22+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-08-23T14:43:21+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2023\/04\/iStock-1253473993.jpg?fit=2235%2C1341&ssl=1\" \/>\n\t<meta property=\"og:image:width\" content=\"2235\" \/>\n\t<meta property=\"og:image:height\" content=\"1341\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Matthew Deeprose\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Matthew Deeprose\" \/>\n\t<meta name=\"twitter:label2\" content=\"Estimated reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/2023\\\/04\\\/27\\\/text-contrast-made-easy\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/2023\\\/04\\\/27\\\/text-contrast-made-easy\\\/\"},\"author\":{\"name\":\"Matthew Deeprose\",\"@id\":\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/#\\\/schema\\\/person\\\/ae2be621ff6c68cce6b17ee35c53f496\"},\"headline\":\"How can we make accessible text colour choices at the University of Southampton?\",\"datePublished\":\"2023-04-27T10:37:22+00:00\",\"dateModified\":\"2023-08-23T14:43:21+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/2023\\\/04\\\/27\\\/text-contrast-made-easy\\\/\"},\"wordCount\":525,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/2023\\\/04\\\/27\\\/text-contrast-made-easy\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/i0.wp.com\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/wp-content\\\/uploads\\\/sites\\\/321\\\/2023\\\/04\\\/iStock-1253473993.jpg?fit=2235%2C1341&ssl=1\",\"keywords\":[\"accessibility\",\"Ask us\",\"colour\",\"contrast\"],\"articleSection\":[\"Accessibility\",\"Creating content\"],\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/2023\\\/04\\\/27\\\/text-contrast-made-easy\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/2023\\\/04\\\/27\\\/text-contrast-made-easy\\\/\",\"url\":\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/2023\\\/04\\\/27\\\/text-contrast-made-easy\\\/\",\"name\":\"How can we make accessible text colour choices at the University of Southampton? - Digital Learning\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/2023\\\/04\\\/27\\\/text-contrast-made-easy\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/2023\\\/04\\\/27\\\/text-contrast-made-easy\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/i0.wp.com\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/wp-content\\\/uploads\\\/sites\\\/321\\\/2023\\\/04\\\/iStock-1253473993.jpg?fit=2235%2C1341&ssl=1\",\"datePublished\":\"2023-04-27T10:37:22+00:00\",\"dateModified\":\"2023-08-23T14:43:21+00:00\",\"description\":\"Simple tools and techniques are available that help University of Southampton staff make accessible colour choices when presenting text.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/2023\\\/04\\\/27\\\/text-contrast-made-easy\\\/#breadcrumb\"},\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/2023\\\/04\\\/27\\\/text-contrast-made-easy\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-GB\",\"@id\":\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/2023\\\/04\\\/27\\\/text-contrast-made-easy\\\/#primaryimage\",\"url\":\"https:\\\/\\\/i0.wp.com\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/wp-content\\\/uploads\\\/sites\\\/321\\\/2023\\\/04\\\/iStock-1253473993.jpg?fit=2235%2C1341&ssl=1\",\"contentUrl\":\"https:\\\/\\\/i0.wp.com\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/wp-content\\\/uploads\\\/sites\\\/321\\\/2023\\\/04\\\/iStock-1253473993.jpg?fit=2235%2C1341&ssl=1\",\"width\":\"2235\",\"height\":\"1341\",\"caption\":\"Sufficient contrast helps your text stand out and be accessible\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/2023\\\/04\\\/27\\\/text-contrast-made-easy\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How can we make accessible text colour choices at the University of Southampton?\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/#website\",\"url\":\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/\",\"name\":\"Digital Learning\",\"description\":\"Consult | Collaborate | Create\",\"publisher\":{\"@id\":\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-GB\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/#organization\",\"name\":\"Digital Learning\",\"url\":\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-GB\",\"@id\":\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/i2.wp.com\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/wp-content\\\/uploads\\\/sites\\\/321\\\/2017\\\/09\\\/cropped-dltdevice.png?fit=512%2C512\",\"contentUrl\":\"https:\\\/\\\/i2.wp.com\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/wp-content\\\/uploads\\\/sites\\\/321\\\/2017\\\/09\\\/cropped-dltdevice.png?fit=512%2C512\",\"width\":512,\"height\":512,\"caption\":\"Digital Learning\"},\"image\":{\"@id\":\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/#\\\/schema\\\/logo\\\/image\\\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/#\\\/schema\\\/person\\\/ae2be621ff6c68cce6b17ee35c53f496\",\"name\":\"Matthew Deeprose\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-GB\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/4ef22a6c313d2eb42c8def43382e11960074491c18f6ff43f4e1d68e1c90d37f?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/4ef22a6c313d2eb42c8def43382e11960074491c18f6ff43f4e1d68e1c90d37f?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/4ef22a6c313d2eb42c8def43382e11960074491c18f6ff43f4e1d68e1c90d37f?s=96&d=mm&r=g\",\"caption\":\"Matthew Deeprose\"},\"url\":\"https:\\\/\\\/generic.wordpress.soton.ac.uk\\\/digital-learning\\\/author\\\/matthew-deeprose\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How can we make accessible text colour choices at the University of Southampton? - Digital Learning","description":"Simple tools and techniques are available that help University of Southampton staff make accessible colour choices when presenting text.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/2023\/04\/27\/text-contrast-made-easy\/","og_locale":"en_GB","og_type":"article","og_title":"How can we make accessible text colour choices at the University of Southampton? - Digital Learning","og_description":"Simple tools and techniques are available that help University of Southampton staff make accessible colour choices when presenting text.","og_url":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/2023\/04\/27\/text-contrast-made-easy\/","og_site_name":"Digital Learning","article_published_time":"2023-04-27T10:37:22+00:00","article_modified_time":"2023-08-23T14:43:21+00:00","og_image":[{"width":2235,"height":1341,"url":"https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2023\/04\/iStock-1253473993.jpg?fit=2235%2C1341&ssl=1","type":"image\/jpeg"}],"author":"Matthew Deeprose","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Matthew Deeprose","Estimated reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/2023\/04\/27\/text-contrast-made-easy\/#article","isPartOf":{"@id":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/2023\/04\/27\/text-contrast-made-easy\/"},"author":{"name":"Matthew Deeprose","@id":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/#\/schema\/person\/ae2be621ff6c68cce6b17ee35c53f496"},"headline":"How can we make accessible text colour choices at the University of Southampton?","datePublished":"2023-04-27T10:37:22+00:00","dateModified":"2023-08-23T14:43:21+00:00","mainEntityOfPage":{"@id":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/2023\/04\/27\/text-contrast-made-easy\/"},"wordCount":525,"commentCount":0,"publisher":{"@id":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/#organization"},"image":{"@id":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/2023\/04\/27\/text-contrast-made-easy\/#primaryimage"},"thumbnailUrl":"https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2023\/04\/iStock-1253473993.jpg?fit=2235%2C1341&ssl=1","keywords":["accessibility","Ask us","colour","contrast"],"articleSection":["Accessibility","Creating content"],"inLanguage":"en-GB","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/2023\/04\/27\/text-contrast-made-easy\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/2023\/04\/27\/text-contrast-made-easy\/","url":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/2023\/04\/27\/text-contrast-made-easy\/","name":"How can we make accessible text colour choices at the University of Southampton? - Digital Learning","isPartOf":{"@id":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/#website"},"primaryImageOfPage":{"@id":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/2023\/04\/27\/text-contrast-made-easy\/#primaryimage"},"image":{"@id":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/2023\/04\/27\/text-contrast-made-easy\/#primaryimage"},"thumbnailUrl":"https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2023\/04\/iStock-1253473993.jpg?fit=2235%2C1341&ssl=1","datePublished":"2023-04-27T10:37:22+00:00","dateModified":"2023-08-23T14:43:21+00:00","description":"Simple tools and techniques are available that help University of Southampton staff make accessible colour choices when presenting text.","breadcrumb":{"@id":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/2023\/04\/27\/text-contrast-made-easy\/#breadcrumb"},"inLanguage":"en-GB","potentialAction":[{"@type":"ReadAction","target":["https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/2023\/04\/27\/text-contrast-made-easy\/"]}]},{"@type":"ImageObject","inLanguage":"en-GB","@id":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/2023\/04\/27\/text-contrast-made-easy\/#primaryimage","url":"https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2023\/04\/iStock-1253473993.jpg?fit=2235%2C1341&ssl=1","contentUrl":"https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2023\/04\/iStock-1253473993.jpg?fit=2235%2C1341&ssl=1","width":"2235","height":"1341","caption":"Sufficient contrast helps your text stand out and be accessible"},{"@type":"BreadcrumbList","@id":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/2023\/04\/27\/text-contrast-made-easy\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/"},{"@type":"ListItem","position":2,"name":"How can we make accessible text colour choices at the University of Southampton?"}]},{"@type":"WebSite","@id":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/#website","url":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/","name":"Digital Learning","description":"Consult | Collaborate | Create","publisher":{"@id":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-GB"},{"@type":"Organization","@id":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/#organization","name":"Digital Learning","url":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/","logo":{"@type":"ImageObject","inLanguage":"en-GB","@id":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/#\/schema\/logo\/image\/","url":"https:\/\/i2.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2017\/09\/cropped-dltdevice.png?fit=512%2C512","contentUrl":"https:\/\/i2.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2017\/09\/cropped-dltdevice.png?fit=512%2C512","width":512,"height":512,"caption":"Digital Learning"},"image":{"@id":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/#\/schema\/person\/ae2be621ff6c68cce6b17ee35c53f496","name":"Matthew Deeprose","image":{"@type":"ImageObject","inLanguage":"en-GB","@id":"https:\/\/secure.gravatar.com\/avatar\/4ef22a6c313d2eb42c8def43382e11960074491c18f6ff43f4e1d68e1c90d37f?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/4ef22a6c313d2eb42c8def43382e11960074491c18f6ff43f4e1d68e1c90d37f?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/4ef22a6c313d2eb42c8def43382e11960074491c18f6ff43f4e1d68e1c90d37f?s=96&d=mm&r=g","caption":"Matthew Deeprose"},"url":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/author\/matthew-deeprose\/"}]}},"jetpack_publicize_connections":[],"jetpack_featured_media_url":"https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2023\/04\/iStock-1253473993.jpg?fit=2235%2C1341&ssl=1","jetpack_shortlink":"https:\/\/wp.me\/paQv07-20x","jetpack_sharing_enabled":true,"jetpack_likes_enabled":true,"jetpack-related-posts":[{"id":6163,"url":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/2021\/04\/04\/how-can-i-use-colour-accessibly\/","url_meta":{"origin":7721,"position":0},"title":"How can I use colour accessibly?","author":"Matthew Deeprose","date":"4 April 2021","format":false,"excerpt":"The University of Kent runs a successful series of Digitally Enhanced Education webinars. One of which was on the theme of Technology to Develop Inclusive Learning Experiences. I presented \"Making it simple to ensure the use of colour is both on brand and accessible\". Watch the recording below or read\u2026","rel":"","context":"In &quot;Accessibility&quot;","block_context":{"text":"Accessibility","link":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/category\/creating-content\/accessibility\/"},"img":{"alt_text":"Colour contrast ratios we should use. 3:1 or higher for graphics, 4.5:1 of higher is the minimum for text. 7:1 or higher is meets an enhanced level.","src":"https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2021\/04\/ratios.png?fit=1200%2C580&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2021\/04\/ratios.png?fit=1200%2C580&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2021\/04\/ratios.png?fit=1200%2C580&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2021\/04\/ratios.png?fit=1200%2C580&ssl=1&resize=700%2C400 2x, https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2021\/04\/ratios.png?fit=1200%2C580&ssl=1&resize=1050%2C600 3x"},"classes":[]},{"id":6433,"url":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/2021\/07\/20\/ppt-design-ideas-part-3-contrast\/","url_meta":{"origin":7721,"position":1},"title":"Three ways PowerPoint&#8217;s &#8220;Design Ideas&#8221; excludes your audience, and how to fix it: Part 3 &#8211; Insufficient colour contrast.","author":"Matthew Deeprose","date":"20 July 2021","format":false,"excerpt":"Too little contrast between colours will not only make your presentation disagreeable, it also presents a barrier to many. Design ideas will sometimes suggest designs that do not have sufficient contrast between colours. In this article we explain this in more detail and how to fix it.","rel":"","context":"In &quot;Accessibility&quot;","block_context":{"text":"Accessibility","link":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/category\/creating-content\/accessibility\/"},"img":{"alt_text":"Human crowd forming a big number three on white background.","src":"https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2021\/07\/iStock-936347610.jpg?fit=683%2C512&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2021\/07\/iStock-936347610.jpg?fit=683%2C512&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2021\/07\/iStock-936347610.jpg?fit=683%2C512&ssl=1&resize=525%2C300 1.5x"},"classes":[]},{"id":7524,"url":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/2023\/02\/24\/tef-accessibility\/","url_meta":{"origin":7721,"position":2},"title":"How did we make the University\u2019s Teaching Excellence Framework (TEF) submission more accessible?","author":"Matthew Deeprose","date":"24 February 2023","format":false,"excerpt":"The process was a great learning exercise and provided hands-on experience for those involved in the principles of accessible documents.","rel":"","context":"In &quot;Accessibility&quot;","block_context":{"text":"Accessibility","link":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/category\/creating-content\/accessibility\/"},"img":{"alt_text":"Launching into accessibility with our TEF submission","src":"https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2023\/02\/iStock-1359000309-1.jpg?fit=1200%2C738&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2023\/02\/iStock-1359000309-1.jpg?fit=1200%2C738&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2023\/02\/iStock-1359000309-1.jpg?fit=1200%2C738&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2023\/02\/iStock-1359000309-1.jpg?fit=1200%2C738&ssl=1&resize=700%2C400 2x, https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2023\/02\/iStock-1359000309-1.jpg?fit=1200%2C738&ssl=1&resize=1050%2C600 3x"},"classes":[]},{"id":1570,"url":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/2019\/01\/28\/accessibility-for-articulate-storyline-are-you-wcag-compliant\/","url_meta":{"origin":7721,"position":3},"title":"Accessibility for Articulate storyline \u2013 Are you WCAG compliant?","author":"Mimi Lee","date":"28 January 2019","format":false,"excerpt":"Here in the Digital Media team, we are busy updating our eLearning content to meet the Web Content Accessibility Guideline (WCAG 2.1) AA level to ensure that our learning content is usable by the majority of learners. I am mindful that there are quite a few people throughout the University\u2026","rel":"","context":"In &quot;Accessibility&quot;","block_context":{"text":"Accessibility","link":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/category\/creating-content\/accessibility\/"},"img":{"alt_text":"Close up of a pen and a notebook.","src":"https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2018\/03\/aaron-burden-123584-unsplash.jpg?fit=1200%2C901&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2018\/03\/aaron-burden-123584-unsplash.jpg?fit=1200%2C901&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2018\/03\/aaron-burden-123584-unsplash.jpg?fit=1200%2C901&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2018\/03\/aaron-burden-123584-unsplash.jpg?fit=1200%2C901&ssl=1&resize=700%2C400 2x, https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2018\/03\/aaron-burden-123584-unsplash.jpg?fit=1200%2C901&ssl=1&resize=1050%2C600 3x"},"classes":[]},{"id":6418,"url":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/2021\/07\/20\/ppt-design-ideas-part-1-all-caps\/","url_meta":{"origin":7721,"position":4},"title":"Three ways PowerPoint&#8217;s &#8220;Design Ideas&#8221; excludes your audience, and how to fix it: Part 1 &#8211; Setting text in &#8220;all caps&#8221;.","author":"Matthew Deeprose","date":"20 July 2021","format":false,"excerpt":"Text in all caps can present a barrier to readers with dyslexia. Moreover, it slows down reading speed for all. Design Ideas will often set short bullet points in all caps. Find out how to fix this and more.","rel":"","context":"In &quot;Accessibility&quot;","block_context":{"text":"Accessibility","link":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/category\/creating-content\/accessibility\/"},"img":{"alt_text":"Human crowd forming a big number one on white background.","src":"https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2021\/07\/iStock-935760396.jpg?fit=683%2C512&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2021\/07\/iStock-935760396.jpg?fit=683%2C512&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2021\/07\/iStock-935760396.jpg?fit=683%2C512&ssl=1&resize=525%2C300 1.5x"},"classes":[]},{"id":1808,"url":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/2019\/04\/10\/ecoffee-sgh-universal-design-for-learning\/","url_meta":{"origin":7721,"position":5},"title":"ecoffee @ SGH: Universal Design for Learning","author":"Tamsyn Smith","date":"10 April 2019","format":false,"excerpt":"What is Universal Design for Learning? Why does UDL matter? To understand what Universal Design for Learning (UDL) is, firstly, we need to look back at the origins of Universal Design. Architect Ron Mace coined the term \"universal design\" to describe the concept of designing all products and the built\u2026","rel":"","context":"In &quot;Events&quot;","block_context":{"text":"Events","link":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/category\/events\/"},"img":{"alt_text":"Birds-eye view of people drinking coffee around a table with laptop and tablet used to represent ecoffee at SGH.","src":"https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2017\/07\/ecoffee%40sgh.jpg?fit=1000%2C607&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2017\/07\/ecoffee%40sgh.jpg?fit=1000%2C607&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2017\/07\/ecoffee%40sgh.jpg?fit=1000%2C607&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-content\/uploads\/sites\/321\/2017\/07\/ecoffee%40sgh.jpg?fit=1000%2C607&ssl=1&resize=700%2C400 2x"},"classes":[]}],"_links":{"self":[{"href":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-json\/wp\/v2\/posts\/7721","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-json\/wp\/v2\/users\/918"}],"replies":[{"embeddable":true,"href":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-json\/wp\/v2\/comments?post=7721"}],"version-history":[{"count":3,"href":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-json\/wp\/v2\/posts\/7721\/revisions"}],"predecessor-version":[{"id":8254,"href":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-json\/wp\/v2\/posts\/7721\/revisions\/8254"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-json\/wp\/v2\/media\/7724"}],"wp:attachment":[{"href":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-json\/wp\/v2\/media?parent=7721"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-json\/wp\/v2\/categories?post=7721"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/generic.wordpress.soton.ac.uk\/digital-learning\/wp-json\/wp\/v2\/tags?post=7721"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}