WDW #432

🗞 Highlights

The genius of Apple’s pricing tables
Pricing tables are designed and exist to make it easy for users to make a purchase decision. See how Apple does it.
Dhananjay Garg (Design)

Everything you need to know about Deceptive Design
Interview with Clo S. on common deceptive design patterns and how to avoid it.
Carlo Cilento (Design)

Prioritise content over components
Typically, designers and developers visualise an entire application like a single image that first must be broken into puzzle pieces and reassembled. Then populated with content. Problem is, components-first thinking can condemn reusable text and images into single-use decorations, arranged with explicit curation.
Simeon Griggs (UI, UX)

👨‍💻 Tutorials

Building a floating action button (FAB) component
How to build color-adaptive, responsive, and accessible FAB components.

How to safely share your email address on a website
Lorenzo shows how to easily protect your email address from spam bots with multiple solutions.

Layout Breakouts with CSS Grid
Extending elements beyond the content area with CSS Grid & named grid lines.

📽 (Youtube) The web is good now
The video of Chris Coyier’s talk at CascadiaJS 2022. He mentions how there are several things in the world of web design and development that have gotten… easy.

🛠 Tools / Resources

25 dinosaur fonts and prehistoric typefaces
A list of dinosaur fonts.

Figtree
A new, friendly (free!) sans serif by Erik Kenned.

LocatorJS
Click on any component in the browser to open its code in your IDE.

Fallback font generator
Reduce Cumulative Layout Shift (CLS) by adjusting web fonts and system font fallbacks using special @font-face descriptors.

⚡ Snippets