Login

Retrieve Password

  • Why Go Responsive?

    Why we recommend responsive as the best approach to designing for web.


    The Internet is alive

    A decade ago, who could have imagined that we’d be streaming funny cat videos to our TVs, or that we'd be connecting with the world socially via the watch on our wrist? It's clear that the way in which we interact with the Internet has changed both drastically and rapidly, and that it wouldn’t be so far-fetched to consider it a living thing.

    As the Internet evolves so too does the way we design for it: enter stage left, Responsive Design.

    It’s a term you may have heard floating around when talking about web design, but what does it actually mean?

    For those of you who like a bit of history, ‘responsive design’ is a term credited to Ethan Marcotte in his article Responsive Web Design written in 2010. He discusses briefly the security in designing for specific page widths, but also the fatal flaw in this way of thinking: there is no set-width for browsing the Internet. Browser window widths are user-specified and unpredictable at the best of times, and this is only taking into account a desktop experience.

    You could argue that today there’s not even a standard way to view the Internet. Increasingly, we are seeing people accessing the Internet on devices other than their desktop. For example, 65% of people in 2013 used their smartphone to access the Internet, compared to the 52% in 2012, and the 37% who did so in 2011—that’s a significant increase and it’s unlikely to stop there.

    Apart from the growing number of smartphones available on the market, we can now access the Internet on gaming consoles, TVs, tablets (of all shapes and sizes) and even watches! What comes next: Internet-equipped sunglasses and holographic interfaces? Anything’s possible! And that’s why responsive design is so important.

    A responsive website will adjust itself to suit the current dimensions of your browser on whatever device you may be using at the time. A good way to illustrate responsive design is to grab the corner of your browser window and make it very narrow – if the website is responsive you’ll see the content being resized to accommodate the smaller viewing space.

    Sounds complicated, right? Well, let me put it this way:

    Responsive design means that whatever device you use to view a webpage, it will always fit the screen well.

     

    So, is responsive design the same as a mobile site?

    A mobile site is a website designed to work solely on a mobile phone. It redirects away from the main website to a dedicated site that targets known phone types.  This helps provide a better experience to phone users than just the desktop version viewed on a tiny screen. Using mobile-specific websites was a common approach when phones had limited internet capabilities, and phones all had the same or similar sized screens.

    Now the definition of mobile has blurred as more and more people are using a variety of devices in a mobile fashion, from touch-screen desktops to tablets and large format mobiles.

    Because there’s no standard mobile resolution anymore - and indeed, no standard definition for a “mobile device”, you’re only targeting a very, very small percentage of your potential audience with a mobile site. Responsive design, on the other hand, can cater for most, if not all device types. At it's core, responsive design has the the concept of providing the best experience to the customer, regardless of the device they’re using.

     

    What does it look like in action?

    The best way to tell if a website is responsive is to view it on a PC and adjust the width of your browser window. That way, you can see how the content responds to the varying widths.

    Here are some great examples of responsive websites:

    Men's designer clothing store, FlatSeven

    Unicef's State of the World's Children 2015: Reimagine the Future

    German-based agency, Demodern Digital Design

     

    Sounds great, but what’s the catch?

    When it comes to designing a responsive website, we apply a lot more consideration, planning, design, and implementation in order to achieve the end result. The level of investment for a desktop-only website, on the other hand, is much lower, but the upshot of a responsive website is its wide reach: you’ll be connecting with a far greater audience.

    And while it’s possible to add a responsive element to an already-established website, it’s certainly a lot easier and neater to create a responsive website from scratch. Not only do you avoid the possibility of muddled and patchy code, you can ensure that your content is suitable across all devices and that the experience is as seamless as possible.

    With responsive design you’re accommodating anyone on any device at any time. Given that 78% of people have researched a product on their device1 and 90% of people have searched for local information, websites that aren’t mobile optimised are just losing potential business.

    By investing in a responsive website, you’re not only showing your customers that you’re conscious of the way the web is evolving, you’re showing them you care.

    No, really! According to a survey by Google, 48% said that if a site didn’t work well on their smartphones, it made them feel like the company didn’t care about their business.

    Where do we go from here?

    Interested? If you want to reach the growing audience of mobile and tablet users then the value of responsive design can’t be overstated. Contact us to find out how we can help your website reach its fullest potential.


    References:

    1. http://services.google.com/fh/files/misc/omp-2013-au-en.pdf
    2. http://alistapart.com/article/responsive-web-design/
    3. http://googlemobileads.blogspot.com.au/2012/09/mobile-friendly-sites-turn-visitors.html
     

    Posted by Amy Rawlings on 10 December, 2014

    TAGS