If You Aren't Thinking Mobile First, You're Doing It Wrong To be truly mobile-friendly, you need to think mobile first from the ground up. Use these five tips.
By Alex Iskold Edited by Dan Bova
Opinions expressed by Entrepreneur contributors are their own.
It is mind blowing to me how many startups and big companies get mobile totally wrong. Take a look at this tweet from Benedict Evans:
Black Friday. US commerce = Mobile, iOS. pic.twitter.com/Gko0Gadeb8
— Benedict Evans (@BenedictEvans) November 29, 2015This is mobile commerce -- currently the worst experience on mobile, but it is still growing at a huge pace. People are still buying stuff on mobile despite the clunky mobile shopping experience.
Next, go read a great post by Evans titled "Mobile Is Eating the World." What this means is that your customers are increasingly coming to you via mobile devices. This applies to everyone -- from consumer apps to enterprise technologies. Even if your customers are going to spend millions on your enterprise license, they still are likely to first click on a link on their phone, while sitting on a couch and not paying attention to some TV show.
Related: 4 Ways to Mobilize Your Business
Responsive design + app = You are doing it wrong.
Lets get straight to the point: Responsive design and having an app isn't a solution for your mobile problem. It is not good enough and likely just plain wrong.
To be truly mobile-friendly, you need to think mobile first from the ground up. Mobile-first doesn't mean I figured out what to remove from the desktop design so that it fits. Mobile-first means thinking hard about how to present your brand and product on mobile screens. Then coming up with the absolutely best possible design for it.
After that, you can think about if it makes sense to have the app -- sometimes it may not. If you choose to have the app, think about how and when to up-sell it properly. And finally, think about how to expand your brand to desktop. The desktop is the last step.
The mobile web information challenge
The beauty and the challenge of mobile is that real estate is really small. It is beautiful, because less is more, and because it is finally liberating. It is challenging, because we didn't grow up with less is more, we came from Windows, from desktop and from larger screens that afforded bloatware.
Because there was a lot more space on the desktop, we thought about how we could add complex menus and a ton of information and graphics and text. Well, the problem is there is just no space on mobile for any of it.
If you take a standard desktop website and make it responsive, it will be useless -- unless you remove 90 percent of it. Here in lies the secret to building a great mobile experience. Instead of figuring out what to remove from your desktop web site, just throw it away completely, and re-think the whole user experience from scratch.
Related: 3 Ways Retailers Should Accommodate the Mobile-Obsessed Customer
5 tips to make your mobile website awesome
1. Brand: Even though mobile user experience is very compressed, start by thinking about how you communicate your brand on mobile. Your logo, colors, fonts -- whatever it is, make sure to breathe your brand into the mobile experience, so that your customers remember you.
2. Scroll: Make everything scroll-friendly. Organize information in a way where more important information is on top, and don't be afraid to have stuff stacked on top of each other. On mobile, people are used to scrolling when they want more information.
3. Copy, fonts, images and menu: Make your copy tight and shiny. Mobile affords the opportunity to make the copy really simple and crisp. Use branded fonts, and make the text larger to make sure people can read it. Use less text and more images.
Images are the killer app for mobile. People love them and love clicking on them, so make sure your images link to where you want users to go. Use a standard menu and place it on the top left, because most people are right handed so that they won't hit it by accident.
4. Calls to action: Direct users to the action you want them to take. App download? Email signup? Or perhaps you want them to text you? Whatever it is, make it crystal clear what you want the user to do, and then drive them to do it. Use big buttons and sticky prompts to get the users to the next step in your conversion funnel.
5. Test, measure and optimize: To quickly test how your website would look on mobile, shrink your browser on the desktop. Then test it out on the latest iPhone and Android to make sure there are no bugs. Track the clicks using MixPanel or your favorite analytics software. Keep iterating on the mobile website until your conversion is healthy. The good news is that since mobile contains a lot less than desktop, you should be able to optimize it a lot faster.
Here are some of my favorite mobile experiences: apple.com, untitledatthewhitney.com, flip.lease, nytimes.com, spoonuniversity.com
What are yours?
Related: 2015 Will Likely Be Known as the Year of Mobile Commerce (Infographic)
