Issue 163
Difficult data, CSS Houdini, font loading, position: sticky, and more browser news.
News
Issue 163
This week we have more news of CSS features making their way into browsers, plus thoughts on designing with difficult data, Houdini, font loading and sticky positioning. Lots of good stuff!
This week the email is sponsored by An Event Apart, see the final link in the email for a special offer code. An Event Apart have just announced their schedule for 2019, so if you are thinking about where to use your training budget for next year, take a look!
Rachel Andrew, CSS Layout News
New in Chrome 69 | Web | Google Developers
Last week we celebrated the latest Firefox release, however we also had the latest Chrome - marking Chrome being 10 years old. That fact doesn't make me feel old at all!
Chrome 69 has Scroll Snapping, conic gradients, Display Cutouts (aka notches) and more.
Firefox 63 for developers - Mozilla | MDN
Firefox 63 is now the Beta version and as part of my work for MDN I've been documenting some of the additions, you can find links to those and more in these release notes.
Learn
Design with Difficult Data · An A List Apart Article
An excellent piece on designing with data which reflects all the edge cases. We come up against this a lot in our CMS Perch, as the UI can be translated. Switching between Japanese and German is likely to throw up all kinds of interesting issues with the size of labels!
Creating sliding effects using sticky positioning | CSS-Tricks
Some nice examples of using position: sticky.
Houdini Spellbook
A microsite explaining CSS Houdini, readers of this newsletter might be especially interested in the info about the Layout API.
The Font Loading Checklist—zachleat.com
Not layout, but given that so many of the interesting things we can do design-wise come down to creative use of Webfonts, I'm pretty sure all of us wonder from time to time the best way to load fonts. Here is a checklist of key things to know.
Create your design system, part 4: Spacing – CodyHouse – Medium
This series of posts on creating your own design system has plenty of good stuff. In this article, we learn about spacing.
Interesting
Color Cycling with Workers - daverupert.com
A lovely subtle effect, with a whole lot of interesting behind the scenes knowledge in this post about using the animation technique of color cycling.
Our Sponsor
Set yourself Apart
An Event Apart Orlando: Special Edition is a jam-packed, three-day conference with 18 sessions and an intense focus on design, code, and content.
Learn with Jeffrey Zeldman, Sarah Parmenter, Yesenia Perez-Cruz, Rachel Andrew, Eric Meyer, Jen Simmons, Kate O’Neill, Una Kravets, Brad Frost, Val Head, Jon Tan, Dan Mall, Kristina Halvorson, Jason Pamental, Trent Walton, Derek Featherstone, Aarron Walter, and Josh Clark. Leave with fresh tips & takeaways, raring to put what you’ve learned to immediate use.
The crew from the Thundernerds podcast will also be on hand for live interaction. All this, and the magic of being at Walt Disney World! Don’t miss it. CSS Layout News readers save $100 off any two or three days with code AEACSSN.
CSS Layout News Newsletter
Join the newsletter to receive the latest updates in your inbox.