1. Home
  2. Discover
  3. Design
  4. Responsive Design Weekly

Responsive Design Weekly - RWD Weekly #434

Read online

Hey everyone and welcome to week #434 of the responsive design newsletter.

I'm sure you, like me, are patiently waiting to see how the US election is going to pan out so I hope this newsletter contains a few interesting links to distract you while the votes are being counted.

Last week I included a little tidbit from our Feature site of the week, so this week I'm doing it in reverse and our Feature site is brought to you thanks to the CSS tip below (thanks for sharing Andy)


.flow > * + * {
  margin-top: var(--flow-space, 1em);
}

The flow utility provides flow and rhythm between direct sibling elements. Where --flow-space is not defined: the default value is 1em, which equals the font size of the affected element.

Let's get to those links!
 

Headline


Webbed Briefs

Funny and informative stuff from Heydon. WEBBED BRIEFS are brief videos about the web, its technologies, and how to make the most of them. They’re packed with information, fun time, and actual goats. Yes, it’s a vlog, but it isn’t on Youtube. Unthinkable! The first is all about ARIA.

 


Sponsor

Vue 3 Introduction with Sarah Drasner.


Get started quickly with the Vue.js JavaScript framework. You’ll learn how to build reusable components and make them flexible with props, lifecycles, and slots. Use directives to build functionality with markup and learn to make your own custom directives. And learn what’s new in Vue 3 and how to abstract functionality with the new Composition API!
Start learning today
Advertise your product, service, or job opportunity to 26,701 tuned in web designers and developers. Find out more.

Article

Redesigning the Pinterest Homepage

At the time of writing this I’m hoping that Pinterest is going to be our feature site of the week (but that will all depend on the x-frame options). I spent some time discussing a very similar approach to overhauling a site that was years old. Research, hypothesise, test, tweak.
 

Effective Skeleton Screens

Tim revisits whether or not Skeleton Screens, the act of putting up grey boxes where the content will eventually load which Facebook/LinkedIn tend to do, is still a suitable approach for a great user experience.
 

Websites We Like: Whimsical

I like this review of Whimsical because I spend quite a bit of time in the product for scoping out websites and defining what needs to be done before handing it off to designers and developers.
 

More People Dipping Toes Into Web Monetization

I had quite a long introduction into PPK’s article last week on web monetisation, and this week Chris from CSS Tricks has provided his thoughts on the subject. If I could encourage you to do anything for 2020 it would be to give this whole Coil thing a go and let me know what you think. Was it easy to set up? Will you make certain things available as a bonus for Coil members? Is there something fundamentally stopping/concerning you?
 

More on content-visibility

The performance gains for setting up a long-scrolling page with content-visibility is huge and that’s awesome. Being able to inform the browser about what is OK not to paint in two lines of code is pretty nice.



Tutorials


Site-Speed Topography

Note that this is TOPography, not typography which is how I first read the title. This run through of how Harry approaches new projects is a great start for you on your own site’s performance (or a clients site if you’re in that line of work).
 

How to persistently change third party web sites with browser developer tools

Have you been caught out before?  You are making a series of changes to your site using the dev tools and then you accidentally click on a link that takes you away from the page and you’ll lose everything 😢. Well there’s a few things you can do to avoid that....
 

Collaborative Journey Maps

When you map the user journey with your team, everyone understands what it says and why. When you collaborate with your team, the journey map transforms from the designer’s magic to the team’s mission, representing the journey you shepherd for your users.
 

Resource


My design systems reading list

If you want to get started with design systems then check out Ethan’s reading list — packed full of system-y and design goodness.

 

Finally


Intent to Prototype: Container Queries

This was a great find by Jeremy just a few hours ago, a discussion around the beginning of implementing container queries by the Google team.
 

That's all for this week. If you've come across any interesting/helpful articles or you've written something yourself please hit reply and let me know about them.

See you all next week!

Have a great weekend!

Cheers,

Justin.
Twitter
Facebook
Website
Copyright © 2020 Simple Things, All rights reserved.
You are receiving this email because you rock! You wanted to know more about Responsive Web Design so you signed up to this list to receive a weekly update with links to articles, tools and tricks of the trade.

Our mailing address is:
Simple Things
Simple Things LTD
Thame, Oxfordshire OX92EQ
United Kingdom

Add us to your address book


Want to change how you receive these emails?
You can update your preferences or unsubscribe from this list

Email Marketing Powered by Mailchimp

Older messages

RWD Weekly #433

Friday, October 30, 2020

Read online Hey everyone and welcome to week #433 of the responsive design newsletter. Our feature site for this week is a nude web page with all it's code bits on show. The site itself is a

RWD Weekly #432

Friday, October 23, 2020

Read online Hey everyone and welcome to week 432 of the responsive design newsletter. This week I've been getting to the end of my workday and excitedly tuning into the Adobe Max conference. In the

RWD Weekly #431

Monday, October 19, 2020

Read online Hello and welcome to RWD weekly newsletter edition 431. This week I'm happy to see someone finally calling out on counting clicks as a default way to improve UX, we're looking at

RWD Weekly #430

Friday, October 9, 2020

Read online Hello and welcome to RWD weekly newsletter edition 430. This week we have two articles on how to break out into full bleed for images/video/codeblocks while still keeping your columns

RWD Weekly #429

Friday, October 2, 2020

Read online Hello and welcome to RWD weekly newsletter edition 429. This week (and last) I've been battling a cold that my daughter brought home from school. Don't be alarmed, it isn't

You Might Also Like

🐺 How to create a high impact press page.

Friday, February 14, 2025

͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏

#494: UX and Product Design

Friday, February 14, 2025

Redesigning complex navigation, product design process, UX in legacy systems, UX workshops with users. Issue #494 • Feb 11, 2025 • View in the browser Smashing Newsletter Halò Smashing Friends, How do

Nick Mafi on Capturing LA’s Loss

Friday, February 14, 2025

View in your browser | Update your preferences ADPro 77 Stories Shared As we watched the worst fires in Los Angeles history spread across the city, the editors at AD came together to discuss the

🐺 Content that Converts - the replay is up!

Friday, February 14, 2025

And everyone who joined loved it! ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌

Designer or Couple’s Therapist?

Friday, February 14, 2025

View in your browser | Update your preferences ADPro Let's Make a Deal There's no shortage of spoils in the wonderfully eclectic Hudson Valley home of actor Walton Goggins and writer-director

178 / Visualize your dreams in 2025

Wednesday, January 15, 2025

Product Disrupt Logo Product Disrupt Half-Monthly Jan 2025 • Part 1 View in browser Welcome to Issue 178 Ever get curious about how this newsletter is doing? I shared the 2024 behind-the-scenes and

Mayer Rus on Loss, and Living, in LA

Tuesday, January 14, 2025

View in your browser | Update your preferences ADPro LA, I Love You Los Angeles has been my home for nearly 20 years, and the devastation here, now, is unfathomable. Entire neighborhoods have been

🐺 How to make a great first impression

Tuesday, January 14, 2025

With real examples. ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏

#490: Interface Design

Tuesday, January 14, 2025

How to design better interfaces, how to choose icons, optical effects, iconography, Gestalt principles and icon design. Issue #490 • Jan 14, 2025 • View in the browser Smashing Newsletter Buona

🐺LAST CHANCE to get 20%-off our PR Masterclass Series

Monday, January 13, 2025

Make 2025 your biggest press year yet. ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏