The paradigm shift that began with the introduction of the Apple iPhone back in 2007 is today a full-blown phenomenon. What’s more, just as the development of premium web templates revolutionized the way websites are built, mobile computing has transformed the way people interact with the Internet. It’s become a far more intimate experience, which is the primary consideration these mobile design tips take into consideration.
Legibility Is Paramount
Rather than the 20 to 23 inches most people maintain from desktop screens, mobile screens are usually within 12 inches of the users face. Additionally, screens are short on space. This means legibility is paramount. When you’re choosing fonts for copy use a clean style with no superfluous elements.
In other words, decorative fonts don’t play well in this environment. Yes, style matters, but it has to be functional or it’ll be like a beautiful person who speaks a language nobody can understand. You love looking at them, but you get nothing at all from the interaction.
Sans serif fonts scale better and they’re more legible across a wider range of screen sizes and resolutions.
Scrolling Is Better Than Pagination
If you sit and watch people using mobile devices for a while the mechanics become readily apparent. Most people hold the device in their left hand and use the right to type, scroll and tap links.
When you need to present lengthy product descriptions, it’s better to present all relevant material in one stream so the user can scroll through it. Send them to a new page to consider a different product or a separate topic. This way they don’t have to step back through pages if they want to reread something about the product they’re currently considering.
Or, said more precisely, the lack of speed kills. Fast load times are crucial in mobile. Studies have shown 53 percent of mobile users will abandon a site if it takes longer than three seconds to load. Session lengths average 70 percent longer on faster sites than slower ones. Their bounce rates are 35 percent lower too.
This means you must absolutely streamline your mobile site for fast loading. Simpler fonts load more quickly (sans serif is the move). Images must be optimized for fast loading. It’s OK to lower their resolution because they’re going to be seen on a smaller screen.
Don’t Rely Solely on Responsive Design
Yes, it’s a great first step as you make the transition from desktop to mobile. And indeed, all premium web templates worthy of consideration are designed responsively.
However, responsive design only carries you so far. To function in a mobile environment, they must convert data originally intended for the desktop. This means they often load slower than purpose-built mobile platforms.
Further, when you design specifically for mobile you can prioritize for mobile user concerns. Navigating on a small screen is inherently different and while responsive makes the site look good, you’re left with the same navigation choices you have on the desktop.
You might be better off considering a dedicated mobile application. These can be specifically optimized for the mobile environment, all but eliminating speed and compatibility issues. However it will entail additional cost and you’ll have to rely upon your customer base to download and install your application. Lots of ecommerce merchants do it, so it can work. You just have to decide if it’s right for you.
All in all, these mobile design tips will help you provide the best possible shopping experience for your customers regardless of the device they choose.