What is a responsive web design and why you should care?

Sharon • April 9, 2021

What is a responsive web design, and why should you care?


According to recent data, a staggering 78% of us use a mobile device to access the internet. To put that into context, just three years ago (that is in 2018), 72% of the population used a smartphone as the most common device to access the internet.


When compared with the data in 2013, that’s a massive 53% increase! Therefore, it is clear that how we access the internet has become so diverse that computers are no longer the primary device we use to access information online.


This is where responsive web design becomes crucial for businesses, not just in Leicester, but for companies of all sizes worldwide. The key for anyone embarking on a new web design project is to ensure that their website loads seamlessly on all devices. So, how can you be sure your website will have a responsive design?


The definition of ‘responsive web design’


In simple terms, a website is said to have a responsive design if it can adapt to the user's screen. The web page should be able to automatically adjust to the screen size of smartphones, tablets, notebooks, laptops, or desktops without issue.


It is the web designer’s skill and technical know-how that will determine whether a website is responsive or not. During the development stage, there are many layers of technical design that need to be followed to enable dynamic changes to the appearance of a website.


The result will be a responsive website that will change its appearance depending on the screen size and orientation of the device being used to view it.


Key components of responsive web design


The term responsive web design was first brought to light by 
Ethan Marcotte way back in 2010.


Three key components encompass this broad term, although we do not intend to get into too technical details, as most of us are not coders or designers:


The first component is the fluid grids. It essentially attempts to align all the elements of a webpage with the browser’s default type size. Back in the day, there was a lot of complex coding behind each page to make it responsive.


The second component is fluid images. This simple technique sets the maximum width of an image to 100%, making the image scale down to a smaller size if the containing column of that image becomes narrower than the image's intrinsic size.


The smart thing about this technique is that it never grows larger. With this option, an image can scale down to fit in a flexibly sized column, rather than overflow it. It will never grow larger and become pixelated if the column becomes wider than the image, which maintains the image quality unaltered.


The third component is the media query, which enables layouts using JavaScript. Rather than having one layout for all screen sizes, the layout could be changed. Sidebars could be repositioned for the smaller screen, or an alternative navigation option could be displayed.


How does the screen size affect a responsive design?


Even with a single device type, such as a smartphone, there are a dozen different screen sizes for which websites need to adjust their display. Most web designers use 
clever tools to make a website compatible with almost any screen size.


Here are the most commonly used screen sizes in pixels:


  • Standard smartphone: 360 x 720
  • iPhone X: 375 x 812
  • Standard tablet: 768 x 1024
  • 15.6-inch laptop: 1366 x 768
  • High-resolution monitor: 1920 x 1080


As we access websites on smartphones more than ever before, it is important to make a business website compatible with as many devices as possible. For example, the image on the left is where the design does not include responsive coding, whereas the image on the right seamlessly fits on a mobile screen.

Therefore, your website must meet the needs of the varying screen resolutions of all these devices. But is it worth the extra effort and cost to make your website fully responsive?


Responsive web design matters, and here’s why


The obvious answer was given in the Office of National Statistics data mentioned above. Local businesses cannot overlook the fact that their users are accessing information about products and services on mobile devices. Having a website set for just one screen type could be fatal for generating more leads and sales, especially if the business is relatively new.


The second most important reason is that illegible texts and images give a poor impression of your brand identity. A business needs to present its best face on the web to showcase its capabilities to customers, business partners, and contractors. Without a professional outlook, you are risking the future of your brand success.


That is why you need to have a professional website design service to have a comprehensive design strategy if your business is based in the Midlands or surrounding counties.


Closely linked to the above, a third reason is that a non-responsive website creates a bad user experience. And as 
more than half of search engine traffic originates from mobile devices, a fixed webpage would put off most mobile users. Therefore, to appeal to a wider audience, your website needs to have a responsive design. 


As with most things in the tech world, it all comes down to finances. Over the last few years, mobile devices have become the primary source of advertising revenue. Even as we gradually move out of the lockdown, the mobile phone advertising market is estimated at $91 billion!


Practical points to discuss with your web designer


Opting for a 
Duda website over a custom-designed one can be quick and cost-effective. However, ensure that you verify with your developers that the Duda theme is fully responsive and meets the needs of mobile devices.


Things to look out for


Three key elements define a website's responsiveness.


First is the responsive design layout. Developers will test the layout of the web page that will be viewed i.e. portrait or landscape. Also, there will be a lot of testing to optimise the size, pixel range and balance of each page.


Secondly, videos and responsive images need to fit seamlessly into any screen size. Most YouTube video codes do respond to the existing coding of a web page. However, you should exercise greater caution when using custom videos or high-resolution images on your website.


Lastly, sometimes overlooked by many, is typography. The font size of the website should be compatible with the parent page width, so it can adapt to the screen of the mobile device and be easily readable.


Here at Kangaroo UK, the sites we build are all mobile-friendly by default. This is because we strive to deliver the best results for each customer, regardless of the web design options they choose. In case the above sounded too ‘techy’, do speak to our specialist design consultants, and we will take you through all the essential parts of a responsive website.

Two people looking at a laptop, pointing at the screen. Office setting, logo in background.
By Paid Ads December 17, 2025
Discover how the KangarooUK team delivers elite marketing power for less cost. Fair dinkum value for SMEs. Call us on 01530 560177 for a chat today!
Two men reviewing a computer screen in an office; one points, smiling.
By Peter Jones November 20, 2025
If you've ever felt the friction in a sales call when the topic turns to price, you're not alone. In the digital agency world, we're not just selling a product; we're selling a complex, high-value service.  How we package that service financially can be the single biggest factor in either building a partnership or hitting a brick wall. There isn't a single, one-size-fits-all approach. The truth is, the "best" model is the one that prioritises the client's immediate needs first, paving the way for a long-term, successful relationship. But this isn't just about how you price your services to your end-client. It's about the very structure of your agency. We see it all the time: talented WordPress agencies who are structured to only handle huge website builds, forcing them to turn away smaller, high-potential clients. We speak with exceptional branding agencies that want to offer a holistic service but find that building and supporting websites distract from their core expertise. This is where rigidity in your business model, not just your sales process, can cost you a perfect-fit client. The "Partnership-First" Approach to Pricing At KangarooUK , we’ve found that true success comes from seeing pricing not as a barrier, but as the first opportunity to build trust. This philosophy operates on two levels: For Direct Clients: Tailoring the payment model to demonstrate we are a partner invested in their success, not just a one-off provider. For Agency Partners: Acting as a specialist partner to help them say "yes" to more opportunities, capturing revenue they would otherwise have to refuse. Let's break down the flexible models that build better relationships on both fronts. Part 1: Flexible Models for Your Direct Clients First, let's examine the client-facing models, even if you plan to outsource the build. Offering these options positions you as a strategic consultant. 1. The Classic: Upfront Project Fees (with a twist) This is the traditional model: the client pays for the website build as a defined project. The Risk: A 100% upfront fee is a deal-breaker for many SMEs with tight cash flow. It can also frame the relationship as purely transactional. The project ends, you hand over the keys, and the partnership struggles to evolve into an ongoing retainer. The Smart-Flex: This is where milestone payments shine. For example, a 50% deposit to secure the project and commence design, with the final 50% balance due just before the new, conversion-driven website goes live. This is a powerful trust-builder. 2. The Relationship-Builder: The 12-Month Split Another highly effective, customer-centric model is splitting the website build cost over 12 months. This model is a game-changer for clients who need to manage their budgets predictably. It transforms a large, daunting capital expense (CAPEX) into a manageable monthly operational expense (OPEX). It’s flexible, predictable, and deeply appreciated by businesses that need to align their outgoings with their revenue. For the agency, it secures a 12-month commitment, naturally opening the door to bundling ongoing marketing retainers. 3. The All-In Partner: "Free" Site + Marketing Retainer This model takes the 12-month split a step further, rolling the entire cost of the build into a 24 or 36-month marketing retainer, presenting the website itself as "free." This is the ultimate low-barrier-to-entry model, powerfully attractive to new businesses. It positions you as a long-term partner from day one and secures predictable, long-term Monthly Recurring Revenue (MRR). Part 2: The Ultimate Flexibility: The Agency-to-Agency Partnership The models above are great, but what if the project itself doesn't align with your agency's needs? What about the client who needs a site, but your minimum project fee is too high? Or the client who needs a fast, scalable site on a platform you don't specialise in? This is where true flexibility wins. Instead of saying "no," you say, "Yes, we can handle that." As the UK’s only Duda Expert & Solution Partner, KangarooUK is built to be this partner for you. We work with clients, agencies, SaaS providers, and trade associations to deliver powerful websites and advanced functionality, allowing you to scale your services without the overhead. Here’s how a partnership model enables you to perform at scale: 1. White-Label Duda Development You can offer our services under your own name. We provide fully White-Label Duda Development in your own environment and brand, enabling you to expand services, clear backlogs, or roll out hundreds of client sites discreetly. With NDAs and silent partnerships, you keep full client ownership while we provide the technical power. This is the perfect solution for branding agencies that want to offer top-tier web design without an in-house development team. 2. Seamless Migrations to a Better Platform Many clients are stuck on slow, insecure, or hard-to-manage platforms like WordPress, Wix, or Mono. A partnership allows you to offer a high-value migration service. We migrate websites to Duda with minimal disruption, whether it's one site or thousands. Every migration is SEO-conscious, ensuring your client keeps their rankings while gaining a faster, safer, and more reliable platform—which you can then manage for them on a retainer. 3. Unlock Enterprise-Grade Tools Our Custom Plan Enablement Platform gives your agency access to Duda’s most powerful features—normally reserved for enterprise plans. You can integrate external datasets, manage an unlimited number of team members, and provide clients with a fully white-labelled environment featuring SSO and API access. This allows you to compete at an enterprise level without the enterprise overhead. 4. Advanced & Custom Solutions on Demand What about the client who needs a custom price calculator, a complex API integration, or even a mobile app? You don't need to build a new department. We handle the heavy lifting. Our team delivers secure, scalable solutions—from custom widgets to database solutions and mobile app builds—that work seamlessly for your client, under your brand. How to Choose the Right Model The secret isn't having a rigid price list. It's using your discovery phase as a diagnostic tool. When you get to the budget conversation, you're not a salesperson; you're a solutions consultant. Ask the right questions: "What's your current budget, and how flexible is it?" "Are there any financial deadlines or fiscal-year considerations we need to be aware of?" "What's more comfortable for your cash flow: a one-off project investment or a predictable monthly cost?" "Are you looking for a long-term partner to help you grow?" And most importantly, ask yourself: "Is this project a perfect fit for my core team, or could I deliver a better, more profitable result for both my client and my agency by using a specialist partner?" The Key Takeaway Being customer-centric and transparent about pricing isn’t just good for clients—it’s essential for agency health. When you tailor your approach, you build immediate trust. But true, sustainable flexibility comes from having the right partners in your corner. It allows you to offer flexible pricing (like the 12-month split) on a platform built for speed and reliability. It allows you to say "yes" to projects your old model would have forced you to refuse. At the end of the day, it’s not about which model is “right” in theory. It’s about which model—and which partner—solves the client’s entire problem.
Stack of coins on top of a financial chart, with a loose coin on the bottom right.
By Peter Jones October 29, 2025
Discover how we achieved explosive growth for our clients during the Prime Big Deal Days 2025.
Screenshot of a performance dashboard showing website clicks, impressions, CTR, and position.
By Devanshi September 26, 2025
In October 2025, Google will update its Google Ads Misrepresentation Policy, specifically targeting dishonest pricing practices.
Show More