I grew up watching the Jetsons, with their flying cars and video calls, and Star Trek, with their tricorders and communicators. Looking back at these shows, there is a common theme here. Sometime in the future, we could have technology that connects people over thousands – or even millions – of miles. Pretty cool right?
This was all back in… well… a while ago. We are now in 2013, and this is “sometime in the future”. We have mobile phones and tablets and smart watches. We can connect with people who are anywhere in the world, from anywhere in the world. We connect in real time through phone calls, Skype, Facebook, Twitter and too many other services to list here. We also connect to information about people and businesses at any time through websites and apps on our phones and tablets.
So, why are there still businesses out there who ignore mobile?
Perhaps “ignore” is not the right word, but there are a number of business websites out there that have clearly not given that much thought about their mobile experience. Why? I have no idea. However, speaking as a user experience developer, these businesses need to join the rest of us in this decade. In an age where nearly a quarter of web traffic is mobile, we need to start living in reality. Mobile web is not a fad. This statistic is only going to increase and businesses need to be ready for this.
Mobile users expect expect the same level of content and functionality as their desktop user counterparts. At the same time, the mobile experience is inherently different from the desktop experience. As a result, this mobile experience needs to be planned and distinct. Why, you ask? Here are 2 big reasons.
Mobile devices are smaller.
No kidding, right? But consider this. We, as UX professionals, have always carefully designed desktop sites to make sure all of the important parts are “above the fold”. The fold is more ambiguous now with all of the mobile devices on the market, but the philosophy is still the same. The most important content for a mobile user needs to be at the top of a mobile site – and what is important to a mobile user may very well be different than what is important to a desktop user.
Mobile devices have limited bandwidth.
For our desktop websites, we can pretty much assume that users have modern computers that are connected via some sort of high speed connection. These users can download a lot of data in a really short amount of time. Fantastic for them, but this, unfortunately, has made many web developers lazy in terms of optimizing the file sizes of our UX elements. While our desktop users will probably never really notice this, our mobile users certainly will.
Think about it. You want to go to a website on your 4G phone with your 2GB data plan (because, face it, unlimited data plans are a thing of the past for most of us), and the website is taking forever to load because it was not optimized for mobile and is now downloading a couple MBs of images and code. I do not know about you, but I am not a patient soul. I will move on and go visit someone else’s website. If this were a business, they most likely just lost my sale.
So, what do mobile users expect?
The philosophy a couple of years ago was to deliver a simple, pared down version of a site’s desktop experience to mobile users. However, with mobile traffic on the rise – remember, it is almost at 25% now… and growing – mobile users are expecting more from their phones and tablets.
We have already established that mobile users want to do and see everything that is available to their desktop user counterparts, but this functionality needs to be optimized for mobile devices. Whether this happens via a responsive website or a separate mobile website is a debate for another article, but this optimization needs to exist. Let me repeat that. A mobile experience needs to be comprehensive and optimized. In today’s world, this is a requirement.
So, what does optimized mean?
Mobile sites need to be easily navigable.
As I mentioned above, content needs to be organized based on level of importance to a mobile user. However, attention also has to be paid to the site’s navigation. What are the most important sections of the site? What links are clicked on most often by mobile users. (Hint: Look at your site analytics!) I will not go into detail on navigation in this post, but consider this. A mobile site has limited real estate for navigation and, potentially, a large amount of content to organize and link to. Also, as a bonus, users cannot hover on a link on a mobile device, like they can on a desktop site to view a drop-down menu. (For more information, there is a comprehensive article on complex navigation patterns for responsive design.)
Files for mobile sites need to be smaller.
Minify the CSS and JavaScript files. Optimize the HTML. And please, oh please, do not load giant full sized images. While you may have a beautiful, hi-res version of a feature photo, mobile users do not care. Shrink the image down and load a mobile-friendly image via a CSS media query.
Input fields are not created equal.
One of the best ways to optimize forms on a mobile device is to correctly define your input types based on the data you are expecting. There are quite a number of input types that display optimized keyboards for that type. An input for a credit card field should bring up a number keyboard. An input for an e-mail address should bring up the e-mail keyboard. There is a great reference online that lists out all mobile input types.
Final thoughts.
Mobile development done correctly takes a lot of time and effort, but if you as a company want to reach those users and make them happy, it is worth it. Do not leave your mobile development to the last minute. Plan out your mobile strategy alongside your desktop strategy. Design the mobile and desktop sites simultaneously, or arguably better yet, design your mobile site first. But do not ignore your mobile site. Please and thank you.