Mobile site Architecture : designing and re-purposing for mobile web with SEO, frameworks, and...
description
Transcript of Mobile site Architecture : designing and re-purposing for mobile web with SEO, frameworks, and...
MOBILE SITE
ARCHITECTURE.
DESIGNING & RE-PURPOSING FOR THE MOBILE WEB WITH SEO, FRAMEWORKS, & USABILITY IN MIND
BEN DAVEY. MOBILENATION
MOBILE INTERNET IS EXPLODING
• 72.5M people in the US have a smartphone • 48% of customers use mobiles in-store for product research • People are turning back to the browser to get information – mobile
browsing exceeds use of downloaded apps
A MOBILE PRESENCE IS A MUST-HAVE FOR ALL BUSINESS
Consumers now see mobile internet more indispensible than
making calls
Source: Prosper Mobile Insights, 2011
21.6% 16.7%
15.7% 7.8%
6.9% 5.9%
4.9% 2.0% 2.0%
1.0%
TexCng Internet
Email Call GPS
Facebook Apps News
Bluetooth Calendar
The mobile web experience
• Not just a 320px window to the desktop internet
• Access to new hardware – GPS – Telephony – Touch gestures – Soon: Camera
• New ways to access and link content
You can rely on your mobile users having a more up-to-date browser than your desktop users!
87.3% of all smartphones run a webkit derived browser capable of displaying HTML5 content (iOS+android+RIM)
Search on mobile
• Discovery of mobile content isn’t just through search engines – Social networking – Social check-‐ins
• Google has an IniCal focus on locaCon relevance & local lisCngs
External SEO
• Add to google business lisCngs • Social media & Crowd-‐sourced • Foursquare, where.com
• Think about the posiConing of physical aZenCon geZers that enable linking of physical media -‐ 2D barcodes, Shazam audio recogniCon, digimarc
Technical optimisations
• URL rewriCng opCmisaCons sCll help
• Microdata (www.schema.org) • ThemaCc consistency
hZp://m.mysite.com/posts/123
hZp://m.mysite.com/post?id=123
Thematic consistency
Ensure that content provided by accessing a URI yields a themaCcally coherent experience when accessed from different devices
“ ” -‐ W3C mobile web best pracCses
Thematic consistency • Something of a pipe dream for most
• Tends to favour the lowest common denominator • Adopt consistent redirecCon policies instead – redirect to a higher level page in the same category
≠
Mobile usage habits tend to vary significantly to Sedentary usage habits – users want important information with minimal navigation Keep your mobile front simple and ensure a consistent UI
Know your content
Touch-based Native apps began the mobile revolution
The App ExplosionBack
MoreTab 4 Tab 3Tab 2Tab 1
Why?
Mobile HTML5 – allowing app-like experiences online
• FORMULATED WITH TOUCH DEVICES IN-MIND
• WORKS ACROSS MULTIPLE PLATFORMS & DEVICES
• SUPPORTS TOUCH GESTURES, HARDWARE-ACCELERATED GRAPHICS, GPS,MORE
• EASIER TO TIE-INTO EXISTING WEB EXPERIENCES
• PARTS OF THE EXPERIENCE CAN BE CACHED TO WORK OFFLINE – GREAT FOR MOBILE NETWORKS
FRAMEWORKS
JO (JoApp.com)
jQMobile
jQuery Mobile
AbstracCons providing animated transiCons, & widgets such as toolbars, tab views, table views, buZons etc. Typically designed to mimic naCve app behavior
MOBILENATION
Build and deploy mobile content in minutes – no developers or IT needed
Develop apps in hours
Deploy far beyond
convenConal app-‐stores
Leverage exisCng content &
infrastructure
Update in minutes
MobileNation [email protected] @MOBILENATIONHQ PH. 0414 476 248 (AUS), 650 283 4237 USA