Responsive websites: How I learned the hard way

Responsive websites: How I learned the hard way

Okay, I need to confess something.

*Deep breath*

My site is not responsive.

There, I’ve owned up. Now leave me the hell alone.

I’ve gone through a lot of blood, perspiration and blubbering in my journey to make my site responsive. So I thought it was only fair if I shared my sorry tale.

2015 update: My site is now fully responsive, yay. Read more about it here.

What is responsive design?

A responsive site has a flexible layout that adapts to a variety of screen sizes, resolutions and devices. Generally this means that on a desktop it’s big and beautiful, with all the bells and whistles. On a tablet it’s smaller and more touch-friendly, with some of the functionality possibly removed. And on smartphones it’s super simple and content and navigation are given priority over the whizzy bits.

Not sure if your site is responsive and don’t have a smart phone? Don’t worry, you can use this handy responsive checker tool.

Why does responsive design matter?

These days, a lot of people browse websites from their phone or tablet. And they quickly get frustrated if they have to keep resizing pages to read the content or click on a link. So a responsive website is more user-friendly, will keep people on your site longer, and will hopefully convert more of them into customers.

See below for the desktop (left) and the mobile (right) version of the Sales Force website.

salesforece responsive website design

Responsive websites and SEO

Lots of people worry that going responsive could harm their SEO, but there’s no need to fret. In fact, it could actually help. Because you’re using a design that best displays your content to your users, it will mathumbnailke the search engines happier.

Copyblogger writer Jerod Morris says:


Mobile responsive design gives your audience a better mobile experience than non- responsive design. A better experience equals happy readers … which equals on-page engagement, linking, and sharing … which equals better SEO.”

So, responsive sites can be great for SEO. Just steer clear of the one-page sites.

Looking at your website traffic

One of the best ways to determine whether you should go responsive is to look at your Google Analytics. Look at how many users visit your site on mobile devices, what their bounce rate is, how long they stay on the site and how many pages they view.

responsive website design advice

As you can see from my site, mobile users visit fewer pages, spend half the time on site and bounce out pretty fast.

I need to get my site sorted pronto, And so do you.

According to Neil Patel’s fantastic infographic:responsive website infographic

  • 1.2 billion users access the web from mobile devices
  • 58% of people who own smartphones have used them for store-related shopping
  • 63% of people expect to do more shopping on their mobile devices over the next couple of years

So with mobile device use on the rise, you’ll have to go responsive sooner or later.

Are you building a new site?

If you’re building a new site you should definitely ask for a responsive design. There are heaps of cheap off-the-shelf WordPress themes on sites such as Themeforest.

My (painful) responsive journey

I built this site myself from a cheap WordPress theme a few years ago, and have been tinkering with it ever since. About eight months ago, I wanted to make some changes to the home page and create some custom templates for my testimonials and clients pages.

I was faced with a choice. Do I:

  1. Scrap the existing theme, install a new responsive theme and reformat my content accordingly?
  2. Fiddle with my much-loved theme, and deal with the responsive stuff later?

I chose number two which, in retrospect, was the wrong choice.

Since then I’ve looked at various options to make my site responsive:

Option 1: Recode my site to make it responsive

  • Pros: My site will be responsive. Woo hoo!
  • Cons: Expensive.

Creating a responsive version of my site involves:

  •  Making decisions about what content and functionality stays and goes for each device.
  •  Employing an expert to review and recode each element of my site and ensure it reformats based on the device.
    (As I understand it, this involves changing the elements on my site from fixed widths to percentages.)
  • Testing on all the different device types to ensure it looks awesome.

I’ve been quoted between $1,000 and $2,500 for this work, which is a huge amount for a solo business owner like myself to wear—especially given how much I’ve already invested in the site.

Responsive websitesSo I thought I’d try Elance. Big mistake.

I put up a brief and got inundated with responses, most of which were just generic ‘Greetings!! We would be much happy to be responsivising your website” type emails from far-flung countries.

After wading through all the quotes I chose the most expensive—a development company out of China who quoted $600.

When they sent through the finished version it was dire. My content was misaligned, there were giant chunks of white space everywhere, elements were cut off, and some pages didn’t function at all.

We went back and forth several times, but they didn’t have a clue. I fired them and thankfully got my money back.

Option 2: Using a WordPress plugin.

  • Pros: Cheap
  • Cons: Doesn’t work very well

Next, I explored the plugin option. There are heaps of plugins out there that promise to create a mobile-friendly or responsive version of your site.

First I tried Obox Mobile which was recommended to me, so I happily paid $60. Sadly, the result was terrible. It simply cut out my navigation completely. I wasted hours fiddling and asking support questions that were never answered, and in the end I uninstalled it.

Next I tried Jetpack, which is what I’m using now. As you can see it’s doing a pretty good job. But it can’t deal with any of the custom code. My contact short code displays as a short code, and my testimonials don’t show up at all.

The Band-Aid approach just wasn’t working.

I’m getting my site recoded

Again, I should probably just bite the bullet and buy an off-the-shelf responsive theme. But I just can’t bring myself to, which is very stupid of me.

If I bought one of these themes, then whenever its maker updated it to accommodate the latest interweb developments I could just download the new version. Easy.
Instead, by having a custom theme I’m tied to using a developer to ensure it’s always in tiptop shape.

Choosing the right developer

I’ve hunted for a developer to make my site responsive for a long time. Be warned: heaps of developers claim they can create responsive sites but they really can’t. Always get a recommendation, as I did.

My coder’s quote was reasonably expensive, but he (hopefully) knows his stuff. I’ll report back and let you know how it turns out.

Future proofing

So, how long will my new sexy responsive site last before it needs a refresh? Well, I’m hoping for at least two years.

Just like every other small business owner, it pains me that I have to invest so much in my website. Why can’t I just pay a lump sum and have a site that will last me for the next five years?

Sadly, there’s only so much future-proofing you can do. The web has changed hugely in the last two or three years:

  • Technology has changed: Flash losing popularity, smart phones and tablets appearing, HTML5, Search Engine algorithm changes.
  • Users have changed: The way we use the web has evolved. We’re sick of wading through wordy brochure-style sites. We want interactivity, tools, quick menus, snippets of content. We want warmer, more chatty language. And we couldn’t care less about whizzy graphics that animate just for the sake of it.

So if your site is more than three years old, you probably need a new one and please PLEASE make sure it’s responsive.

Over to you

Is your site responsive? Do you care? What are your plans to create a responsive site?

Did you like this post?

confessions of a misfit entrepreneur with Kate Toon

You might like my book ‘Confessions of a Misfit Entrepreneur | How to succeed despite yourself’ – buy it online here.




Want to have a chat?

If you need a Copywriter, SEO Consultant or Information Architect, then please contact me.

The Recipe for SEO Success
The Clever Copywriting School

 

Responsive websites: How I learned the hard way was last modified: by
shares