Use of mobile devices, such as tablets and smartphones, continues to show explosive growth, especially among younger users. As more websites recognize this trend and become mobile-friendly, a snowball effect is beginning to take shape. The future is relatively clear: If your website isn’t optimized for mobile users in 2014, you will be left behind. Communicators of all stripes, of course, need to make sure that doesn’t happen.
Let’s presume that you’ve made the decision to create a mobile version of your website, either as an update to your existing site, or as part of a larger site redesign/rebuild. If you’re rebuilding the entire site, it might be worth considering a “mobile-first” approach.
This uses the mobile design and content as the starting point, and adds more features and richer content for users with larger screens and better connections.
It’s a different way of thinking about your website, and a good idea if you want to pursue the mobile audience.
CONTENT HIERARCHY
Whether you decide to go mobile-first or add mobile to your existing site, it’s a good idea to have a designer with mobile experience create the layouts. But only you can make decisions about content.
The first question you may ask is: Why not just use all of the same content?
The problem with this approach is that it overlooks the main obstacle of small screens—the content simply will not fit in a limited space.
On a desktop, users scan pages in a zigzag pattern to find what they want.
Mobile devices generally only allow for a comfortable reading experience in the amount of space you’d see in a conventional site’s sidebar.
Due to limited screen space, you will have to decide on a content hierarchy.
For individual pages the simple way to do this is to lay out the content from top (most important) to bottom (something that entices the user to stay), with the ‘meat’ of the page in between. Landing pages, such as the homepage, raise additional questions.
For example, if your site has a carousel, it’s probably best to simply remove it for mobile, but what should go in its place?
In general, the best approach for making these decisions is quite simple: What is the single most important thing you want a mobile user to see or do when they get to your site? Lead with that.
Mobile users abandon websites far quicker than desktop users when they encounter problems, so you must reduce the site to the most essential items in order to ensure users get what they want as quickly as possible.
LESS IS MORE
In addition, because of the limited memory, processing power and bandwidth of mobile devices, reducing your content to the essentials significantly helps your site performance, another roadblock for mobile user engagement.
As for the content itself, the most notable change should involve the treatment of images. The only time images should be included is when they are directly relevant to the content itself—graphs and charts are good examples.
The images you do include should also be optimized for mobile instead of simply resizing large images in the browser window.
For articles and similar content, author images and bylines should be moved to the bottom of the page; they should be available for follow-up or further reading, but out of the way. Since users won’t have a mouse, links must be prominent and spaced accordingly.
NO FLASH
Mobile devices do not support a “hover” effect, so nothing of importance should rely on it.
Any content built using Adobe Flash must be rebuilt using HTML5 or dropped altogether, since most mobile devices do not support Flash.
Forms are another problem area. Entering data on even the best mobile devices is tedious, so be sure to make forms as minimal (name, email) as possible, especially for simple operations such as newsletter signups or contact forms.
Turning your existing site into a mobile version can be difficult—like trying to fit an entire closet into a suitcase.
But the implementation of a mobile site is a great opportunity to update content so that your message comes through loud and clear. That’s appreciated on any device. PRN
CONTACT:
Josef Komenda is senior front-end developer for Ashe Avenue. He can be reached at [email protected].
This article originally appeared in the April 21, 2014 issue of PR News. Read more subscriber-only content by becoming a PR News subscriber today.