Responsive design: questions and answers to decide what your website needs

A website may look fine on a computer yet make it difficult to submit an enquiry, make a purchase or read about a service on a mobile device. The issue is not usually just aesthetic: small buttons, cramped text, awkward forms or key information in the wrong place change how people use the page.

Responsive design aims to avoid that friction by adapting the interface to each screen size. By the end of these questions, you will be able to distinguish what that adaptation should include, what is worth checking and whether your project needs a more in-depth redesign.

Short answer: what is responsive design?

It is a way of designing and developing a website so that its structure, content and controls adapt to the available space. Rather than creating an independent version for each device, it starts from a single website that rearranges its elements according to screen width.

This may mean that several columns become one, a menu changes format, an image is cropped differently or a form displays its fields in a more convenient layout. The goal is not for everything to look identical, but for every task to remain understandable and achievable.

Definition questions

Does responsive design mean creating a website “for mobile”?

Not exactly. It means designing for different screen contexts, including mobile. People may visit your website from a phone, tablet, laptop or large display. The design should respond to those spaces without losing hierarchy or usefulness.

Thinking mobile first often helps with prioritisation: it forces you to decide which information and actions need the most prominent space. But a good adaptation also reviews wider screens, where overly stretched content or scattered navigation can be uncomfortable.

Is responsive design the same as a separate mobile version?

No. A separate mobile version is a different website designed for phones; a responsive website adapts the same interface. Maintaining separate sites can introduce duplicated content, inconsistent changes and more elements to review.

There are situations where a mobile-specific experience may make sense, for example if the task, context of use or features are genuinely different. That decision should be based on user needs, not on a technical label.

What needs to adapt besides image size?

The adaptation should cover everything that allows people to understand and use the page. At a minimum, it is worth reviewing:

• The hierarchy of headings, text and calls to action.
• Navigation and the way users find services or information.
• Reading width and spacing between sections.
• Buttons, links and fields tapped with a finger.
• Forms, including their error and confirmation messages.
• Tables, filters, maps, videos and other complex elements.

Simply shrinking a desktop website until it fits on a phone does not necessarily address these points.

Scope questions

What should I ask for when including responsive design in a web project?

Ask for the devices or screen ranges to be reviewed and the actions that must work on each one to be defined. The word “responsive” alone is ambiguous unless it specifies which pages, components and user journeys it covers.

You can turn that request into verifiable criteria. For example: a person should be able to find a service, read its description, complete a form and see a confirmation without controls overlapping or being hidden. This is a hypothetical example, but it illustrates the difference between requesting a generic adaptation and agreeing on a verifiable outcome.

It is also worth clarifying whether the scope includes:

• New pages, existing pages or both.
• Menus, forms, tables, catalogues and downloadable content.
• Review of text, images and visual elements.
• Testing at the defined screen sizes.
• Adjustments to components repeated across several pages.

Do all website pages need to be reviewed?

All templates and components within the scope need to be reviewed, not just the homepage. A contact page, service page, listing or checkout process may behave differently even when they share the same design.

If the website has many pages with the same structure, reviewing that shared structure and then checking cases that introduce their own elements may be more useful. By contrast, a page with tables, filters, calendars or long forms deserves a specific review.

How do you decide what comes first?

Start with the pages and actions that support the website’s objective. If your priority is receiving enquiries, first review the journey from service information to contact. If you sell products, the focus may be on search, the product page, the basket and delivery details.

Separating objective, scope and solution avoids unhelpful discussions. The objective describes what the person must be able to do; the scope lists pages and functions; the solution sets out how they will adapt. This allows you to assess what is essential now and what can wait.

Technical questions

How is a website made responsive?

It combines design and development rules that reorganise the interface according to the available space. Common approaches include flexible containers, grids that change their layout and CSS rules that apply different styles at certain screen widths.

The browser viewport is also controlled so that mobile devices interpret page size correctly. Images and media must be able to shrink or display at a different proportion without overflowing their container. The technique matters because it determines behaviour, but it should serve a clear user experience.

How many screen sizes need to be designed?

You do not need to design a different mock-up for every device model. It is usually more useful to identify the points where content stops working well: when a row no longer fits, a card becomes too narrow or a menu is no longer legible.

So-called breakpoints are the moments when the interface changes layout. They should not be chosen by habit, but because they solve a specific reading, navigation or interaction problem.

How is a responsive adaptation tested?

It is tested by carrying out real tasks at the intended sizes, not just by shrinking the browser window. Check that you can read, navigate, tap, complete forms and correct errors normally.

A useful review includes, at a minimum:

• Opening relevant pages on narrow and wide screens.
• Testing the menu, links and buttons with touch interaction where applicable.
• Completing forms and checking validation and confirmation messages.
• Reviewing content that often breaks the layout, such as long headings, vertical images, tables or notices.
• Checking that elements do not overlap, become cropped or require unnecessary horizontal scrolling.

Preview tools help detect structural issues. Even so, the final check should take real use of important functions into account.

Does responsive design affect speed or accessibility?

It can have an influence, but it does not replace dedicated performance or accessibility work. An image that is too heavy will still need optimisation even if it adjusts to the screen width. Similarly, a visually large button is not enough if it does not have an understandable name or if keyboard navigation fails.

These areas should be reviewed together because they meet within the same user experience, but they need their own requirements and tests.

Limitations and exceptions

Does a responsive website guarantee that it can be used well from any device?

No. Screen adaptation is necessary for many projects, but it does not by itself fix confusing content, a poorly designed form or unclear navigation. Nor does it define which information should be shown first or resolve complex business rules.

The design may adapt correctly and still require changes to the text, section order or the process people follow to complete an action.

When is making a website responsive not enough?

It is not enough when the main issue lies in the structure, features or content rather than screen size. For example, if a catalogue does not allow users to find products, if an enquiry process asks for unnecessary data or if the business needs to manage information with specific roles and rules, shrinking sections will not solve the need.

It may also be insufficient if the starting technical foundation is difficult to maintain or if the project requires a mobile experience with different features. Before choosing a solution, it is worth confirming which task needs to improve, who performs it and what constraints exist.

Are any elements particularly sensitive on mobile?

Yes: tables, lengthy forms, multi-level menus, maps, charts and embedded content often require specific decisions. Sometimes they can be reorganised; in other cases, they require an alternative presentation or a limit on the information initially visible.

There is no single valid answer for every case. The choice depends on whether that element is essential to the task and which information the person needs to consult or enter from a small screen.

Next decision: do you need an adaptation or a redesign?

You need an adaptation if the current structure makes sense and the issue appears when the screen changes. You need to review the project more thoroughly if the content, user journeys or features also fail.

Before moving forward, gather the priority pages, the actions that need to be completed and the elements that raise questions. With that foundation, it will be easier to define what needs adapting and what should be reconsidered.

If you want to define the scope of a new website or review an existing one, you can explain your case through the web development for businesses service.