Transcription
Mobile Web Design
This webinar is presented by W3C to the Web community as part of an EUIST project (3GWeb). The content of this webinar does not necessarilyrepresent the official position of the W3C, or the position of any ofthe W3C members or W3C’s host institutions.(Lawyer says ‘Hi’!)2 MMVI Cameron Moll. This document is available under the W3C Document License.
You are.Experienced with XHTML/CSS.Familiar with good markup techniques.Unsure about this “mobile web thing”.3 MMVI Cameron Moll. This document is available under the W3C Document License.
Legacy
19105 MMVI Cameron Moll. This document is available under the W3C Document License.
“Pocket watches provide the closesthistorical parallel to the remarkablerise of the mobile phone.”—Jon Agar, Constant Touch6 MMVI Cameron Moll. This document is available under the W3C Document License.
Staggering Numbers71996GSM phones in 103 countries200010 million i-mode users (Japan)20021 billion mobile phone users worldwide20093 billion mobile phone users worldwide MMVI Cameron Moll. This document is available under the W3C Document License.
UK8More mobile phones than humans. MMVI Cameron Moll. This document is available under the W3C Document License.
Quandary
Reader PollHighly scientific, statistically significant(not really!)10 MMVI Cameron Moll. This document is available under the W3C Document License.
40015911ParticipantsUnique handsets(Motorola RAZR, Palm Treo 650, Sony Ericsson K750i / K700i / T610, Nokia 6230.)19Manufacturers44Countries MMVI Cameron Moll. This document is available under the W3C Document License.
“Designers face a proliferation ofcapabilities that make the early[Mobile] Web look like a playground.”—Joe Shepter, “The Pulse of Modern Design”12 MMVI Cameron Moll. This document is available under the W3C Document License.
Mobile Web “Playground”WML, XHTML, -MP, -Basic.Plethora of user agentsVarying coding practices, URIs, etc.13 MMVI Cameron Moll. This document is available under the W3C Document License.
What is the Mobile Web?14 MMVI Cameron Moll. This document is available under the W3C Document License.
?
OptimismMore mobiles than PCs.More mobiles than landline phones.Web usage is continually increasing.You can utilize existing skills.16 MMVI Cameron Moll. This document is available under the W3C Document License.
Context
18 MMVI Cameron Moll. This document is available under the W3C Document License.
Noooo!19 MMVI Cameron Moll. This document is available under the W3C Document License.
Instead.20What is contextually relevant? MMVI Cameron Moll. This document is available under the W3C Document License.
21 MMVI Cameron Moll. This document is available under the W3C Document License.
Mobile Mobility22 MMVI Cameron Moll. This document is available under the W3C Document License.
Design Communication23 MMVI Cameron Moll. This document is available under the W3C Document License.
Therefore, mobile design is the art ofcommunicating within anenvironment of mobility.24 MMVI Cameron Moll. This document is available under the W3C Document License.
Fundamentals
Most devices sold today are WAP 2.0.26 MMVI Cameron Moll. This document is available under the W3C Document License.
XHTML, not WML.27 MMVI Cameron Moll. This document is available under the W3C Document License.
What that means.28 MMVI Cameron Moll. This document is available under the W3C Document License.
english360.com
english360.com
english360.com/mobile (powered by MovableType)
However,32 MMVI Cameron Moll. This document is available under the W3C Document License.
XHTML/CSS support is inconsistent.** highly33 MMVI Cameron Moll. This document is available under the W3C Document License.
Markup Test Pagescameronmoll.com/mobile34 MMVI Cameron Moll. This document is available under the W3C Document License.
35 MMVI Cameron Moll. This document is available under the W3C Document License.
36 MMVI Cameron Moll. This document is available under the W3C Document License.
37 MMVI Cameron Moll. This document is available under the W3C Document License.
38 MMVI Cameron Moll. This document is available under the W3C Document License.
39 MMVI Cameron Moll. This document is available under the W3C Document License.
Test on target devices, not emulators.40 MMVI Cameron Moll. This document is available under the W3C Document License.
Methodology
MethodDo nothing.42 MMVI Cameron Moll. This document is available under the W3C Document License.
31 kb(markup only)
MethodDo nothing.Strip images and styling.44 MMVI Cameron Moll. This document is available under the W3C Document License.
MethodDo nothing.Strip images and styling.Handheld stylesheets.45 MMVI Cameron Moll. This document is available under the W3C Document License.
MethodDo nothing.Strip images and styling.Handheld stylesheets.Mobile-specific site/app.46 MMVI Cameron Moll. This document is available under the W3C Document License.
47 MMVI Cameron Moll. This document is available under the W3C Document License.
Miniaturize or Mobilize?48 MMVI Cameron Moll. This document is available under the W3C Document License.
MiniaturizeRepurpose existing content49 MMVI Cameron Moll. This document is available under the W3C Document License.
craigslist.org
craigslist screen grab51 MMVI Cameron Moll. This document is available under the W3C Document License.
Primary Use CasesChoose area (city)Browse categoryPost a listingSearchEvent CalendarForums52 MMVI Cameron Moll. This document is available under the W3C Document License.
Use Case Hiearchy531. SearchTop element2. CategoriesMost frequented3. Event calendarAccess to today, tomorrow4. Choose areaBy zip code or city nameAssume San Francisco by default MMVI Cameron Moll. This document is available under the W3C Document License.
SearchText or numericCategoriesMost frequentedCityZip or name; would offersuggestions if not found
Opera Mini
MobilizeContent-, Context-, Component-specific57 MMVI Cameron Moll. This document is available under the W3C Document License.
58 MMVI Cameron Moll. This document is available under the W3C Document License.
LBS59 MMVI Cameron Moll. This document is available under the W3C Document License.
Forces
61SMSTexting; SMS searchJ2MEJava-based apps, interactivityAJAXJavascript, XMLSVGSVG Tiny; scalable vector graphicsLBSLocation-based services; GPS MMVI Cameron Moll. This document is available under the W3C Document License.
“ The mobile device has the potential toact as a significant reporter of datarather than a mere consumer of data.”—Joe Shepter, “The Pulse of Modern Design”62 MMVI Cameron Moll. This document is available under the W3C Document License.
63 MMVI Cameron Moll. This document is available under the W3C Document License.
Device Detection“Sniff out” user agent strings for individual devices64 MMVI Cameron Moll. This document is available under the W3C Document License.
User AgentsProprietary vs. Cross-platform?Beyond mobile phones?65 MMVI Cameron Moll. This document is available under the W3C Document License.
http://www.tinyurl.com/l2lst66 MMVI Cameron Moll. This document is available under the W3C Document License.
Best Practices.and even “standards”?67 MMVI Cameron Moll. This document is available under the W3C Document License.
Mobile Web InitiativeW3C charteredInput by mobile developers, companiesBest Practices68 MMVI Cameron Moll. This document is available under the W3C Document License.
Sample GuidelinesUse valid markup.Use tables only if supported by target device.Use text equivalents for non-text elements.http://www.w3.org/TR/mobile-bp/69 MMVI Cameron Moll. This document is available under the W3C Document License.
Also.mobileOK.remember these?http://tinyurl.com/gzdrbBest Practices Checkerhttp://tinyurl.com/jsrkn70 MMVI Cameron Moll. This document is available under the W3C Document License.
Ideology
A mobile web that isdesirable, dependable, disciplined.72 MMVI Cameron Moll. This document is available under the W3C Document License.
An array of thought leaders.73 MMVI Cameron Moll. This document is available under the W3C Document License.
User agent consistency.74 MMVI Cameron Moll. This document is available under the W3C Document License.
Mobile device wiki.75 MMVI Cameron Moll. This document is available under the W3C Document License.
.and?76 MMVI Cameron Moll. This document is available under the W3C Document License.
Questions?
cameronmoll.comemail@cameronmoll.com801.644.8793
M M V I C am ero n M o ll. T his d o cum ent is availab le und er the W 3 C D o cum ent License. 1 9 1 0 5
