Skip to main content

O3 & Responsive Web Design

O3 & Responsive Web Design

You may have heard the term responsive web design before. It’s quite the trend but not one that is likely to ever go away. Responsive web design is a technique that allows web designers and developers to serve multiple versions of a website based on the visitor’s viewport (or visible browser area). That means that a user on a desktop or laptop, a tablet, or a smartphone will all be served a version of the website that is optimized for their particular device. What this means to the average person is that mobile devices will not present you with the ability to “pinch to zoom” to areas on the website. The website will be formatted more vertically than horizontally and present the content in a manner that will be easily readable on a tablet or browser.


What is truly great about employing responsive web design is that the website contains just a single layer of development code and database. The old way of optimizing for mobile devices was to serve an entirely different website to these devices (you may have noticed that you would be forwarded to a subdomain like m.website.com or mobile.website.com when visiting from a mobile device). With this setup, web design firms would have to write completely separate versions of a website and maintain those versions as well. Website owners would also have to change the same content on multiple versions of a website.

Responsive web design is not for every website. Owners of websites with low mobile visibility will typically elect to not spend the extra cash on something that will be rarely viewed. On the other hand, consumer goods, restaurants, and bars will definitely want to look at responsive web design to serve a user-friendly view to their mobile clientele.

You can read more in our in-depth look at responsive web design.

A few other notable changes in the site.

  • We’re now using font icons from icomoon.io instead of graphics to display iconography across the site;
  • We’re using CSS3 transitions for literally every animated object on the site (see the hover states on the Portfolio);
  • We’re using Twitter Bootstrap for a framework;
Share this article on