BLOG

What is Responsive Design?

Published: April 16, 2020

Responsive design is the concept that a website will display in a particular way based upon the screen on which it's being displayed. Thus, the modern way to think about a website is like the old adage from science class that, "a liquid takes the form of its container."

Responsive Design is often called "mobile-friendly" or "mobile ready" but responsive design is a broader term.

What about the code?

The underlying code for a responsive website doesn't change -- what DOES change is the style. The table below shows a few elements from a website and what changes or doesn't change based on the device re: responsive design.

Website ElementDesktopResponsive (tablet, smartphone)
textno changeno change
image sizesstandardreduced for smaller screens and to conserve bandwidth
hero/slider area standardmodified so there's no slider, or removed completely and replaced with text.
navigationstandardcondensed on a tablet, replaced with the hamburger icon on a smartphone.

Should responsive design cost extra?

No way! In 2020 every website should be built in a responsive manner. You can check to see how well your site performs on a mobile device by using Google's Mobile-Friendly testing tool. It will a) show you what your site looks like on a mobile device, and it will let you know b) if there are any mobile-related issues on your site that should be fixed (e.g. "elements too close together").

Questions about responsive design or about results from the mobile-friendly test? Get in touch with us today so we can help!

© Copyright 2008-2021 - Short Hills Design, LLC - All Rights Reserved
envelopephone-handsetmap-marker linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram