How to Emulate Vision Deficiencies in Chrome DevTools — Did you know you can emulate various vision deficiencies in Chrome to see how users who experience color blindness or blurred vision might see your site? Here’s how to try it out and help catch any issues that might be degrading your user experience.

Addy Osmani

The Failed Promise of Web Components — The idea was that Web Components would help us more simply roll out new, powerful HTML elements and features, but.. it didn’t quite work out that way, as Lea explains. Before you think this is just someone’s opinion.. sure, but plenty of people in the space have agreed with it.

Lea Verou

Tutorial: Build An Online Payment Form In 3 Steps — The Square payment form is customizable and easy to integrate into your web application’s checkout flow. It securely tokenizes sensitive card data so it never touches your servers, facilitating PCI-compliant payment processing.

Square sponsor

Gutenberg Accessibility Costs WordPress the W3C Work — Not a great look when the international standards organization for the Web points the finger (politely) at the Gutenberg editor as the reason for WordPress no longer being a CMS consideration for the in-progress W3C redesign. Joe Dolson raises some related internationalization concerns in this related post.

Adrian Roselli

Wikipedia Is Getting A New Look for The First Time in 10 Years. Here’s Why — Making any sort of design changes can be a daunting task, so hats off to those doing so on such a massive, widely-used, and important site. If you want to follow along, this is the first entry in a series on how Wikipedia is going about things.

Olga Vasileva (Wikimedia)

Find a Job Through Vettery — Create a profile on Vettery to connect with hiring managers at startups and Fortune 500 companies. It's free for job-seekers.

Vettery

Frontend Developer (Remote) — We're seeking a developer (Vue + React) to join our talented team, building community and esports-centric products that impact millions of people worldwide.

GFinity

How Screen Readers Navigate Data Tables — A thoughtful explainer on how screen reader users navigate <table> based content.

Léonie Watson

How To Auto Adjust Your Font Size With CSS font-size-adjust? — Explains how the CSS font-size-adjust property works and how you can experiment with it across multiple browsers.

Nimritee Sirsalewala

The 20 Best Brackets Extensions for Front End Developers — We've highlighted our top picks for Brackets extensions that will help developers working to optimize their workflow.

Shopify Partners sponsor

Debugging Browsers: Tools and Techniques — If you’ve a keen interest in testing, this is a quick (growing) summary of some tools and techniques you can use to diagnose browser problems.

Eric Lawrence

Five Ways Google Analytics Helps Web Developers In UI/UX Design — Features in Google Analytics that can help web devs and designers in making a better user experience on their website.

Clara Buenconsejo

Menu Reveal By Page Rotate Animation — A neat hidden menu idea. Preethi runs through how to create it.

CSS Tricks

Optimizing Your Website with Fiddler and Lighthouse

Rob Lauer

The High Privacy Cost of a “Free” Website

Aaron Sankin and Surya Mattu

Duet Date Picker: An Accessible WCAG-Compliant Date Picker — Has an elegant default design with lots of ways to customize it (e.g. min/max ranges, changing first day of the week, localization, etc). Try different examples here.

Duet Design System

Keyboard Simulator: A Three.js-based Customizable 3D Keyboard — Allows you to design and test virtual keyboards using a number of different layouts and keyboard features, along with a whole slew of color themes.

Carson Britt

Ballpoint: An Experimental Web-Based Vector Graphics Editor — Offers offline support, its own native BPS file format, SVG import, and export via SVG, PDF, or PNG.

ballpoint

500M End-Users Depend On Our Scalable Chat & Activity Feed APIs

Stream sponsor

Visual Mind AI: Analyse the Visual Quality Of Your Website — Take this with a grain of salt, since it’s based on AI, but this is an interesting way to see how your website’s layout is scored for its overall attractiveness.

myraah

a11yresources - A Growing List of Accessibility Tools and Resources

Hannah Milan

A CSS Nintendo Switch — Sharing this as I’m currently playing through Super Mario 3D All-Stars and this naturally caught my eye. A great CSS recreation of Nintendo’s hybrid console making good use of box-shadows. (Oh, and if you’re a Switch gamer, there’s a newsletter for that 😉).

Tee Diang codepen