1 of 2
Luke Jordan, Co-Founder, DesignForest
2 of 2
Responsive Design Matters
When we first began to dabble in web design here at DesignForest back in the year 2000, my mother had not even purchased a cell phone yet, nor did she know how to turn a computer on. I think she was still trying to figure out what to do with all the Y2K canned food she aggressively stored up. Yeahhh…These days I’m getting SnapChats from her iPhone (most of them make no sense whatsoever). Most folks think that the mobile device revolution is really a conglomeration of teens and 20 something’s. Quite the opposite! Twitter, Facebook, Pinterest, and Instagram are growing faster among the 55+ demographic than any other age group in the world. Many folks in that age group are business owners and c-level executives in the very organizations you advise. Beyond the social media realm though, that demographic is also the most active on websites available through mobile devices. Eager to gain as much information in the most readable way possible, the mobile device often times helps dictate the conversion of those users. Sadly, the vast majority of websites out there, especially those over the 2 year mark since development, are not mobile responsive. The words appear very tiny, images are offset, and the menu bar is impossible to find. These aspects of responsive website design coding are what recreates websites into a scalable user end experience.
What is Responsive Web Design?
Responsive Web Design (RWD) is an approach of laying-out and coding a website such that the website provides an optimal viewing experience — ease of reading and navigation with a minimum of resizing, panning, and scrolling — across a wide range of devices (from desktop computer monitors to mobile phones). Responsive websites are coded to work on mobile devices such as iPads, iPhones, and Androids.
How do you know if your website is responsive?
This is a question we hear quite often from our customers here at DesignForest. The process is super simple in testing for a responsive website on a mobile device.
- Open up your browser on your desktop or laptop
- Drag your cursor over to the top right hand corner
- Click on the double box icon between the underscore symbol and the x symbol.
- Once you see the screen reduced in size, you should start to see visual elements on the screen begin to restructure themselves. You will see a different dropdown menu created that has been compressed. You will see visual elements stack on top of each other for ease of viewing. This is also important because your customers need to be able to see all the information on your website without using their fingers to move things around and blow elements up. Everything should work in sync by itself.
- From there, drag your cursor over and grab the right hand side of the page border.
- Grab that border and drag the right hand side of the page over the left as far as you can go. It should end up being about the same width of a phone.
- This is the true test. How does the screen look? Did the visual elements stack and realign themselves?
- If you answered no to this question, your website and/or your client’s website is in for some viewership trouble.
- Poor mobile elements = Less viewership = Less conversion = Less revenue.
The Numbers Don’t Lie.
75% of Americans admit to bringing their phone to the bathroom.
Let’s face it. We’re all guilty of this at one point or another in our life. While statistics show that the younger generation is playing games in the bathroom stalls, the grownups are scrolling through their next purchase or services that they’re strategically scoping out. Emails and newsletters are one of the highest read rates in the baño. So those of you who still don’t think Blogging is important on your website. Think twice. And if you haven’t started collecting emails from your potential or current customer base for newsletter marketing – you’re missing out on a crap load of revenue (you see what I did there?).
40% of shoppers consult 3 or more channels (often while shopping) before making purchases.
Exactly 10 years ago, this statistic was at 10%. Astounding growth right? Here’s an even crazier statistic. 52% of Americans use their devices while they’re actually in the store browsing products and throwing items in their physical carts.
4 out of 5 consumers use smartphones to shop.
From 2005 to 2013, purchases from smartphone users in North America grew from 1% of all mobile device users to 25%. Holy cow! Imagine where we’ll be at in the next 5 years. 60%? 80%?
Switching to a Responsively Designed Site
We’ve had many folks ask us, “Can you just make my website responsive?” We would love to! Except it’s not quite that easy. Imagine if you were to tell me that I should replace all of the copper piping in my home with PEX plumbing, and I were to ask you, “Can’t you just switch all the piping out real quick?” Can you see where I’m going with this?
Quality coded websites, which play a significant role in surging to the top of Google (stay tuned for another article coming soon about this area of design), cannot just be re-arranged at will on the front end. The style code, or CSS, is carefully created and configured specifically to the design of your website. In order to obtain a responsive style website, you will need a design built from the ground up in responsive coding.
Luke Jordon is the Co-founder & Chief Design Officer for DesignForest // a leading national web design & custom programming firm. The DesignForest team has been designing web based applications and visual environments since 2000. Their specialties include business designs, eCommerce designs, and Fishbowl Inventory programming and database setup. Luke graduated from the University of Arizona with a degree in Regional Economic Development and also holds an MBA in Strategic Planning from the University of Phoenix.