By Justin Avery, 27 March 2020 posted in Newsletter
Headline
Apple’s attack on service workers
This article is so good it made the front page on the orange website. We’ve covered the original article from WebKit below, but Jeremy goes into the detail of what the recent changes to Safari really means for the web.
Sponsorship
Restrict Content Pro
A full-featured, powerful membership solution for WordPress. In the time where people are looking for alternative ways to make money this plugin for WordPress can help you create a membership area quickly and securely.
Articles
Full Third-Party Cookie Blocking and More
An article from Aral raised concerns over this move which is strange to come from such a privacy orientated person. His real concern is around the removal of all local storage capabilities if the website isn’t used for more than 7 days. An update to the article indicates that this is not the case for PWAs that are added to the home screen, but that begs the question about what happens to desktop apps. If you use browser based apps on Safari like Tidal, Twitter and use it less than weekly you could be impacted. If you didn’t read Jeremy’s article in our headline, check that out.
Firefox Better Web with Scroll
For those of you based in the US you can try out this new initiative from Firefox and Scroll. Pay just $2.49 per month and have certain website’s advertising removed so you can enjoy your content (ad free).
CO2 emissions on the web
Tutorials
Maintaining Performance
Dave shows why it is so important to continue to check your site after launch (after every update) and make sure you’re still running a performant website. In this article you can see how he saved a whopping 33s load time by re-implementing the font loading strategy.
How to switch from Microsoft Edge to Firefox in just a few minutes
Continuing on from our push last week to raise awareness of the Firefox Browser this quick lesson on moving from Edge to Firefox seems timely. Perfect for your not-so-tech-savy relative or friend to make a change to a more privacy focused web.
Implementing Google Custom Search Engine’s JSON API in the JAMStack
We covered off how to do this with Angolia search so it’s only fair that we also showcase how this might work with Google Custom Search. If you have a JAM Stack site and have a different search mechanic let me know how you’re dealing with the issue.
Oh, embed!
Currently we’re spending a lot of time online and in front of our web cameras to continue to engage with folks, and it’s happening across a number of industries. As we continue the chances are that you’ll produce more video content so this wonderful tutorial from Jeremy has coming along at the right time. Learn how you can embed your youtube videos as performantly as possible.
Embracing modern image formats
Josh looks at the benefits of optimisting images and how JPG, PNG, and WEBP stack up against each other. He showcases best practice using the picture element and even covers off how to convert your existing images to webp.
Inspired Design Decisions With Otto Storch: When Idea, Copy, Art And Typography Became Inseparable
Stunning examples of stretching your web designs beyond what we commonly see by using inspiration from print.
Scrape Static Site with Algolia
Setting up a static site you sometimes miss out on dynamic things like site search. You also need to know when to re-index your website, so using something like GitHub Actions can make this part of your deployment process.
Everything About Auto in CSS
Auto is a value that can be used on a number of different CSS properties. The most common ones for me is setting an image height: auto; when doing responsive images, and using margin: 0 auto; as a way to center block elements. There are so many other uses for it though, and Ahmad goes through each and every one of them.
Resource & Tools
Site.js
Develop, test, and deploy your secure static or dynamic personal web site with zero configuration.
Pixel Lite – Free Bootstrap 4 UI KIT
Pixel Lite Bootstrap 4 UI Kit is a beautifully crafted UI Kit based on Bootstrap 4 Components. This theme was built following Bootstrap’s methodologies by the heart. It has 100 components, 3 plugins and 3 example pages.
Netlify offer free stuff for corona site details