Generative AI: What You Need To Know
Generative AI: What You Need To Know is a free resource that will help you develop an AI-bullshit detector.
You can read all the cards on one page, print them out, or print to PDF.
Tags: resource
115
Wednesday, May 24th, 2023
Wednesday, April 26th, 2023
WPDS - Accessibility | Resources
I didn’t know the Washington Post had a design system or that the system has this good section on accessibility.
Monday, April 17th, 2023
Accessibility for designer: where do I start? by Stéphanie Walter - UX Researcher & Designer.
Stéphanie has gathered a goldmine of goodies:
Articles, resources, checklists, tools, plugins and books to design accessible products
Thursday, March 23rd, 2023
Learn Privacy
Stuart has written this fantastic concise practical guide to privacy for developers and designers. A must-read!
Wednesday, February 22nd, 2023
Learn HTML
This is a great step-by-step guide to HTML by Estelle.
Saturday, December 24th, 2022
12 Days of Web
All twelve are out, and all twelve are excellent deep dives into exciting web technologies landing in browsers now.
Thursday, December 1st, 2022
Links for Declarative Design
At the end of next week, I will sally forth to California. I’m going to wend my way to San Francisco where I will be speaking at An Event Apart.
I am very much looking forward to speaking at my first in-person AEAs in exactly three years. That was also in San Francisco, right before The Situation.
I hope to see you there. There are still tickets available.
I’ve put together a brand new talk that I’m very excited about. I’ve already written about the prep for this talk:
So while I’ve been feeling somewhat under the gun as I’ve been preparing this new talk for An Event Apart, I’ve also been feeling that the talk is just the culmination; a way of tying together some stuff I’ve been writing about it here for the past year or two.
The talk is called Declarative Design. Here’s the blurb:
Different browsers, different devices, different network speeds…designing for the web can feel like a never-ending battle for control. But what if the solution is to relinquish control? Instead of battling the unknowns, we can lean into them. In the world of programming, there’s the idea of declarative languages: describing what you want to achieve without specifying the exact steps to get there. In this talk, we’ll take this concept of declarative programming and apply it to designing for the web. Instead of focusing on controlling the outputs of the design process, we’ll look at creating the right inputs instead. Leave the final calculations for the outputs to the browser—that’s what computers are good at. We’ll look at CSS features, design systems, design principles, and more. Then you’ll be ready to embrace the fluid, ever-changing, glorious messiness of the World Wide Web!
If you’d a glimpse into the inside of my head while I’ve been preparing this talk, here’s a linkdump of various resources that are either mentioned in the talk or influenced it…
Declarative Design
- Declarative design on adactio.com
- Utopia by James Gilyead and Trys Mudford
- Every Layout by Heydon Pickering and Andy Bell
- Be the browser’s mentor, not its micromanager by Andy Bell
- Layout Land by Jen Simmons
- Designing Intrinsic Layouts by Jen Simmons on adactio.com
HTML
- A declarative Web Share API on adactio.com
- A polyfill for button type=”share” on adactio.com
- The reason for a share button type on adactio.com
- Share Button Type explainer on Github
- When should there be a declarative version of a JavaScript API? on adactio.com
- How to (not) make a button by Tomas Pustelnik
CSS
- The CSS Mindset by Max Böck
- Contextual Spacing For Intrinsic Web Design by Stephanie Eckles
- The CSS mental model by Peter Paul Koch
- CSS Forces by Tim Brown
Design Tools
- Our web design tools are holding us back by Vasilis van Gemert
- Traditional Web Design Process is Fundamentally Broken by Jason Grigsby
- Web Design Tool Wish List by Jason Grigsby
- Declarative Design Tools (archived) by Jem Gold
Design systems
- Declarative design systems on adactio.com
- Design systems thinking on adactio.com
History
- Cascading HTML style sheets — a proposal by Håkon Wium Lie, 1994
- A Dao of Web Design by John Allsopp, 2000
- Responsive Web Design by Ethan Marcotte, 2010
People
Wednesday, November 23rd, 2022
An Interactive Guide to Flexbox in CSS
This is a superb explanation of flexbox—the interactive widgets sprinkled throughout are such a great aid to learning!
Wednesday, August 24th, 2022
Lean Web Club
New from Mr. Vanilla JS himself, Chris Ferdinandi:
A learning space for people who hate the complexity of modern web development.
It’ll be $29 a month or $299 a year (giving you two months worth for free).
Tuesday, August 16th, 2022
Color and Contrast.com
A lovely website (or web book?) dedicated entirely to colour contrast, complete with interactive illustrative widgets.
A comprehensive guide for exploring and learning about the theory, science, and perception of color and contrast.
Monday, January 3rd, 2022
Start at the beginning: the importance of learning the basics - localghost
I’d recommend going in the order HTML, CSS, JS. That way, you can build something in HTML, add CSS to it as you learn it, and finally soup it up with your new-found JS knowledge.
Excellent advice for anyone new to web develoment.
Once you start getting into interactive website territory, with API calls and fancy stuff, that’s where you need JavaScript (JS) knowledge. More specifically, vanilla JS: plain JS with no additional frameworks or plugins. The JS that your browser understands without having to do any pre-processing. It makes working with frameworks a whole lot easier, and it’ll help you to know when not to use a framework (and avoid making users download massive JS bundles when all you need is a tiny bit of code).
Saturday, October 23rd, 2021
Can I include a tag to a tag? Based on HTML Spec WHATWG
A neat little tool when you need a reminder about what elements can go in other elements.
Saturday, October 2nd, 2021
Tiny Helpers
A very comprehensive collection of standalone little tools for web design and development—tools that do one thing.
Wednesday, May 19th, 2021
Learn CSS
This is a great (free!) course on learning CSS from the basics up. Nicely-pitched explanations with plenty of examples.
Thursday, April 1st, 2021
Library: Accessibility resources, guides, communities, and more
A very comprehensive directory of accessibility resources.
Monday, March 22nd, 2021
A Complete Guide To Accessible Front-End Components — Smashing Magazine
Vitaly has rounded up a whole load of accessibility posts. I think I’ve linked to most of them at some point, but it’s great to have them all gathered together in one place.
Saturday, January 16th, 2021
Responsible Web Applications
An excellent collection of advice and examples for making websites responsive and accessibile (responsive + accessible = responsible).
Tuesday, November 10th, 2020
Operator Lookup - Search JavaScript operators · Josh W Comeau
Operators in JavaScript—handy! I didn’t know about most of these.
Thursday, October 1st, 2020
AddyOsmani.com - Preload late-discovered Hero images faster
Did you know there’s an imagesrcset attribute you can put on link rel="preload" as="image" (along with an imagesizes attribute)?
I didn’t. (Until Amber pointed this out.)
Thursday, August 20th, 2020
Service Workers | Go Make Things
Chris Ferdinandi blogs every day about the power of vanilla JavaScript. For over a week now, his daily posts have been about service workers. The cumulative result is this excellent collection of resources.