What is Mobile Responsive Design?

The proliferation of smart phones and tablets has dramatically changed the way we design websites.

Why? First, our customers expect to access websites anywhere there is an internet connection. Second, the plethora of device screen sizes means we have to consider how website information will appear in more than just the context of a desktop.

Responsive, Defined

Mobile responsive refers to web design in which the website content responds to resolution limitations of the device type.  We make use of grid patterns when laying out wireframes and creating the design. Grids serve to organize text and imagery in such a way that they will behave in a clean and elegant at the major ‘break points‘, i.e. the pixel widths of the major phones, tablets, and desktop computers.

Optimized vs. Accessible

Most websites built in the last few years will be ‘mobile accessible’ –  meaning a mobile user can access the desktop site without hitting a technological brick wall (ahem, Flash).  While accessible site is good, optimized is better.

An optimized site resizes content to a display well for each screen allowing your customer to easily browse and complete web forms on touch screens – using just one hand. When we optimize a website for mobile, we reduce the amount of pinches, zooms, and squints for our customers and give them a better experience with our brand.

Why the Mobile Experience Matters

A better mobile experience means more repeat visits and purchases. According to research by Google:

  • “50% of people said that even if they like a business, they will use them less often if the website isn’t mobile-friendly”
  • “61% of users said that if they didn’t find what they were looking for right away on a mobile site, they’d quickly move on to another site”

Ouch. A web strategy that doesn’t take into account mobile users may actually be negating good work in other areas!

story written by Elizabeth MacDonald