Best of Accessibility — June 2024
- 1
- 2
The New Stack·2y
13 Practical Updates to Optimize Website Performance
Gcore.com enhanced website performance, security, SEO, and accessibility through a series of strategic updates. Implemented improvements include SSO authentication for streamlined access, WAF and bot protection to reduce security breaches, Gcore DDoS protection to achieve 99.99% uptime, and automatic pod scaling to improve stability. SEO initiatives like structured data markup, special HTML tags for lists, and image optimization significantly boosted search rankings and organic traffic. Accessibility advancements were made via color scheme adjustments, font-size changes, and better alt texts. These efforts resulted in improved user engagement, SEO metrics, and overall website performance.
- 3
Collections·2yWeb Accessibility in Development: Best Practices and Tools
Web accessibility ensures websites are usable by everyone, including people with disabilities. Key practices include using descriptive alt text for images, semantic HTML, ARIA roles, proper headings and labels, keyboard navigation, responsive design, captions for multimedia, and sufficient color contrast. Tools like WAVE, axe Accessibility Checker, Google Lighthouse, and Pa11y help check and improve accessibility.
- 4
iO tech_hub·2y
This was CSS Day 2024
CSS Day 2024 in Amsterdam celebrated its 10th edition with a diverse set of speakers and topics. Highlights included discussions on the power of modern CSS, accessibility considerations in layout design, and the potential of Tailwind CSS. Key presentations showcased the importance of custom properties, detailed character modeling using pure CSS, and the significance of typography with indie fonts. The event concluded with insights into the CSS Anchoring API, scroll-driven animations, and innovative experimentation in CSS. The gathering sparked valuable conversations on CSS future developments and practical applications.
- 5
Nuxt·2y
Nuxt 3.12 · Nuxt Blog
Nuxt 3.12 introduces improvements and prepares for Nuxt 4. It includes testing for Nuxt 4 changes, auto-installation of Nuxt Scripts, layer auto-registration and bug fixes, built-in accessibility improvements, performance improvements, multi-app support, DX wins, stabilizing features, type improvements, inlined UI templates, and upgrade instructions.
- 6
Community Picks·2y
A11y Documentation
Learn how to make your WebGL accessible with @react-three/a11y and react-three-fiber. Use the A11yAnnouncer component and wrap components with the A11y component to add accessibility features. Call functions on focus or click and provide descriptions for focused/hovered elements.
- 7
Community Picks·2y
A modern approach to browser support
Clearleft has developed a modern approach to browser support based on outcomes for the user rather than specific browser versions. They use the Baseline initiative to determine which browser features to use in production. Their browser support policy focuses on progressive enhancement and ensuring accessibility and core functionality for all users.
- 8
Community Picks·2y
Inclusive Design Patterns For 2025 — Online Workshops
Join Vitaly Friedman's free 3.5-hour online workshop on September 24, 2024, to explore inclusive and accessible design patterns. The session covers practical insights, UX guidelines, WCAG 2.2, ARIA, and the European Accessibility Act, with dedicated Q&A time. Learn techniques for designing for various user needs, including those with disabilities, neurodiversity, and multilingual considerations. Suitable for product and interface designers, UX designers, and front-end developers.
- 9
- 10
Phoenix Files·2y
Using AI to Boost Accessibility and SEO
The post discusses using AI to enhance website accessibility and SEO by generating context-aware alt tags and captions for images. It highlights leveraging OpenAI’s ChatGPT and Anthropic’s Claude LLMs through the Elixir LangChain library to automate the description process. The post covers best practices for creating high-quality alt text and captions, emphasizing the importance of context. It provides a detailed guide on implementing this in Elixir, illustrating how AI can streamline the management of large volumes of images.
- 11
- 12
Collections·2yExploring the Popover API: Creating Accessible and Customizable UI Elements
The Popover API allows any HTML element to function as a popover, using the 'popover' attribute for compatibility. It heavily relies on CSS for visibility and styling, including the ':popover-open' pseudo-class. Initially aimed at creating tooltips, it now supports various use cases like interactive footnotes and slide-out drawers. This flexibility enhances UI/UX across devices, making it a valuable tool for front-end developers.