Over the last few years, more and more people and businesses are using mobile devices to browse the internet. Nearly a third of New Zealand internet users access the internet via a Smartphone; and this trend will continue to grow in the future. This means that with more and more different types and sizes of devices coming online, your website pages will need to look different depending upon what is displaying them. Enter responsive design.

Responsive design is a way of designing web pages for mobile and desktop devices; in fact, the idea behind responsive design is that you design your web pages so that they respond to the device that is viewing it. Rather than forcing a mobile user to see a desktop site, a laptop user with a small screen to scroll horizontally to see a wide-screen monitor site, or a wide-screen monitor to view a site as a mobile customer might like, the design looks at each of these scenarios and adapts to display the content most effectively.

Why Responsive Design is a Good Idea

The best web designs are the ones that make things easy. Responsive web design makes your website user friendly for mobile customers. It is web design that responds to the user as they arrive at the web page.

Think about your typical desktop browser. Even if it is not maximised, it almost certainly has a width of at least 960 pixels. That is a lot of space to place lots of columns of text and images. If you compare that with a smartphone in portrait mode, you are looking at a device with about 480 pixels of width. That is half the screen space. A feature phone has even less space with 320 pixels or less in most cases.

If you create a page with a fixed-width layout 960 pixels wide, it will look great on your desktop monitor. But when you view it on a tablet, it’s going to look small. A smartphone will make it look even more cramped  and on a feature phone, the page might not display correctly at all.

However, with responsive design you create a design that works for any of the devices visitors to your website use. What sets responsive design apart from other methods of mobile websites is that you don't create a separate webpage for every type of mobile browser you want to support. Instead, responsive design simply looks at the features of the device viewing the page, and delivers the styles appropriate for that device.

Creating a Whole Separate Website is a Bad Idea

It can be tempting to create a “mobile” site with a separate sub-domain or site location. Then you just put all the mobile friendly site features like single-columns, limited content, and reduced navigation in that one location and point mobile users there.

In the short term, this can work, as it gets up a mobile site quickly. But eventually it will start to cause problems. The first issue comes when you realise that you have to post every article twice; once to the main site and once to the mobile site! Why create that extra work for yourself?

Responsive Design Treats Mobile and Desktop the Same

A responsive web design uses the exact same content to create a page that works whether you are viewing it at 1800 pixels wide or 320 pixels wide. But the pages that are created may look vastly different, while containing the same content. This means that whether you come to the site on an iPhone or a 27-inch iMac, you will get the same content; in fact you will go to the same URL. But on the iPhone you might see the page with only one column while the iMac gets five. But they are both considered equally important when delivering the content.

The website responds the the device and adjusts accordingly, while still retaining the important content.                             

Take a look at an example in action on a few different devices

Is Responsive Design Right for Your Business?

It depends what your customers are using to visit your site. You may find that it is not cost-effective enough if only a very small percentage of your customers are using mobile devices to view your website. You can use Google Analytics to track traffic to your regular website that comes from mobile devices like iPhones and Android devices. All traffic from mobile devices can be viewed by device or carrier under the 'Visitors' section in the 'Mobile' tab of your Analytics account, or in the 'Mobile advanced' section.

Responsive Design at Zeald

Zeald are now offering responsive design on all our websites. Check out our online store to find out more about how you can get responsive design for you website. Prices start at $597 with monthly fees of $17.

Without a doubt, one of the biggest trends in the online space at the moment (aside from social media) is the rise of the use of mobile devices to browse the internet. Widespread acceptance and use of devices such as the iPhone and iPad, along their Android-compatible competitors, has seen a huge rise in the number of people with access to the internet through their phone and, as mobile data rates come down, this trend is only going to accelerate in the coming years – both in New Zealand and abroad.

As NZ businesses become more aware of this trend, we are starting to receive the odd related question – do I need to have a specific mobile-compatible version of my website? Am I losing business by not having one?

A bit of history - mountain to Mohammad & all that ...

In the early days, mobile devices were very restrictive in their navigation of websites. This resulted in some websites being created specifically for browsing on mobile phones. However, it was always highly unlikely that the internet would reinvent itself to support these restrictions. According to the Netcraft Web Server Survey, as at June 2011 there were around 346 million websites on the internet – that’s a lot of sites to rebuild to support these technological restrictions!

Instead, what we have seen over the last few years (especially with the release of the iPhone – thanks Mr Jobs), is a major leap forward in the ability for mobile devices to correctly display normal websites, and allow people to navigate them easily. In this day and age, provided the site is well designed & built, it should be relatively easy for a mobile user to navigate and read – as is.

Check out our quick video demo of browsing the web on an iPhone 4.

Let’s back up for a second

To objectively consider the relevance of a mobile specific website for your business, I think it’s important we step back for a moment and consider your objectives in getting a website in the first place. For most businesses we encounter in the NZ marketplace, their primary objective is to generate sales and/or leads.

So when we are asking – “should I have a mobile website?”, one could argue the question actually is “will a mobile website generate more sales or leads for my business”. Or even more accurately, “will the time and money I invest in building, running and maintaining a mobile version of my website provide me with more sales or leads than other activities I could be investing that same time and money in”.

The success of your website is ultimately determined by your ability to get targeted prospects to your website, and once they arrive, convince them to do business with you – to actually pick up the phone and call, or enter their credit card details and make an online purchase.

So should I get a mobile version?

Unfortunately, the majority of NZ businesses we encounter are struggling with the core requirements for a successful website. Because of this, I believe we could compile quite a list of areas to invest into with regard to the average website that would provide greater return on investment, than the creation of a mobile version of the site.

Would a well thought out, well planned mobile version be useful? Most definitely. Would I recommend it in a perfect world where businesses had unlimited resources? Most definitely. However, in the world of very limited time and budgets, I would argue there are much bigger fish to fry. Areas such as; testing headlines, strategy sessions (to help understand your target customers better), planning and organising targeted promotional campaigns and usability testing would all provide greater return on investment than the creation of a mobile version of the site.

Only once all of that is sorted, would I recommend you get down to the ‘finer details’ such as custom versions of the website for mobile devices.

Ultimately, it is essential that our website is persuasive in the first place - otherwise you just end up with a mobile version of your website that still doesn’t persuade customers to buy – it’s fractionally easier to use, but still convinces no one.

Have one website that works for everything.

My advice is to keep it simple. The last thing we want to do is distract you from is having a highly persuasive website – especially when killing two birds with one stone is so easy. A Zeald website naturally suits mobile browsing in a lot of ways:

• We recommend that all your web content is in HTML (rather than in images etc). This means it will load quickly and automatically scale to a phone’s browser window as a visitor zooms in and out.
• We help you create a website that loads quickly – essential for slow and costly mobile web connections.
• We educate & assist you to identify topics for large (in font size), compelling headlines which spark attention – these can be read when ‘zoomed out’ on a mobile device & can be used to convince the visitor  it is worth their time to zoom in on that section and read the detail.
• We don’t recommend using flash, which doesn’t work on iPhones.
• We avoid drop menus or any ‘rollover’ functions – they don’t work on phones either.

Users who visit your website with an iPhone or similar mobile device will still be able to browse it easily and look for the information they want. For return visitors it has the additional advantage of looking familiar when they loaded your site on their laptop (navigation hasn’t moved, the layout of the website is as they would expect).

Whatever the case – it will be the effectiveness of the content on the website that determines whether they buy from you or not. How well you answer their questions, and persuade them to trust and do business with you.