Make Your Site Mobile-Friendly. Smartphones and tablets are becoming daily browsing tools for internet users all over the world—and sites that fail to accommodate the challenges of mobile browsing are losing traffic, losing business, and losing revenue. Here are a few of the easiest ways to make your site simple and accessible for mobile users.
Stay within 1000px
This is definitely the easiest rule of thumb to follow; it won’t make your content accessible on the smallest devices, but it’s a bare-minimum requirement for anything other than a desktop or laptop. It will also help your site avoid the sense of sprawl that makes bad sites look like Angelfire pages from 1998.
Build your mobile platform first
If you have the luxury (or necessity) of starting over on your web design, start from the assumption that your user interface should be functional on a 3” smartphone display, work your way up to smaller tablets, and then close out with desktop design.
Not only will it make your site more universally accessible, but it will also help you boil down your design to what’s really essential. Often, bells and whistles distract from your revenue stream and can actually make your site less effective at doing what you need it to do.
Use a third-party service
Until recently, themes and templates have been much easier to get for a desktop-size page than for a mobile platform—but if you’re not interested in doing your own design or hiring a specialist, it’s pretty easy nowadays to get a mobile template to plug your content into.
Check out Google’s new “GoMo” service, that allows you to mobilize your content as well as mobile-test your existing site to make sure it’s a positive user experience.
Try a fluid layout
If you do your own CSS, make your site is universally accessible by defining everything in percentage, rather than pixel terms. If all the elements of your style sheet take up a certain number of pixels, mobile users will have to scroll and zoom around on your page to find what they’re looking for. By defining your style sheet in percentage terms, you allow your content to effortlessly change to fit desktops, tablet computers, and smartphones.
Know the limitations of mobile UI
Smaller displays aren’t the only obstacle to good mobile design—you also have to cope with the fact that fingertips aren’t as precise as mouse cursors, virtual keyboards are a pain to use, and elements like hover text aren’t usable from a mobile device.
The simplest way to help people navigate your site with their clumsy sausage fingers is to give everything plenty of breathing room—links, text, images, everything that you want your user to interact with should have a healthy quantity of negative space to make clicking easy.
Pulse’s front page is an excellent example of mobile-first architecture, with big, clear images and minimalist design. It’s great for mobile users, but it also just looks better than a crowded page.
Overall, until we find a better interface for mobile devices, you should just limit your site’s use of hover text and user text input. Sometimes it’s necessary, but not as often as you’d think.
