Issue 183
Firefox 65, table design patterns, optimizing images and a grid scrabble board
News
Issue 183
In the last week, I moved from being an Invited Expert to the W3C to the representative for Fronteers. The move has been ongoing since the meeting last year when Fronteers decided to become a W3C Member, however it is now all official. I wrote a short piece about this on my blog. I'll be in Amsterdam speaking at the Fronteers meetup next Thursday and then running a spec reading workshop for members.
I've been working on documenting various things over at MDN, some of that in preparation for Firefox 65 which is released today. Also heading further down a fragmentation rabbit hole, blog post on that to come!
Rachel Andrew, CSS Layout News
Firefox 65 for developers | MDN
It is Firefox 65 release day. Among the features of interest to web developers is WebP image support, the new Flexbox Inspector, plus the implementation of the CSS fragmentation properties break-before, break-after and break-inside and aliasing of them to the older page-break-* properties.
Learn
Table Design Patterns On The Web — Smashing Magazine
An article with examples to demonstrate how best to display tabular data on the web.
“The Joy of Optimizing Images” by Una Kravets – An Event Apart video
"Images are by far the greatest bottleneck to performance on the web, and with the average web page size now about 2.5MB large—images taking up 65% of that—we need to tame the beast. Running images through a compression program like ImageOptim is a good first step, but what else can we do?"
A useful talk, which while not strictly layout, is an important thing to consider as we try to create more beautiful designs.
Putting the Flexbox Albatross to Real Use | CSS-Tricks
Chris puts the technique to use and also has a look at the Firefox Flexbox Inspector.
Interesting
CSS Grid Scrabble Board
A scrabble board using CSS Grid, which is just a very cool thing to look at!
Our Sponsor
Flexbox, CSS Grid and much more. Understand CSS Layout with my video course.
I've distilled my knowledge about CSS Layout into this training course. This course has something for you if you are new to CSS, have been using frameworks for a while and want to understand how they work, or have been doing this for a while but want to understand the newer layout methods. The course includes video tutorials, text explanations and all the starting points to follow along.
The full table of contents gives an overview of what you can learn - at your own pace. We also have a Slack community where you can ask questions about the course materials.
CSS Layout News Newsletter
Join the newsletter to receive the latest updates in your inbox.