3. Mobile Devices/Tables Are Responsible
For Nearly 7% Of All Web Traffic
Only 7%? Let’s see what that translates to…
2,267,233,742 Internet Users
x 7%
158,706,391
Users Accessing The Web Through Mobile
Device/Tablet
5. What Does This Mean For Web Design?
Content is prioritized and categorized for
easy navigation
Less clicks/taps/swipes
Single column sites shine – multiple column
sites don’t translate well
No longer a definite ‘fold’
6. What Are Some Technologies That Can
Be Used?
Content Management Systems
HTML5
But…just say NO! to Flash!
11. Next Steps To A Mobile Device/Tablet-
Friendly Site
Understand your customers and what they want
Define your priorities
Evaluate current design and what needs to be done
Remember to breathe…
Develop a plan of action
Investigate current technology to make site successful
Test, test, re-test and then test some more!
Is your website mobile device or tablet-friendly? Take a moment, look at your smartphone or tablet and pull up your site. Does it look the same as it would on your desktop? Do you have to stretch, zoom or tap to see the content you’re looking for? If so, your site is not mobile ready. Today, that may be okay…but tomorrow, you may miss out on potential customers.
Let’s take a vote. Do you have use your smartphone or tablet to look something up on the Internet? Maybe directions, a telephone number, purchase theater tickets? If so, then I think we just answered the question as to why websites need to be device / tablet compatible. Because people use them.
In a study done in 2011, it is shown that nearly 7% of all web traffic is from a mobile device/tablet. That may not seem like a lot. But let’s look at how many Internet users there are in the world Over 2 billion people…7% of 2 billion is A LOT. That’s a lot of potential customers, strategic alliances, etc. who want the sites to be easy to use.
Mobile device/tablet usage is not even close to its’ pinnacle yet. It’s grown. A study estimates that by 2015, mobile internet users will eclipse desktop usage. Think about that. If your site isn’t mobile compatible or easy to use and most Internet users are using a device, what will you miss out on?
So we’ve talked about how important a mobile-ready site is, but what does this mean for web design? It means content needs to be evaluated and prioritized. Check out your analytics, why are people coming to your site. What are people doing when they get there? Prioritize your most popular content to be showcased on your page. If you have a navigation bar across the top, change the layout to be vertical instead. If “Contact Us” is something important to you and your customers, this should not be hidden within several clicks of your site, it needs to be on the front page. If you have multiple columns on the site…this needs to be reconsidered. An iphone is only about 2 inches wide, those will be very tiny columns if you don’t make a style change. On typical sites, you want your important information ‘above the fold’, but since devices comes in a variety of shapes and sizes, there is no longer a definite fold to design for.
So what are some technologies that can be used to help change your site to being mobile ready? If you’re not already using a Content Management System, which allows you to easily update the site as needed, investing in one may be beneficial. There are free CMS’ out there, like Wordpress and Drupal, that have mobile-friendly themes and technology built in. If funds allow, you can also have a CMS built for you. HTML5 also allows a great deal of flexibility in regards to developing sites for mobile apps. Finally, something to keep in mind is that Flash is not friendly in a device environment, so no matter how you change your site, if it uses flash, it will not work on a device (as it does on a desktop browser).
Are you convinced yet, that a mobile/tablet friendly site is the way to go? Let’s look at a few examples.
Here are two examples of sites being viewed from an iPhone. On the Apple site, you’ll notice there is a top navigation bar that is hard to read. While the images are large, it’s tough to read the text and requires effort to maximize/zoom to see what is written. Similarly, the Microsoft site has tons of text, which is extremely difficult to read from a device. Neither site detected they were being accessed from a mobile device (something HTML5 allows) and showed a different page, more customized to the browser.
Here are two sites that get it. CNN.com puts everything into a single column view, showing latest news at the top with also a dropdown allowing the user to select where they want to go. Same with the Amazon site. Instead of having menus across the top and text through the page, there is a single column showing what you can do. It’s simple, very little effort is required to find what you need.
Hopefully by now you’re convinced, so let’s take a look at the next steps.
Again, check out your analytics. Find out what your customers are doing on your site, so you can define the priorities. Next, you’ll evaluate your current site design and decide what needs to be done. This all sounds a little overwhelming and like a major task, don’t forget to breathe! Now that you know the who and the what, develop a plan of action and investigate current technology you will need to make this site successful. Once the site is up and ready, test it…test it again…and test some more. Test on multiple environments and make sure there is a single, cohesive user experience.
Again, check out your analytics. Find out what your customers are doing on your site, so you can define the priorities. Next, you’ll evaluate your current site design and decide what needs to be done. This all sounds a little overwhelming and like a major task, don’t forget to breathe! Now that you know the who and the what, develop a plan of action and investigate current technology you will need to make this site successful. Once the site is up and ready, test it…test it again…and test some more. Test on multiple environments and make sure there is a single, cohesive user experience.
