|
|
|
When CSS Isn’t Enough: JavaScript Requirements For Accessible Components — Stephanie Eckles looks at how components such as tooltips, modals, tabs, carousels, and dropdown menus often require more than just CSS (even when 'pure CSS' solutions are technically possible), especially to ensure accessibility. Smashing Magazine |
|
Serving Sharp Images to High Density Screens — A majority of displays now have device to pixel ratios (DPR) higher than 1 (e.g. 'Retina' screens) — so what’s the best way to handle images in such high-density situations? Here’s a solid look at how to do just that (covering compression, delivery, etc.) Jake Archibald |
New & Updated Course: Complete Intro to React v6 with Brian Holt — Learn to build real-world applications using modern React. Much more than an intro, you’ll start from the ground up, getting to using the latest features in React, including hooks, effects, context, and portals, plus piecing together tools from the entire React ecosystem. Frontend Masters sponsor |
|
▶ Design for Safari 15 — Apple has shared a half hour video, along with related resources, where Jen Simmons and Myles Maxfield covered all the upcoming Safari changes we saw in last week's WWDC keynote in more detail. Worth a watch. Apple |
|
Introducing Aurora: A Collaboration Between Chrome and Open-Source Web Frameworks & Tools — A new initiative that aims to “deliver the best user experience possible for production apps regardless of the browser you’re rendering in”. Early days, but this post outlines the overall goals. Panicker, Osmani, Djirdeh (Google) |
|
📙 Tutorials, Articles & Opinion |
|
|
Web Design Done Well: Making Use Of Audio — Audio on the web can often be a tricky thing to get right. Here’s a showcase of sites that get it right, nailing the user experience. Frederick O'Brien |
|
Google Chrome Ends Its War On Address Bar URLs—for Now, At Least — Yep, it appears as though Google is abandoning plans to display a ‘simplified’ domain in the Omnibox. Ron Amadeo |
|
CSS System Colors — It’s not got universal support, but did you know you can use a range of keywords in CSS to set color values that are dependent on your system preferences. Jim digs in. Jim Nielsen |
|
An Angular Data Grid That Makes Life Easy Does Exist! Give It a Try — Get the performance, features, and UI users demand in a super customizable grid component -- and enjoy the experience. Progress Kendo UI for Angular sponsor |
|
Three Frontend Auditing Tools I Discovered Recently — Some lesser-known tools to help you achieve a faster website. Stefan Judis |
|
Thumbnail Hover Effect with SVG Filters — A simple thumbnail hover effect with a caption slide out animation and an SVG filter distortion on the image. Mary Lou |
|
Improving Contrast in Microsoft Edge DevTools: A Bugfix Case Study
|
|
Making Tables With Sticky Header and Footers Got a Bit Easier
|
|
🔧 Code, Tools and Resources |
|
HTTP/3 Check: See If A Server Supports HTTP/3 — Online tool to check if a server supports HTTP/3, based on the QUIC protocol, which you can read about here. LiteSpeed |
DOOM Captcha: Captchas Don't Have to Be Boring — Just a bit of fun - even John Carmack himself liked it. Take out a few classic DOOM enemies to complete the Captcha. Miquel Camps Orteza |
|
Uniform CSS — A fully customizable utility-first CSS framework built in Sass. Jin Su Park |
|
Market: A Collection of Nearly 400 'CC0' 3D Assets — …for React Three Fiber or Three.js. Poimandres |
|
Easy, Fast and Seamless UAT and User Feedback with Bugherd BugHerd sponsor |
|
Loopple: A Drag-and-Drop Tool to Create Bootstrap-Based Dashboards Loopple |
|
Tailwindo: Convert Your Bootstrap CSS to Tailwind CSS Awssat |
|
Directionally Aware CSS Buttons with React Jhey Tompkins codepen |