Upload
james-byun
View
333
Download
0
Tags:
Embed Size (px)
DESCRIPTION
A Lunch and Learn talk on what not to do when designing for the mobile web. Credits: Dave Shea, wtfmobileweb.com, mobilewebbestpractices.com
Citation preview
Anti-Patterns for the Mobile Web
OpenRoad Lunch & Learn // James Byun // September 18, 2013
Anti-pattern?A repeated pattern of action, process or structure that initially appears to be beneficial, but ultimately produces more bad consequences than beneficial results. Wikipedia, Anti-pattern.
wtfmobileweb.commobilewebbestpractices.com
#1: No Mobile Site
Responsive and mobile are not yet considered defaults
The current site build may not be suited for having a mobile version.
Device Testing
Why You Should Build Mobile
- Better user engagement- Sites that feel built for their device
encourage users to use them.- People use mobile differently now
#2: Doorslams
#3: m.yoursite.com
- Search Engine Optimization- Redirect Delays- Sharing
W3C’s One Web PhilosophyOne web, one URL, any device.
#4: Add to Home
- Don’t assume user’s browser- Chrome: - no bottom toolbar- Mail, Social Med. Clients: - all different- Don’t assume user’s environment.
#5: Bad Touch Affordances
Fitts Law
Fitts LawAcquiring a target is faster as a target is larger. More errors occur as targets become smaller.
PrioritiesMake it easy for your user to achieve the page goal you have set for that page. Prioritize everything else after.
#6: Default HiDPI Images
To consider- Does it need to be hi resolution?- Will it make a big difference if it’s not?- Can it be vectorized?
#7: Ignoring the Fold
Consider:If you have user interaction that potentially leads to $, make it visible on load.
Narrow your page’s purpose down to one primary action, make it visible.
#8: Mystery Meat
“If I don’t understand why it happened, I probably can’t repeat it.”
Show visual cues for all actions and use text labels with icons where possible.
Thanks!