What Does That Mean? Mobile Responsive

Mobile Responsive

what is mobile responsive design?The internet is a strange and wondrous place, but it is constantly changing. It’s hard to keep up. We are here to help by explaining “what does that mean?”

For the first time last year, mobile traffic on the internet – the amount of people surfing the web via a phone or tablet – surpassed the desktop. This was a historic moment. It meant the shift from accessing websites at your desk to your phone was nearly complete. Sure, most of us still surf the web from a computer at work, but more and more it’s the phone that has our attention. That means your website needs to look good on phones, tablets and regular computers.

As a result, a critical part has been added to the website design process: mobile responsive design.

What is it?

Mobile responsive refers to how a website looks and behaves when it is in a mobile environment. A desktop monitor is a lot like a television, it’s wide and short. Phones and tablets, in standard portrait mode, are more like a TV stood on one end. There is less space left to right and more top to bottom, so what looks good on a monitor might not look good on a phone and vice versa.

From desktop to phone, mobile responsive design helps your website work.

 

As a result, websites must adapt by scaling to the right size and operating the way phones do. Not only is a phone smaller and oriented differently, but it has a touch screen instead of a mouse.

How is this different from before?

For years, if you wanted a mobile option for your web presence, you built a completely separate website. There was no adaptation. You simply had two websites, one for the desktop and one for mobile, which was not only expensive but impractical. Failing that, your website would appear tiny on a mobile screen and not terribly functional. Neither an ideal choice.

So, what changed?

Designers and coders began to realize the need for simpler solutions. Code also began to adapt to the growing needs of the marketplace. Now, most website design firms have altered their workflow. Designs previously done to fit the desktop first and now done for mobile first and adapted to the desktop. In addition, scrolling used to be something generally avoided. Prior to mouse wheels and touch-sensitive trackpads and mice, scrolling was a bit of a pain on a browser. With swiping on phones and tablets, there is much more vertical real estate to work with. Instead of trying to cram everything into a short, horizontal space, we simply design websites vertically, opening up loads of space for information as you scroll (or swipe) down the screen.

What’s the difference between mobile responsive websites and apps?

Good question. An app is a typically a standalone piece of software that loads on the phone for a specific purpose, like purchasing something or direct access to your account and customer service. A mobile website is nothing more than your existing website adapted for the size of the screen and meant to be viewed through a browser just like you do on a desktop.

How can I tell if my website is mobile responsive?

Other than getting on a phone and checking, the easiest way is to grab the right corner of your browser window and drag it to the left making the screen narrower. As you do, the website should begin to change and adapt. If it doesn’t and text and images begin to get cut off, your site is not optimized for mobile devices.

What do I do if it isn’t?

Some existing websites can be adapted as is. They can simply be re-coded to accommodate a more flexible design. We have modified numerous websites keeping the basic look and architecture in place, while making them work better on phones and tablets. For older websites, a full redesign may be necessary. Sometimes the code can be so outdated that the only thing to do is start over.

Fortunately, this is something everyone must deal with, so you aren’t alone. And we can help you through it. If you are looking to upgrade your website for mobile, contact us today and we’ll get your website working seamlessly in any environment.