Issue #330  (AT Survey, CSS/HTML, Git/CLI, React)11/14/19

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. Apply today

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).

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
• Less than 1% of screen reader users have JavaScript disabled
• 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  

css-page
More of an experiment, not for production. This is a CSS parser written in JavaScript that builds HTML from CSS selectors.

UI Interactions
Open source click-and-copy user interface interactions. Includes animated hamburger menus, loading indicators, toggles, and more.

AniX
Super easy and lightweight CSS animation library with excellent performance and good compatibility for modern browsers. UMD, jQuery, and React versions also available.

Formcarry
Recently updated (details). Advanced form back end that processes your forms without hassle.

instant.page
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
A simple JavaScript library for preserving HTML form data across multiple sessions.

CSS Photo Filter Playground
Generate and output CSS that uses the different features of the filter property, for on-page photo enhancements.

css-camera
JavaScript library to easily add depth to page elements using 3D transforms.

js-noisy-gradient
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

igloo
A small, but powerful terminal app for Windows. Simplifies Windows administration by offering pre-made aliases for lengthy PowerShell commands.

>_TerminalSplash
A small set of terminal color themes for Windows Terminal.

Assist
Instant terminal sharing from anywhere (Mac, Linux, ARM).

Bidbar
Save Terminal commands in the Mac menu bar. Run and copy them with keyboard shortcuts.

Ten Hands
Windows, Mac, and Linux app to organize your command line tasks in a simple way.

GetGit
Simple Git hosting for a one-time fee to set up a Gitea server without the complexities of managing it yourself.

image-actions
A GitHub action to automatically compress JPEG, PNG, and WebP images in GitHub pull requests.

navi
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.

actions-gh-pages
GitHub Actions for GitHub Pages. Deploy static files and publish your site easily. Static-Site-Generator-friendly.

React Tools

React Helmet
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.

react-awesome-spinners
Awesome loading spinners for React, built with styled-components.

react-modern-calendar-datepicker
A modern, beautiful, customizable date picker for React. Includes date range support, multiple dates, and support for a Persian calendar.

Framer Motion
An open source React library to power production-ready animations. Design fluid animations for the web, across desktop and mobile.

useAuth
The simplest way to add authentication to your React app. Handles everything for you. Users, login forms, redirects, sharing state between components.

react-sweet-state
The good parts of Redux and React Context in a flexible, scalable and easy to use state management solution.

ShapeForm
A form library that uses JSON schema and works with Redux.

React Transitions
Add animated page transitions to your React Router components.

react-element-scroll-hook
A React hook to use the scroll information of an element.

use-position
React hook that allows you to fetch the client's browser geolocation and/or subscribe to all further geolocation changes.

Smashing Form
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...

Code News is an iOS and Android app that lets you filter code and development news based on language and/or technologies (JavaScript, PHP, Apache, CSS, HTML5, GitHub, and lots more...)

Thanks to all for subscribing and reading!

Keep tooling,
Louis
webtoolsweekly.com
@LouisLazaris