Leep.
HomeBusiness DevelopmentWeb & EngineeringWork
Contact
Log in
Leep.

Custom websites and web applications for ambitious companies.

Navigation

  • Home
  • Work
  • Contact

Services

  • Website
  • App
  • AI Implementation

Resources

  • Articles
  • Dictionary

Contact

  • hello@leep.no

© 2026 Leep. All rights reserved.

Back to Dictionary
Technology

What is Responsive Design?

Last updated: January 15, 2025

On this page

TL;DRExampleExplanationWhy It MattersRelated Terms

TL;DR

Responsive design makes websites automatically adjust their layout to look good on any screen size, from phones to desktop monitors.

Example

What responsive design does:

On desktop (1920px wide):

  • 3-column layout
  • Large images
  • Full navigation menu

On tablet (768px wide):

  • 2-column layout
  • Medium images
  • Collapsible menu

On mobile (375px wide):

  • Single column
  • Smaller images
  • Hamburger menu

Same website, different presentations. The content adapts to fit the device perfectly.

Test it yourself: Open any modern website and slowly resize your browser window. Watch how elements rearrange themselves.

Explanation

How Responsive Design Works

CSS Media Queries: Rules that apply different styles based on screen size. "If screen is less than 768px, stack these columns."

Flexible Grids: Layouts use percentages instead of fixed pixels. A 50% width column adjusts to any screen.

Flexible Images: Images scale down to fit containers. Never wider than their container.

Mobile-First Approach: Design for mobile first, then add complexity for larger screens. Ensures mobile experience isn't an afterthought.

Common Breakpoints

  • Mobile: 0-767px
  • Tablet: 768-1023px
  • Desktop: 1024-1439px
  • Large desktop: 1440px+

Why It Matters

For Business Owners

Over 60% of web traffic is mobile. If your site isn't responsive, you're giving most visitors a bad experience.

Google prioritizes mobile-friendly sites. Since 2019, Google uses mobile-first indexing. Non-responsive sites rank lower.

One site for all devices. No need to maintain separate mobile and desktop versions. One responsive site serves everyone.

Better conversion rates. Users who can easily navigate on their device are more likely to buy, sign up, or contact you.

Signs Your Site Isn't Responsive

  1. You have to pinch and zoom on mobile
  2. Text is too small to read
  3. Buttons are hard to tap
  4. Horizontal scrolling is required
  5. Menu is unusable on phone

Related Terms

UX

UX (User Experience) is how a person feels when using a product, website, or app. Good UX means the experience is easy, intuitive, and enjoyable.

UI

UI (User Interface) is the visual part of a product that users interact with: buttons, menus, colors, typography, icons, and layout.

Frontend

Frontend is the part of a website or app that users see and interact with: buttons, text, images, forms, and animations.

SEO

SEO (Search Engine Optimization) is the practice of improving your website so it appears higher in Google search results when people search for relevant topics.

Need help with your digital project?

We build websites, apps, and digital solutions for businesses.

Get in touch