Consider Responsive Design

Author: Kevin Moe
Date: November 15, 2013

More and more people are viewing websites in other ways than on a traditional computer screen. Some are using their smart phones; others on a tablet. Some use all three at different times and in different locations.

What does this mean for you? It means that a great looking screen on a PC will not be so great as seen on a phone. Text will be illegible, causing viewers to zoom in to read it and miss other important areas of your site. For the most part, viewers will consider your site not up to today’s technology and will likely move on to one more user-friendly.

It is becoming more and more imperative that you embed responsive design into the creation of your website. Responsive design means that your website automatically adjusts itself to the type of screen it is being viewed upon. This gives the best experience for those viewing your site with a phone, tablet, or a PC.

responsive screen

ON LEFT IS ORIGINAL SITE AND ON RIGHT IS RESPONSIVE DESIGN FOR PHONE
The down side is you are basically creating three sites. And as each site becomes smaller, you have to reexamine the hierarchy of your site to determine what is safe to lose and what is necessary to keep. You also need to make concessions in your navigation; a left side navigation bar may have to be turned into a pull down menu to better fit the space.

One positive aspect is that creating a responsive design is getting easier to do. With new online tools being developed all the time, the hours of working on coding are being reduced to a few keystrokes and some cutting and pasting of developed code.

With responsive design, you won’t be losing viewers before they even look at your site. A full tutorial on how to make a responsive site is beyond the scope of this column, but there are several sites offering help:

Responsive website tutorial

Getting started with responsive web design

Making a website responsive to mobile devices

Responsive grid system

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s