Link tags: gui

Monzo tone of voice

Some good—if overlong—writing advice.

• Focus on what matters to readers
• Be welcoming to everyone
• Swap formal words for normal ones
• When we have to say sorry, say it sincerely
• Watch out for jargon
• Avoid ambiguity: write in the active voice
• Use vivid words & delightful wordplay
• Make references most people would understand
• Avoid empty adjectives & marketing cliches
• Make people feel they’re in on the joke – don’t punch down
• Add a pinch of humour, not a dollop
• Smart asides, not cheap puns and cliches
• Be self-assured, but never arrogant

The web we want: A beginner’s guide to the IndieWeb · Paul Robert Lloyd

This is a terrific presentation from Paul. He gives a history lesson and then focuses on what makes the indie web such a powerful idea (hint: it’s not about specific technologies).

PENGUIN SERIES DESIGN – the art of Penguin book covers

Exploring the graphic design history of Penguin books:

The covers presented on this site are all from my own collection of about 1400 Penguins, which have been chosen for the beauty or interest of their cover designs. They span the history of the company all the way back to 1935 when Penguin Books was launched.

Do That After This – Terence Eden’s Blog

Good advice for documentation—always document steps in the order that they’ll be taken. Seems obvious, but it really matters at the sentence level.

An Interactive Guide to CSS Container Queries

Another terrific interactive tutorial from Ahmad, this time on container queries.

CSS :has() Interactive Guide

This isn’t just a great explanation of :has(), it’s an excellent way of understanding selectors in general. I love how the examples are interactive!

Designing better target sizes

This is a wonderfully in-depth interactive explainer on touch target sizes, with plenty of examples.

An Interactive Guide to CSS Grid

This is a terrific interactive explainer!

Getting started with CSS container queries | MDN Blog

Michelle has written a detailed practical guide to container queries here.

Link colors and the rule of tincture

When you think of heraldry what comes to mind is probably knights in shining armor, damsels in distress, jousting, that sort of thing. Medieval stuff. But I prefer to think of it as one of the earliest design systems.

This totally checks out.

Community Guidelines for Kottke.org

I like Jason’s guidelines—very in keeping with The Session’s house rules.

And I really like his motivation for trying out comments:

The timing feels right. Twitter has imploded and social sites/services like Threads, Bluesky, and Mastodon are jockeying to replace it (for various definitions of “replace”). People are re-thinking what they want out of social media on the internet and I believe there’s an opportunity for sites like kottke.org to provide a different and perhaps even better experience for sharing and discussing information. Shit, maybe I’m wrong but it’s definitely worth a try.

As I said in my comment:

Yes! More experiments like this please! Experiments that aren’t just “let’s clone Twitter”.

A history of metaphors for the internet - The Verge

No one says “information superhighway” anymore, but whenever anyone explains net neutrality, they do so in terms of fast lanes and tolls. Twitter is a “town square,” a metaphor that was once used for the internet as a whole. These old metaphors had been joined by a few new ones: I have a feeling that “the cloud” will soon feel as dated as “cyberspace.”

The other side of egoism | A Working Library

Mandy takes a deep dive into the treatment of altruism in Ursula Le Guin’s The Dispossessed.

WPDS - Accessibility | Resources

I didn’t know the Washington Post had a design system or that the system has this good section on accessibility.

We need to tell people ChatGPT will lie to them, not debate linguistics

There’s a time for linguistics, and there’s a time for grabbing the general public by the shoulders and shouting “It lies! The computer lies to you! Don’t trust anything it says!”

Readability Guidelines

Imagine a collaboratively developed, universal content style guide, based on usability evidence.

Learn Privacy

Stuart has written this fantastic concise practical guide to privacy for developers and designers. A must-read!

1. Use just the data you need
2. Third parties
3. Fingerprinting
4. Encryption
5. Best practices

Privacy in the product design lifecycle | ICO

A very handy guide to considering privacy at all stages of digital product design:

This guidance is written for technology professionals such as product and UX designers, software engineers, QA testers, and product managers.

1. The case for privacy
2. Privacy in the kick-off stage
3. Privacy in the research stage
4. Privacy in the design stage
5. Privacy in the development stage
6. Privacy in the launch phase
7. Privacy in the post-launch phase

Learn HTML

This is a great step-by-step guide to HTML by Estelle.

WebPageTest’s Guiding Principles - WebPageTest Blog

1. Make the right thing easy
2. Always answer “so what”?
3. Close the gap between “something is wrong” to “we fixed it”