Hello and welcome to RWD Weekly Edition #274.
Just a note to all the UK and European subscribers that Reasons.to is on next week and you should definitely come along and say hello! I'm in a mad dash at the moment to get through as much work as possible to clear out Monday-Wednesday next week so that I can sit back and soak in the conference.
Let's get linking!
This week I talk about why API's are a good place to starting thinking, we look at more CSS Grid tips and tricks, take a look at the healthcare.gov design system, have a look at WCAG2.1 and much more.
Headline So while this has nothing to do with RWD I think it's a valuable way to think about building anything on the web. If you think about how you might need to extract content onto a web page (or app, or search engine, or widget on someone else's site) you start to break down in the individual components and think about how they might be useful, how they might relate to each other, how they might be queried etc. As you do this you begin to see other opportunities for the content, but you also realise you might need data applied to the content elements that isn't seen but needed to provide the right information at the right time. It's a really worthwhile thing to do.
I found this to be an incredibly moving article. It has reminded me that I need to spend more time testing the code/content I produce for all methods of consumption. | | State of the Browser is a one-day, single-track conference with widely varying talks about the modern web. This year's loose theme is: Rise of the Browsers. Speakers include Peter Gasston, Peter O'Shaughnessy, and Seren Davies. The conference is in London, UK, and it's on a Saturday so you don't even need time off work. They're incredibly welcoming, I took Noah along to my first one when he was only 9 months and they looked after us both.
| | Articles This is a great point with the usability and potential issues with a page that loads progressively (rather than having a spinner until everything is ready). This isn't the fault of progressive web apps though, and I think the comparison between the two is unfair especially for me because I think of progressive web apps from the service worker and offline side of things which has no impact on anything in this article. That doesn't mean it's not a great article though, the layout issues and progressive loading issues are great points you should consider when you're designing your own interfaces.
Jason Grigsby talks through the cloud 4 timeline/road map on the way to progressive bliss.
woohoo, Brad has undertaken what many of us are too worried about — a redesign of our personal sites. There are some good reasons behind it and although it doesn't 'look' like a lot has changed as soon as Brad started talking about cleaning up content in WordPress I know there's a tonne of stuff that's gone on for this. This will have to be the next example up on our site.
An interesting look at some popular logos and where they might have been derived from in the past. This should give you the confidence, or at least wash away the worry, if your design might happen to resemble another one found on the web. The idea is that your iteration is better than the last.
Understanding the CSS Grid Layout through a quick overview from Tim Wright.
When it comes to virtual reality, augmented reality, and mixed reality, Austin has built a hands-on process for researching and creating immersive experiences using emerging technologies and now he is here to share with us his own personal experience.
A deep dive on creating the design system in a large organisation. This post covers some of the bigger technical decisions that were made while developing the design system.
"Think about your presentation having a good narrative arc. Like a film. Unless that film is called Mamma Mia, which is s&*t." - Some very good advice there from Brendan Dawes about speaking and he's got a lot more. This may have been written a while ago but it all still reigns true.
Tutorials Chrome version 60 ships with an exciting new DevTools feature called Audits 2.0. This panel replaces the previous Audits panel with a new set of tests powered by Lighthouse. Lighthouse is a tool which checks for various performance and best practice metrics, including accessibility.
I remember when WCAG2.0 came in and we all got out our testing tools to discover that we were really really bad at accessibility. Now that WCAG2.1 is almost upon us it's time to start learning what you need to do this time around, and fortunately, Adrian Roselli has got our backs with this awesome overview of everything you need to know.
This tutorial breaks down how you might approach loading CSS into your designs in a truly HTTP/2 world. If you're already building things via an atomic design approach then your SCSS files are likely to be broken down into similar components already.
What you need to consider when using SVGs in your responsive designs
Learn how to organize your font collection to maintain consistency across your team's design workflow in this free webinar // sponsor 
Resource & CodePen Does what it says on the tin - a whole bunch of links to explanations to problems you're likely to run in to.
That's it for this week. I've started pulling together a talk for a conference coming up in October which I'm very excited about, a whole bunch of new learning is needed.
See you next week!
Cheers,
Justin. | | | |
