What is responsive design?, explained properly.
What responsive design actually means
A responsive site uses flexible grids, fluid images and CSS media queries to reflow content based on viewport changes. The same HTML and URL serve all devices, with the browser determining how to display content based on screen size. Legacy separate mobile sites such as m.example.com are outdated, because they split SEO authority and create maintenance issues.
Why responsive design matters for SEO
Google has run mobile-first indexing across the entire web since March 2021. That means the version of your site Googlebot crawls, evaluates and ranks is the mobile version. Mobile traffic accounts for approximately 60% of UK web visits, so a poor mobile experience harms rankings everywhere. Responsive design directly affects Core Web Vitals and page speed scores on mobile.
What good responsive design looks like
- Readable type at every breakpoint, with body text at a minimum of 16px on mobile and line lengths of 45 to 75 characters. - Tappable interactive elements, with buttons and links at a minimum of 44 by 44 pixels and adequate spacing. - Layout that reflows rather than shrinks. - The same content on every device. - Performance that holds up, with lazy loading and JavaScript trimming recommended.
What is responsive design?: common questions.
Is my WordPress theme responsive?
Most modern WordPress themes, built within the last five years using Bricks, Elementor, Divi or block themes, are responsive by default. Check by opening your site in Chrome, pressing F12 and toggling device views.
Does responsive design affect SEO?
Yes. Google has indexed and ranked sites based on their mobile version since March 2021. Non-responsive sites are effectively penalised because Google evaluates the phone user experience, where most traffic originates.
What is the difference between responsive design and mobile-friendly?
Responsive design is the methodology: one site, one URL, a CSS-adaptive layout. Mobile-friendly is the outcome: it works well on mobile devices. Responsive design is the common method of achieving mobile-friendliness, though adaptive design exists as an alternative.
How much does it cost to make a site responsive?
Retrofitting responsiveness on modern themes typically costs several thousand pounds and takes a couple of weeks. Legacy templates often require full rebuilds, though the cost recovers quickly through mobile conversion improvements.
What clients say about working with us.
“I've had the pleasure of working with Chris on several SEO projects for my websites in the health field. He was definitely been able to demystify things so that I felt able to make decisions with him and feel confident they were the right ones. For a non-techie, that is worth gold! I look forward to working with Chris again and warmly recommend him to anyone who - like me - is unsure about all things SEO.”
“I was recommended by my branding partner to use Chris and his team last year. I can’t recommend them highly enough. They are very responsive , easy to communicate with and great at translating techy stuff when needed. They are now an essential part of my business model”
“We've been working closely with Chris, Hannah and the team for over 12 months now. As a small company with ambitious growth plans, it was incredibly important that we made the right choice on who to trust with our SEO. 18 months later, we're totally thrilled with our experience so far and our growing online presence within our market. We'd happily recommend BTT and their services to other SMEs. Drop them an enquiry!”
Real people on your account, not a faceless agency.
You work directly with the senior people who do the work, a small Bristol team you will actually get to know, not a call centre or an account manager relaying messages.
Meet the team →
