5 Content Usability Tips for Mobile Sites

by on 05/09/2011 • 10 Comments | Online Marketing

Hey. It’s a new week and you’re busy. So what do you say we just agree that your audience is trying to view your content via mobile and save ourselves the debate about whether or not it’s happening? Because it is happening, you stubborn fool, and you need to optimize for it.

Heck, I’ll even start with some numbers.

Even if you’re not using your phone to access the Web, your customers are. In fact, the number of searchers using their cell phones to hunt down information has grown 40 percent YOY. Pretty noteworthy, eh? Now take that number and understand that only 59 percent of users who search via mobile are able to complete their task, 21 percent LOWER than what it is on a desktop. And do you know why they can’t complete their task? It’s because you messed up.

You need to get your act together.

To be a site that doesn’t render in mobile is similar to not having a site at all. You don’t exist. And if you’re a content marketer – whether you label yourself a blog, a news site or you’re hawking a product– you can’t afford to be invisible. You need to be there and you need to optimize for mobile.

To make sure your site is seen, below are five content usability tips you should implement today.

Remove the bloat

Below you’ll see two screenshots of the homepage for the Troy Record, our local paper. One screenshot is from the desktop version, the other is for mobile.

Desktop:

Mobile:

See the problem? They’re the exact same site. And that’s no good. Because while the giant headers, rotating images (oh yes, that man rotates), the video, and the large page size all work fine on my desktop, they full-out crash my phone. I cannot load this page properly. Ever. And there’s no reason for it.

You need to kill the bloat, recognize that I’m a mobile user, and give me only what I need. If you’re a news site, that’s likely the top headlines, weather, local news and link to access your full site should I want to go there. If you’re a blog, then it’s probably links to your last 4-5 posts. I’m on the go. If I wanted the whole kitchen sink, I’d go buy one.

Give full headlines

Another common error for content-heavy sites that don’t optimize for mobile? Truncated headlines galore! When this happens, in order for users to interact with your content or even understand what your content says, they have to do a lot of extra clicking or side scrolling.

Avoid this. It’s a roadblock and users don’t want it.

The more information you can give on one screen means less moving around for a user and a greater chance they’re going to find what they want. No, go read that second part of the sentence again. I bolded it for you. Realize that mobile users are users are on a mission. Your job is to make it as easy as you can for them to find exactly what they’re looking for. Or at least to make an educated guess.

A hometown favorite who does this well – The Times Union, another local paper.

Full headlines, major categories covered, and I know which links contain media that may slow me down. Nerd bliss.

Use image icons to increase scannability

Scannability is vital whether we’re talking about the traditional Web or the new mobile Web since the general public has forgotten how to read. However, it’s even more important in mobile where stories are often preceded by generic date icons or station logos. When everything looks the same (and not particularly interesting), there’s nothing there to excite a reader’s eyes and make them want to spend that extra few seconds to take a deeper look. If you’re covering news, make sure each story has a unique image. We’re talking mobile, so don’t make it a giant image, but a small thumbnail or a picture of a person they’ll recognize is going to increase scannability and the way a user can interact with your page.

Anticipate what people want

You’ll notice up there that the Times Union isn’t just giving us weather, the top headlines and local news – there’s also a category specifically targeted the news around Osama Bin Laden’s death.

Why is that there? Its there’s because it’s a high interest item and the TU knows there’s a good chance its readers are looking for that content. For the same reason, the TU features news from popular TU Capitol Region blogs and other popular sections of the site. When you anticipate what people want and serve it to them before they can even ask for it, you win a friend for a life. Or at least a reader for one more session.

Make things bigger

Hey look, if you have an 18-year-old’s eyesight, I’m really happy for you. Truly. Unfortunately, the rest of us are getting older and the tiny screens found on most mobile devices really aren’t helping matters. Make yourself a champion in the, well, eyes of your audience by making things bigger in order to compensate for the spammer UI. In other words, there’s really no reason to cram information into a very small window. Make your text bigger, your headlines bigger, the icons bigger, etc. We don’t mind scrolling a bit; we do mind having to get the magnify glass out to see who won the Celtics game [All hail, Rondo]. I know it sounds like a small thing, and perhaps even like a silly thing, but it’s hugely important to your audience, and, you know, to you if you’re trying to get people to read and click on things.

Those are five things you can do TODAY to increase your content usability on mobile. Which are you doing? What drives you nuts.

[Oh. Hi there. Yes. We know that some of you still have issues viewing Outspoken Media on mobile. We’re working on that. The plugins keep breaking our site. Kthx. :) ]

Share this post

About the Author

Lisa Barone

Lisa Barone co-founded Outspoken Media in 2009 and served as Chief Branding Officer until April 2012.

Get social with Lisa at Twitter

10 thoughts on “5 Content Usability Tips for Mobile Sites

  1. Lisa-Is this post a coincidence or what?! We just realized this morning a Plugin update threw our mobile site out of whack so tonight will be a fun mix of watching Boston (hopefully win game 2) and figuring out where the glitch is in the matrix. A well structured navigation friendly Mobile site creates a lasting impression of being a legitimate ‘go to’ company in your industry. It’s as much a part of your online branding as anything else because people appreciate the ‘extra touch.’ When the mobile experience goes smooth (helps them find exactly what they’re searching for fast) it subconsciously plants a seed that your site understands their needs. Even money can’t buy that type of brand reinforcement.

    • It’s actually not a coincidence. We’ve been stalking you. I hope you don’t mind. Don’t worry, I won’t tell anyone about that…other thing. :)

      100 percent – when you create a pleasing mobile experience, customers really remember and appreciate it because, sadly, it’s somewhat rare. Most sites are such a hassle that we flock toward the ones that are not.

      • Lisa,
        Ha! I thought I picked up on someone lurking but reminded myself when stalkers like you come around-you should never take them for granted.

        It is a rarity which is why customers appreciate it all the more. Right you are! It’s also sad which is why we should make it our mission to exploit other companies shortcomings. Not only from a competitive standpoint but to also act as a shinning example for others to follow.

        P.S. What “other thing?”

  2. I’ve noticed that I have increasingly begun to use my phone for searching the internet even when there’s a computer on the other side of a room from me. It’s just more convenient… or so I believed. Unfortunately, beyond the gripes you’ve posted, there are other horrible problems associated with mobile optimization of sites. There are so many sites that realize they are lacking when it comes to mobile so they throw together a platform to redirect mobile users to… but that’s where it all falls apart. It’s incredibly frustrating when the unoptimized site is better than their “optimized” one. I’ll be searching for something, click a link for a specific article/video/etc., and then their server sees “Oh, you’re a mobile device. Here’s our mobile page.” but instead of bringing me to the mobile page for the item I clicked to see, they take me to a mobile landing page that has no mention of what I needed.
    Now that I think about it, there was an XKCD comic about this: http://xkcd.com/869/

    • Youch. Yeah, that’s really no good at all. That’s when people start throwing their phones across the room and smashing them to pieces. I wonder if sites like that have a side deal with cell phone providers?

  3. Agree 100% with @M_Roberts. Plus, it makes me tickle with the wrong kind of joy when there’s no link to “View desktop version”, especially when I know the page by heart and what I’m looking for is not on the mobile version. See you soon Lisa! ~Paul

  4. I have a client who a developer who made a mobile site for my client. He thought it was a great idea to have mobile version, because many of the mobile users can’t see the flash version of the regular site.

    I think mobile is good idea, but needs the right developers to implement.

    What are the effects on SEO from having a mobile site?

  5. You touched a nerve with this one. I recently suggested to a non-profit client that they needed a mobile version of their website. A site that is so terrifyingly crammed full of competing calls for action and visual stimuli that I’m surprised they aren’t required to post a seizure inducement warning. I digress. The initial response was that smartphone adoption removed any need for a mobile development. True story.

  6. With the advent of voice search for Google people have more to use the phone to find the information they want. While I do not know how to set up a blog just to read a mobile phone. Previously created special PDA version of the site, but it was necessary for older models.

  7. My blog’s mobile version is really odd. i never had a look on it since 3 to 4 months. I don’t have iphone version of my blog because in india very few people have iphones.
    Also i have seen that only big websites have nice looking mobile version of there sites.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Comments links could be nofollow free.