What is a Responsive Website

Responsive web design (RWD) is an approach to web design aimed at allowing desktop webpages to be viewed in response to the size of the device one is viewing with – Wikipedia

Have you asked yourself, “What is responsive Web design?” Almost every new client these days wants a mobile version of their website. It’s practically essential after all: one design for the BlackBerry, another for the iPhone, the iPad, netbook, an oversized desktop computer monitor, a laptop, a 10-inch tablet, a 7-inch tablet, or a 4-inch smartphone screen, Kindle — and on and on and on to all screen resolutions your website must be compatible, too. In the next five years, we’ll likely need to design for a number of additional inventions. When will the madness stop? It won’t, of course. Therefore, responsive Web design is an approach whereby a designer creates a Web page that “responds to” or resizes itself depending on the type of device it is being seen through.

lady-with-tabletFlexible images, Menus, Wording Content, Heading and footers, and the web framework must also be sized in relative units, so as to prevent them from displaying outside their containing element. You want your website to look good no matter the device you are using. Responsive web design has become more important as the amount of mobile traffic now accounts for more than half of total internet traffic. Therefore, Google announced Mobilegeddon (April 21, 2015) and started to boost the ratings of sites that are mobile friendly if the search was made from a mobile device. Bottom line, if your site is not responsive, you will be lowered in the search rankings therefore losing business.

Responsive Web design is not only about adjustable screen resolutions and computer-screenautomatically re-sizable images, but rather about a whole new way of thinking about design. For example, if you have the perfect image for one of your main pages, this image must also be duplicated up to 10 times in 10 different formats and file sizes so that what you want your client to see, will be exactly what will be seen. So if your home page has 7 images, that means that as many as 70 different files will need to be created, and then the website will need to know which image goes to which device. Then the website needs to be smart enough to readjust for tablets or mobile devices that can be viewed either in portrait orientation, or turned sideways for landscape view.

lady-with-laptopYour Site also needs to be loaded at different speeds. The processors of each medium operate at different speeds, therefore, your web page must also learn to compensate for all these mediums. When all is said and done, your home page must have as many as 1,000 different variables and be flexible enough as different sized devices are continued to be added to the market.
Mouse v. touch: Designing for mobile devices also brings up the issue of mouse versus touch.  On desktop computers the user normally has a mouse to navigate and select items.  On a smartphone or tablet, the user mostly is using fingers and touching the screen.  What may seem easy to select with a mouse, may be hard to select with a finger on a tiny spot on a screen. The Web designer must take “touch” into consideration.

In order to accomplish this, you need to be versed in JavaScript frameworks smart-phonelike Modernizr, jQuery, and jQuery Mobile that can directly test browser support for HTML/CSS features (or identify the device or user agent), PHP,  Ajax, and more and more programs that are becoming ever more popular.
We at Turnkey Web and Marketing employ programmers worldwide that specialize in all of the above software’s We require that each of our employees also go through continuous training so that we are always able to be responsive to your needs as your web designer and developer. For more information, please feel free to contact us.