Hi and welcome to edition 309 of the RWD Weekly newsletter.
This week we're taking a look at some Math with CSS — there's even a link where you can test your skills against 11 year olds — as well as inclusive media queries.... a presentation not to be missed.
There's some excellent resources for page transitions and container queries as well, plenty of things to keep you busy experimenting on a Friday. | | Headline It's not often that a presenation becomes the headline of the newsletter, but Eric Bailey absolutely smashes this with his slide deck and comments. This is not a video of Eric presenting, but instead it's 127 slides of amazing information, tips, and tricks for building on the web today. | | | What would be the best way to learn and improve your skills? By looking over a designer or developer's shoulder! At SmashingConf Toronto taking place on June 26–27, they will let us do exactly that. All talks will be about running live coding and design sessions on stage, showing how speakers such as Dan Mall and Lea Verou, Rachel Andrew, and Sarah Soueidan design and build stuff — including pattern libraries setup, design workflows and shortcuts, debugging, naming conventions, and everything in between. | | Articles A cracking effort from Ashley Nolan in putting the survey and results together. These results represent a sample of front-end developers working in the industry. Therefore, they shouldn't be taken as gospel, simply as pointing towards a rough trend.
It's a shame that eBay is focusing their PWA for Android devices first now that iOS also support Service Workers. I'm sure it's because there's some additional functionality that isn't supported and I have reached out to the author for further clarification within 9 minutes of me reaching out I had an answer from Alex Russell. It turns out that Safari are still yet to implement some service worker features including Navigation Preload which are required for this work. Thanks Alex!
Tutorials This week at work we all spent around 30 minutes going through these school maths problems resulting in a lot of scribbling on paper (and some embarrassed faces). You should give it a go, because like Chen points out in this article we do use maths when we're dealing with the front end. This can be setting the page layout, creating border-radius, triangles with borders or setting fluid typography.
Lea Verou comes back to one of the more challenging issues we've had since the move from fixed desktop sites to the responsive world, the data table. There are a number of existing solutions which I think are covered really well with Table Saw (link to resource), but these are some interesting approaches that I've not seen before.
A couple of weeks ago Sarah Drasner wrote an article on getting nice page transitions using Vue. This we have Georgy Marchuk taking a look at using Swupjs to enable page transitions for all sites.
Jeremy Keith covers off his talk at the Delta V conference and goes into the details around how to turn any website into a progressive web app.
Tools & Plugins
CSS transitions between website pages
A simple, tiny alternative to element/container queries from Matt Stow.
A resource for learning, creating and evangelizing design systems
| | It was good to see you again this week, thanks for reading all the way down to the bottom. See you next week!
Cheers,
Justin. | | | |
No comments:
Post a Comment