#415 — October 30, 2019 |
Frontend Focus |
The Current State of Styling Chris Coyier |
In October 1991, Tim Berners-Lee Published a Document Called 'HTML Tags' — It’s been 28 years (and one day) since Tim Berners-Lee wrote a document outlining descriptions of the first 18 HTML tags. Bonus points if you can name them all before clicking through. 😉 Web Design Museum |
Design for Developers ✨ New Course by Sarah Drasner — Become more self-sufficient for the entire process for execution, from concept to design to implementation. Understand the rules for designing and learn to create complex and beautiful front-end experiences. Frontend Masters sponsor |
Google to Stop Indexing Flash Content — ...by the end of this year. This ties in with Adobe's (and others') plans to stop supporting it by the end of 2020. With this, another interesting era of the Web passes into history. |
Are There Random Numbers in CSS? — Certainly an interesting trick for generating pseudo-random outcomes in CSS alone. The randomness is questionable, but usable for casual situations. Alvaro Montoro |
Auditing For Accessibility Problems With Firefox Developer Tools — An overview of the Accessibility Inspector in Firefox 70’s dev tools, explaining how this auditing facility helps identify/fix common mistakes and practices that reduce site accessibility. Mozilla Hacks |
HTMHell - A Collection of Bad Practices in HTML, Copied From Real Websites — This site seems relatively new, but is a growing collection of real-world examples of things you may not want to do. Submissions are being taken. Manuel Matuzović |
💻 Jobs |
Senior Product Designer - Buildkite (Remote) — Help shape a tool that thousands of developers use every day. Join our small team and have the chance to influence our product. Buildkite |
Have You Tried Vettery? — Vettery specializes in tech roles and is completely free for job seekers. Create a profile to get started. Vettery |
📙 Articles, Tutorials & Opinion |
▶ Inner & Outer Values of the Display Property — Last week’s issue made mention of the fact that Firefox now supports the use of multiple values in the Mozilla Developer |
What's New In DevTools In Chrome 79 — Including new cookie debugging, color scheme simulation options, code coverage updates, and more. Google Developers |
Speed Up Your Website With WebP — A thorough overview of Google’s WebP image format, highlighting its advantages, how it works and how to use it. (I was surprised to learn it has been nearly a decade since the format was first introduced.) Suzanne Scacca |
Why Parcel Has Become My Go-To Bundler for Development — A run-down on what the popular web application bundler can offer, plus how you might start to using it in your own projects. Maks Akymenko |
Why Are Accessible Websites so Hard to Build? — Robin Rendle asks why seemingly so many companies struggle at making accessible websites (looking at you Domino’s), and offers up an idea on how text editors could help by way of included accessibility checkers. Stefan Judis expands on this proposing that browser dev consoles could do similar checks. Robin Rendle |
The React Hooks Guide: In-depth Tutorial with Examples. Start Learning Progress KendoReact sponsor |
Bidirectional Horizontal Rules in CSS — A straightforward tutorial looking at how to use CSS’s logical properties to support both LTR and RTL layouts. Hussein Al Hammad |
CSS Utility Classes: Your Library of Extendable Styles — What CSS utility classes are and why you should be using them. Russell Bishop |
Making a PWA out of the Classic 1996 'Space Jam' Site — A fun recreation of the seemingly everlasting Space Jam website. See the end result here. Zach Leatherman |
The Problem with Dropdown Fields (..and What You Should Use Instead) Design Smarts |
🔧 Code, Tools & Resources |
Sal: Lightweight Scroll Animation Library — Coming in at just 2.8KB, this vanilla JS library is performance focused with no dependencies. GitHub repo. Mirosław Ciastek |
FitText in CSS — Remember the old jQuery plugin called FitText? Well, here it is recreated in (very modern — Chrome 79+ needed) CSS. Perhaps not quite ready for prime time but a cute idea. Dave Rupert codepen |
Looking to Build Leading Search Experiences with Ease? — Elastic App Search brings the power and scalability of Elasticsearch to ecommerce sites, mobile apps and more. Try free. elastic.co sponsor |
GRID: A Simple Visual Cheatsheet for CSS Grid Layout — A list of visually displayed properties available in CSS Grid Layout. Tap or click to copy to keyboard. Malven Co. |
JAMstack Themes — A list of themes and starters for JAMstack sites filterable by the supported generator and/or CMS. Stackbit |
Minimal Wim — An experiment in minimal typography based on the work of Dutch designer Wim Crouwel. Booreiland |
|