accessibility

Bilingual

Fixing my tooltip accessibility mistake
2 months ago
- The author created an accessibility error by using aria-describedby without providing an accessible name for a button containing only an SVG icon.
- Removing the aria-label caused the button to have no accessible name, leading to issues like VoiceOver saying 'clickable image' and JAWS confusing sibling tooltip elements.
- The fix was switching from aria-describedby to aria-labelledby, which provides the accessible name from the tooltip content.
- Always ensure interactive elements have an accessible name and test with multiple screen readers for full coverage.
Capra, Cribl's Design System
2 months ago
- Startups often rely on third-party UI libraries for quick development, but this can lead to issues like constant style overrides, misaligned design, and accessibility problems as the product evolves.
- Cribl faced significant frontend challenges, including visual divergence, brittle code from overrides, and accessibility failures, prompting them to build their own design system called Capra.
- A design system is more than UI components; it includes design standards (like design tokens), a frontend component library, and a commitment to accessibility, which is crucial in the era of agentic programming.
- Cribl's Platform UI team partnered with Design to refresh UX, create new design tokens using the Design Token Community Group spec, and chose React Aria Components as a foundation for its accessibility and unstyled approach.
- The design system documentation was made accessible to both humans via Storybook and LLMs via Markdown conversion, ensuring ease of use for all.
- Rollout of Capra is ongoing, with over 25% migration progress; lessons learned include balancing final component states with pragmatic adoption to ease the transition for engineers.
- Capra is now publicly available on NPM for Cribl Apps customers, and future plans include expanding base components and supporting higher-level ones to improve consistency and code health.
Show HN: GPU Accelerated Desktop Screen Flash Filter (Photosensitive Epilepsy)
2 months ago
- FlashFilter is a screen filter that reduces flashing content for people with photosensitive epilepsy.
- It runs on the GPU and does not slow down the system or drain battery.
- Supports Windows, macOS, and Linux.
- Filters all on-screen content including games, video, and web without dark overlay or color tint.
- All processing is local; no tracking of usage or screen data leaving the computer.
- FlashFilter is not a medical device and does not replace medical advice.
- Free public beta from June 30 to August 25, no credit card required.
Jelly UI: Soft-body physics for native HTML form controls
2 months ago
- Jelly UI is a dependency-free Web Components library for soft, tactile product interfaces.
- It features real form controls with soft-body physics, built-in dark mode, right-to-left support, and WCAG AA color tokens.
A bug which affected only left handed users
3 months ago
- A bug in WordPress affected left-handed users by unintentionally triggering a reply link when scrolling with the left thumb.
- The bug was caused by an outdated 'touchstart' listener that was unnecessary due to modern browser improvements.
- A fix was implemented by deleting a few lines of code to prevent accidental triggers during scrolling.
- The author humorously discusses handedness biases and suggests a hypothetical meta tag to exclude left-handed users.
- Commenters reflect on broader societal biases related to handedness, accessibility, and user behavior.
If you're a button, you have one job
3 months ago
- An interactive essay discusses universal challenges of user interfaces, despite seeming old-fashioned due to classic desktop examples.
- A rotation control example: on iPhone, taps are buffered allowing rapid input; on Nothing Phone/Android, taps during animation are ignored with feedback.
- This highlights 'situational disability'—accessibility matters as everyone can face disabling situations, like needing to rotate many photos quickly.
- Casual vs. non-casual use: phone interfaces often serve casual users but must also accommodate power users in specific scenarios.
- Key principle: never force users to wait for animations; buffering inputs or interrupting animations can improve experience.
How working with a blind client revealed invisible accessibility gaps
3 months ago
- Accessibility reviews for a workflow project took 18 hours, far exceeding the initial estimate of a few hours.
- The client had blind and deaf employees, requiring serious accessibility considerations beyond standard engagements.
- Platform limitations, such as Microsoft's browser apps and SharePoint's read-only tags, hindered screen reader usability.
- Workarounds included sending email updates instead of using inaccessible pages and creating tailored training materials.
- Using a screen reader revealed the noise and clutter that sighted users overlook, emphasizing the need for better design.
- The experience highlighted gaps in software accessibility when tools are built primarily for sighted and hearing users.
- Recommendations include integrating accessibility standards early, advocating for inclusive tools, and reporting issues to companies.
Open letter to Anthropic: keep Claude Fable 5 in existing paid plans
3 months ago
- Anthropic gave all paid subscribers access to Claude Fable 5, the most advanced AI system, from July 1st.
- On July 7th, they plan to remove Fable 5 from subscription plans, requiring users to purchase additional usage credits to retain access.
- The letter argues that pricing is not a safety control, as Fable 5 is already deemed safe for public use.
- Access to advanced AI is essential for economic activities like job applications, small businesses, and research, and usage-based pricing risks creating economic disparities.
- Anthropic, as a public benefit corporation, is called on to ensure AI benefits are broadly shared, not restricted by income.
- The promotion proved Fable 5 could be included in subscription plans within usage limits, showing feasibility.
- The undersigned demand Fable 5 remain in paid plans, a published diffusion policy, and a commitment that price is not used as a safety measure.

accessibility

Fixing my tooltip accessibility mistake

Capra, Cribl's Design System

Show HN: GPU Accelerated Desktop Screen Flash Filter (Photosensitive Epilepsy)

Jelly UI: Soft-body physics for native HTML form controls

A bug which affected only left handed users

If you're a button, you have one job

How working with a blind client revealed invisible accessibility gaps

Open letter to Anthropic: keep Claude Fable 5 in existing paid plans