Published by Designzillas on November 25, 2013
At Designzillas, we are strong advocates for responsive design. You’ve probably heard this term thrown around a lot, but do you find yourself still unsure of exactly what it means or why everyone is talking about it? Maybe you’ve seen the countless blog posts vying for users to switch to responsive layouts, or maybe one of your competitors just announced their new, responsive and user-optimized site? Well, we’re here to give you a quick and easy guide to responsive design, why it’s awesome, and why you should consider it!
NUMBERS DON’T LIE
First and foremost, let’s start with some simple statistics:
- 91% of American adults have a cell phone, 56% have a smartphone
- 60% of cell users use their phone primarily to access the internet
- 96% of cell users have encountered sites that are not mobile-optimized
- 74% of cell users will return to a website in the future if it is mobile-friendly
- 67% of cell users report that visiting mobile-friendly websites make them more inclined to purchase
- 79% of cell users will leave a non-mobile friendly website and search for another
More than half of the American adult population uses smartphones. A large chunk of your potential clientele are using their smartphones to access your website — if their experience isn’t great, they could be part of the 79% that leaves and gives their business to one of your competitors. The numbers alone tell you that more people than ever are using their mobile devices to surf the web, and these numbers don’t even include tablet users! The time to consider responsive design is not in the future, it’s right now!
WHY RESPONSIVE DESIGN?
Long story short, a responsive website is one site that is specifically built to be accessible on any device. The stats from above show us that desktops and PCs are no longer the kings of technology so a website optimized for these alone no longer makes the grade. Your consumers are accessing your website from iPhones, Androids, iPads, tablets, and even newer products like Google Glass. With a responsive website, you build it once and view it perfectly on each device. Your pages are literally responsive; they understand the device being used and resize images, content, and typography to fit varying screen sizes.
There are quite a few differences between responsive and mobile-optimized websites; I’ll go through these below. In the end, it’s pretty clear to see that the upkeep of a mobile website definitely requires more organization and technical understanding than that of a responsive one. Sure, a mobile version of your website is definitely better than nothing at all, but the benefits of making the change to responsive are colossal. Let’s explore:
EXHIBIT A: ONE VERSION
One of the most compelling factors in favor of responsive design is that there is only one version. Websites with responsive layouts do not require separate versions for other devices. A responsive website is built on a single domain, that means one version of your website that you only need to update from a single location. If you have or decide to create a mobile version, you will need to create and redirect your users to a separate “m-dot” version of your pages (like m.YourWebsiteName.com). The m-dot pages are essentially duplicates of your desktop version that you have optimized for mobile. When you change an existing page on your desktop version, you also need to change the m-dot version. And when you upload a new blog post or add a new page to your desktop-optimized website, you also need to add an accompanying m-dot version and set up redirects for your users. Already, this seems pretty complicated, doesn’t it? On the other hand, if your site is responsive you only have to edit one of the versions and the edits take place on all devices! How easy is that?
EXHIBIT B: NO REDIRECTS
The fact that there will only be one version of your responsive site is the most compelling factor because it underlies everything else on this list! Take redirects, for example. If you only have one version, you won’t need any redirects. But when your leads and customers are on their smartphones and they search for your website, if you don’t have a redirect set up, they could be sent to one of three places. Either they get an ugly 404 error page, they are taken to a different page of your website that does have an m-dot version available, or they are taken to the desktop-optimized version. If you do go with a mobile website, always remember your redirects. But it’s easy to see why this is a major pain point of mobile-optimized sites! They take a lot of organization, upkeep, and technical understanding to maintain. And if you can’t do this, Google will penalize you! Which brings me to my next point…
EXHIBIT C: GOOGLE PREFERS IT
Google is not a fan of mobile-optimized sites when you can’t maintain them properly. You may or may not know that Google “crawls” each page on your website and indexes it. It compiles all of this information to determine your website’s authority and relevancy so that it can give the best information possible to searchers. When you have a responsive site, Google only has to crawl that one version. All of your search engine optimization juice is pumped into one version of a site. With separate mobile and even tablet versions of a site, Google has to crawl every single one of these! All of your search engine power gets split between multiple domains and most likely, your search engine rankings will suffer.
EXHIBIT D: SHARE-FRIENDLY
90% of people start a task on one device and then pick it up later on another. We’ve all been there. Consider this scenario: It’s getting later in the evening and you’re surfing Pinterest or reading the latest article on Wired on your laptop. You realize you’re getting tired so you turn off your laptop and lay in bed, only to continue doing what you were doing on your smartphone or tablet. We use multiple devices throughout the day! In some instances, if you share something on social media from an m-dot version of a site, someone on a desktop may not be able to access the page correctly because it will register it as an m-dot. With a responsive site, you will never have this problem because your content will already be automatically optimized for all screen sizes. When you share an article to Facebook from your mobile phone, responsive websites guarantee that the article will also be optimized for whichever device it is being viewed on.
EXHIBIT E: FUTURE-PROOF
Last, but certainly not least, is the ROI factor. You or the decision-makers in your company may be initially put off by the higher cost of a responsive layout, but the long term benefits are truly worthwhile. Unlike “device”-friendly designs, which require tweaking and changing with each new device that comes out, responsive designs are future-proof. They easily mold themselves to whatever device they are being accessed on. Take Google Glass for instance. Not many people really use this device yet, but it shows what kinds of products may be coming in the future. Responsive websites can detect the dimensions of any screen size today, and in the future.
If you’re in that decision making period where you really can’t tell if going for responsive design, a simple mobile website, or maybe even neither is best, you really should consider going responsive. This may seem a bit more costly at first, but the benefits and ROI speak for themselves. Not having any kind of mobile website presence is no longer an option in today’s world, and between responsive and mobile websites there really is no competition! Having a responsive website will provide you with those real results that you are looking for. Your website will be viewable on all kinds of devices that exist now and ones that haven’t even been invented yet! Technology is constantly changing, your website shouldn’t fall behind!