For the better part of a year I have been working with adaptive and responsive templates. Over that time I have seen first hand that content is an important part of any site, however, you when making a site responsive you've got to keep that content in mind. A great deal of companies want a mobile experience, but they don't want to spend the time considering how content should be displayed for users trying to use their sites.

A design is not so much about the cool graphics anymore and users do not visit sites because they have the free time; they visit because there is something useful. If your site is only useful on desktop then you could be missing out on business, traffic, or sales that would have been made via a different user experience, such as, a smartphone or tablet. Take a step back and consider your users and content first before concentrating on the next big thing. Don't launch a mobile site unless you can effectively give your users what they need most.

Users and Mobile First

If you're thinking about building or consulting a design firm to build a mobile site for you then I encourage you to consider doing your homework first. No, the dreaded words! Though this is not necessarily "bad homework", but important homework. Think of your users and what they will be using your site for. I have heard to many discussions where people consider all the options in a series of meetings, but they never consider the metrics, analytics reports, usability testing, or ask the users what they use most on their site. At the end of that type of process you end up with a great design, but a poor user experience because none of the essential pieces are where users want them. When you consider those that use your site and what their goals are that is the moment you allow your site to become not only useful, but necessary to their daily flow. If your site is hard to navigate and difficult on a desktop, then you squeeze all those problems into a mobile experience that won't help them either.

I'm a huge advocate for mobile first, which means you start with the smallest device or experience and work up. The reason this process works so well is that you're not trying to stuff a desktop site down a tiny funnel for mobile, but you're considering what you need on a mobile device the most and adding as the screen gets bigger. There is no harm in adding (as long as the experience warrants it), but sometimes it can be hard to remove things that we once knew to be extremely useful to our desktop users.

Smaller Real-estate

My phone's screen is smaller than my laptop screen. Now that we have that earth shattering notion out of the way we can focus on the fact that we don't have as much space to work with. A responsive design must function in a plethora of arenas and must serve each equally well. This is where your content strategy, design and usability experts, and other procedures come into play. The homework that I talked about earlier is about getting dirty and hitting the mobile road running.

Based on the fact that I have no screen space to fit a full user-experience I need to scale out everything and start with the basics. Will your users need a login? Will they need huge graphics? Does my navigation need to change format? There are plenty of questions to ask yourself before you get started, but remember that things will be changing and if done right, for the better.

For example, a good amount of mobile sites today hide navigation behind a single-click button to mitigate the space it would have taken up on the screen. Sites do this because the space on a screen is precious and shouldn't be wasted. If you doubt this then think of it this way: if I displayed my navigation straight down the page for users to click through my site, then chances are they are going to miss the awesome content that you have hidden from view. Everything on a site has to work together and that is why content is crucial, if you make the navigation accessible, but hidden from view then users can find it when they need it. All this leaves the content of your site front and center.