Lazy-loading, regular grids, accessibility as progressive enhancement.
This morning it felt a little like Autumn (Fall for many of you) as I cycled up to the gym. I'm going to need to get my bike lights out! Despite being a (very) long time out of school, I still quite like the back to school feeling that begins at this time of year. For me a back to travel reality as all the conferences and meetings start up again!
This issue is sponsored by An Event Apart. I'll be heading off to speak at An Event Apart Chicago at the end of next week, and we still have the Denver and San Francisco events to look forward to this year. Check out the post at the end of this email for a special offer.
Rachel Andrew, CSS Layout News
Native lazy-loading for the web | web.dev
Native lazy-loading for the web is here in Chrome. This article explains how it works.
Inspired Design Decisions: Ernest Journal — Smashing Magazine
This third instalment of Inspired Design is interesting for anyone who thinks it isn't possible to create an interesting and unique layout when using the strict grid patterns of a framework. This time, Andy Clarke is taking inspiration from the design of Ernest Journal, which uses a very regular grid.
Jules Forrest on For The Love Of The Grid on Vimeo
In this video from Smashing Conf Toronto, Jules Forrest codes a design live on stage using CSS Grid. We've published all of the Smashing Conf Toronto video, you can find them all here.
Using Progressive Enhancement to Design for Accessibility - Blog | SitePen
This is a really nice post explainng designing for accessibility in terms of progressive enhancement.
"The solution is progressive enhancement. For years, developers have utilized this approach to ensure that their code works across multiple browsers and operating systems. The idea is to start at the bottom: make sure that the core functionality of the application works on the most antiquated browser, and then layer on nuance and support for the users who have newer, more capable browsers. When designing for accessibility, we can take the same approach. Start with accessibility requirements first, and then enhance upwards."
Design Principles for Developers: Processes and CSS Tips for Better Web Design | CSS-Tricks
This is the sort of article I love, as a design-challenged developer. Not just layout but I wanted to include it as there are some useful tips for folk like me.
A CodePen that allows you to play around with CSS Filters.
”You're a wizard, Harry!”
That’s what they’ll say when you return from An Event Apart eager to show your colleagues how to solve problems that once baffled you all. Well, it’s what they’ll say if your name’s Harry. And no matter what your name is, they’re all sure to be impressed.
Learn new secrets of web design and development, and eternal truths about UX. From web form wizardry to the latest in optimization. Inclusive animation? We’ve got it covered. The technical side of design systems? You betcha. What emerging CSS techniques mean for accessibility? You’ll learn that—and so much more.
Discover your secret power to design, develop, and plan brilliant web experiences, and set yourself Apart. 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.