Responsive Design News

Keep up with the latest news and developments around responsive design and the new direcitons that web designa and development are taking.

HTTPS is Easy!

I don’t like to say things are “Easy” because for someone getting started things are rarely ever easy. This is the name of a series that will help take you through the steps you need to get your site up and secure.

Read more

CSS Positioning

Positioning things within a browser is easy… but positioning where you actually want them to go…. well that’s a whole different story. This tutorial will help take the complexity out of positioning and make it an easier process for you to build your sites.

Read more

Redesign: Gridniking

Frank Chimero’s new redesign has been a fascinating read. This article he looks at how the grid will come together, and if you like that check out his post about the footer too.

Read more

ResizeObserver in WebKit

ResizeObserver has hit WebKit Safari Technology Preview releases by default as of version 97l. Rather than focus on how slow webkit were to enable this feature (Chrome released this in Jan 2018) let’s rejoice in the fact that another browser supports this (Chrome, FF, Edge, Opera… all desktop). The article has a great example and […]

Read more

Thoughts on Writing: What They Say

I love this piece from Matthias and I can’t echo his words enough (or Sara’s linked to in the post). “Write about what is most important to you in the first place and create the opportunity for people to learn and reach their own conclusions. Oh, and don’t forget to publish your work. Ideally on […]

Read more

CSS Grid can be used to stack elements

Stack elements easy with display:grid… although you can do the same thing with display:block; — BUT that’s not really what Stefan is doing in this article, instead it’s moving the elements out of the regular content flow and setting them to grid positions that you would have otherwise required absolute positioning to achieve.

Read more

The Mythical Mythical Man-Month

The idea of the man-month (need not be a man) is that you can not simnply add more developers to a project to shorten the delivery time, and in fact that adding more people will delay delivery further. The article author, John Foreman who is Chief Product Office at Mailchimp (and therefore has my undivided […]

Read more

The New Generation of Performance Metrics for Better User Experience

Most of you these days will focus on one or more of the three key metrics when it comes to performance: First Contentful Paint (is it happening), First Meaningful Paint (is it useful), and Time to Interactive (can I use it?). Those have paved the way for three new metrics that will are worth looking […]

Read more

Collaborative Information Architecture at Scale

Designing an information architecture with input from multiple stakeholder groups can feel like a NASA-level effort. This article shares thoughts on how to keep things organised while working systematically.

Read more

Upgrading to the new Microsoft Edge

Microsoft Edge is now shipping with Chrome running it behind the scenes. For the first time in a long time a Microsoft browser is once again available on MacOS. I’ve installed it, tried it, and now I’m not likely to reopen it unless I need to debug something.

Read more

The Thought Process Behind a Flexbox Layout

Chris looks at the adventure of laying out three boxes with a variety of content using Flex box and how different settings will impact the layout. One interesting approach that I’ve never done before is setting display:block on the elements when you want them to stack vertically over using flex-direction: column;

Read more

How To Run a Proxy Server Inside Your Browser

There’s a great overview of how to use Service Workers to make local development much easier (especially if you’re trying to hit an API that you want to run locally). This is a medium link, so if you’ve run out of free articles you can use this tweet to see it https://twitter.com/justinavery/status/1200025733361479682), or if you […]

Read more

How I created 488 “live images”

Oh my. For years people have been asking at least once a week to enable a screenshot capability on Am I Responsive but it’s been beyond my level of coding capabilities (at least the way that I want it to work anyway). This tutorial from Ire is the gap in my knowledge that I’ve been […]

Read more

The ugly truth about optimising beautiful images

Sometimes when you’re making optimisations to images on a site you won’t see that much of a change to the overall load time or the first significant paint. Often this is a result of some other implementation factor, and if you dig one more layer down you’ll find a way to get the really big […]

Read more

Simplified Fluid Typography

I loved it when we could declare different font sizes between breakpoints to have the best typography for the given width, but when the typography locks were introduced things go a whole lot better.

Read more

HEAD – A free guide to elements

Although all the important stuff comes from the <body> tags (the important stuff being the actual content) the things you place inside the <head> are vital for the content actually being seen. This is a great guide to what is vital and important and what each of the elements do. Who’s doing the <body> version?

Read more

Responsive Type and Zoom

Beware when setting your typography in responsive sites as there are chances that the way you implement it will remove the ability to users to properly zoom in on text when they want to.

Read more

Calculating Color: Dynamic Color Theming with Pure CSS

Did you know that you can build custom dynamic color themes without the use of JavaScript or a CSS preprocessor!? Read on!

Read more

An Introduction to Variable Fonts

24 Ways is my favourite advent calendar and this year is not disappointing. There are back to back tutorials on Variable Fonts and I highly recommend you starting with the overview from Jason Pamental before following up with Mandy’s.

Read more

Getting Started with Web Performance

Are you looking for an introductory article that you can use to explain to someone why it’s important to their business? Or maybe you’re on the performance band wagon but you’re not exactly sure why. This article from Karolina and Calibre have you covered.

Read more

Subscribe to our Newsletter

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