Building your website with a mobile mentality

By Nick Harrison

What is the purpose of your website? In most cases it is to either sell a consumer a product or service, or to get a consumer to read content so that you can sell advertising. Sometimes, it’s all of the above.

With a canvas as wide as 1,000 pixels for some sites and a height that could be endless, it is fairly easy to feel the need to make sure every pixel is covered with something — buttons, calls to actions and content. But when you clutter up your website, you distract the user, and that lessens the chance that the user will do what you want him or her to do in the first place. And it could even make it hard for the user to know what your company does.

What does this have to do with a mobile UI (user interface)? When creating a mobile site, there is very little room to work with due to the size of the screen, so the content and the menu has to be sharp and to-the-point. The content is often shorter and more focused. It is more difficult to oversell on a mobile UI design.

All websites have different needs, different content and different rules. And some businesses have an awful lot of information to cover. Regardless of the content that is really needed and some that really isn’t, the basic principle is this: The less a user’s eyes have to look at or comprehend, the more likely it is that the user will see important content or click on calls to action.

Here are a few tips for small-business owners looking to set up an effective mobile site:

1. Navigation: Drop-down menus can be highly effective. For instance, an “About” button could drop down and include information about your company, your leadership, employment, press releases, news and so on. The fewer buttons that people see on your main navigation or side column could make the “Buy Now” button appear more visible and desirable.

2. Less text, more images: Images sell, not miles of text. An awesome image could tell a consumer in a second what you do, what you are offering and why they need to “order a pizza” from you this second. Grab their attention and sell them! Stop talking so much. Although textual content is crucial, use the images to help sell as the images are the first thing users see.

3. Do you need all that info about the user? Most mobile forms are short because people anticipate (with good reason) that the user is either on the go, distracted or just doesn’t want to navigate through a huge form using their iPhone. Try to keep your forms short if you can and, when you can’t, try to use JavaScript or other ways to make the form “appear” shorter.

4. Keep your best-sellers up front: There is most likely a reason why you sell this product or service more than others. Try to get that sale as soon as possible, because the more users have to look for it, the less likely you will sell it.

5. Don’t make users guess why they are there: The user should know right away what you do and why you think they should use you.

Remember, though, that the more things that you ask the user to look at on your page, the more his or her distraction levels can kick in. So think about your navigation, your content and the number of things you have on each page. Keep it simple and direct.

Nick Harrison is creative director for Chicago-based branding, web development and social media firm Dashal, whose client roster ranges from small businesses to best-selling authors to major consumer brands.

Follow Nick on Twitter: @HarrisonNick.

Join Crain’s LinkedIn group for Chicago entrepreneurs. And stay on top of Chicago business with Crain’s free daily e-newsletters.

Crain’s small-business editor Ann Dwyer is on Google+.

Related posts:

1. Nick Harrison: Huge increase in holiday mobile use
2. Nine Tools for Building Your Own Mobile App
3. Nine Tools for Building Your Own Mobile App
4. Bloomberg´s Global Head of Mobile, Oke Okaro, Will Challenge Conventional Thoughts on Mobile Strategy at GDS …
5. Building the right team for your startup