Responsive Web Design is KEY in a Quality Browsing Experience

Rate Your Browsing

Have you ever viewed a website on your smartphone or tablet and found it difficult to read because it required extensive resizing and scrolling? This occurred because the website didn’t have responsive web design.

Is your website or blog responsive? If it isn’t, we highly recommend taking the necessary measures to provide a quality browsing experience for your readers.

Wait, What is Responsive Web Design?

A website with responsive design is built to provide an optimal viewing experience on all devices. In other words, the website is easy to read and navigate on desktop monitors, smartphones, tablets, etc.

Why is it Important?

Responsive design is necessary because people now access the web on a multitude of devices. Smartphone and tablet web browsing already accounts for a large percentage of web traffic and will continue to increase. In fact, almost half of the traffic on EzineArticles.com comes from a non-desktop device.

We recommend making your site mobile-friendly for these reasons:

  • Traffic: You don’t want to lose traffic because your site is difficult to read and navigate.
  • SEO: Responsive websites tend to rank higher in search results.
  • Competition: If your site isn’t easy to navigate, it’s possible users will go to your competitors.
  • Credibility: If you have a good-looking site, users will be more likely to spend time browsing and trust your products or services.

How it’s Done

First, determine if this is a job that can be done by you or if you need to outsource it to a professional.

If you have a blog, such as WordPress, you can select a WordPress Theme that is already responsive. Refer to the ‘help’ section of your blog provider’s website if you’re unsure how to do this.

If you have an HTML/static website, you can edit your design by adding media queries to your code. If you’re not experienced in coding, you can choose to outsource the work. However, you will want to use caution in any sort of outsourcing process.

Buyer Beware.

Before hiring a programmer to code your responsive design, ensure you’re using a credible site and that the person or business has a solid reputation. If you post an ad on a freelance project website, use caution if the reply to your ad reads pre-scripted as these are typically not services you want to use. Confirm the person you hire is genuine in their work and able to communicate in regard to your needs. Also, be sure to ask for examples of their work.

As a side note, the price will fluctuate depending on whether your website needs to be completely re-coded or if it can simply be edited by adding media queries. Keep this in mind when you discuss pricing. Bottom line: Use caution and shop around.

Additional Thoughts

Regardless if you do-it-yourself or if you outsource, here are some additional things to consider before you begin the project.

  1. Content. Many times you can’t fit everything on a mobile site. Make a list of what should be included on the mobile version and what can be left out. Be specific.
  2. Design. Look around at other mobile-friendly sites. Do you see any designs you especially like? Take note. Think about what kind of layout would work best with the type of content you feature.

As we mentioned, mobile browsing is on the rise. Phones are getting bigger, tablets are getting less expensive, and everybody wants to be connected on-the-go. Whether or not you decide to make your website responsive is ultimately your decision. However, we can say, it WILL improve the user experience, which largely impacts your bottom line.

User experience is key!

Have you already made your website responsive? We’d love for you to share your tips with others in the comments below!

17 Comments »


1
Nikolay writes:

For a blog on WordPress, you can use a plugin «WPtouch Mobile Plugin»

Comment provided October 10, 2014 at 11:48 AM

[Reply]

2
Sastonepal writes:

In This Competitive Internet World, Responsive website play vital role to increase the visibility on search engines as well as increase the search engine traffics. Most of the mobiles companies are targeting smartphones and its easy to browsing data on smartphone with responsive theme. Therefore all business should make their website responsive. it make the site quality browsing on smartphone, tablets, desktop, laptops and all size of devices.

I have a website with responsive design: http://sastonepal.com . you can test this site also.

Comment provided October 10, 2014 at 11:56 AM

[Reply]

3
David Croucher writes:

“We recommend making your site mobile-friendly…” is the key here

‘Responsive’ sites are usually written in HTML5; they look up which browser and device the person is using and change their format to best match that. They’re complex to code and REALLY need an expert designer and programmer to prepare. Usually they place quite serious limitations on your site layout whatever device is intended to be used. There are two alternatives that are easier for the self-publisher and small company, who don’t have the budget for such coding and complex design:

# A special site for mobile devices, intended to link to the ‘main’ site. Wikipedia does this, for example. Sometimes a bit of code detects whether the user has a mobile device rather than a desktop or laptop, and redirects appropriately. If this special website has less content (Courtney’s right that this is a good thing) then there should be links to the main site to ‘read more’.

# Your main website is so laid out that it’s simple to use with mobile devices, while having the full experience on wider screens. On my main sales site, for example, I use a 1000 pixel fixed width (variable width is TERRIBLE on mobile devices) in three columns (most blogging sites are like this, too). The two side columns are 200px wide and the main one 600px, which is great on a smartphone. Reference to the sidebars are clear and alongside, so that a quick swipe finds them. My customers tell me that this works fine on iPhones and tablets, and only the tiniest Android and Blackberry screens are difficult to read – but so is a dedicated mobile site on these.

I build my own websites, mainly in Serif’s WebPlus for ease and security, and their recent versions all support matching mobile sites with linking code. This saves me from having to use a lot of HTML (in fact, none is actually needed) and I do struggle with HTML5 coding or CSS. You’re all welcome to take a look (http://www.pivotalhealth.co.uk/bioflow-index.html)and make your critique here!

Comment provided October 10, 2014 at 12:37 PM

[Reply]

David Croucher writes:

Update: according to the Googlebot, the second of my options above now won’t show up in Google searches on a mobile device. Sigh… Now I need to update more pages.

[Reply]

4
Rick Lomas writes:

I absolutely agree 100% with this. I played around with things like DudaMobile to build a site that would be mobile friendly, but conversions were poor. Now I use WordPress+Thesis 2.1+Pearsonified Skin to create an excellent experience whatever device it is viewed with. No turning back at all, its responsive all the way for me.

Comment provided October 10, 2014 at 3:44 PM

[Reply]

5
Nihad Cherif writes:

i like EzineArticles but i always try to submit articles and he say no!!!
this is my blog: http://molium.blogspot.com

Comment provided October 12, 2014 at 1:33 PM

[Reply]

6
Kay writes:

How timely! I have just upgraded my own site to a responsive theme. Been thinking about it for ages and finally sorted it out.

Looks much better now.

Comment provided October 14, 2014 at 4:31 AM

[Reply]

7
Merrisa Meyer writes:

A responsive web design is the key for current market.

Comment provided October 15, 2014 at 12:34 AM

[Reply]

Wayne Farrell writes:

Absolutely agree with you! We’ve made our website responsive http://ovpod.co.za as well as our clients. There is nothing more frustrating than a website that isn’t mobile friendly!

[Reply]

8
David Croucher writes:

Responsive design sucks again! Today I logged into my favourite UK weather page, the BBC Weather predictive radar forecast for my own little town (a 20×12 mile rectangle of prediction plus regional and national forecasts and the latest local TV video forecast).

Uh-uh! The system had gone responsive, and the new mobile version for my Android phone has left out all the key stuff that I (trained in meteorology) use to fine-tune my day. Just as you suggested, Courtney, to make things simpler! The BBC is one of the world’s best websites, though, so they had a prominent link ‘back to the old site’ waiting to rescue me.

The point is, though, that responsive design needs to be VERY GOOD, to be MARKET-TESTING LED, and to BE FIELD TESTED very, very thoroughly. I’m still for the alternate site idea, with users given the option of whether to use the narrow-screen Mobile version or the full fat Main Site. Oh, and some mobile versions include alternate access depending on screen orientation. When that’s good (eg my YouTube app giving me full screen video in Landscape and a small picture with info and feedback in Portrait) it’s great – but there’s scope for disaster here, too.

Anyone got other experiences/examples of good and bad responsive design? Clue: ‘responsive’ to what? A bit if feedback code, or the reader’s preferences?

Comment provided October 15, 2014 at 6:21 PM

[Reply]

David,

You make a great point. When making your site responsive, you should also ask others to test the site. Get feedback from your family, friends, and colleagues. Others will be able to tell you what they like/dislike and point out any key features that are missing. Thanks, David!

[Reply]

9
Ricky Davies writes:

If your site isnt responsive then you are missing out of potential customers. With frameworks in place such as bootstrap which make it simple to create responsive sites then i see no reason to do it. i agree with most of your comments in the article.

Comment provided November 17, 2014 at 8:06 AM

[Reply]

10
Rosalinda Flores - Martinez writes:

Thank you. A blessed day, all!

Comment provided November 18, 2014 at 6:29 AM

[Reply]

11
youlilie writes:

Surfing through mobile is very common these days. So mobile friendly sites get more traffic than sites are not mobile friendly.

Comment provided April 10, 2015 at 9:20 PM

[Reply]

12
Sandra writes:

I have an eBay store How do I make it a mobile friendly site? Does anybody know?

Comment provided April 16, 2015 at 2:44 PM

[Reply]

13

Well- wriiten article and useful guide as well. It’s true, what David said herein above, the sites look different expending upon the platforms used in devices like Smartphones, Tablets, etc.. My site http://www.mohanspage.com appears good on iPad whereas on another mobike device( smartphone), it presents in a different way.

Comment provided April 17, 2015 at 9:44 AM

[Reply]

14
Lionel F. Evans writes:

Responsive websites are very good, however, there are some fundamental drawbacks, they are not always compatible with certain mobile devices. However, we recommend that all websites go responsive, and WordPress have themes that are designed with responsiveness in mind.

At http://www.evans-mobile-solutions.com we can make any website (in any language) mobile friendly, quickly.

Comment provided May 7, 2015 at 12:18 AM

[Reply]

RSS feed for comments on this post.

Leave a comment

Please read our comment policy before commenting.