GitHub’s Post

I just shipped the new feature for accordion accessibility to my open source accessibility package https://lnkd.in/duuhaVtd. This feature helps visually impaired users to navigate interacting with accordions, by enabling screen reader support to inform the users of information about the accordion like the current state, and purpose. The states are either expanded or not expanded. The package function updates the aria-pressed, aria-expanded and aria-label attributes of the accordion's trigger button. The function accepts 3 arguments; an array of objects with information about each accordion in the collection, a shared class of all the accordion triggers, and the index position of the currently clicked trigger relative to the main accordion container and other trigger buttons.

Enhance Website Accessibility with These Simple Tips! 1. Clear Navigation: Organize content for easy browsing and searchability. 2. Alt Text for Images: Provide descriptive text for screen readers. 3. Color Contrast: Ensure readability for users with visual impairments. 4. Keyboard Accessibility: Enable navigation without a mouse. 5. Test and Iterate: Regularly check and improve accessibility features for an inclusive user experience.

Did you know February is Low Vision Awareness Month? Using a website when you’re affected by low vision can be difficult, but our websites follow all of the major guidelines for ADA compliance! Learn more about how we've designed accessible websites here: https://lnkd.in/ghWUkJYn

Alt text provides a text alternative for images, allowing visually impaired users using screen readers to understand what an image conveys. Here's how to write effective alt text: Be accurate and equivalent to the image - Don't write "Picture of our office" if the image is of a team meeting. Keep it concise - 1-2 sentences at most describing the image. Avoid alt text that simply repeats the caption. Don't include "Image of..." or "Picture of..." For complex images, summarize the most important information. Test it by turning off images - The alt text should make sense alone. Proper alt text is a web accessibility best practice that improves the experience for all users. Let us know if you have any other web accessibility topics you want explained!

🌈 See Beyond Colors: Learn why color contrast matters for web content and accessibility. Discover how sufficient contrast impacts users with visual impairments and the key ratios for compliance. Check out our full article below:

Empowering Accessibility: 5 Simple Steps for a User-Friendly Website. 1. Clear Navigation: Intuitive menus and organized content for easy browsing. 2. Alt Text for Images: Describe visuals for screen reader compatibility. 3. Color Contrast: Ensure readability for all users. 4. Keyboard Navigation: Enable seamless navigation without a mouse. 5. Descriptive Links: Clearly indicate link destinations for clarity. Elevate your website's accessibility with these easy tips.

"Accessible sites are ugly." - so untrue! And #BeautifullyAccessible does (in my opinion) a really fantastic job of illustrating that point. Right now they are my favorite social media account talking about accessible design. They share - Simple, digestible and actionable tips. - Research motivating the need for accessible design. - Reputable resources and tools like The A11Y Project and Stark. - How both designers and developers contribute to accessible experiences. - And a lot more! I highly recommend designers (and frontend developers) check them out on Instagram @beautifullyaccessible #accessibility #uxdesign #productdesign #accessibledesign #uidesign https://lnkd.in/gWP4vbws

🚀 Exciting News! Introducing the "Target Size Checker & Accessibility Tools" Chrome extension 🌐 "Target Size (Minimum) (Level AA)" is a critical accessibility guideline that ensures interactive elements on your website are large enough and easy to interact with for all users, especially those with motor disabilities. Our extension simplifies the process of checking and improving target sizes. Would you be looking for help evaluating 'Target Size (Minimum)' My new extension can help? ✅ Check the target size of interactive elements. ✅ Ensure compliance with accessibility guidelines, including "Target Size (Minimum) (Level AA)." Get started today: [https://lnkd.in/di2jCtPp] ✅ Feature your website for pass/fail examples on my extension store. Please feel free to comment below or DM us if you'd like to showcase your website as an example. Let's make the web more accessible for everyone! 💻 ✅I am actively working on this extension and will be including more tools to make your accessibility audit easy. #WebAccessibility #ChromeExtension #AccessibilityTools

Your website should be accessible to everyone. Not just able-bodied people. Not just sighted people. Not just people who speak your language. But to everyone. Here's why: There are millions of people in the world with disabilities, many of whom rely on assistive technologies to interact with the web. When you design with accessibility in mind, you're helping those people access the same information as everyone else. Not only that, but an accessible website is also better for SEO and can improve your user experience for everyone. So, what can you do? - Use alt text for images - Provide captions and transcripts for videos and audio - Use clear and simple language - Ensure your website is keyboard navigable Prioritizing accessibility doesn't just improve your website, it also makes the web a better place for everyone.