Responsive web design

We design your website to work on all devices, from mobile phones and tablets to desktops and large screens.

 

Why do you need a responsive website?

In Australia, three out of four people use their mobile devices for internet browsing every day.

Resolution widths can range from 320px (iPhone) to 2560px (large monitor) or even higher, and by using a responsive design your website will be optimised for all of these environments. Plus it’s future proofed for formats that don’t even exist yet.

About Responsive website design

Responsive design is the term given to websites that detect the browser width of the device, and adapt accordingly.

LiTHe embrace the technologies offered by all modern browsers to create responsive web designs.

A responsive website will rearrange elements on the page, so that:

  • all content is legible without having to zoom
  • links and buttons are given more space so that you can tap them with your finger
  • traditional navigation can also be condensed into collapsible menus so they’re out of the way until you need them.

We’re also conscious of reducing or removing the use of technologies which are not cross-device friendly, such as Flash, to device detection to show discrete platform-specific interfaces. This ensures your site and any media on it (like videos) can be viewed on iPhones and iPads as well as desktop computers.

What does a Responsive website design look like?

Visit any of the following websites which LiTHe designed to be responsive, and manually drag the browser window to a narrow width. You’ll be able to see the sites readjust to fit the new screen width.

These are websites we built afresh using responsive design technology:

And here are examples of websites that were originally built as a fixed-width desktop websites but have been converted to responsive design:

Improved browser technology

As well as responsive design, the technology in browsers has come a long way in recent years.

Older techniques of using images to show visual elements, like drop shadows and rounded corners, can now be better handled. This is referred to as progressive enhancement, or graceful degradation, depending on which way you want to look at it (the old glass half full or empty adage).

The load time of a website can be improved by removing the images used to show rounded corners and drop shadows etc, by using progressive enhancement instead (we’re glass half full people).

Applying progressive enhancement will show a rounded corner for example in Google Chrome, Firefox, Safari, Opera and IE9 or newer browsers, and result in faster load time and a cleaner site. Although older browsers won’t be able to show the effect and will show a straight edge corner, we consider this an acceptable trade-off for the benefits.

Making these conversions also makes the transition to responsive design more seamless.

So what are you waiting for?

Contact us to make sure you have a site that works as a mobile website, tablet website and desktop website, that looks good, functions well and meets web standards.