Mobile devices have become the dominant way users access websites. Many large companies still have websites that are not optimized for mobile. According to a website validator, popular sites like Target, Verizon, Amazon, and Best Buy scored very low in mobile friendliness. Even cutting-edge websites scored low. To have a mobile-friendly site, businesses should use responsive design, evaluate their content management system, and use the W3C validator regularly to identify and address issues. Following these guidelines will help small businesses have mobile sites that outperform some large companies.
2. THE GAME HAS CHANGED
Mobile devices have evolved to be the most significant channel for user interaction on the web.
!
The game has changed. More people than ever are accessing websites through their mobile phones than through any other device.
!
To put things in perspective, Statista (http://www.statista.com/chart/1886/facebook-and-twitter-usage-by-platform/) released the following chart disclosing
how folks are accessing Facebook and Twitter. It shows that 85% of American Twitter users are accessing the site on mobile devices. The future is already
here for Twitter, as it is officially becoming a mobile-only company.
3. NOW
ARE
SMALLER
SCREENS
Websites have been a hoarding place for business and brands in the past. “Less is more” is an ideal approach to take when designing a website for all
devices. The user experience needs to be focused on, instead of seeing how much information you can cram into your site. After all, those screens are
smaller.
!
Transition should also include more of a touch-and-swipe mentality rather than point and click. Along with this, the content presented needs to be
digestible to the customer.
!
Because mobile websites have high bounce rates, don’t put a lot of energy into destination pages that don’t have high priority. Search and contact links
are high priority.
4. http://validator.w3.org/mobile/
One way to help figure out if your website is optimized for mobile devices is to visit this website and use the validator tool offered. The validator will
check to see how a website will respond to a mobile device and offer information to fix any issues.
5. ADAP
TIVE
& RES
PONS
IVE.
Design
Another way to optimize for mobile devices is to implement adaptive or responsive design.
Adaptive design us used by big companies that have the backing to invest to reach extremely large audiences. Adaptive design identifies the device and
then generates a page to match the capabilities of the device.
Responsive design is a cost-effective solution that uses Cascading Style Sheets (CSS) to make one version of a website that automatically adjusts to fit the
screen of any device that accesses the webpage, minus the really old mobile devices.
Now, using the WC3 validator website mentioned earlier, I did some research to see how some big companies scored for their mobile friendliness.
6. WWW.TARGET.COM
0%
MOBILE FRIENDLY
Let’s take www.target.com. I was expecting to see high scores from this heavy hitter.
!
And the validator gave me this number. I did it again to make sure I didn’t make a mistake. How could this be? So I did a few more…
7. !
WWW.VERIZON.COM = 7%
WWW.AMAZON.COM = 0%
WWW.BESTBUY.COM = 1%
At this point I was a bit confused. I mean, I know that these companies have apps that you can download, but who wants to take up storage on your
phone with these applications when you really want to save them for the games you need like Angry Birds and Words with Friends?
Anyway, I pulled these sites up on my iPhone 6 Plus. They didn’t look that bad, in their defense. They weren’t that hard to use, and I wasn’t confused, so I
am really curious now why they were scoring so low.
8. WAIT!!!!
61%
WAIT! Remember how Twitter has essentially become a mobile-only company?
They scored a 61%. I have not yet found a website that even remotely close to that for being mobile friendly on the WC3 validator.
Facebook scored better than most, at 38%. Instagram ended up with 0%, LinkedIn 0%, and just for fun I checked Google, who ended up with 25% mobile
friendly.
9. WWW.ONEDESIGNCOMPANY.COM
As I said before, in defense of the low scores, a lot of these websites still looked good and worked well when I pulled them up on my mobile device. Take
for example, www.onedesigncompany.com. Their desktop website is so cool. Very interactive. Grab the side of the window and drag it in. Nice.
Responsive. I expected nothing less. I pulled it up on my mobile. Beautiful.
Now the true test. The WC3 validator. Drum roll please!!….
!
Insert deflation here. 0%. I feel like this is a bit like a sword and the stone scenario. Where are all of these sites failing? Turns out the critical failures are
in size and external resource links.
Let me explain further.
10. CRITICAL:
total size of the page exceeds
ONE DESIGN COMPANY :
total page size equals
20KB
701.1KB
I will touch on only the critical flags picked up by the validator here for One Design Company.
The total size of the one design web page analyzed by the WC3 validator exceeded 20 kilobytes. In fact, the total page size equaled 701.1 kilobytes.
11. 681.1KB TOO BIG!??
3,405%
TOO BIG.
381.1 kilobytes too big? This seems nutty. But according to WC3 this is the case. That means that the web page of this cutting edge creative agency is
3,405 kilobytes too big for a mobile device to properly handle it. Honestly? I am still a bit confused why this is happening.
The other critical issue flagged by the validator was that there were more than 20 embedded external resources. External resources consist of images and
style sheets. This means that loading this page would require the mobile browser to make more than 20 separate HTTP requests. This can delay the time
in which the information is shown to the user.
12. WHAT DO I
MAKE OF ALL
THIS?
So what can you as a small business owner do to have the most mobile friendly site possible?
13. FORTHE BEST POSSIBLE PLAN:
3
THINGS.
I suggest three things for a small business. If you adhere as much as possible to these three guidelines, you will be ahead of the mobile friendly game.
14. 1.
RESPONSIVE
DESIGN
The first thing is to implement a responsive web design.
For small businesses, this is a priority, no matter what you do. Using WC3 guidelines to make sure you are on the right track, anyone can maintain a
website that can be easily accessed on mobile and tablet devices.
15. 2.
FRIENDLY
CMS
Second, analyze your CMS. What are the capabilities and how is it working for you? You may want to be looking at your CMS at the same time you are
looking at responsive design, because some content management systems do not support it.
16. 3.
YOUR BUDDY
IS W3C
Third, build a page, and use the validator to make sure you are on the right track. Fix any critical issues before you move on, and visit the W3C standards
website often.
http://www.w3.org/standards/
17. AND THAT’S IT!
Obviously there is a lot involved in this, and things are rapidly changing. But there is no reason why everyone can’t have a mobile friendly and accessible
website without being one of the big guys. And frankly, from what I researched, following these guidelines presented would actually put anyone ahead of
the companies we would all expect to be on top of this revolution in website design.
