Welcome to week 362 of the responsive design weekly newsletter!
As I was hoping I have come back with a renewed passion for tinkering on the web and over the next several weeks I hope to be rolling out a few experiments with AR and VR on the web.
Here’s hoping I can pull a few of these off, but for now let’s get linking.
Andrew Betts takes a close look at AMP across three specific areas: Technical, User experience and Commercial.
Percy’s all-in-one testing platform makes it easy to review your UI across responsive widths and browsers. With visual testing, you can replace time-consuming manual QA to catch visual bugs automatically and ship with complete confidence in your designs. Get started today.
Chatbots or forms, what do you think? I really like a conversational interface to find my way through a data collection process, but done wrong it can be incredibly infuriating.
Woohoo, another browser/OS/device set of combinations to support. Thanks Microsoft! I say this in jest, I’m glad there’s more competition on the Mac albeit at the demise of the Edge rendering engine.
The next generation of story telling on the web will be done through VR, learn how Mozilla see this happening.
Have you ever wondered what is behind a JPG? Well now you can learn and play around with the code to see how it impacts the image. This will also help you understand how image compression works.
Zell has conducted an interview and goes through the job application process from a developers point of view. If you’re thinking about apply for your first job, or looking to make a switch I highly recommend you check this out.
While CSS shapes might not be what you expected when you start this article, hopefully you’ll come to see their power.
An epic example of setting up the planets using CSS. I’m glad I came across this as I’m putting together a landing page for our Solar System Notebooks so I hope Rob doesn’t mind me using his inspiration to make it even better.
Subgrids are an exciting addition to the CSS Grid specification and as we see it roll out across browsers you’re going to find uses for it.
Rachel looks at how they can effect a simple card layout.
Brad shares a technique where you can take advantage of the media query attribute of the picture element to call a different image when users prefer reduced motion. A great idea for any GIF’s you’ve got on your sites.
CodyHouse provide some practical examples of why they decided to keep their CSS variables inside of the CSS Custom Properties. This spans color schemes, typography, spacing, and vertical rhythm and does well to also pull out the catch (browser support)
Resources & Tools
Though this project can get a basic layout started for you, this project is not a comprehensive tour of CSS Grid capabilities. It is a way for you to use CSS Grid features quickly.
Build your story just the way you want it.
Round, flat, designer-friendly pseudo-3D engine for canvas & SVG
That’s all for this week, enjoy your weekend and if you have written about anything you have been doing lately please hit reply and let me know!