If you have been wondering whether or not your outdated website needs an upgrade…the answer is a resounding YES!  Don’t believe me…I bet you’d believe Google.  According to a recent press release, Google has started to adapt their algorithms to give search ranking priority to those websites that are built for multiple devices…in other words if your website is built using a responsive layout it will rank higher than an similar site that does not.  Plain and simple.

The idea behind responsive website design is really just a move toward uniform or consistent design where developers aim to create a site that will display predictably across all devices.  Yes, ALL devices not just the itty-bitty ones like the iPhone 5 in portrait view but also the really large flat screen TVs that are being used as monitors.  In this situation, instead of removing elements or shrinking the column widths, developers have the opportunity to add larger images or supplement a page with another column of content.

How does this all work?  CSS3 and media queries of course.  Confused?  Let’s take a look an example.  By default your site will have a stylesheet.  In that stylesheet will be all of the necessary CSS code that will control the way your page looks on the device.  Without a media query (don’t worry…I’ll explain) your page will display the same for all devices.

Now,let’s change the style for a portrait tablet…specifically the iPad Mini.

@media screen and (device-width: 768px) and (device-height: 1024px){ /* Your styles here */}

This little bit of code placed in your stylesheet will target the exact pixel dimensions specified and return certain styles which are applied in the section “Your styles here”.  Just to note, you wouldn’t want to directly target specific devices but rather set breakpoints where the layout would change no matter what the device but that’s for another day.

If you are interested in building a responsive site or would like to discuss remodeling what you have contact us today to get the conversation started.