Tags: style

178

sparkline

Introducing the GOV.UK Design System - Government Digital Service

The Gov.uk design system is looking very, very good indeed—nicely organised with plenty of usage guidelines for every component.

Guidance on using components and patterns now follow a simple, consistent format based on task-based research into what users need in order to follow and trust an approach.

Resilient, Declarative, Contextual

This is really good breakdown of what’s different about CSS (compared to other languages).

These differences may feel foreign, but it’s these differences that make CSS so powerful. And it’s my suspicion that developers who embrace these things, and have fully internalized them, tend to be far more proficient in CSS.

Bulb Design System

I really like the way that this pattern library includes research insights to provide justification for design decisions.

The Secret to Writing (Is Writing) + Subtraction.com

In a world full of talented designers, the ability to express oneself in written form is a key advantage.

A Guide To The State Of Print Stylesheets In 2018 — Smashing Magazine

Good advice on print styles from Rachel. The browser support situation is frustrating; I suspect it’s because the people working on browsers would rather get stuck in on shinier stuff.

Radial Gradient Recipes | CSS-Tricks

Chris takes us on a whirlwind tour of radial gradients in CSS.

:focus-visible and backwards compatibility

Patrick is thinking through a way to implement :focus-visible that’s forwards and backwards compatible.

Brutalist design is the bad influence we all need

What these brands are taking from web-brutalism — and truly, we should all be learning something here — is that User-centered design doesn’t need to be monopolized by the same colors, same buttons, same photography and even same copy you see in pretty much every single website or product.

Hudl Uniform

This design system takes an interesting approach, splitting the documentation between designing and coding.

The first visual identity for UK Parliament

Some lovely branding work for the UK Parliament, presented very nicely.

Measuring the Hard-to-Measure – CSS Wizardry

Everything old is new again—sometimes the age-old technique of using a 1x1 pixel image to log requests is still the only way to get certain metrics.

While tracking pixels are far from a new idea, there are creative ways in which we can use them to collect data useful to developers. Once the data is gathered, we can begin to make much more informed decisions about how we work.

How I design with CSS grid

Always mark-up first. Regardless of what the kids are doing these days, I stick by my guns and start with mark-up first. A fun experiment (maybe not for you, but definitely for me) is to see how your site reads on Lynx. It does serve as a good gauge of whether the content on the site is structured properly or not.

Regarding the Em Dash - The Millions

I like a good em dash, me.

clean-code-javascript

Opinionated ideas on writing JavaScript. I like it when people share their approaches like this.

TNZ Pattern Library Docs

New Zealand has a pattern library (in Fractal, no less).

Async + Await

Slides from a conference talk with a really clear explanation of how async + await works with promises.

Herman: Automated Pattern Libraries | OddBird

A lightweight style guide generator. This one uses SassDoc to parse out the documentation for colours, type, etc.

Why Design Systems Fail ◆ 24 ways

Great advice from Una on getting buy-in and ensuring the long-term success of a design system.

Silly hover effects and the future of web typography – Pixelambacht

These experiments with transitioning variable font styles on hover might be silly, but I can see the potential for some beautiful interaction design.