What is Responsive Web Design and Do I Need It?

Responsive web design, or RWD, is a method of changing how your website displays and interacts with the user, depending upon the device that is being used.  Most websites that are being designed today use responsive web design because mobile devices are now more prevalent than ever.  In fact, mobile users surpassed desktop users in 2014.  Another reason RWD is so popular?  A website designed for a desktop does not typically display well on a mobile device.  You have 8 seconds to make an impression with your site.  If a web visitor has to zoom or change their viewing settings while on a phone, they are less likely to stay on that site.

Previously, some sites had a mobile version and a desktop version based on the user’s device.  However, the mobile version’s functionality was normally watered-down and the site contained less information.  Users did not want to have to make sacrifices when using a tablet or phone.  Therefore, responsive web design was an answer to that issue.  All of the information and functionality is available; it is just displayed differently depending upon the device.

An excellent example of responsive web design is Integrity First Corporation’s newly designed website.  The three screenshots below show what the site looks like on a desktop, a tablet and a phone:

Figure 1 is the site on a desktop.  Note how the main menu and social media information is to the far right.

Figure 2 is the site on a tablet.  Note how the main menu and social media information go across the whole top of the page now because the available screen display is reduced.  Additionally, the mountain picture is smaller and has lesser resolution to speed load time.

Finally, Figure 3 is the site on a mobile phone.  Because phones have a much smaller processor in them, the main picture drops completely and only the information is displayed to increase load time.  The menu is now a drop-down in the upper-right hand corner so that it takes up less valuable viewing space.  Additionally, the phone number is now a link that when touched, will prompt your phone to dial it.

If you are in the process of creating or revamping your website, you should make sure that it is responsive.  Though it takes a bit longer to design and build the site in the beginning, it should pay off in the end through customers that love your easy-to-use, responsive website.