The official book of California Stylesheets
(and that's okay)
It's a book about writing CSS.
And not writing CSS.
The official book of California Stylesheets
(and that's okay)
It's a book about writing CSS.
And not writing CSS.
Stop feeling superior to your users.
Here’s the brutal truth of it: Your users suck at using your website because they have better things to do.
Live like you’re in retail because you are. Retail’s better, though, because it takes time and effort for your customers to physically remove themselves from your store in retail.
When it comes to digital presence, people can leave instantly. They just disappear with a barely audible popping sound. (It’s only audible to you. It’s your dreams.)
And then, even worse, the customer never comes back.
Those are the stakes.
Design is mostly about getting the thing you do or make to your user with as little friction as possible. You’re desperately trying to do this before your impatient user leaves forever. Friction therefore means people leaving forever. People pretend this is only obvious at scale but that’s just where it’s easier to get honesty. Watch four users use your product and you’ll see 60% of its problems. This is never not true.
Visual design is a huge bit of friction, so much so that the word “design” is often used in place of it. Visual design works as a lightning rod that sucks all the design energy out of the air.
Swaying from standards is another friction.
Designing outside of standards is always an anti-pattern. Even if an element, page or funnel is a one-off, it should still be designed to a standard, or at least with that in mind as a future destination.
Nothing should have its own special padding.
If you’re a designer, you should probably be building design systems which enable others on your team to design things more than you design things yourself. In an information design sense, anyway.
You should do this to mitigate your own biases. It’s not that you’re wrong about design. It’s just that, as an individual you’ll always have differences from your user. Designing by convention forces you to involve your user in every step of your design.
Again, design here doesn’t mean visual design. You can come through as “the designer” later and handle that bit. Design means getting the thing to the user. It’s more about function than form. Visual design is the part of it that’s more about form than function. It’s an afterthought. Stop doing it first.
Getting the elements on the page without looking broken gets you halfway there. Make sure everyone on your team can do this.
CASS gets the elements on the page. Do most of the information design heavy lifting on the first pass of the markup. Prototyping and developing at the same time isn’t necessarily a good idea. But that doesn’t mean you should be limited from doing it because of visual design.
Realistically, your project is only going to use a few layout conventions. CASS has got you covered.
With easy-to-use composables like two columns and three columns, it’s simple to quickly do page layout. The columns composable works for anything with more columns, up to twelve.
Within a columns container, you can use composables like three wide to make child elements span multiple columns.
Remember, CASS never uses numerals in its classes. Everything is spelled out.
You can control where the behavior begins, in a mobile-first responsiveness sense, by including breakpoint composables. The tablet composable will have the column behavior begin on mid-resolutions, and desktop will have it begin in wider viewports.
It’s not mobile-first but mobile will contain the layout behavior to the slimmest viewports. The composable phrase mobile tablet will do the same for slim and mid-width viewports.
The columns composable composes with the golden class which imparts the golden ratio to them. The reverse class reverses how it’s applied. Composable class phrases like two columns golden mobile tablet are common in CASS projects. It makes the element that has it act as a two-column container with golden widths, but only on mobile and tablet.
When your project matures, you might grow out of CASS in a few places. This is fine and expected. CASS is there to save you time early on. Markup conventions using CASS can be mixed or replaced with other conventions fairly easily.
The Gumroad version contains a secret chapter that spills the dirt on CSS preprocessors, a tech CASS no longer uses.
