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.

The Power (and Fun) of Scope with CSS Custom Properties

Custom properties makes CSS a programming language. There, I said it, no need to reply :). I’m still not in the practice of using CSS variables and I feel that I’m steadily being left behind, and also that I’m missing out on taking some serious shortcuts in my code.

Read more

Get More For Less With Variable Fonts

I feel that most of us (certainly me) are still coming to grips with the application of variable fonts when we build sites. To me this means it’s up to us to become more familiar with how they work and the design potentials that they open up, and then showcase that to designers so that […]

Read more

Moving towards a faster web

The Google Chrome team are making UX changes to the browser to help users identify is a site is known to be slow loading. This is a great step in the right direction provided that they get the measurements right (which I’m sure they will). It’s great to see the Chrome team focusing specifically on […]

Read more

8 Unbelievable Things You Never Knew About Tracking

Really eye opening slides from Laura Kalbag’s recent talk at Full Frontal web conference in Brighton last Friday. If you think you know how much data is collected about you, I’m almost 100% sure you’ll find something else you didn’t know in this (I know I did)

Read more

Chrome Developer Summit 2019: performance announcements you have to know

Calibre (a performance monitoring tool) go through all the announcements related to performance that happened during the Chrome Development Summit. They cover off some of the items we have in our resources section this week and much more.

Read more

Getting your sites ready for the new Microsoft Edge

Windows had a release candidate out to go with their fancy new logo (does anyone else get reminded of the Firefox logo?) A new Edge means they’re finally rolling out the changes which essentially make Edge the same as Chrome. I wish they would have stuck with their own rendering engine and helped provide some […]

Read more

Become a Front-End Master in 2020 With These 10 Project Ideas

There are some really great suggestions here from Chris. The “find a dribbble shot and recreate it in a clean semantic accessible way” is one of my tasks for next year.

Read more

The web is not dying

The web has been on and off its deathbed for the past 25 years and each year someone/thing gets traction around the end of times and the commeth of native. There are some serious issues, don’t get me wrong, but with people like Chris Ferdinandi and you at the helm to steer us in the […]

Read more

The Web Share API in Safari on iOS

If you’re implementing the web share API on your site BEWARE. The API takes three arguments, Name, Text, URL, but when sharing on iOS it will only pass two arguments and omit the third one, the URL (go figure, the most vital piece). Jeremy has a modified script that he uses to only pass across […]

Read more

Why Are Accessible Websites so Hard to Build?

The other day one of the Creative Directors at work approached me very excited. He wanted our next web project to win an award for Accessibility… certainly something I could get behind. The thing was, however, is that he wanted to create a website that would be featured on Awwwards, but have a toggle button […]

Read more

Reverse Knockout Text Mask Effect with SVG

Using design tricks on headings allows you to make more of the typography choices that you make and can have some interesting design outcomes. This approach will work with both custom headers (like a homepage that you set and forget) but also with a blog/CMS that has variable heading lengths/sizes

Read more

Dark mode

Jeremy applies a dark mode to his site during a recent indie web camp. The thing that I quite like about it, aside from the use of CSS Custom Properties, is the approach to darken your images with CSS as part of the update. I never would have thought of that.

Read more

A Guide To New And Experimental CSS DevTools In Firefox

As I’ve mentioned (a lot) before, I’ve switched over to Firefox as my primary browser. At first, the only downside was my lack off familiarity with the dev tools, but now I prefer it over Chrome’s. In this tutorial, you can see how the Grid Inspector, Fonts editor, Shape Path Editor and more work (seven […]

Read more

Building a Scrapbook Layout with CSS Grid

A compound grid is when you have two grids, like a 5 column and a 4 column, and you overlay them together. What does that have to do with Scrapbook layouts? Well, this is the grid that Michelle used to build the scrapbook and she even built this little tool on code pen that will […]

Read more

A Modern CSS Reset

I remember when Eric Meyer created the first CSS reset back in 2008 (or at least that was the first time I really started using it). I think this version from Andy is a modern approach and something which is worth considering. If you’re using any reset please make sure you understand what the declarations […]

Read more

Blog service workers and the chicken and the egg

Remy continues to tweak his implementation of his service worker. In this iteration he ensures that if you land directly on a blog post for the first visit (when the service worker is first activated) that the current page is added to the list of cached items (it doesn’t by default because when the page […]

Read more

Making Instagram.com faster: Part 1

Instagram started as an app and that is where they focussed most of their efforts for a long time. Now things are changing and Instgram have been spending more time improving the capabilities of the instagram.com site. In this first of many posts, the engineering team go through the steps they’ve taken to help improve […]

Read more

Using the DOM like a Pro

Jquery was a great way to make traversing and manipulating the DOM a lot easier than it was with vanilla javascript, especially seeing as at the time each browser had their own quirks. Nowadays JS has developed further to provide the same simple hooks that jQuery once afforded us. This tutorial takes you through key […]

Read more

The Browser Monopoly

Blair looks at the current stronghold that Chrome (Google) has over the browser market, how they got there, and why they’re such a tough force to disrupt. I especially like the ideas around what Firefox could be doing to help challenge this, and I for one will be happy to pay some money for the […]

Read more

Making Your Wait a Little More Great: New Loading Indicators in AMP

I still don’t like AMP, but I do like the approach of showing the user that something is happening rather than just showing them a blank page while things are still loading. (I have nothing against the people working on AMP and their goal of making a faster web, I’m just against the use of […]

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.