As a follow-up to Seth’s latest post, I thought I might do a bit of a breakdown on a type of responsive website, called an Adaptive website, and why it’s beneficial.
First and foremost, a full-sized adaptive website will function exactly like any regular desktop website. The main difference is that the styles (and sometimes content) adjust according to the device its being viewed on. This is accomplished through the use of filters called “media queries”, which help split the views of the website into ranges. Say for instance you wanted to target a modern smartphone device. You should happen to know that most smartphones in portrait mode (straight up and down) are roughly 300 pixels in resolution. With that knowledge, you can target styling by setting a media query of max-width to 300 pixels, meaning that any stylings you put under that filter will only show up when the site is viewed at a width of 300 pixels. Normally people don’t view a website on their computer at such a small width, so the only time those styles will be seen are on a handheld device.
From there, it’s simply a matter of targeting the various “break points” (aka the resolution cutoff points between different devices), and applying styles specifically toward each view. Perhaps you want to hide a sidebar on a tablet device. Simple! Just put a style of “Display:none” inside the tablet media query, and voila!
So, how does this help your online presence? For starters, it keeps your site contained as one entity. Instead of using duplicated content for a mobile site, search engines only see the single site and all the traffic pointed at it. Secondly, it can allow you to fully utilize ALL of your content (or pick and choose) from your full desktop version, rather than arbitrarily having to decide what you think is most important to your customers/audience. Finally, it makes maintaining the site vastly easier, without having to make sure changes on one site also get updated on your mobile version. No muss, no fuss!
If you’re looking to get a new website developed that appeals to your customers and is easy to view across all modern devices, be sure to check out our website packages page, and contact us today! We are always happy to assist you in making the most of your business online!