Hello again and welcome to this week's responsive design weekly newsletter.
This week we'll take a look at getting started with web page test, get our sites working faster with service workers, check out the new and upcoming way to lazy load images and much more.
Let's get linking.
Headline "This is the way he wants it, well, he gets it".
For those of you that are closely aligned with my musical tastes you'll recognise that from Guns and Roses Civil War, but the actual quote comes from Cool Hand Luke. Both have nothing to do with the link :)
Chris covers off something that is near and dear to my heart, creating web pages using HTML to serve content as a first port of call... and ideally the last. The days of rolling everything into Vue, React, Angular, just to serve content to the masses (I'm looking at your NASA) are certainly upon us, but I just cannot fathom how these decisions are made.
| | | What's it all about? Well, monday.com is about managing your workload professionally, planning ahead visually and communicating with the team. Once these points are set, have your champagne to celebrate the success of your graphic design brand! | | Articles This is a great introduction on how anyone can contribute to open source. If you've always thought about it then read this article and go and find something to contribute to today.
With the arrival or CSS Writing Modes and the ability to quickly change from left to right to right to left, or top to bottom/bottom to top. With those updates it's hard to work out something like margin-top/bottom/right/left. This aims to fix that problem.
There's a big focus on this article around the privacy of the user, but I'd be more interested in delving deeper into what AMP considers the actions of a user that wants a page to be prerendered. I worry less about the privacy implications of someone not viewing a page that is loaded and focus more on the wasted requests and bandwidth.
long story on how percentage work on CSS in general and in CSS Grid Layout row tracks and gutters particularly.
This is very exciting. I'm just finishing a quick web cast on how to enable lazy loading in Wordpress by using the RWD site as an example, but it's great to see that a simple update to the <img> tag will let us do this natively.
Join hundreds of thousands of expert designers who receive our twice-weekly articles focused on the forefront of design. Subscribe to the Toptal Design Blog today and receive our 'Mastering Sketch' eBook, with six helpful articles for Sketch productivity. Subscribe on the right-hand side, after reading our article comparing Sketch and AdobeXD.
// Sponsor
Tutorials
Building a Nothing PWA in 15 minutes
An introduction into Service Workers from the Flavio Copes and the team from Alligator
In this article James runs through the typical approach of having a button style for default and active, but then having to change that up depending on if it's on a light on dark background.
I'm really enjoying David East's Front End News and his detailed overview of something particular each week, this week it's using Web Page Test.
Tools & Resources
Use a lens to drill down into a particular subset of websites. The HTTP archive now support @WordPress, @Drupal, and @Magento lenses.
A design system used for any mozilla branded websites. You will probably already be familiar with this look from the Mozilla Developer Network documents. I wouldn't use this directly, unless you want to look like Mozilla, but it is a good frame of reference if you're building your own design system.
load images only when they are in (and remain in) the viewport
| | Finally Some great work as part of a hackathon bringing some Augmented Reality to the browser in a shopping scenario.
Thanks to those that suggested some of the links for this week, if you have come across something that you found interesting, or have written yourself, hit reply and let me know.
Cheers,
Justin. | | | |
No comments:
Post a Comment