Klick Twice Technologies, Inc.

Responsive Web Design

This is undoubtedly one of  the biggest web design buzz words of all time. And if you're not familiar with it, you're probably asking yourself, what does it all mean? 

Before there were iPhones or Android tablets, running around everywhere, websites used to come in two basic flavors. Desktop and mobile.

Responsive web design scales to the device 

On the rare occasion that someone did visit your site on their phone. Your site would recognize that and serve up sort of a barebones version of the site that looked a lot like a list of links. There weren't very may photos or videos to be seen because most phones couldn't handle that type of work load. Now-a-days however, Our content is being consumed on literally thousands of devices. All of which are capable of producing a rich web experience unlike anything we've ever seen. Because of this we must be able to deliver content in a better way and have our websites adapt and show content differently based on the type of device viewing that content at any given time.

Basically we need a website to respond to the device that's viewing it. And serve up the best possible experience for the end user.  Hence the name, responsive web design. Now, there are three basic ways to design a responsive website today. First is something called a fluid site, which means the entire site is based off of a percentage, and simply scales itself down as the window the browser decreases and scales back up as it increases.

Second, there's adaptive web design, which targets specific devices like iPhones, and Kindles by using something in CSS called a media query. This makes it easy to display your site in a uniquely tailored way to a variety of different devices. The problem is that not every device uses a standard iPhone or Kindle sized screen. And therefore you might not be able to adequately cover the full spectrum of devices that visit your site. Finally, we come to perhaps the best solution. True responsive web design. Responsive design is based on a fluid grid which can adapt itself based on the view port of the browser.

You have the ability to determine what are called break points meaning minimum widths and heights and tailor your content to fit everything in between. Keep all three of these in mind as you think about how your site will ultimately be built.

Work with your developer to deliver a functioning prototype of the site if you can. This gives you a more hands-on feel of how the site will perform at every stage. This is very important and a great little extra because it's really going to underscore the point of why you had to build it this way and, most likely, why it took a little longer than a traditional website. At the end of the day, this is all about user experience. Responsive design helps you create a better experience for your clients and their clients.

It's here and it doesn't look to be going away any time soon.

Steve Steinberger

www.klicktwice.com

561-281-8330