Responsive web design is a hot topic these days, especially as websites need to adapt to the growing number of mobile devices with their relatively small screens. Many designers and developers want to create new websites with responsive layouts, or modify their existing sites to incorporate responsive elements.

The basic idea of responsive web design is that a website should “respond” to the device it’s being viewed on. In broad terms, this can mean things like:

  • Adapting the layout to suit different screen sizes, from widescreen desktops to tiny phones
  • Resizing images to suit the screen resolution
  • Serving up lower-bandwidth images to mobile devices
  • Simplifying page elements for mobile use
  • Hiding non-essential elements on smaller screens
  • Providing larger, finger-friendly links and buttons for mobile users, and
  • Detecting and responding to mobile features such as geolocation and device orientation.