Issue 116
Naming things in grid, tabbed interfaces, accessibility and the 8-point grid.
News
Issue 116
Conference season continues. I was in Portugal and Germany last week and will be in France for Google DevFest Nantes later this week. I'm also working hard on my new talk for An Event Apart, I'll be presenting this talk for the first time at An Event Apart San Francisco.
An Event Apart have been the major sponsor of this newsletter this year, a big thank you to them for that! The schedule of events for 2018 has now been announced, with several three day events. For the first time it will be possible to buy a ticket for just one day, so I hope that means more people get to experience this truly wonderful conference.
Rachel Andrew, CSS Layout News
Learn
Naming Things In CSS Grid Layout – Smashing Magazine
I've written another lengthy article for Smashing Magazine, this time unpacking the various ways you can name things in CSS Grid Layout.
Component Variants with Scoped CSS Variables - Jonathan Harrell | CSS Blogger & Teacher, UI/UX Designer, Front-End Developer
Another CSS Variables article. This one looks at use variables to create variants of components in your site.
Tabbed Interfaces
An excellent tutorial explaining how to create an accessible tabbed UI component.
8-Point Grid: Vertical Rhythm – Built to Adapt
Useful information about vertical rhythm and the 8 point grid.
Writing CSS with Accessibility in Mind – Medium
Information about how to keep accessibility in mind when working with CSS. Glad to see mention of the potential of creating a disconnect between the logical and visual order when working with flexbox and grid.
Interesting
A Look at Bootstrap 4's New Reset: Reboot.css ― Scotch
This article looks at the reset stylesheet included with Bootstrap - reboot.css. Whether you use Bootstrap or not I rather like studying the decisions made in large projects like this, in terms of what I might choose to do in my own projects.
Rebuilding slack.com – Several People Are Coding
An interesting look at how Grid and Flexbox have been used in the redesign of slack.com.
Our Sponsor
Not your father’s design & front-end conference
Designers and developers who seek out An Event Apart are a special breed. They know what's happening in web and interaction design, and want to know what's coming next. They’re eager to share with their peers and to learn from the unrivaled leaders in interaction and UX.
They’re women and men like you, who come to AEA for three days of design, code, content, and comradery. They return to work energized by new ideas. So, come. Join your people. Register now and save $100 with code AEACSSLAYOUT.
CSS Layout News Newsletter
Join the newsletter to receive the latest updates in your inbox.