Is your website mobile friendly?

May 30, 2014 by

Josh Simmons

One in four US internet users browse the internet using ONLY a mobile device. If your website is not mobile friendly, you are potentially losing 25% of your website visitors to a bad experience!

So how do you solve this problem? Make your website "responsive".

What is Responsive Web Design?

Responsive web design (RWD) is an approach to website design aimed at providing an optimal user experience regardless of device. With RWD, a website's design and layout is automatically adapted to the viewing environment of the visitor. This allows users to interact with the website in a way specific to the size of the device that they are using.

In short, responsive web design optimizes a website for its use on a desktop, tablet, and smartphone.

How does Responsive Web Design work?

With responsive web design, when a website is loaded, the website detects the width of the browser and then adjusts the design and layout of the website accordingly. The content of the website remains the same, but the way in which it is presented is optimized for the size of browser that the visitor is using.

In most cases, responsive web design targets three optimized layouts:

1. Desktops/Laptops
2. Tablets
3. Smartphones

Below is an example of a website using responsive web design when viewed on three different sized devices.

Is Responsive Web Design the same thing as having a mobile version of my website?

No, it's even better!

In the past, if you wanted a mobile website, you would create a separate mobile version of your website and deliver it to users when they visited your domain name on a mobile device. The mobile version would have a separate URL such as mobile.yourwebsite.com.

There are several problems with this approach of creating a mobile version of your website:

1. You have to maintain two separate websites: the full version and the mobile version. Creating and maintaining two separate websites is both time intensive and expensive.
2. The mobile version of the website is device specific. New devices are constantly introduced to market and the code for the mobile version has to be adjusted accordingly.
3. The content on a mobile version of a website is often different than that of the full version which can frustrate users expecting a consistent experience across all devices.

Responsive web design solves all three of these problems:

1. You only have to maintain one website. The layout of the content is then optimized per the viewing environment. Creating and maintaining one website is much faster and cheaper than two.
2. The design and layout are dependent upon the width of the browser, not the device used.
3. The content is consistent across all devices, providing a uniform user experience.

How do I make my website "responsive"?

Ready to make your website responsive? Here are three ways to do so...

1. If you don't use eCatholic, contact your website designer and let them know that you want to make your website responsive. If they don't know what you are talking about, they don't know how to implement responsive web design, or if it is going to cost a small fortune, see #2 below.
2. Sign-up for a free 30-day trial of eCatholic. With eCatholic, all of our themes use responsive web design or we can create a completely custom, responsive theme just for you.

Got a question or comment about responsive web design? We'd love to hear from you below!