Mobile and tablet accessibility is vital to the survival of websites. Not only is it ‘with the times’ but it is also the way to keep the site accessible to as many people as possible.
The statistics are undeniable.
In 2012 the global mobile data traffic increased by 70% and that made it nearly 12 times the size of the entire global internet in the year 2000. Mobile network connection speeds more than doubled and the average smartphone usage grew 81%. The number of tablets increase 2.5 times up to 36 million, each one generating more than two times the traffic of the average smartphone. There were 161 million laptops on the mobile network just last year, and each laptop created 7 times more traffic than the average smartphone. Basic handsets still make up 82% of handsets on the network.
Global mobile data traffic is predicted to increase 13-fold by 2017, with the number of mobile connected devices exceeding the number of people in the world just by the end of this year. Currently, devices other than smartphones (such as, regular hand-held phones, laptops, and tablets) have the largest share of all mobile devices and connections. However, starting in 2015 the number of overall non-smartphones in use will start declining. “By 2017, there will be 8.6 billion handheld or personal mobile-ready devices and 1.7 billion machine-to-machine connections.”
Mobile data growth has had a very noticeable effect on web design.
In order to make the most out of the small screen available on phones and provide an enjoyable customer experience companies must change the layout of their site for mobile devices. Everything needs to be “touch-friendly”. Vertical menu navigation is easier on a smartphone than horizontal navigation is. Bigger buttons for links, not a bunch of smaller hypertext links. Fewer graphics are needed to make an impact. If someone is coming on your site through a mobile device they likely want quick and easy information, not a bunch of images. However, the images that you do include need to be smaller than for a regular site. Prioritization is key. Take the most important menu options, links, and information to use for the mobile site.
These are a few examples of what we should model and what we should make sure to avoid.
We do not want an advertisement to pop up as soon as the customer clicks on our mobile site. If they wanted our app or more advertisements they wouldn’t be on the mobile site. They’d be in the app store or on a desktop. Also, if someone is on a mobile site and wants to find the nearest location of that company they are likely somewhere they aren’t usually at. Meaning they may not know the zip code. Having the site set up to locate the user through GPS on the phone and automatically enter the nearest zip code is more appealing. Small links in hard to discern colors are a no-no as well.
Where to start, where to start. Redundancy is not required, nor desired. On top of that, this mobile site’s links are small hypertext links that will not be easy to use on any mobile device. To emphasize the importance of resizing objects the picture on the right is the Jeep mobile site. Their “Name my ride” advertisement is useless when the customer can’t see the whole slogan. Jeep’s template is a very basic one, perhaps too basic considering it really doesn’t do the brand justice.
Vertical navigation is touch-friendly and also allows for sliding buttons. Minimize the need for data-input. More than likely a mobile user is wanting faster information than a contact form would allow (a phone number, perhaps?) so a simple form is better, if one is truly needed at all.
Rather than having links to other sites it is useful (and more efficient to the user) if the mobile site has images and videos imbedded. Booking.com has the right idea: use the phone’s coordinates to suggest a current location and make data-input as easy as possible (with things such as the calendar widget). A very important thing I must reiterate: big, touch-friendly buttons for links.
First thing to do would be to make sure to keep the logo and slogan. They make the company easy to identify. Next, prioritize. Decide what information to include on the mobile site. The menu page does need to be completely reorganized to be touch- and user-friendly. The venue page should be set up to where the picture of the venue is the link to the venue’s website. All the other information about the venues can be removed unless the venue has no site to provide basic information. As long as we prioritize and simplify, we can create a top-notch, user-friendly, mobile site that will expand our customer potential.
Mobile Presentation FWD
Let’s Get Moving! Why Collins Catering should go mobile S
Mobile/Tablet Growth S Global mobile data S 2012’s mobile data traffic was nearly 12 times traffic grew 70% in the size of the entire 2012 global internet in 2000. S In 2012, the number of S Mobile network mobile-connected tablets increased 2.5-fold to 36 connection speeds million, and each tablet more than doubled generated 2.4 times more traffic than the average smartphone. in 2012.Cisco Visual Networking Index. (2013, February 6). Cisco Visual Networking Index: Global Mobile Data Traffic ForecastUpdate, 2012–2017. Retrieved March 1, 2013, from:http://www.cisco.com/en/US/solutions/collateral/ns341/ns525/ns537/ns705/ns827/white_paper_c11-520862.html
Predictions Cisco Forecasts 11.2 Exabytes per Month of Mobile Data Traffic by 2017 S Global mobile data traffic will increase 13- fold between 2012 and 2017. S The number of mobile- connected devices will exceed the worlds population in 2013.Cisco Visual Networking Index. (2013, February 6). Cisco Visual Networking Index: Global Mobile Data Traffic ForecastUpdate, 2012–2017. Retrieved March 1, 2013, from:http://www.cisco.com/en/US/solutions/collateral/ns341/ns525/ns537/ns705/ns827/white_paper_c11-520862.html
The ImpactHow M/T usage has changed web design S
http://www.uxmatters.com/mt/ archives/2011/03/images/10w aysmobilesiteIsDifferentfromF ullWebSite_figure1.jpg http://www.uxmatters.com /mt/archives/2011/03/ima ges/10waysmobilesitesDif Simple is fer_figure7_reduced.jpg Better • Vertical navigation over horizontal navigation • Content prioritization Dell • Less hypertext • Less graphics Orbitz • Fewer footer links • Smaller imageshttp://www.uxmatters.com/mt/archives/2011/03/images/10waysmobi UX matters. (2011, March 21). 10 Ways MobilelesitesDiffer_fi Sites Are Different from Desktop Web Sites.gure1- Retrieved March 1, 2013, from:b_reduced.jpg http://www.uxmatters.com/mt/archives/2011/03/10 -ways-mobile-sites-are-different-from-desktop- web-sites.php
Do’s and Do Not’s What to aim for and what to avoid S
AVOID thisiMedia Connection. (2012, March 19). The 5 worst mobile websites by Eric Anderson Retrieved March 2, 2013 from:http://www.imediaconnection.com/article_full.aspx?id=31232
… AND this, tooiMedia Connection. (2012, March 19). The 5 worst mobile websites by Eric Anderson. Retrieved March 2, 2013 from:http://www.imediaconnection.com/article_full.aspx?id=31232
Try these instead:Mobile Awesomeness. Retrieved March 2, 2013, from: http://www.mobileawesomeness.com
And this:Mobile Awesomeness. Retrieved March 2, 2013, from: http://www.mobileawesomeness.com
Collins Catering MobileS What the company should do
Let’s GetStarted!• Make touch friendly• Simplify Menu page• Make Venue photos, not the venue titles, the links to the venue website