Responsive Web Design

In the early days of the Internet, desktop computers used mostly standard screen sizes, and websites were designed around minimum resolutions such as 800x600 or even 1024x768. During the past few years, the number of internet-enabled devices has increased greatly, and many of these new devices such as laptops and smart phones use a number of different screen sizes and resolutions. Due to the popularity of these mobile devices (some websites receive more traffic from smart phones and tablets than desktop computers and laptops), today's web designers must now create websites that are able to support a significant number of different screen sizes.

By default, web browsers of mobile devices such as tablets or smartphones will attempt to display the entire content of a website within the mobile device's screen by shrinking the entire website. On tablets, most websites are still viewable; however, the text may be harder to read, and the navigation menus may be harder to target using the mobile device's touch-based interface. On a smartphone, a website which is not mobile-friendly results in text too small to read, or a frustrating user experience caused by large amounts of horizontal and vertical scrolling.

Responsive web design's goal is to create mobile-friendly websites that adapt to a device's screen size. A responsive website displays readable text regardless of a device's screen size, and the layout of a responsive website will also adapt to prevent or minimize horizontal scrolling. A responsive website is also a single website, which minimizes maintenance and updates. Alternate mobile-friendly website strategies usually involve creating separate mobile-friendly websites; however, content and design updates must then be applied to both websites, and more code must be maintained and updated.