Muddling Through the Mobile Web
Upcoming SlideShare
Loading in...5
×
 

Muddling Through the Mobile Web

on

  • 26,772 views

Presentation by Bryan Rieger of Yiibu for Mobilism 2011 conference - http://mobilism.nl @mobilismconf in Amsterdam on 13/05/2011.

Presentation by Bryan Rieger of Yiibu for Mobilism 2011 conference - http://mobilism.nl @mobilismconf in Amsterdam on 13/05/2011.

Statistics

Views

Total Views
26,772
Views on SlideShare
22,737
Embed Views
4,035

Actions

Likes
112
Downloads
907
Comments
6

36 Embeds 4,035

http://toolbox-4-websites.com 2555
http://www.blackphoebe.com 659
http://flytip.com 251
http://blog.i2fly.com 145
http://leni.blog.hu 79
http://paper.li 71
http://moodle.i3s.unice.fr 62
http://thinkux.posterous.com 31
http://lanyrd.com 29
http://e-merge.posterous.com 29
https://twitter.com 21
http://www.flytip.com 20
http://twitter.com 19
http://www.linkedin.com 10
http://richardting.tumblr.com 7
url_unknown 6
http://a0.twimg.com 6
http://ryanmoede.posterous.com 6
http://www.techgig.com 4
http://www.shovan.co.uk 4
http://blackphoebe.com 3
http://bytes.fallonhotdish.com 3
http://webcache.googleusercontent.com 2
http://131.253.14.98 1
https://abs.twimg.com 1
http://us-w1.rockmelt.com 1
http://bottlenose.com 1
http://zootool.com 1
http://pinterest.com 1
http://posterous.com 1
http://www.slideshare.net 1
http://translate.googleusercontent.com 1
http://lorrainestrialrun.blogspot.com 1
https://si0.twimg.com 1
http://flavors.me 1
http://166.77.186.16:15871 1
More...

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

CC Attribution License

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
  • Just love everything yiibu does
    Are you sure you want to
    Your message goes here
    Processing…
  • Very nicely Done. Great presentation!
    Are you sure you want to
    Your message goes here
    Processing…
  • I really like the friendly, little kick to Ahonen in slide 88...
    Are you sure you want to
    Your message goes here
    Processing…
  • @jamespearce I'd definitely be interested in creating an open, interchangeable 'slideware' format (Eric Meyer's S5 is a nice starting point). OPML and RSS might also be worth taking a little inspiration from, though using a JSON file format instead of XML.
    Are you sure you want to
    Your message goes here
    Processing…
  • Good stuff.

    Thanks for the tinySrc shout out (it's now src.sencha.io as per http://www.sencha.com/blog/previewing-sencha-io/)

    Definitely interested in thinking about how to make one of our most common asset types - that is, apparently, slideware! - live your dream :-)
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Muddling Through the Mobile Web Muddling Through the Mobile Web Presentation Transcript

  • Muddling Through the Mobile Web designing for rapid change and increasing diversityhttp://creativecommons.org/licenses/by/2.0 http://www.flickr.com/photos/booleansplit/2806792407
  • things are moving pretty quickly these days... http://www.flickr.com/photos/joo0ey/4630950433
  • until very recently ‘best practice’ was to build a separate mobile site... typicallym.domain.com || domain.mobi http://www.forum.nokia.com/Develop/Web/Mobile_web_browsing/Web_templates
  • but lately, old ideas are being revisited...http://www.alistapart.com/articles/understandingprogressiveenhancement
  • ...and new ideas are really shaking things up http://www.alistapart.com/articles/responsive-web-design
  • ...of course the elusive ‘One Web’still beckons madmen & dreamers http://www.flickr.com/photos/3oheme/4069616710
  • ...of which we’repragmatic devotees ;) http://www.flickr.com/photos/aerosolhalos/5134483703
  • You must have a goal in life. BUT http://www.flickr.com/photos/christopherdombres/4493564844
  • rethinking mobile web yiibu try to keep an open mind andregularly challenge our beliefs... http://www.flickr.com/photos/fpat/3692425154
  • this is rhetorical...Are we there yet? http://yiibu.com
  • ...why are kiwi fruit fuzzy? many questions remain unanswered... http://www.flickr.com/photos/wwworks/2427001802
  • @media queries? yes no *.mobi? adapt? yes ? web mobile? yes is ? yes such as...what do you do with one web? yes ? yes yes yes? manyRethinking the Mobile Web no no images like this? no device dB? yes yes desktop no care? yes ? UA sni ng? few umm...? no no yes yes *.mobi? @media queries? adapt? yes no yes U ? yes available here? many web mobile? yes is ? yes one web? yes ? device dB? no no no yes yes desktop no care? yes ? UA sni ng? webno mobile? yes @mediano queries? http://yiibu.com
  • automagically scaling detailed images isnt ideal... no few no @media queries? yes yes no *.mobi? adapt? yes ? yes? yes yes web mobile? yes is ? yes one web? yes ? many Rethinking the Mobile Web few device dB? no no umm...? no no yes no yes yes desktop no care? yes ? UA sni ng? yes *.mobi? @media queries? adapt? desktop web ? few umm...? no no yes yes no *.mobi? *.mobi? no mobile? yes yes yes @media queries? adapt? ? available umm...? @media no yes no yes queries? here? yes yes UA sni ng? ? yes available here? is ? many device dB? one web mobile? yes is ? yes one web? yes ? device dB? web? no manyweb mobile? yes is ? no yes no one web? yes no yes ? device dB? adapt? yes care? few yes many desktop no care? yes ? UA sni ng? no no no unreadable web yes no mobile? yes yes @media ? no yes queries? desktop no care? UA sni ng? http://yiibu.com
  • eries? yes yes no *.mobi? adapt? yes? yes yes is ? yes one web? yes ? many device dB?ile Web no no yes yes care? yes ? UA sni ng? hmm... desktop web yes few no yes no mobile? yes yes *.mobi? *.mobi?eries? adapt? @m umm...? no qu available yes no here? available UA sni ng? yes here? is ? yB? many many device dB? one is ? yes one web? yes ? device dB? web? no adapt? no no f yes yes yes care? yes manyo care? yes ? UA sni ng? http://yiibu.com
  • o adapt? yes? yes yes many device dB? yes yes ...do we simply ? provide alternates? desktop web yes yes no mobile? yes *.mobi? adapt? @media umm...? no available queries? here? UA sni ng? yes available here? many is ? yesB? many device dB? one device dB? web? no adapt? yes few yes yes care? yes many http://yiibu.com
  • o ? @240x2 web mobile? yes adapt? web yes? yes yes no no mobile? yes many device dB? no @media queries? @320x2 desktop no yes yes @960 ...do we simply desktop web ? provide alternates? desktop web yes yes countless no no mobile? yes mobile? yes *.mobi? *.mobi? adapt? @m @1280 available umm...? no @media queries? umm...? no qu here? UA sni ng? UA sni ng? yes availableB? here? many is ? yes @320 one is ? y many device dB? one device dB? device dB? web? web? no no adapt? adapt? few f yes yes care? yes yes care? yes many many @640 @640x2 web desktopapt? no mobile? yes yes? no @mediaes yes queries? manyce dB? @240 *.mobi? yes webes http://yiibu.com no mobile? yes
  • every stylesheet is not required 3 columns, really?@font support varies desktop scripts arent suitable for mobile typically perhaps a bit ambitious? ...what about scripts & stylesheets that arent suitable? ...a bit late, no? device detect early
  • too many HTTP...do we requests...simply provide alternates? ...thats a lot of unsupported JavaScript! media formats... ...is Flash even supported?the right version of ...aye, thar be Floosh! ...does every device get the same Floosh – if they support Floosh? http://yiibu.com
  • ...available bandwidth? ...is orthogonal to... ...screen size? this only deals with codecs - not context*... ...or factors that you just cant detectc.2000... http://www.w3.org/TR/html5/video.html
  • mmm, Spongebob... “ Biggest problem for handheld web video playback still seems to be pulling down a high-bitrate HD file...with extra pixels that never display. – @jdowdell http://www.flickr.com/photos/rexroof/3372607671
  • we being yiibu... obviously delusional ...so weve done a little mild insanity brainstorming... research harmless sketches something else...? prototypes crazy ideas cerebral gymnasticsResearch is what I’m doing when I don’t know what I’m doing.– Wernher von Braun http://www.flickr.com/photos/humblog/4522388767
  • server-sidemedia queries and we have a little filters dirty laundry to share... XSLT http://www.flickr.com/photos/katayun/4288456971
  • ...a selection of contentfiltering + transformation prototypes http://www.flickr.com/photos/digger_twit/1353837770
  • g in n er tioes lt a typ t firm roto en fo p nt nsCo ra t rs ... + Fi lte Plan B .D OM server-side media queries... a http://www.flickr.com/photos/mwichary/2614644341
  • begin with someexisting HTML content...
  • Raw user agent: Mozilla/5.0 (SymbianOS/9.1; U; en-us) AppleWebKit/413 ...Device identified as: Nokia N73Actual Root Device ID: nokia_n73_ver1WURFL ID: nokia_n73_ver1_submozilla50physical_screen_height: 49columns: 21dual_orientation: falsephysical_screen_width: 37 $wurfl->getDevice($id);rows: 6max_image_width: 229resolution_height: 320resolution_width: 240max_image_height: 260 this is what were after!... http://www.tera-wurfl.com/explore/
  • resolution_width: 240 device property $html->find(img[src]);
  • resolution_width: 240 device property <img /> <img /> <img />
  • resolution_width: 240 device property based on... panda.jpg panda@320.jpg panda@240.jpg repeat process for each <img> found in document... replace each image with a more suitable alternate... http://www.flickr.com/photos/davefayram/3773208649
  • IL resolution_width: 240 device property FA panda.jpg panda@320.jpg panda@240.jpg ...how many images are required? ...related elements? ...what about slightly "fuzzier" DOM elements?...other elements? http://www.flickr.com/photos/davefayram/3773208649
  • in n g er tioes lt a typ t firm roto en fo p nt nsCo ra t ..t.eir uses... rsave h + lttey do h Fi he .D OM id rie e s... a -s e er qu rv ia Seed b. m http://www.flickr.com/photos/mwichary/2614644341
  • ...an interesting idea{{mustache}} inspired...
  • *H AC K* FAIL yet revolting ...an interesting idea that quickly got out of control... {{mustache}} inspired... written in slippery slope PHPhacked together in PHP almost reinvent ed... to(should have been C for speed)... XSLT!...apologies to @stephenhay
  • in n g r o te ti ypes #mobilism at fi l a t we support s mtdemo.mobi processing o erver side t rm roto en fo p enhanced witf media-queries t s on an from wurfl... h all featuresC r t ..t.eir uses... rsave h EASE LO! – @harloff + lttey do h PLAY HEL Fi he O M e s...S a .D id rie -s e er qu rv ia . b m Seed LT ? X S is it .R ev c http://www.flickr.com/photos/mwichary/2614644341
  • ...use XSLT – after all it was made to style content!? WTFF? AIL found massive inspirationyup, thats "99 for XSLT here!Bottles of Beer"in XSLT...? ...we honestly tried, but we @$*#& XSLT! http://www.angelfire.com/tx4/cus/shapes/bottles.html
  • in n g r o te ti ypes #mobilism at fi l a t we support s mtdemo.mobi processing o erver side t rm roto en fo p enhanced witf media-queries t s on an from wurfl... h all featuresC r t ..t.eir uses... rsave h EASE LO! – @harloff + lttey do h PLAY HEL Fi he O M e s... S a .D -s eid rie er qu rv ia . b m Seed LT ? S X te... it ed tas isacquir .R ev an c http://www.flickr.com/photos/mwichary/2614644341
  • ...eventually we came to acceptthat we cant get there, from here http://www.flickr.com/photos/awfulshot/180189401
  • but we did learn two things...http://www.flickr.com/photos/meddygarnet/3390890516
  • respon sive design & one web the mobile web is really bloody difficult... http://www.flickr.com/photos/vauvau/3466024918
  • everything we believed about the web today is wrong... http://www.flickr.com/photos/congaman/4059136660
  • in hindsight...the problem becomes obvious... http://www.flickr.com/photos/sketch22/2460898332
  • display size/width in the beginning we had computers... 512 x 342 1984 1990 1994 1998 2004 2007
  • display size/width we came to expect 1440 more and more every year... 1280 1024 512 x 342 1024 x 768 800 640 512 1984 1990 1994 1998 2004 2007
  • display size/width ...one day1440 2007 in less became much more 1280 1024 512 x 342 1024 x 768 800 640 512 320 x 480 240 1984 1990 1994 1998 2004 2007
  • display size/width today we seem1440 have to 1280 lot less more... a 1024 512 x 342 1024 x 768 800 768 x 1024 640 480 x 800 512 320 x 480 240 1984 1990 1994 1998 2004 2007
  • display size/width public displays 3200 with a lot more less on the horizon... 1920 x 1080 1920 1024 x 768 768 x 1024 1440 1280 600 x 1024 480 x 800 360 x 640 1024 320 x 480 800 640 240 1990 1994 1998 2004 2007 2011 2015
  • “ With current growth rates, Web access by people on the move—via laptops and smart mobile devices— is likely to exceed web access from desktop computers within the next five years....or by 2015 - Source: ITU via mobiThinking http://www.flickr.com/photos/tocaboca/5524320942
  • yet were inherently constrained by human factors... http://www.flickr.com/photos/carbonnyc/4213684953
  • which presents us with one problem... nagging http://www.flickr.com/photos/whiskeytango/471826517
  • the hellhow do we make content meaningful in all of these varied contexts? http://www.flickr.com/photos/izzyplante/4009893952
  • ...lets first deal withwhat we mean by context... http://www.flickr.com/photos/sporst/3999795549
  • con•text [kon-tekst] – the set ofcircumstances or facts that surrounda particular event, situation, etc.http://dictionary.reference.com/browse/context
  • human beings are a generally unpredictable lot... http://www.flickr.com/photos/collinmesser/4567027786
  • meaningfuldetermining user context remains an impossible task... http://www.flickr.com/photos/collinmesser/4567027786
  • meaningfulwhile determining device context is often a much simpler endeavour... and opportunity.. . http://www.flickr.com/photos/hejgustav/3631418869
  • and stuff youstuff you know wish you didnt...features + constraints• screen size • screen size• local storage • no touch• touch • poor JavaScript• canvas • no canvas• SVG • isMSIE• etc • etc http://www.flickr.com/photos/katerha/4330199412
  • feature detectionthe client with both client & server working together... device database and the server "first-run" http://www.flickr.com/photos/donkeyhotey/5527263186
  • first load...http://www.flickr.com/photos/wscullin/3770015203
  • Hmm, Huston - we have a problem... JavaScript HTML fontsinitial request stylesheets images Flash video ...no idea what we can deliver to this client... 1 http://www.flickr.com/photos/wscullin/3770015203
  • $wurfl->getDevice($id); ...or another dB! PHP, Java, etc. http://www.flickr.com/photos/wscullin/3770015203
  • width: 320 px... use what you can... PHP, Java, etc.{    width:{        screen:320    }} 2 create profile a cookie http://www.flickr.com/photos/wscullin/3770015203
  • we could send smaller images... JavaScript HTML fonts stylesheets images images Flash video reduce images include only those resources suitable for device context...{    width:{        screen:320    }} http://www.flickr.com/photos/wscullin/3770015203
  • be sure to compress them if you can...{    width:{        screen:320    }} http://www.flickr.com/photos/wscullin/3770015203
  • initial response{    width:{        screen:320    }} http://www.flickr.com/photos/wscullin/3770015203
  • {    width:{        screen:320    }} 3 detectFeatures(); JavaScript http://www.flickr.com/photos/wscullin/3770015203
  • {    width:{        screen:320,        document:320 subsequent    }, request    xhr:true,    canvas:true,    flash:false,    video:true,    formats:{        h264:probably,        ogg:false,        webm:false    },    offline:true } 4 update profile...now with more chips! http://www.flickr.com/photos/wscullin/3770015203
  • sync profile{ 5    width:{        screen:320,        document:320    },    xhr:true,    canvas:true,    flash:false,    video:true,    formats:{        h264:probably,        ogg:false,        webm:false    },    offline:true} same profile on both client & server http://www.flickr.com/photos/wscullin/3770015203
  • now, send only whats required{ 6    width:{ HTML JavaScript HTML JavaScript fonts        screen:320,        document:320 images stylesheets images stylesheets    },    xhr:true,    canvas:true, Flash video video    flash:false,    video:true,    formats:{        h264:probably,        ogg:false,        webm:false    },    offline:true} .com/bryanri eger/profile h ttps://github sample code* available *fyi the code currently uses a simple profile db idea were playing with instead of WURFL... http://www.flickr.com/photos/wscullin/3770015203
  • Ogg javascript input methods or profilestorage colour depth the device context is defined via appcache dpi features & constraints...screen size isBrowserLame xhr media formats custom properties based on your own tacit knowledge...HTML5 CSS isTouch canvas doctype @font-face json H.264 WebM isTablet WebGL http://www.flickr.com/photos/wscullin/3770015203
  • features & constraints device profile but only those that are screen size actually relevant... Flash Embed to usHTML5 JavaScript http://www.flickr.com/photos/dullhunk/4422952742
  • http://www.flickr.com/photos/aturkus/4040454167
  • The significant problemswe face, cannot besolved at the same levelof thinking we were atwhen we created them.– Albert Einstein
  • what if what is actualis actually not normal...? http://www.flickr.com/photos/pagedooley/2121472112
  • and now for a littlecerebral gymnastics... http://www.flickr.com/photos/jb-london/4112837448
  • display size/width+ a little cerebral gymnastics... and our perception of it 1440 how would the web be different 1280 if history had given us... and Steve 1024 512 x 342 1024 x 768 800 640 480 x 800 512 320 x 480 240 1984 1990 1994 1998 2004 2007
  • 1280 1024 a more constrained context first...? 800 natural progression? 512 x 342 640 1024 x 768 ...mobile first? 480320 x 480 320 1984 1990 1994 1998 2004 2007
  • and
  • what would happenif we designed content... http://www.flickr.com/photos/pasteberlusconi/5352932503
  • in a manner similarto how we design software...? http://www.flickr.com/photos/stephi2006/4428932249
  • ...could we design contentthat adapts to 40,000 contexts?
  • hmm...http://www.flickr.com/photos/seatbelt67/502255276
  • {insert fave CMS here} most websites today are built using a CMS...
  • where page templates tend to dominate content...<put content here /> http://www.nytimes.com
  • monetization focused on delivering ads and providing navigation... longer visits<put content here /> http://www.wired.com/magazine/2011/04/st_thompson_homophily/
  • <put content here />
  • All the Numbers, All the Facts on Mobile the Trillion-Dollar Industry. Why is ...Yes, Google (outgoing) CEO Eric Schmidt had been saying Mobile First but his latest version of his Mobile mobilemobile mantra, that he shares with all partners and companies interested in mobile is: "Put your best people onmobile." Why? Because Mobile today is by a wide margin, the fastest-growing giant industry on the planet.Because all major digital technologies are headed to mobile - telecoms, computers, the internet, etc - and all majormedia are headed to mobile - music, gaming, news, television, advertising - and even money, from coins tobanking to credit cards, is headed to a phone near you. This is definitely the "industry of the decade" and we haveonly begun. So how big is big? Its huge. Lets review the numbers. 2013 and content typically confined to a sandbox... http://communities-dominate.blogs.com/brands/2011/02/all-the-numbers-all-the-facts-on-mobile-the-trillion-dollar-industry-why-is-google-saying-put-your-b.html
  • where context iscompletely irrelevant... http://www.flickr.com/photos/wengs/3938347495
  • resulting in an experience similar to this...http://communities-dominate.blogs.com/brands/2011/02/all-the-numbers-all-the-facts-on-mobile-the-trillion-dollar-industry-why-is-google-saying-put-your-b.html
  • please note... The use of @tomiahonen s site is for illustration purposes only, and is not intended as a criticism of the excellent inform ation he regularly publishes on his site. If youve never re ad any of Tomis posts, youre missing out! ;) Sincerely, Bryanhttp://communities-dominate.blogs.com/brands/2011/02/all-the-numbers-all-the-facts-on-mobile-the-trillion-dollar-industry-why-is-google-saying-put-your-b.html
  • “ There still is no such thing as a mobile-friendly CMS... http://pinchzoom.com/posts/7-things-we-learned-during-sprint-8/ http://www.flickr.com/photos/29022619@N03/3902777481
  • our assets we treat our contentas rubbish with no value... http://www.flickr.com/photos/dnorman/3590132503
  • ...doh!http://www.flickr.com/photos/proimos/4199675334
  • which of course provides exciting opportunities for others... http://www.flickr.com/photos/johanl/4816110696
  • Instapaper Flipboard Readable + Reader in Safari...
  • who are very good at taking this...http://communities-dominate.blogs.com/brands/2011/02/all-the-numbers-all-the-facts-on-mobile-the-trillion-dollar-industry-why-is-google-saying-put-your-b.html
  • and automagicallyturning it into this...
  • and this...
  • http://communities-dominate.blogs.com/brands/2011/02/all-the-numbers-all-the-facts-on-mobile-the-...and look, were back in the browser! and even this http://communities-dominate.blogs.com/brands/2011/02/all-the-numbers-all-the-facts-on-mobile-the-trillion-dollar-industry-why-is-google-saying-put-your-b.html
  • http://communities-dominate.blogs.com/brands/2011/02/all-the-numbers-all-the-facts-on-mobile-the- which can then be tailored to your preferences... http://readable.tastefulwords.com/
  • #!/usr/bin/perl -wuse strict;use XML::RSS;use LWP::Simple;use HTML::Entities;my $rss = new XML::RSS (version => 1.0);my $url = "http://www.linux.org.uk/~telsa/Diary/diary.html";my $page = get($url);$rss->channel(title => "The more accurate diary. Really.", link => $url, description => "Telsas diary of life with a hacker:" . " the current ramblings");foreach (split (<dt>, $page)){ if (/<asname=" ([^"]*) "> # Anchor name ...surely we can do significantly <strong> ([^>]*) # Post title better than a screen scraper glorified </strong></a></dt>s*<dd> (.*) # Body of post </dd>/six) { $rss->add_item(title => $2, link => "$url#$1", description => encode_entities($3)); }}print $rss->as_string; http://linuxgazette.net/108/oregan2.html
  • but can we...http://www.flickr.com/photos/jaako/218844774
  • do significantlybetter than a PDF...?
  • object database gs,booleans , numbers, strainies, rnames, arrays, diction.. . streams and null ...a fascinating little technology... database
  • %!PS-Adobe-3.0 EPSF-3.0%%BoundingBox:0 0 288 288 context*%%ColorUsage: Color%%DocumentProcessColors: Cyan Magenta Yellow Black/ok_Ellipse{ ok_xOffset ok_yOffset moveto ok_x1 0 ok_xR ok_y1 ok_xR ok_yR rcurveto 0 ok_y1 ok_x1 neg ok_yR ok_xR neg ok_yR rcurveto ok_x1 neg 0 ok_xR neg ok_y1 neg ok_xR neg ok_yR neg rcurveto 0 ok_y1 neg ok_x1 ok_yR neg ok_xR ok_yR neg rcurveto closepath} def/ok_Ellipses{ %on stack: designed to faithfully render %xCenter yCenter xOffset yOffset width height weight howMany [color array] one single context everywhere... aload pop setcmykcolor /ok_HowMany exch def /ok_Weight exch def routine device independent /ok_Height exch def /ok_Width exch def definition /ok_yOffset exch def /ok_xOffset exch def /ok_yCenter exch def /ok_xCenter exch def http://en.wikip /ok_Angle 360 ok_HowMany div def edia.org/ /ok_xR ok_Width 2 div def wiki/PostScrip /ok_yR ok_Height 2 div def t /ok_x1 ok_xR ok_xR .552292 mul sub def /ok_y1 ok_yR ok_yR .552292 mul sub def ok_Weight setlinewidth gsave ok_xCenter ok_yCenter translate ok_HowMany { ok_Ellipse ok_Angle rotate routine call } repeat stroke grestore +} def%heres an example call to the "ok_Ellipses" routine144 144 0 0 24 36 .5 24 [0 0 0 1] ok_Ellipses database application144 144 0 76 18 60 3 6 [1 0 1 0] ok_Ellipses144 144 0 76 12 48 2 12 [.8 0 .8 0] ok_Ellipses http://www.adobe.com/products/adobemag/archive/spirogf1.html144 144 0 78 11 44 2 12 [.6 0 .6 0] ok_Ellipses
  • but not known for being terribly adaptive...
  • but the web wasnt designed tobe constrained to a single context...
  • http://communities-dominate.blogs.com/brands/2011/02/all-the-numbers-all-the-facts-on-mobile-the ...maybe we should stop imposing arbitrary constraints on our content?
  • features & constraints web design is software design... +object model view controller device context ...keep an eye on these!
  • to a brave, new
  • content.app content as applications... http://www.flickr.com/photos/colindunn/4479309983
  • February 17, 2011All the Numbers, All the Facts on Mobile the Trillion-Dollar Industry. Why is Google saying: Put your Best People on Mobile?Yes, Google (outgoing) CEO Eric Schmidt had been saying Mobile First but his latest version of his Mobile mobile mobile mantra, that he shares with allpartners and companies interested in mobile is: "Put your best people on mobile." Why? Because Mobile today is by a wide margin, the fastest-growing giantindustry on the planet. Because all major digital technologies are headed to mobile - telecoms, computers, the internet, etc - and all major media are headed tomobile - music, gaming, news, television, advertising - and even money, from coins to banking to credit cards, is headed to a phone near you. This is definitelythe "industry of the decade" and we have only begun. So how big is big? Its huge. Lets review the numbers.5.2 Billion Subscribers it should be blatantly obvious but,So first the biggest number - 5.2. That is in billions with a B. There are 1.2 billion personal computers in use worldwide including desktops, laptops and tablet – start with the content...PCs like the iPad. There are 1.1 billion fixed landline phones. There are 1.0 billion automobiles registered and in use. There are 1.6 billion television sets, 1.7billion credit card users, 2.0 billion internet users, 2.2 billion people with a banking account, and 3.9 billion radio receivers in use worldwide. Mobile utterlydwarfs them all - with 5.2 billion currently active, ie fully paid mobile phone subscriptions. Active mobile phone accounts. 5.2 billion. yes, 4.5 times more mobilephone subscriptions than personal computers or landline phones. 2.5x more mobile accounts than all internet users. 3 times more mobile subscribers than thetotal number of television sets. Mobile is huge.The planet has 6.9 billion people alive, from babies to great grandparents. Now there is an active mobile phone subscription for 75% of them. So where arewe? One way to look at it is electricity. The planet has 1.6 billion people who live beyond the reach of electricity (said CNN, 2009). So the mobile phonesubscriber count is almost matching every human alive (including babies etc) who enjoys modern conveniences like electricity (5.3 billion people). Or anotherway? Water. We learned last year that 4.2 billion people use a toothbrush (MMA Forum Asia 2010) - so there are one billion more mobile phone accounts thanthe total number of users of a toothbrush. Or jobs? Motorola told us last year that there are 5 billion people who have a job on the planet - but 5.2 billion peoplehave a mobile phone.I am doing my count-down to the point when we have 100% per-capita penetration rate of mobile phone accounts on the planet, ie one active mobile accountper person alive. Well hit that point roughly at the end of 2013. But Im using an age-related count-down. So if we allocate all existing active mobile phoneaccounts by age, from the eldest to the youngest, we are now at the start of 2011, at the point, where there would be an active mobile phone account for everyperson alive on the planet who is over the age of 12. It is coming down at the rate of about one year of age, per quarter! In other words phones are spreading atthe rate of four years of age, per year. By the end of this year well be at about age 8... And its everywhere. In the USA the mobile phone penetration rate israpidly nearing the 100% rate per capita (we should pass that point this year). That may seem impressive, it is not. Europe is at 130%, many ;eading countriesare already past the 150% level and the United Arab Emirates (ie Abu Dhabi, Dubai etc) became the first country to pass 200% mobile phone subscriber count.And even the poorest regions are rushing in. The continent of Africa has already passed the 50% penetration level in mobile phone subscriptions per capita.3.7 BILLION UNIQUE MOBILE PHONE USERSThe total mobile phone subscriber count of 5.2 billion is not the same as unique users of mobile phones. Over one third of all people who have a mobilephone, have two or more mobile accounts. Many have two phones, some have a phone and a laptop-PC account on a 3G data dongle, and some walk around
  • February 17, 2011All the Numbers, All the Facts on Mobile the Trillion-Dollar Industry. Why is Google saying: Put your BestPeople on Mobile? typography mattersYes, Google (outgoing) CEO Eric Schmidt had been saying Mobile First but his latest (you may not care) but your users do...version of his Mobile mobile mobile mantra, that he shares with all partners and companies etitors and compis by ainterested in mobile is: "Put your best people on mobile." Why? Because Mobile todaywide margin, the fastest-growing giant industry on the planet. Because all major digitaltechnologies are headed to mobile - telecoms, computers, the internet, etc - and all major Instapapermedia are headed to mobile - music, gaming, news, television, advertising - and even money,from coins to banking to credit cards, is headed to a phone near you. This is definitely the"industry of the decade" and we have only begun. So how big is big? Its huge. Lets review Flipboardthe numbers.5.2 BILLION SUBSCRIBERSSo first the biggest number - 5.2. That is in billions with a B. There are 1.2 billion personalcomputers in use worldwide including desktops, laptops and tablet PCs like the iPad. Thereare 1.1 billion fixed landline phones. There are 1.0 billion automobiles registered and in use.There are 1.6 billion television sets, 1.7 billion credit card users, 2.0 billion internet users, 2.2billion people with a banking account, and 3.9 billion radio receivers in use worldwide.
  • February 17, 2011All the Numbers, All the Facts on Mobile the Trillion-Dollar Industry. Why is Google saying: Put your BestPeople on Mobile?Yes, Google (outgoing) CEO Eric Schmidt had been saying Mobile First but his latestversion of his Mobile mobile mobile mantra, that he shares with all partners and companiesinterested in mobile is: "Put your best people on mobile." Why? Because Mobile today is byto and dont be afraid awide margin, the fastest-growing giant industry on the planet. Because all their ideas... steal major digitaltechnologies are headed to mobile - telecoms, computers, the internet, etc - and all major ie. preferencesmedia are headed to mobile - music, gaming, news, television, advertising - and even money,from coins to banking to credit cards, is headed to a phone near you. This is definitely the"industry of the decade" and we have only begun. So how big is big? Its huge. Lets reviewthe numbers.5.2 BILLION SUBSCRIBERSSo first the biggest number - 5.2. That is in billions with a B. There are 1.2 billion personalcomputers in use worldwide including desktops, laptops and tablet PCs like the iPad. Thereare 1.1 billion fixed landline phones. There are 1.0 billion automobiles registered and in use.There are 1.6 billion television sets, 1.7 billion credit card users, 2.0 billion internet users, 2.2billion people with a banking account, and 3.9 billion radio receivers in use worldwide.
  • http://www.flickr.com/photos/farleyj/2768941171
  • /*  dimensions  */ ...check out if you use$min-­‐width:  220px; constraints can easily be modified$max-­‐width:  960px;$column-­‐main:  65%;$column-­‐aside:  31%; relative values provide flexibility$column-­‐margin:  4%; ems + %s $variables/*  dimensions  */ think relative, embrace uncertainty@mixin  aside  {   clear:  right; and express yourself...   float:  right;   margin:  0  0  0  $column-­‐margin;   &:color  opacify($azure-­‐sea-­‐of-­‐despair,  0.8);   width:  $column-­‐aside;}@mixin  wrap  {   clear:  both; expressions based on variable   display:  block; features + constraints   margin:  0px  auto;   padding:  0px  $column-­‐margin/2;   min-­‐width:  $min-­‐width;   max-­‐width:  $max-­‐width;}/*  colours  */$azure-­‐sea-­‐of-­‐despair:  rgba(84,  174,  207,  0.75); http://sass-lang.com
  • February 17, 2011All the Numbers, All the Facts on Mobile the Trillion-Dollar Industry. Why is Google saying: Put your BestPeople on Mobile?Yes, Google (outgoing) CEO Eric Schmidt had been saying Mobile First but his latestversion of his Mobile mobile mobile mantra, that he shares picture is often worth a with all partners and companies a thousand words...interested in mobile is: "Put your best people on mobile." Why? Because Mobile today is by awide margin, the fastest-growing giant industry on the planet. Because all major digitaltechnologies are headed to mobile - telecoms, computers, the internet, etc - and all majormedia are headed to mobile - music, gaming, news, television, advertising - and even money,from coins to banking to credit cards, is headed to a phone near you. This is definitely the"industry of the decade" and we have only begun. So how big is big? Its huge. Lets reviewthe numbers.5.2 BILLION SUBSCRIBERSSo first the biggest number - 5.2. That is in billions with a B. There are 1.2 billion personalcomputers in use worldwide including desktops, laptops and tablet PCs like the iPad. Thereare 1.1 billion fixed landline phones. There are 1.0 billion automobiles registered and in use.There are 1.6 billion television sets, 1.7 billion credit card users, 2.0 billion internet users, 2.2billion people with a banking account, and 3.9 billion radio receivers in use worldwide.
  • February 17, 2011All the Numbers, All the Facts on Mobile the Trillion-Dollar Industry. Why is Google saying: Put your BestPeople on Mobile?Yes, Google (outgoing) CEO Eric Schmidt hadbeen saying Mobile First but his latest version ofhis Mobile mobile mobile mantra, that he shareswith all partners and companies interested inmobile is: "Put your best people on mobile."Why? Because Mobile today is by a wide margin,the fastest-growing giant industry on the planet.Because all major digital technologies are headedto mobile - telecoms, computers, the internet, etc- and all major media are headed to mobile -music, gaming, news, television, advertising - and even money, from coins to banking tocredit cards, is headed to a phone near you. This is definitely the "industry of the decade"and we have only begun. So how big is big? Its huge.5.2 BILLION SUBSCRIBERSSo first the biggest number - 5.2. That is in billions with a B. There are 1.2 billion personal
  • February 17, 2011 All the Numbers, All the Facts on Mobile the Trillion-Dollar Industry. Why is Google saying: Put your Best People on Mobile? tinySrc http://tinysrc.net/ a cloud app to resize images appropriate to the device contextdevice context device context Yes, Google (outgoing) CEO Eric Schmidt had been saying Mobile First but his latest version of his Mobile the simplest way to adapt your images mobile mobile mantra, that he shares with all partners and companies interested in mobile is: "Put your best people on mobile." Why? Because Mobile today is by a wide margin, the fastest-growing giant industry on the planet. Because all major digital technologies are headed to mobile - telecoms, computers, the internet, etc - and all major media are headed to mobile - music, gaming, BTW - ImageMagick, GD, Batik, news, television, advertising - and even money, from coins to banking to credit cards, is headed to a phone PIL and other libraries and near you. This is definitely the "industry of the decade" applications can be used to roll and we have only begun. So how big is big? Its huge. your own solution... Lets review the numbers. 5.2 BILLION SUBSCRIBERS So first the biggest number - 5.2. That is in billions with a
  • but images can also be...http://www.flickr.com/photos/johanl/4382372758
  • data ...applications data design elementsfocus region BTW - ImageMagick, GD, Batik, PIL and other libraries and applications can be used to roll your own solution... <canvas /> <canvas /> http://www.flickr.com/photos/johanl/4382372758
  • that adaptconstraints http://www.flickr.com/photos/johanl/4382372758
  • focus region to changes... http://www.flickr.com/photos/johanl/4382372758
  • in context...http://www.flickr.com/photos/johanl/4382372758
  • February 17, 2011All the Numbers, All the Facts on Mobile the Trillion-Dollar Industry. Why is Google saying: Put your BestPeople on Mobile?Yes, Google (outgoing) CEO Eric Schmidt had been saying Mobile First but his latestversion of his Mobile mobile mobile mantra, that he shares with all partners and companiesinterested in mobile is: "Put your best people on mobile." Why? Because Mobile today is by awide margin, the fastest-growing giant industry on the planet. Because all major digitaltechnologies are headed to mobile - telecoms, computers, the internet, etc - and all majormedia are headed to mobile - music, gaming, news, television, advertising - and even money,from coins to banking to credit cards, is headed to a phone near you. This is definitely the
  • <aside /> #ranthttp://paulrouget.com/e/infographicsInHTML5
  • Yes, Google (outgoing) CEO Eric Schmidt had beensaying Mobile First but his latest version of his Mobilemobile mobile mantra, that he shares with all partnersand companies interested in mobile is: "Put your bestpeople on mobile." Why? Because Mobile today is by awide margin, the fastest-growing giant industry on theplanet. Because all major digital technologies are headedto mobile - telecoms, computers, the internet, etc - and allmajor media are headed to mobile - music, gaming,news, television, advertising - and even money, fromcoins to banking to credit cards, is headed to a phonenear you. This is definitely the "industry of the decade"and we have only begun. So how big is big? Its huge.Lets review the numbers.5.2 BILLION SUBSCRIBERSSo first the biggest number - 5.2. That is in billions with aB. There are 1.2 billion personal computers in useworldwide including desktops, laptops and tablet PCslike the iPad. There are 1.1 billion fixed landline phones.There are 1.0 billion automobiles registered and in use.There are 1.6 billion television sets, 1.7 billion credit card ...and what about all that text?users, 2.0 billion internet users, 2.2 billion people with abanking account, and 3.9 billion radio receivers in useworldwide. Mobile utterly dwarfs them all - with 5.2billion currently active, ie fully paid mobile phonesubscriptions. Active mobile phone accounts. 5.2 billion.yes, 4.5 times more mobile phone subscriptions thanpersonal computers or landline phones. 2.5x more mobileaccounts than all internet users. 3 times more mobilesubscribers than the total number of television sets.Mobile is huge.The planet has 6.9 billion people alive, from babies togreat grandparents. Now there is an active mobile phonesubscription for 75% of them. So where are we? One way
  • @bdconfIf youre not at #mobilism you can stillwatch the browser panel athttp://mobilism.nl/2011/stream at 16:00CET! via @ppk ...or for that matter this text?
  • make it usableand meaningful... http://www.flickr.com/photos/aubergene/970367879
  • add structure toenable manipulation... http://www.flickr.com/photos/aubergene/970367879
  • tagidentifier @bdconf If youre not at #mobilism you can still watch the browser panel at url http://mobilism.nl/2011/stream at 16:00 CET! via @ppk markup enhances your textual data... or content...?
  • If youre not at #mobilism you can stillwatch the browser panel athttp://mobilism.nl/2011/stream at 16:00CET! via @ppk this is also recognisable...
  • Yes, Google (outgoing) CEO Eric Schmidt had been saying Mobile First but his latest version of his Mobile mobile mobile mantra, that he shares with all partners and companies interested in mobile is: "Put your best people on mobile." Why? Because Mobile today is by a wide margin, the fastest-growing giant industry on the planet. Because all major digital technologies are headed to mobile - telecoms, computers, the internet, etc - and all major media are headed to mobile - music, gaming, microformats news, television, advertising - and even money, from microformats.org coins to banking to credit cards, is headed to a phone near you. This is definitely the "industry of the decade"open data formats and we have only begun. So how big is big? Its huge.hCard, hCal, rel-*, etc. Lets review the numbers. 5.2 BILLION SUBSCRIBERS ...read it and add So first the biggest number - 5.2. That is in billions with a meaningful structure B. There are 1.2 billion personal computers in use worldwide including desktops, laptops and tablet PCs like the iPad. There are 1.1 billion fixed landline phones. There are 1.0 billion automobiles registered and in use. There are 1.6 billion television sets, 1.7 billion credit card some call it editorial... users, 2.0 billion internet users, 2.2 billion people with a banking account, and 3.9 billion radio receivers in use worldwide. Mobile utterly dwarfs them all - with 5.2 billion currently active, ie fully paid mobile phone subscriptions. Active mobile phone accounts. 5.2 billion. yes, 4.5 times more mobile phone subscriptions than personal computers or landline phones. 2.5x more mobile accounts than all internet users. 3 times more mobile subscribers than the total number of television sets. HTML5 http://w3.org/html5 Mobile is huge. data-attributes The planet has 6.9 billion people alive, from babies to semantic elements great grandparents. Now there is an active mobile phone subscription for 75% of them. So where are we? One way
  • typically"Links dont open apps" Google (outgoing) CEOlatestSchmidt of his Mobile Yes, saying Mobile First but his Eric version had been– @grigs mobile mobile mantra, that he shares with all partners and companies interested in mobile is: "Put your best people on mobile." Why? Because Mobile today is by a wide margin, the fastest-growing giant industry on the planet. Because all major digital technologies are headed to mobile - telecoms, computers, the internet, etc - and all major media are headed to mobile - music, gaming, news, television, advertising - and even money, from coins to banking to credit cards, is headed to a phone which will enable near you. This is definitely the "industry of the decade" you to better interpret... and we have only begun. So how big is big? Its huge. Lets review the numbers. 5.2 BILLION SUBSCRIBERS Description Billions mobile  subscribers 5.2 personal  computers  in  use 1.2 interpret fixed  landline  phones 1.1 registered  automobiles  in  use 1.0 television  sets 1.6 a little information design can credit  card  users 1.7 often help clarify things... internet  users 2.0 people  with  a  banking  account 2.2 radio  receivers  in  use 3.9 The planet has 6.9 billion people alive, from babies to great grandparents. Now there is an active mobile phone subscription for 75% of them. So where are we? One way to look at it is electricity. The planet has 1.6 billion people who live beyond the reach of electricity (said CNN, 2009). So the mobile phone subscriber count is almost matching every human alive (including babies etc) who enjoys
  • Yes, Google (outgoing) CEO Eric Schmidt had been saying Mobile First but his latest version of his Mobile mobile mobile mantra, that he shares with all partners and companies interested in mobile is: "Put your best people on mobile." Why? Because Mobile today is by a wide margin, the fastest-growing giant industry on the planet. Because all major digital technologies are headed to mobile - telecoms, computers, the internet, etc - and all major media are headed to mobile - music, gaming, news, television, advertising - and even money, from and communicate coins to banking to credit cards, is headed to a phone near you. This is definitely the "industry of the decade" your message... and we have only begun. So how big is big? Its huge. Lets review the numbers. 5.2 BILLION SUBSCRIBERSion Billions 6ubscribers 5.2 4.5  computers  in  use 1.2 chart tools APIndline  phones 1.1 3 visualiseed  automobiles  in  use 1.0on  sets 1.6 1.5ard  users 1.7 0 images can also  users 2.0 billions  of  users be applications!ith  a  banking  account 2.2 mobile radio bank  account internet credit  card televisionceivers  in  use 3.9 computers landline automobiles The planet has 6.9 billion people alive, from babies to great grandparents. Now there is an active mobile phone subscription for 75% of them. So where are we? One way to look at it is electricity. The planet has 1.6 billion people who live beyond the reach of electricity (said CNN, 2009). So the mobile phone subscriber count is almost matching every human alive (including babies etc) who enjoys
  • news, television, advertising - and even money, from coins to banking to credit cards, is headed to a phone HTML CSS near you. This is definitely the "industry of the decade" and we have only begun. So how big is big? Its huge. Lets review the numbers. SVG 5.2 BILLION SUBSCRIBERS make meaning mobile HTML5 http://w3.org/html5 5.2  billion  currently active mobile phone subscriptions – thats 4.5 times more than personalion Billions computersubscribers 5.2  computers  in  use 1.2ndline  phones 1.1 radio images can alsoed  automobiles  in  use 1.0 be applications!on  sets 1.6ard  users 1.7  users 2.0ith  a  banking  account 2.2ceivers  in  use 3.9 television computers not just an image, but real data The planet has 6.9 billion people alive, from babies to and content great grandparents. Now there is an active mobile phone subscription for 75% of them. So where are we? One way in different contexts... to look at it is electricity. The planet has 1.6 billion people who live beyond the reach of electricity (said CNN, 2009). So the mobile phone subscriber count is almost matching every human alive (including babies etc) who enjoys
  • http://communities-domina mobile 5.2  billion  currently active mobile phone subscriptions – thats 4.5 times more than personal computers radio television computers
  • http://communities-dominaFebruary 17, 2011All the Numbers, All the Facts on Mobile theTrillion-Dollar Industry. Why is Google saying:Put your Best People on Mobile?Yes, Google (outgoing) CEO Eric Schmidt hadbeen saying Mobile First but his latest version ofhis Mobile mobile mobile mantra, that he shares
  • http://communities-dominate.blogs.com/brands/2011/02/all-theCommunities Dominate Brands February 17, 2011All the Numbers, All the Facts on Mobile the Trillion-Dollar Industry.Why is Google saying: Put your Best People on Mobile?Yes, Google (outgoing) CEO Eric Schmidt had beensaying Mobile First but his latest version of hisMobile mobile mobile mantra, that he shares with all mobilepartners and companies interested in mobile is: "Putyour best people on mobile." Why? Because Mobile 5.2  billion  currently active mobile phonetoday is by a wide margin, the fastest-growing giant subscriptions – thats 4.5 times more than personal computersindustry on the planet. Because all major digitaltechnologies are headed to mobile - telecoms,computers, the internet, etc - and all major media areheaded to mobile - music, gaming, news, television,advertising - and even money, from coins to banking to radio
  • http://communities-dominate.blogs.com/brands/2011/02/all-the-numbers-all-the-facts-on-mobile-the-Communities Dominate Brands February 17, 2011All the Numbers, All the Facts on Mobile theTrillion-Dollar Industry. Why is Google saying:Put your Best People on Mobile?Yes, Google (outgoing) CEO Eric Schmidt had been saying Mobile First but his latestversion of his Mobile mobile mobile mantra, that he shares with all partners andcompanies interested in mobile is: "Put your best people on mobile." Why? BecauseMobile today is by a wide margin, the fastest-growing giant industry on the planet.Because all major digital technologies are headed to mobile - telecoms, computers, theinternet, etc - and all major media are headed to mobile - music, gaming, news,television, advertising - and even money, from coins to banking to credit cards, isheaded to a phone near you. This is definitely the "industry of the decade" and wehave only begun. So how big is big? Its huge. Lets review the numbers. 5.2 BILLION SUBSCRIBERS mobile 6 5.2  billion  currently 4.5 active mobile phone computers subscriptions – thats 4.5
  • “ an opportunity ...it sounds dumb, but I cant tell you how often Id really like articles online to have a download as PDF or ePub option... – @tomcoates http://twitter.com/#!/tomcoates/status/ 66368409335644160 http://www.flickr.com/photos/plasticbag/2335503812
  • lemobi active s – rently n illio n  cur subscription5.2  b e phone more thamobil 4.5 times uters thats nal comp perso radio which is merely one more context... or 2, 3, 4, or... ers sion ut televi comp convenience has value... apps are often just another context...
  • in the comingzombie apocalypse... http://www.flickr.com/photos/digitalsextant/3624030270
  • “ It is not necessary to change. Survival is not mandatory. – W. Edwards Deming http://www.flickr.com/photos/wasteofspace/4861254682
  • @yiibupleasesay hi hello@yiibu.com thank you the font we use is Museo http://www.exljbris.com/museo.html many thanks to the amazing photographers on http://www.flickr.com/creativecommons/by-2.0 licensed under http://creativecommons.org/licenses/by/2.0 available on http://www.slideshare.net/yiibu/muddling-through-the-mobile-web http://www.flickr.com/photos/tinou/453593446