RWD Weekly #363

Welcome to week 363 of the responsive design weekly!

This week our feature site is Lago Design Studio who focus on physical office location fit-outs, but they’re site is lovely. It uses  large typography and animates their site heavily with GSAP. It is on the heavy side of things when it comes to page weight (4.5mb) and could certainly do with some lazy loading on the images to help bring that down.

Sponsorship

SmashingConf Toronto 🇨🇦 2019 (June 25–26)

Up, up, up to the stars! SmashingConf Toronto is a friendly, inclusive event which is focused on real-world problems and solutions. Instead of showing slides, presenters prefer showing attendees how they work in a practical sense, from live debugging to live redesign. 13 speakers including Sarah Drasner, Brad Frost and Steven Hoober will be exploring practical front-end techniques and design strategies. Tickets are now available ↬

Feel excited to join, but you think your manager could need just a little bit more persuasion? We’ve prepared a neat Convince Your Boss PDF (123 KB).

Get your ticket today

Articles

3 Reasons Against Ad Blockers

A really interesting article about ad blockers from Jens. As a content creator I really understand his second point about damaging creators. I’m lucky to have the newsletter sponsored by other publications, events, and useful products, but small income from the site itself has steadily declined over the past few years. I totally get why you might use them though, other publications and sites have really made them a necessity for browsing these days.

The Co-opetition of Team Web

I love this post from Zach about how similar tools/products to your own that you’re developing aren’t necessarily a competitor, but they can work well together or spur you on to improve your own products. The web as a whole, you and I, we strive to collaborate and make great things. I love that.

When Do We Need A Design System?

Brad and Vitaly site down to talk about all things design systems.

CSS Grid Level 2 – subgrid is coming to Firefox

We talked a little about sub-grid last week and this week Rachel Andrew delivers everything you need to know about the support in Firefox.

Characteristics of a Strong Performance Culture

Tutorials

Extract critical CSS

We don’t here too much about critical CSS these days, but it can still help with first paint and make users feel like your site is super fast by putting content in front of them sooner.

Image Optimization In WordPress

Reducing the size of your images is a sure fire way to increase the speed of your website and lower the frustrations of your users. If you’re running WordPress (I’m guessing about 33% of you) then here’s a few approaches you can use (non wordpress users will find it helpful too).

Medium to your own blog

This week we have a tool that will help you add a search function to your static Gatsby site, now this tutorial will take all your amazing content from Medium and drop it onto a Gatsby powered site just for you.

Increase Customer Centricity With Workshops

Running a workshop with clients to identify the products needs against your customer base can be _hard_. This article from Claire is a 35 minute read but with a tonne of valuable tips and tricks on how to prepare and run sessions, it even has agenda’s and sample downloads.

Gatsby site search with Lunr.js

One of the downsides for a static site is that a search capability is tough to come by. This tutorial looks at using a tool called Lunr.js (note the similarity to Solr) on how you might use this with your static site.

Tools

performance-budgets

No more excuses not to set performance budgets. performance-budgets gives you a simple way to check and stay on top of performance.

Lunr.js

A bit like Solr, but much smaller and not as bright

Finally

That’s all for this week, enjoy your weekend and if you have written about anything you have been doing lately please hit reply.

Cheers,

Justin.

Subscribe to our Newsletter

Add your email address and receive an email every Friday covering off everything worth knowing about building your websites responsively.