Hey There!: BetterWebList is a daily curation of 3 articles to help you build better experience on the web. This is the weekly roundup featuring 10 of the most exciting & informative resources in the past week. Reach out to me on Twitter for headsup/suggestions.
And without further ado 🏃♀️
- How We Created a Dark UI For GitLab's Web IDE: A lot of considerations go into making awesome dark mode experiences. This article from the GitLab engineering blog walks through their process of implementing dark mode on the GitLab Web IDE.
- An Introduction to Accessible Data Visualizations With D3.js: Everyone's into COVID-19 dashboards these days and there's a huge chance you've built one. Sarah Fossheim starts this insightful series on accessible data visualizations with D3.js. The article covers color contrast, presenting content to screen readers and other possible improvements.
- Disclosure Widgets: Adrian Roselli writes about the nuances of making a disclosure widget on the web. He talks about browser support, polyfills, and screen reader support. Adrian's focus on web standards makes him the best person to share his learnings
- How to Build a Chrome Extension: Sarah Drasner shares how ridiculously easy it is to build a chrome extension. If you're never made one before, you know how complex it sounds. After reading this article, I had a few ideas of extensions I'll build in my spare time. Awesome read peeps
- In Defense of The Modern Web: It's very likely you've seen Tom MacWright's article; Second-guessing The Modern Web. If you haven't you really should. Rich Harris reacts to a few of Tom's idea, highlighting awesome work to make the web fast by folks at Next, Gatsby, Marko etc.
-
Accessible Images For When They Matter Most: You might have heard a bunch of people say add
alt=""to all your images! It turns out this isn't much of great advice. Most times, we use images that are decorative and wouldn't make sense for assistive technology to announce. This is a long, informative read from Carie Fisher, so be ready for the ride. - Form Design: Multiple Inputs Versus One Input: I always look forward to Adam Silver's design-focused ****articles. In this one, he writes about input patterns that split user entries into smaller inputs (Much like credit card & phone numbers). He talks about the challenges of those kinds of controls as well as when we should use them
- How to Tame Line Height in CSS: Caleb Williams dives deep into the line-height property and shows how it relates to leading in print design. After reading this article, I learned line-height works more like padding-top/bottom. You might want to read this one too.
- Setting TypeScript For Modern React Projects Using Webpack and Babel: It's safe to assume almost no one writes large projects without TS & Webpack. If you're curious how starters like CRA, etc works, you might want to check this one out. In this article Blessing Krofegha sets up a React project from scratch with TypeScript & Webpack. This article came right on time as this is something I've been interested in lately.
- Understanding Destructuring, Rest Parameters, and Spread Syntax: It took me lots of articles to understand the differences between spread and rest operators. I literally had the click after reading this article from Tania Rascia. This is a long one, but it feels kinda natural coming from her.
Stay safe and see you next week - Victor
PS: Checkout BetterWebList
Top comments (0)