Issue 141
Art direction with Grid Template Areas, focus-visible and Variable Fonts.
News
Issue 141
I am back from Seattle and now in Berlin at the CSS Working Group meeting. I'm writing the intro to the email while waiting for day one to get going. At An Event Apart in Seattle I opened an afternoon of CSS Layout fun, followed by Eric Meyer and Jen Simmons. Jeremy Keith has some live blogs of all of our talks, if you would like to read his summary of the afternoon. After Berlin, I am heading back to the West Coast to San Francisco for Smashing Conference.
Thanks to Peers Conference for sponsoring this week. Sadly schedule conflicts meant I couldn't attend this year, but it is sure to be a really great event.
Rachel Andrew, CSS Layout News
Learn
Art Directing For The Web With CSS Grid Template Areas — Smashing Magazine
A very visual grid tutorial from Andy Clarke, concentrating on Grid Template Areas.
:focus-visible and backwards compatibility | The Paciello Group – Your Accessibility Partner (WCAG 2.0/508 audits, VPAT, usability and accessible user experience)
Information about the proposed :focus-visible pseudo-class and potentially solutions for backwards compatibility.
Graduating to Grid | Rachel Andrew
Another very detailed live blog of my An Event Apart talk from the Seattle event.
Creating Themeable Design Systems | Brad Frost
In which Brad Frost reminds me of the "style switchers" we all put on our sites back in ye olde days of CSS-for-layout.
Interesting
VF Demos - a Collection by Jason Pamental on CodePen
Jason Pamental spoke at An Event Apart in Seattle on Variable Fonts. While this isn't strictly layout I think Variable Fonts one of the exciting things happening in web design right now. Combined with new layout, so many possibilities open up. Take a look at these demos.
Bringing CSS smarts to Sketch – Design + Sketch – Medium
If you are a Sketch user, this (still under development) looks highly useful.
Design Trend: Offset + Overlapping Content Blocks – UX Power Tools – Medium
A short post about the use of overlapping content blocks in design, something that is becoming easy with Grid Layout and these examples might be useful starting points for new ideas.
Our Sponsor
Peers Conference - Austin April 25-27
Peers Conference heads to Austin for its 6th year of web, business, software, food and fun. Join us this spring for workshops on React, CSS Grid GraphQL and more, along with sessions on web and mobile development, and running your business. There may be tacos. And B-B-Q. Did we mention our Food Ambassador…? Come spend three days with the best community in tech: your peers. Whether you're a pixel-pusher, an artisan or a maker, Peers is for you. Register today - register.peersconf.com.
CSS Layout News Newsletter
Join the newsletter to receive the latest updates in your inbox.