Printer Friendly Version

BellaOnline's Digital Art and Design Editor

Designing for Web and Tablets - Responsive Design

The term Responsive has been in the forefront for a while but what exactly does it mean? The Internet has changed much over the years, from a mostly text-based platform to a interactive, engaging, multi-media and multi-device environment.

Webpages have changed over the last decade to reflect the improvements to the Internet and the devices we use to view it. Speaking of devices, we have several types to choose from, including computers, mini-computers, tablets and smartphones. As the number of devices and their variations increase, a problem becomes obvious. Each device and each variation of a device has itís own screen size.

When we only had to design websites for desktop and laptop computers, our main consideration was how to insure that the webpage displayed the same no matter the computer or web browser. The answer was to design for the top web browsers and the most common screen resolutions. That worked for a short time. Another problem became evident as these parameters kept changing. The screen size for my first computer was 800 x 600 and I loved it anyway. Then 1024 x 800 became the norm. Now computers have grown to 27 inches and larger. So the target resolution for a website kept changing.

Just when we began to enjoy designing for these larger screens, the popularity of the smartphone and tablet increased greatly, with their cool apps but smaller screens. In fact, it is predicted that smartphones and tables will be used more often then computers to view the web in only a few years. At first there were only a few mobile devices. So we began designing both a main website for the computer user and a second site for the mobile user. But this didnít solve the problem completely, becausse we were still designing for fixed-width layouts.

Now, you canít assume what device the viewer will be using to view your website. So designing for certain fixed screen sizes is no longer the best answer to the problem. What we need is a way to determine the userís device screen size and display the webpage accordingly. Hence, responsive web design, which uses CSS to determine the screen width and to display a webpage differently as needed. This allows us to have only one website that will morph into several versions as needed.

Join us in the Animation forum. | Join us in the Digital Art forum.


Digital Art and Design Site @ BellaOnline
View This Article in Regular Layout

Content copyright © 2013 by Diane Cipollo. All rights reserved.
This content was written by Diane Cipollo. If you wish to use this content in any manner, you need written permission. Contact Diane Cipollo for details.

| About BellaOnline | Privacy Policy | Advertising | Become an Editor |
Website copyright © 2016 Minerva WebWorks LLC. All rights reserved.

BellaOnline Editor