Essential Tips for Digital Accessibility

We design for the average. The average doesn’t exist. April is Autism Acceptance Month. Designing for autism is about building products that work for everyone. Cognitive overload affects everyone. Your brain has limits, and more noise can affect how you perceive things. For some autistic users, this is constant and amplified. Many rely on digital products to navigate daily life. Yet most interfaces ignore them. So what happens? We design experiences that overwhelm the people who need them most. And if your product overwhelms autistic users, it’s exhausting everyone else. Here are 5 principles to get you started: 1. Consistent Structure Keep navigation, layout, and UI patterns identical across your entire product. Why: Sudden changes cause anxiety and disorientation. Example: Shopping cart stays in the top-right corner across every page. 2. Literal Communication Use plain, direct language. Skip idioms and metaphors. Why: Vague language requires guessing and creates confusion Example: "Your payment was declined. Check your card number and try again." 3. Sensory Calm Use muted, natural colours. Avoid pure black/white and bright contrasts. Why: Extreme contrast and bright colours cause sensory overload Example: Dashboard with soft beige background, dark grey text, and 3-4 clearly separated sections 4. User Control Default to sound off. Allow people to pause, stop, or disable animations. Why: Sensory needs vary greatly, and customization prevents overload. Example: Toggles for reduced motion, dark mode, font size, and autoplay off by default. 5. Predictable Interactions Provide clear feedback and progress indicators so users always know where they are. Why: Unexpected interruptions trigger anxiety and break focus. Example: Multi-step form shows "Step 2 of 4" with a progress bar, confirms "Your information was saved" after each step. Better design starts with understanding. 👇🏽What would you add to this list? 🔖 Save this for reference ♻️ Share it with your team ---- ✉️ Subscribe for more accessibility and design insights: https://lnkd.in/gZpAzWSu ---- Accessibility note: This infographic, titled Designing for Autism has the same content as the post. It also includes alt text.

I've seen so many posts being shared recognising and celebrating International Day of Persons/ Disabled People. Which is amazing! But sadly the vast majority of the content being shared is inaccessible. A day reflecting on equality and equity, but yet we're creating barriers that Disabled people. It's ironic, on a day of inclusion so many of us are excluded So please, if you are posting make your content accessible! Here are some tips to get you started: Image Description: Content Checklist. Six sections with tips read: 1. Message Body. Write in plain English. Use short paragraphs. Avoid using acronyms and jargon. Left align text where possible. Do not use a font generator, they are inaccessible for screen readers. 2. Images. Add Alt Text. Remember to keep Alt Text short and factual. Add an Image Description. Image Description is more descriptive and includes things like colour, texture, backgrounds etc. Any Text on a graphic or image should have sufficient Colour Contrast. 3. Video. Always use Closed Captions. These should appear at the bottom of a video. Use accessible Sans Serif fonts like Arial, Calibri or Helvetica. Include an audio description to describe what's happening in the video. Always manually check captions. Automated captions aren't always reliable. 4. Emojis & Hashtags. Don't replace words with Emojis. Don't overuse Emojis. Do use Emojis at the end of a sentence. Do use a capital letter for each new word in a hashtag. #camelCase or #PascalCase. 5. Check Colour Contrast here: https://lnkd.in/ecQAWnR4 checker. www.contrastchecker.com. www. userway.org/contrast. https://lnkd.in/exj-tFeV. 6. Add Captions Using:Youtube Online. CapCut Online. Adobe Premier Pro App. MixCaptions App. AutoCap App. Automated Social Media Apps. #DisabilityInclusion #IDPWD #DiversityAndInclusion #Accessibility

Happy Global Accessibility Awareness Day everyone! It's a great day to remind people, that, accessibility is the responsibility of the whole team, including designers! A couple of things designers can do: - Use sufficient color contrast (text + UI elements) and don’t rely on color alone to convey meaning. - Ensure readable typography: support text resizing, avoid hard-to-read styles, maintain hierarchy. - Make links and buttons clear and distinguishable (label, size, states). - Design accessible forms: clear labels, error help, no duplicate input, document states. - Support keyboard navigation: tab order, skip links, focus indicators, keyboard interaction. - Structure content with headings and landmarks: use proper H1–Hn, semantic order, regions. - Provide text alternatives for images, icons, audio, and video. - Avoid motion triggers: respect reduced motion settings, allow pause on auto-play. - Design with flexibility: support orientation change, allow text selection, avoid fixed-height elements. - Document accessibly and communicate: annotate designs, collaborate with devs, QA, and content teams. Need to learn more? I got a couple of resources on my blog: - A Designer’s Guide to Documenting Accessibility & User Interactions: https://lnkd.in/eUh8Jvvn - How to check and document design accessibility in your mockups: a conference on how to use Figma plugins and annotation kits to shift accessibility left https://lnkd.in/eu8YuWyF - Accessibility for designer: where do I start? Articles, resources, checklists, tools, plugins, and books to design accessible products https://lnkd.in/ejeC_QpH - Neurodiversity and UX: Essential Resources for Cognitive Accessibility, Guidelines to understand and design for Dyslexia, Dyscalculia, Autism and ADHD https://lnkd.in/efXaRwgF - Color accessibility: tools and resources to help you design inclusive products https://lnkd.in/dRrwFJ5 #Accessibility #ShiftLeft #GAAD

Accessibility in development isn’t about adding extras, it’s about writing better code from the get-go. Simple habits that can help are: ✅ Use button elements for buttons → <button> works everywhere, while <div role="button"> needs extra work (and often breaks). A button being a better button if it's a button, wow can you imagine? ✅ Label form fields properly → <label for="email"> ensures everyone knows what they’re filling out, including screen readers and autofill. ✅ Make clickable areas big enough → Small touch targets frustrate everyone, especially on touch screens. ✅ Don’t remove focus styles → If you hide focus indicators, keyboard users get lost. Instead, make them your own: design them to fit your UI and brand design. Don't forget that they still need to pass 3:1 color contrast. ✅ Test with a keyboard → Speaking of focus indicators: Can you navigate your site without a mouse? Well, have you tried? This is where the custom focus indicator will either shine or embarrass you. Good code isn’t just functional, it’s usable. And that’s what sets great developers apart. Accessibility isn’t an add-on, it’s what makes you great at your job.

Drop the white. Your clean background is creating visual friction. We tend to equate pure white with professionalism. But for a massive part of your ecosystem, that stark background is not professional. It is a strobe light. I have posted about this before. The feedback from UX researchers, designers, and accessibility advocates helped expand this landscape significantly. The clinical reality is that high contrast drains executive function. You force users to burn cognitive fuel just to stabilize the image, leaving less fuel to actually understand the content. Here is an updated guide to cultivating visually accessible digital environments. 1/ The Strobe Light (Stark White) → The Code: #FFFFFF → The Issue: For the 14% of the population with Scotopic Sensitivity, high contrast black text on pure white causes text to vibrate. It acts as an optical strobe light, washing out the letters. → The Environment: Pair this stark hex code with harsh fluorescent office lighting, and you actively trigger visual migraines and severe optical drag. 2/ The Deep Shade (Pure Black) → The Code: #000000 → The Issue: Dark Mode is not a universal cure. For the 33% of people with astigmatism, pure black backgrounds cause halation. The text becomes fuzzy, bleeds into the dark, and forces the eyes to overwork just to focus. 3/ The Soft Sun (Optimal Contrast) → The Standard: The British Dyslexia Association explicitly recommends avoiding bright white. You want soft, not stark. → The Metric: Accessibility experts note that an ideal luminance contrast ratio sits between 7 to 1 and 15 to 1. Going over 15 to 1 becomes difficult to tolerate. 4/ The Solarized Upgrade → The Codes: Background FDF6E3 with Text 657B83. → The Science: Lowers contrast gain. It mimics reading on a sunny afternoon rather than staring into a flashlight. 5/ The Sepia Upgrade → The Code: Background F4ECD8. → The Science: Provides a cozy warmth that reduces blue light exposure and relaxes the ciliary muscles in the eye. 6/ The Cream Upgrade → The Codes: Background FFFFE5 or FAFAFA. → The Science: Replaces the harsh #FFFFFF and #000000 with a gentle off white. Reduces glare while preserving a familiar paper feel. This is a standard recommendation for dyslexic readers. 7/ Expanding the Ecosystem → The Goal: Normalize customization. The goal is never to force everyone into a sepia box. → The Practice: Build websites that respect custom user style sheets. Ensure your contrast choices do not break screen reader compatibility. Empower user agency so individuals can adjust the lighting for their own specific neurobiology. White space is important. But it does not have to be white. Check your recent slide deck or website. Are you planting visual friction, or are you cultivating flow?

1 in 6 people globally live with a disability. Add family members and caregivers, and the influence grows dramatically. This is one of the largest underserved consumer markets. Ask yourself: → Can someone use your website without a mouse? → Are your videos captioned? → Are your PDFs readable by screen readers? → Is your checkout usable without precise clicking? These details affect who can engage with your brand. The UK Click-Away Pound research found that 71% of consumers with disabilities leave websites that are hard to use. Inclusive campaigns deliver results too (study by Unstereotype Alliance, Saïd Business School, University of Oxford, Unilever): → 62% likelihood of being a consumer’s first choice → 3.5% higher short-term sales and 16% higher long-term sales → 15% higher consumer loyalty Simple changes like adding keyboard navigation, captioning videos, making PDFs readable, and structuring your copy make things easier for everyone. Customers spend more time, make purchases more easily, and return more often. Run a basic accessibility check on your website. Review your video library for captions. Test your checkout with only a keyboard. Look at your PDFs through a screen reader. If you find gaps, fix them. If you’re not sure where to start, bring in expertise. Accessible marketing is good business. Companies that get this earn loyalty and stand out in the market. How easy is it for someone with a disability to buy from you? #AccessibleMarketing #DigitalAccessibility #CustomerExperience #DisabilityInclusion #DisabilityAwareness

Nearly everyday, I unfollow folks here, because of content that is either inaccessible for me, or content that physically causes me pain.  Let me explain each one in a bit more detail. I am colorblind.  If graphics or images are shared without an image description, I may very well not be able to see what others see.  Colorblind folks don't use screen readers... so even if you are entering alt text in your graphics online, I can't see them. I am neurodivergent.  I don't often get sarcasm unless it is directly a quote from a movie or show that I regularly watch.  While I am quite possibly the BIGGEST gigglebox that you'll ever meet and I thrive on laughing, I'm often left feeling confused by posts that are sarcastic, or covertly making fun of something or someone. I am physically disabled with multiple rare diseases that cause pain and damage to my joints and physical movement in general.  These posts that are SUPER long due to unneccessary spacing are brutal on my hands.  The more mouse clicks and scrolling I need to do in a day means the less time I can hold off on my pain medication... and that means the less I can do the things I would like to do before I have to listen to my body and stop.  And yes - my pain is bad enough that I am in pain management for relief. What can you do to be more accessible?  Let's use my examples, as accessibility is such a vast field: 1. Always provide both alt text and image descriptions.  An image description goes into more detail than alt text.  It explains the image and its relation to a post.  It can include emotions, actions, or intentions you are trying to convey.  If it's a graphical representation of data, it should be a readable format of the data presented. 2. If you're using humor or sarcasm in your content, include some context for folks that may not understand what you mean.  Whether you add a quick note at the end of the post to explain your humor or sarcasm, or you explain within the post, it's so helpful... for not only neurodivergent folks but also folks who don't speak English as their first language or are from a different country and/or culture than you. 3. There is absolutely no need to write one sentence per line.  I know it may look cool, or some marketing bro said to do it.  But think about how much additional effort that is for folks to consume your content.  You may think I'm exaggerating, but I did an experiment before.  It took me like 9 scrolls to read content that, when I reformatted it similar to this post, it only took like 1 scroll.  That shit adds up in a day.  Find a good balance between avoiding HUGE walls of text, but also not 5 words per line. I hate to unfollow cool folks, but I have to protect my mental and physical health.  It's like a slap to the face if I am repeatedly being told [visually] that I don't belong, that spaces aren't welcoming me. Much love, friends. 💜 #Accessibility #DisabilityInclusion #ChronicPain #Neurodivergent #Belonging  

The five most common accessibility mistakes I see? They're not all about missing a WCAG criterion. They're often about how teams think about accessibility in the first place. • Over-relying on automated test results Automated scanners catch maybe 25-30% of real accessibility issues. They're helpful, but they can't tell you if your form flow makes sense or if keyboard navigation actually works. Manual testing and real user feedback are essential. • Misunderstanding or misusing ARIA ARIA is powerful when used correctly, but it's not a fix for bad HTML. Using ARIA to patch non-semantic markup often creates more problems than it solves. Start with semantic HTML, then add ARIA only when truly needed. • Using divs or spans as buttons or links Just because something looks like a button doesn't mean it acts like one. The right semantic element gives you keyboard access, focus management, and screen reader support for free. Don't rebuild what HTML already does well. • Treating accessibility as a one-time project Accessibility isn't something you achieve and forget about. Content changes, features get added, team members come and go. Ongoing testing and maintenance are what keep a site accessible over time. • Delegating accessibility to one person When accessibility lives with one "expert," it becomes a bottleneck. Everyone needs baseline knowledge integrated into their role. Developers, designers, content creators, QA - accessibility works best when it's woven into the whole team's workflow. These aren't just technical problems. They're mindset shifts that make accessibility sustainable instead of overwhelming. What would you add to this list? #Accessibility

Inaccessibility is all around us - but sometimes we’re doing it without even realising. I’ve made every one of these mistakes in the past. It wasn’t until someone took the time to point them out that I learned how inaccessible I was being - despite having good intentions. Here are 5 ways you might be being inaccessible, without even knowing: 1. Long LinkedIn headlines or overuse of emojis. Screen reader users hear your full headline every single time you post or comment. Every. Single. Time. Even when it’s truncated visually. That can mean hearing your full job title, emojis, and taglines multiple times before even reaching your post content. Try to keep your headline under 100 characters or two lines max - it makes a huge difference. 2. Long email signatures, HTTP links, and unlabelled images. Screen readers will read out every line - including things like “H-T-T-P-colon-slash-slash…” for full URLs. Images without alt text are completely invisible to screen reader users. Keep it short and simple, and use alt text wherever you can. Put only essential info in your email signature and put two dashes at the top to signal your signature is starting. And remember, it’s not your marketing tool. When was the last time you actually bought something from an email signature?! 3. Not running documents through the accessibility checker. You run a spell check, so why not an acceeeibility check? It’s a quick step, but it can flag things like heading structures, contrast issues, and missing image descriptions. It takes seconds and makes a big impact. 4. Using colour alone to convey meaning. For example, “I’ve marked the important cells in green” doesn’t help if someone can’t perceive colour easily. Neither does “I’ve shaded the cells for our RAG status”. Always add a label, icon, or another indicator. 5. Using all lowercase hashtags. #thisisnotaccessible - screen readers can’t parse where one word ends and another begins. Use camel case instead - #ThisIsAccessible - so screen readers pronounce the words correctly. Small changes, big impact. If you’ve made some of these mistakes before - welcome to the club. We learn, we improve, we do better. #DisabilityInclusion #Disability #DisabilityEmployment #Adjustments #DiversityAndInclusion #Content #A11y

👩🦰 Designing Accessibility Personas (https://lnkd.in/evVnB4hd). How to embed accessibility and test for it early in the design process ↓ We often assume that digital products are merely that — products. They either work or don’t work. That they help people meet their needs or fail on their path to get there. But every product has its own embedded personality. It can be helpful or dull, fragile or reliable, supportive or misleading. When we design it, willingly or unwillingly, we embed our values, views and perspectives into it. Sometimes it’s meticulously shaped and refined. And sometimes it’s simply random. And when that happens, users assign their perception of the product’s personality to the product instead. Products are rarely accessible by accident. There must be an intent that captures and drives accessibility efforts in a product. And the best way to do that is by involving people with temporary, situational and permanent disabilities into the design process. One simple way of achieving that is by inviting people with disabilities in the design process. For that, we could recruit people via tools like Access Works or UserTesting, ask admins of groups and channels on accessibility to help, or drop an email to non-profits that work in accessibility space. Another way is establishing accessibility personas for user journeys. Consider them as user profiles that highlight common barriers faced by people with particular conditions and provide guidelines for designers and engineers on how to design and build for them. E.g. Simone, a dyslexic user, or Chris, a user with rheumatoid arthritis. For each, we document known challenges and notable considerations, designing training tasks for designers and developers and instructions to simulate experience through the lens of these personas. By no means does it replace proper accessibility testing, but it creates a shared understanding about what the experiences are like. You can build on top of Gov.uk’s profound research project (https://lnkd.in/evVnB4hd) — it also explains how to set up devices and browsers, so that each persona has their own browser profile. Once you do, you can always switch between them and simulate an experience, without changing settings every single time. All Accessibility Personas (+ Tasks, Research, Setup) https://lnkd.in/evVnB4hd Accessibility doesn’t have to be challenging if it’s considered early. No digital product is neutral. Accessibility is a deliberate decision, and a commitment. Not only does it help everyone; it also shows what a company believes in and values. And once you do have a commitment, and it will be much easier to retain accessibility, rather than adding it last minute as a crutch — because that’s where it’s way too late to do it right, and way too expensive to make it well. [Useful pointers in the comments ↓] #ux #accessibility