{"id":467,"date":"2023-05-23T13:54:51","date_gmt":"2023-05-23T11:54:51","guid":{"rendered":"https:\/\/ideance.net\/blog\/?p=467"},"modified":"2023-08-31T10:35:13","modified_gmt":"2023-08-31T08:35:13","slug":"accessibilite-ux-ui-design","status":"publish","type":"post","link":"https:\/\/ideance.net\/blog\/467\/accessibilite-ux-ui-design\/","title":{"rendered":"Ressources d&rsquo;accessibilit\u00e9 pour UX et UI designers"},"content":{"rendered":"<p>En mai 2023, j&rsquo;ai eu le plaisir d&rsquo;intervenir en conf\u00e9rence lors des <a href=\"https:\/\/uxdays.eu\/\">Flupa UX Days 2023<\/a> pour sensibiliser les professionnels du design num\u00e9rique et de l&rsquo;exp\u00e9rience utilisateur \u00e0 la prise en compte du handicap dans le num\u00e9rique : <a href=\"https:\/\/ideance.net\/blog\/497\/pourquoi-integrer-accessibilite-numerique-ux-days-2023\/\">Comprendre pourquoi et comment int\u00e9grer l\u2019accessibilit\u00e9 num\u00e9rique (vid\u00e9o et transcription)<\/a>.<\/p>\n<p>Lors de cette intervention, j&rsquo;ai rapidement fait r\u00e9f\u00e9rence \u00e0 quelques ressources pratiques, accessibles et didactiques \u00e0 destination des UX et\/ou UI designers. Afin de les retrouver plus rapidement, en voici un r\u00e9capitulatif. N&rsquo;h\u00e9sitez pas \u00e0 le commenter et \u00e0 le compl\u00e9ter d&rsquo;autres guides, checklists ou outils qui vous semblent pertinents.<\/p>\n<p><!--more--><\/p>\n<p class=\"emphasis\">Nous publierons \u00e9galement, ult\u00e9rieurement, sur ce blog, la pr\u00e9sentation, la vid\u00e9o et la transcription de cette conf\u00e9rence.<\/p>\n<h2 lang=\"en\"><a href=\"https:\/\/accessibility-for-teams.com\/accessibility-for-ux-designers\" hreflang=\"en\">Accessibility for UX and UI Designers<\/a><\/h2>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-470 size-large\" src=\"https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-for-ux-designers-1024x511.png\" alt=\"\" width=\"640\" height=\"319\" srcset=\"https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-for-ux-designers-1024x511.png 1024w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-for-ux-designers-300x150.png 300w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-for-ux-designers-768x383.png 768w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-for-ux-designers-1536x766.png 1536w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-for-ux-designers-18x9.png 18w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-for-ux-designers.png 1648w\" sizes=\"auto, (max-width: 640px) 100vw, 640px\" \/><\/p>\n<blockquote lang=\"en\"><p>This is a starter guide for UX and UI Designers about delivering accessible websites. As a designer you\u2019re an advocate for the user. You\u2019re responsible for making sure the product is useful and usable for all users, including those with disablities.<\/p><\/blockquote>\n<h2 lang=\"en\"><a href=\"http:\/\/accessibility.voxmedia.com\/#designers\" hreflang=\"en\">Accessibility Guidelines &#8211; The Checklist<\/a><\/h2>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-474 size-large\" src=\"https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-guidelines-designers-1024x511.png\" alt=\"\" width=\"640\" height=\"319\" srcset=\"https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-guidelines-designers-1024x511.png 1024w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-guidelines-designers-300x150.png 300w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-guidelines-designers-768x383.png 768w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-guidelines-designers-1536x766.png 1536w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-guidelines-designers-18x9.png 18w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-guidelines-designers.png 1648w\" sizes=\"auto, (max-width: 640px) 100vw, 640px\" \/><\/p>\n<blockquote lang=\"en\"><p>Making work accessible creates a better experience across the board. Use this checklist to help build accessibility into your process no matter your role or stage in a project.<\/p><\/blockquote>\n<h2 lang=\"en\"><a href=\"https:\/\/not-checklist.intopia.digital\/\" hreflang=\"en\">Accessibility Not-Checklist<\/a><\/h2>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-477 size-large\" src=\"https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-not-checklist-1024x447.png\" alt=\"\" width=\"640\" height=\"279\" srcset=\"https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-not-checklist-1024x447.png 1024w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-not-checklist-300x131.png 300w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-not-checklist-768x335.png 768w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-not-checklist-1536x671.png 1536w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-not-checklist-18x8.png 18w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-not-checklist.png 1882w\" sizes=\"auto, (max-width: 640px) 100vw, 640px\" \/><\/p>\n<blockquote lang=\"en\"><p>The Not-Checklist acts as a guide to make sure you haven\u2019t missed anything. If you\u2019re new to accessibility, the resource provides a foundation \u2013 it\u2019s an overview of what you\u2019ll need to consider, but it won\u2019t teach you WCAG from front to back.<\/p><\/blockquote>\n<h2><a href=\"https:\/\/design-accessible.fr\/\">Designer un web <strong>accessible et inclusif<\/strong><\/a><\/h2>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-479 size-large\" src=\"https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/design-accessible-1024x447.png\" alt=\"\" width=\"640\" height=\"279\" srcset=\"https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/design-accessible-1024x447.png 1024w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/design-accessible-300x131.png 300w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/design-accessible-768x335.png 768w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/design-accessible-1536x671.png 1536w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/design-accessible-18x8.png 18w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/design-accessible.png 1882w\" sizes=\"auto, (max-width: 640px) 100vw, 640px\" \/><\/p>\n<blockquote><p>Ressources pour concevoir des services utiles et utilisables pour toutes et tous.<\/p><\/blockquote>\n<h2 lang=\"en\"><a href=\"https:\/\/www.accessibility.sa.gov.au\/your-role\/ux\" hreflang=\"en\">Online Accessibility Toolkit &#8211; User experience (UX)<\/a><\/h2>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-480 size-large\" src=\"https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/online-accessibility-toolkit-1024x447.png\" alt=\"\" width=\"640\" height=\"279\" srcset=\"https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/online-accessibility-toolkit-1024x447.png 1024w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/online-accessibility-toolkit-300x131.png 300w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/online-accessibility-toolkit-768x335.png 768w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/online-accessibility-toolkit-1536x671.png 1536w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/online-accessibility-toolkit-18x8.png 18w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/online-accessibility-toolkit.png 1882w\" sizes=\"auto, (max-width: 640px) 100vw, 640px\" \/><\/p>\n<blockquote lang=\"en\"><p>Digital things like websites and apps work best when they&rsquo;re created so everyone can use them. Using this toolkit helps you create digital platforms and content that are accessible. If you create something with accessibility in mind, the whole community benefits. As you go, you&rsquo;ll also discover the importance (and many benefits) of human-centred design.<\/p><\/blockquote>\n<h2 lang=\"en\"><a href=\"https:\/\/www.w3.org\/WAI\/roles\/designers\/\" hreflang=\"en\">W3C WAI &#8211; Resources for Designers<\/a><\/h2>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-481 size-large\" src=\"https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/w3c-resources-for-designers-1024x447.png\" alt=\"\" width=\"640\" height=\"279\" srcset=\"https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/w3c-resources-for-designers-1024x447.png 1024w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/w3c-resources-for-designers-300x131.png 300w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/w3c-resources-for-designers-768x335.png 768w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/w3c-resources-for-designers-1536x671.png 1536w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/w3c-resources-for-designers-18x8.png 18w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/w3c-resources-for-designers.png 1882w\" sizes=\"auto, (max-width: 640px) 100vw, 640px\" \/><\/p>\n<blockquote lang=\"en\"><p>This page provides a starting point for information that is particularly relevant to visual designers and user interface designers.<\/p><\/blockquote>\n<h2 lang=\"en\"><a href=\"https:\/\/accessibility.digital.gov\/ux\/getting-started\/\" hreflang=\"en\">Accessibility for user experience (UX) designers<\/a><\/h2>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-482 size-large\" src=\"https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-for-teams-1024x447.png\" alt=\"\" width=\"640\" height=\"279\" srcset=\"https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-for-teams-1024x447.png 1024w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-for-teams-300x131.png 300w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-for-teams-768x335.png 768w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-for-teams-1536x671.png 1536w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-for-teams-18x8.png 18w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/accessibility-for-teams.png 1882w\" sizes=\"auto, (max-width: 640px) 100vw, 640px\" \/><\/p>\n<blockquote lang=\"en\"><p>Accessibility is usability for people who interact with products differently. Your role is to help the team approach accessibility as a facet of user experience rather than checklist of requirements.<\/p><\/blockquote>\n<h2 lang=\"en\"><a href=\"https:\/\/www.accessguide.io\/\" hreflang=\"en\">Access Guide<\/a><\/h2>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-483 size-large\" src=\"https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/access-guide-1024x447.png\" alt=\"\" width=\"640\" height=\"279\" srcset=\"https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/access-guide-1024x447.png 1024w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/access-guide-300x131.png 300w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/access-guide-768x335.png 768w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/access-guide-1536x671.png 1536w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/access-guide-18x8.png 18w, https:\/\/ideance.net\/blog\/wp-content\/uploads\/2023\/05\/access-guide.png 1882w\" sizes=\"auto, (max-width: 640px) 100vw, 640px\" \/><\/p>\n<blockquote lang=\"en\"><p>Welcome to Access Guide, a friendly introduction to accessibility! Browse the cards below to learn more about the guidelines.<\/p><\/blockquote>\n<p class=\"emphasis\">Retrouvez \u00e9galement davantage de contenus sur notre page de <a href=\"https:\/\/ideance.net\/fr\/ressources-accessibilite-numerique\/\">ressources d&rsquo;accessibilit\u00e9 num\u00e9rique<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>En mai 2023, j&rsquo;ai eu le plaisir d&rsquo;intervenir en conf\u00e9rence lors des Flupa UX Days 2023 pour sensibiliser les professionnels du design num\u00e9rique et de l&rsquo;exp\u00e9rience utilisateur \u00e0 la prise en compte du handicap dans le num\u00e9rique : Comprendre pourquoi et comment int\u00e9grer l\u2019accessibilit\u00e9 num\u00e9rique (vid\u00e9o et transcription). Lors de cette intervention, j&rsquo;ai rapidement fait&hellip;<\/p>\n","protected":false},"author":1,"featured_media":491,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[13],"tags":[],"class_list":["post-467","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-ux-ui"],"acf":[],"_links":{"self":[{"href":"https:\/\/ideance.net\/blog\/wp-json\/wp\/v2\/posts\/467","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ideance.net\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ideance.net\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ideance.net\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ideance.net\/blog\/wp-json\/wp\/v2\/comments?post=467"}],"version-history":[{"count":16,"href":"https:\/\/ideance.net\/blog\/wp-json\/wp\/v2\/posts\/467\/revisions"}],"predecessor-version":[{"id":1523,"href":"https:\/\/ideance.net\/blog\/wp-json\/wp\/v2\/posts\/467\/revisions\/1523"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/ideance.net\/blog\/wp-json\/wp\/v2\/media\/491"}],"wp:attachment":[{"href":"https:\/\/ideance.net\/blog\/wp-json\/wp\/v2\/media?parent=467"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ideance.net\/blog\/wp-json\/wp\/v2\/categories?post=467"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ideance.net\/blog\/wp-json\/wp\/v2\/tags?post=467"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}