This post comes at a pretty important time as Google has announced that they are going to start to push non-mobile friendly websites down in the results starting sometime in April. Many of you still have non-responsive websites, and this is going to be a problem for you!
Let’s answer what responsive design is in the first place
Responsive web design is based on the concept of responsive architecture, which is the idea that a building should change form in order to accommodate a certain number of visitors. Something many contractors are familiar with.
This doesn’t mean that a building will physically change shape, but rather that it will create an environment conducive to making people feel comfortable by altering wall colors to make rooms look larger or changing the shape of art on the walls to accommodate the angles a visitor will view it from.
Responsive architecture design also takes into account temperature and can adjust it to fit the needs of the room (cooling the room as more people enter or warming it as people leave).
While originally designed for large buildings, certain “smart houses” have begun popping up that utilize this concept in a smaller setting. Responsive architecture uses by powerful sensors to detect the amount of people present.
The concept of responsive web design works much the same way, but instead of adjusting walls and temperatures, it alters the website’s appearance to fit the screen the page is being viewed on.
Introduced in a 2010 article by web designer Ethan Marcotte, the concept of responsive web design has become the topic of conversation amongst web designers.
Responsive websites are built around a “fluid grid” that scales for proportions rather than the traditional method of adjusting for screen resolution. In terms of architecture, the fluid grid is essentially the foundation of your website in which you will place all your content. The fluid grid ensures that this content will change shape to meet the type of device it is being viewed on.
There is a problem with this, however; pictures that are adjusted to accommodate viewing on a very small (or large) screen tend to lose quality, making them look old or even obscuring them all together.
This is due to the fact that an image only contains so many pixels, and when stretched, these pixels eventually move or are broken down.
To see this for yourself, take a picture with your smartphone and zoom all the way in. See how the image becomes blurry, and boxes appear?
This is called pixelation, and it is the bane of many programs designed for web use. “Fluid images” used in responsive website design will shrink to fit their space in the fluid grid but won’t lose their original clarity.
Now that you know what a responsive website is, you probably have a lot of questions. Consider the following FAQs about responsive websites:
How is responsive website design different than mobile design?
Mobile design involves the creation of an entirely different website specifically geared towards a mobile device. This means that a mobile website will look and feel different than a website viewed on a computer screen. Responsive website design allows users to see the same webpage no matter what device they are using.
Will a responsive website limit my design?
Yes and no. A responsive website means that you will have to conform to a fluid grid design, however, these grids can be created to match many of the most popular web designs.
A responsive website also means that you can’t put as many flash animations or interactive menus on your page because not all mobile devices can handle these base programs.
If you simply must have “all the bells and whistles” on your site (which is not really advisable anyway) you may want to stick with creating a mobile site in addition to your standard site.
How much more expensive are responsive websites?
While creating a responsive website utilizes the same coding language as regular websites, it is more difficult. The designer must be aware of the way responsive websites work, which means that they must possess the appropriate skills to create fluid grids and images.
This requires special training (although it can often be accomplished by simply reading a book on responsive website creation). As you can imagine, designers familiar with this technique demand more for their services. This can lead to a larger upfront cost.
How does a responsive website affect my bottom line?
Business is all about making a profit, so if a responsive website doesn’t help improve your bottom line, it’s useless. The good news is, long term, you will make money on a responsive website.
As smartphones and tablets become more common, people are using them to access websites more often, and having a responsive website provides an easy transition from home to mobile use-meaning that a customer can easily find one of your products anytime they want.
Seriously, though. Most of the people I know use their home computers to find information and only use cell phones as a last resort. Is it worth it?
As I said before, more and more people are using mobile devices to look up information online, but it’s predicted that there will be a massive upswing in mobile use within the next few years because of Generation Z. Generation Z includes people born after 1995 who have been raised to see technology as simply a part of their everyday life.
Most Gen Zrs don’t remember a time before cell phones, and some don’t even remember a world without smartphones! The nature of this upbringing means that members of Generation Z expect websites to function on mobile devices so that they can be viewed on the go. As this generation approaches the coveted 18-34-year-old age demographic, it’s going to become imperative to change your web design to fit their needs.