Just like your old goldfish, Bubbles, if your website isn’t responsive, it may as well be dead. We’re sorry to dig up old memories, but it’s almost 2014 and it’s time to get serious about responsive design.
With the digital world heading inevitably towards a smartphone and tablet-heavy future, responsive design should be front and centre of your plans for the coming year. Are you ready? If you’re not, we’ve compiled some compelling facts and figures to get you motivated, along with some helpful hints to get you started. Ready, steady – get responsive!
It’s a mobile world…
Let’s crunch some numbers before we go any further. If you’re not taking responsive design seriously, you are ignoring an enormous and ever-growing online audience. Just take a look at these figures:
- 91% of all people on earth have a mobile phone
- 56% of people own a smart phone
- 50% of mobile phone users, use mobile as their primary Internet source.
- 80% of time on mobile is spent using apps
- 72% of tablet owners purchase online from their tablets each week
If these numbers sound exciting now, imagine how they’ll look in a year or two. Smartphone and tablet saturation of society, all over the world, is growing exponentially. By 2017, eMarketer estimate that 34.8 million of us in the UK (around half of the population) will be tablet owners.
Respondez s’il vous plait!
As you can see, if your website is not yet entirely responsive across all major devices, you’re missing a trick and potentially a massive slice of your market! So what does responsiveness really mean?
A responsive website is a website which can be accessed and used with ease from all common devices, smartphones, tablets, netbooks – you name it. In order to make your website as usable as possible from all of these different devices, you’ll need to make sure it automatically adapts (or responds) to the screen size and device type that it is viewed from.
Let’s get technical
To ensure your website responds automatically, you’ll need to use media queries to detect screen width and device type. You’ll then need to use a flexible grid system (just like JBi’s!) to give your website the power to fit and flex to the size and shape of the device it’s accessed from. To make sure all of your site’s features work with the piece of technology your visitor is using, you’ll also need to look at things like:
- Hover functions
These might look flash from a laptop or desktop but, without a cursor, they just don’t work, making your website difficult to use from tablets and smartphones.
A great, responsive menu design is important to make your website easy to access with smaller devices. Trying to get from one page to the next via smartphone can be frustrating if menu buttons are too small or fiddly.
Lots of images might look great on a big screen but they can seriously clutter up a website viewed via tablet or smartphone. You may want to cut down on the graphics to make your website more accessible and usable from handheld devices.
- Loading times
Smaller and fewer images will also help you to cut down mobile site loading times. Background images can be a big problem for responsive site speed – significantly increasing loading time. Good responsive design will ensure these images aren’t used on mobile versions of your website and cut down on other loading time lengtheners like multimedia extras.
Get the message
Once your website has been given a responsive overhaul, you might think that your work is done. Oh no! Responsive email is now more important than ever before. If you’re putting your resources into a strong email marketing campaign, you’ll want to make sure your marketing missive is seen by as many recipients as possible.
Did you know? In 2013, 61% of us use our smartphones to check emails
With so many of us using mobile for email, doesn’t it make sense for your email marketing to be designed responsively? In fact, at JBi, we did a little experiment of our own to see just how important responsive email design is. When we sent out our most recent email to our lovely contacts, 43.9% of them opened up our message using an iPhone or iPad (and that’s not even taking onto consideration other mobile devices)! For the very best take ups and click-throughs, 2014 is the year to take responsive email more seriously.
Online marketing and responsive design
And the fun doesn’t stop there! As if you needed more reasons to get responsive, website responsiveness is now having an effect on SEO. It’s not a direct effect. You won’t win immediate brownie points for being uber-responsive. But, if your site is ready to respond, there are a number of ways you’ll benefit in search engine rankings:
- Avoid penalties
You won’t gain ‘points’ for being responsive, but Google does issue penalties to websites which do not meet its mobile standards. This can have a negative effect on your placement on SERPs (Search Engine Results Pages).
- Get points for speed
Google loves a speedy website. In fact, over the last couple of years, the search engine giant has been working hard with developers and designers to improve loading times all over the web. Site speed has been part of Google’s ranking algorithms for around two years now, making getting your site up to speed an absolute priority. Even if your standard site is whipfast, your mobile version may be crawling at a snail’s pace. Responsive design will fix this issue and boost your rankings. You can take a look at how you’re doing over at PageSpeed Insights.
- Lower your bounce rate
If a visitor opens your site and almost immediately closes it, your bounce rate goes up. A slow-loading, impossible to navigate mobile site is a sure fire way to earn yourself a big bounce rate, with visitors leaving your mobile website like hipsters from a non-ironic Justin Bieber concert. Ensuring you have a really accessible, usable responsive mobile design in place will keep your bounce rate in check and your website ranking as well as it can.
And that’s a wrap!
We could talk forever about the virtues of great responsive design, but we’ll spare you this time! The facts speak for themselves. Responsive design means more custom, better SEO, smarter online marketing and a digital business which is ready for whatever the future has to throw at it. If you’d like to see responsiveness in action, why not fire up JBi on your tablet or smartphone? You could also try resizing your browser to watch us shrink and fit!