Issue #330 (AT Survey, CSS Tools, Git/CLI, React)
Accessibility has been a hot topic of late, so it's fitting to discuss the latest Screen Reader Survey from the folks over at WebAIM. This is their 8th survey completed since 2009 and is based on 1,124 responses (down from the previous year's 1,792).
WebAim's Screen Reader Survey
Here are some of the highlights that grabbed my attention:
- 12.4% of respondents used a screen reader for something other than a disability
- 76% of respondents use one due to blindness, but 15.8% claimed to have more than one disability
- The most popular screen readers were NVDA and JAWS, accounting for more than 80% combined
- 10.9% of screen reader users use IE11, compared to 1.9% for Edge
- The most popular mobile screen reader was VoiceOver (71.2%)
- 18.4% of respondents said web content has become less accessible (compared to 40% who believe it's more accessible)
- More than 70% of screen reader users believe the primary problem with accessibility is due to lack of awareness or lack of skills/knowledge in developing accessible websites or apps.
- 28.7% of respondents use a "very customized" version of their screen reader. More than 90% have at least some customizations.
- When navigating a long page for info, about 70% of users will use the headings (vs. links or the "find" feature)
Lots more data to analyze in that report, but those are just the things that grabbed my attention. Check out the rest of the survey data for more.
Now on to this week's tools!
CSS and HTML Tools
Start Gaining Machine Learning Skills Today
Ready to master machine learning or even switch to a career as a machine learning engineer? With Springboard's Machine Learning Bootcamp, you'll work 1:1 with an expert machine learning mentor to complete hands-on, real world projects. ad via Paved
Open source click-and-copy user interface interactions. Includes animated hamburger menus, loading indicators, toggles, and more.
Super easy and lightweight CSS animation library with excellent performance and good compatibility for modern browsers. UMD, jQuery, and React versions also available.
Recently updated (details). Advanced form back end that processes your forms without hassle.
Now at version 3+ (details). Make your site’s pages instant using just-in-time preloading — it preloads a page right before a user clicks on it.
HTML Form Persistence
CSS Photo Filter Playground
Generate and output CSS that uses the different features of the filter property, for on-page photo enhancements.
Small and fast library for smoothing visible banding in linear-gradient backgrounds.
Immersive Custom Elements
A set of web components to embed immersive (VR & AR) content into your page by using custom element tags. Currently includes components for 360 images and 360 video.
Super Easy Forms
A free and open source tool to quickly create responsive HTML contact forms. Serverless backend components are automatically deployed for you and linked to your HTML form.
Git, GitHub, Command Line Tools
Tech Productivity Newsletter
A brief weekly newsletter featuring productivity tools, articles, and resources for tech pros. promoted
A small, but powerful terminal app for Windows. Simplifies Windows administration by offering pre-made aliases for lengthy PowerShell commands.
A small set of terminal color themes for Windows Terminal.
Instant terminal sharing from anywhere (Mac, Linux, ARM).
Save Terminal commands in the Mac menu bar. Run and copy them with keyboard shortcuts.
Windows, Mac, and Linux app to organize your command line tasks in a simple way.
Simple Git hosting for a one-time fee to set up a Gitea server without the complexities of managing it yourself.
A GitHub action to automatically compress JPEG, PNG, and WebP images in GitHub pull requests.
An interactive cheat sheet tool for the command-line.
GIT quick statistics
A simple and efficient way to access various statistics in a Git repository.
GitHub Actions for GitHub Pages. Deploy static files and publish your site easily. Static-Site-Generator-friendly.
Reusable React component will manage all of your changes to the document head. Takes plain HTML tags and outputs plain HTML tags. It's dead simple, and React beginner friendly.
Awesome loading spinners for React, built with styled-components.
A modern, beautiful, customizable date picker for React. Includes date range support, multiple dates, and support for a Persian calendar.
An open source React library to power production-ready animations. Design fluid animations for the web, across desktop and mobile.
The simplest way to add authentication to your React app. Handles everything for you. Users, login forms, redirects, sharing state between components.
The good parts of Redux and React Context in a flexible, scalable and easy to use state management solution.
A form library that uses JSON schema and works with Redux.
Add animated page transitions to your React Router components.
A React hook to use the scroll information of an element.
React hook that allows you to fetch the client's browser geolocation and/or subscribe to all further geolocation changes.
MobX powered forms in React.
A Tweet for Thought
I previously featured a Tweet where someone was wondering why the "save" icon was a vending machine. Here's a response to that, which might blow your mind a little.
Send Me Your Tools!
Made something? Send links via Direct Message on Twitter @WebToolsWeekly (details here). No tutorials or articles, please. If you have any suggestions for improvement or corrections, feel free to reply to this email.
Before I Go...
Thanks to all for subscribing and reading!