Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Muddling Through
                                              the Mobile Web
                                            ...
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...
         typically




m.domain.com || do...
but lately, old ideas are
        being revisited...




http://www.alistapart.com/articles/understandingprogressiveenhanc...
...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/3ohem...
...of which we’re
pragmatic devotees ;)




    http://www.flickr.com/photos/aerosolhalos/5134483703
You must have a goal in life.




         BUT




                                http://www.flickr.com/photos/christopher...
rethinking mobile web yiibu


   try to keep an open mind and
regularly challenge our beliefs...




                     ...
this is rhetorical...

Are we there yet?




                           http://yiibu.com
...why are kiwi fruit fuzzy?



                                    many questions
                               remain u...
@media queries?
                                                                                  yes              no     ...
automagically scaling
                                                                                                    ...
eries?                   yes

                                           yes              no           *.mobi?       adapt...
o


      adapt?

                                      yes?
        yes                yes

                             ...
o
                                                                                                                        ...
every stylesheet is not required

                                                            3 columns, really?


@font s...
too many HTTP...do we
                                                    requests...simply
                              ...
...available bandwidth?


                             ...is orthogonal to...


                  ...screen size?

       ...
mmm, Spongebob...




                    “   Biggest problem for handheld
                        web video playback stil...
'we' being yiibu...
                        obviously delusional                            ...so we've done a little
    ...
server-side
media queries


                              and we have a little
                filters   dirty laundry to s...
...a selection of content
filtering + transformation prototypes




                     http://www.flickr.com/photos/digger...
g
                  in n
               er tioes
            lt a typ
         t firm roto
      en fo p
   nt ns
Co ra
   ...
begin with some
existing HTML content...
Raw user agent: Mozilla/5.0 (SymbianOS/9.1; U; en-us) AppleWebKit/413 ...
Device identified as: Nokia N73

Actual Root Dev...
resolution_width: 240   device property




                                   $html->find('img[src]');
resolution_width: 240   device property




                                           <img />


                         ...
resolution_width: 240     device property


                                            based on...




  panda.jpg   pand...
IL
     resolution_width: 240            device property



                                                        FA
   ...
in n   g
               er tioes
            lt a typ
         t firm roto
      en fo p
   nt ns
Co ra
   t               ...
...an interesting idea
{{mustache}} inspired...
*H AC K*
                                                       FAIL
                                                     ...
in n  g
                   r o
                te ti ypes
                                             #mobilism at
      ...
...use XSLT – after
         all it was made to
         style content!?         WTFF?
                                   ...
in n g
                    r o
                te ti ypes
                                             #mobilism at
      ...
...eventually we came to accept
that we can't get there, from here



                 http://www.flickr.com/photos/awfulsh...
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/p...
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
                                      ...
display size/width



                                          we came to expect
                                        ...
display size/width



                                              ...one day1440 2007
                                  ...
display size/width



                                          today we seem1440 have
                                   ...
display size/width

                                                                               public displays
       ...
“        With current growth rates,
         Web access by people on
         the move—via laptops and
         smart mobi...
yet we're inherently constrained
             by human factors...


               http://www.flickr.com/photos/carbonnyc/4...
which presents us with
       one problem...
                  nagging




     http://www.flickr.com/photos/whiskeytango/4...
the hell
how do we make content meaningful
     in all of these varied contexts?
                    http://www.flickr.com/...
...let's first deal with
what we mean by 'context'...




             http://www.flickr.com/photos/sporst/3999795549
con•text [kon-tekst] – the set of
circumstances or facts that surround
a particular event, situation, etc.
http://dictiona...
human beings are a generally
         unpredictable lot...




            http://www.flickr.com/photos/collinmesser/456702...
meaningful
determining user context remains
            an impossible task...




                      http://www.flickr.c...
meaningful
while determining device context is
 often a much simpler endeavour...
                                   and o...
and stuff you
stuff you know                 wish you didn't...

features          +   constraints
• screen size            ...
feature
 detection
the client


             with both client & server
                   working together...



         ...
first load...




http://www.flickr.com/photos/wscullin/3770015203
Hmm, Huston - we have a problem...

                                    JavaScript
                          HTML         ...
$wurfl->getDevice($id);


                               ...or another dB!

             PHP, Java, etc.




              ...
width: 320 px...      use what you can...




                                                PHP, Java, etc.




{
	
  	
...
we could send smaller images...

                                                JavaScript
                              ...
be sure to compress them
                             if you can...
{
	
  	
  width:{
	
  	
  	
  	
  screen:320
	
  	
  }...
initial response




{
	
  	
  width:{
	
  	
  	
  	
  screen:320
	
  	
  }
}




                                        ...
{
	
  	
  width:{
	
  	
  	
  	
  screen:320
	
  	
  }
}                                                        3
        ...
{
     	
  	
  width:{
     	
  	
  	
  	
  screen:320,
     	
  	
  	
  	
  document:320     subsequent
     	
  	
  },  ...
sync profile
{                                              5
	
  	
  width:{
	
  	
  	
  	
  screen:320,
	
  	
  	
  	
  d...
now, send only what's required
{                                                                       6
	
  	
  width:{  ...
Ogg
      javascript                             input methods
                                                           ...
features & constraints
 device profile
                                   but only those that are
  screen size            ...
http://www.flickr.com/photos/aturkus/4040454167
The significant problems
we face, cannot be
solved at the same level
of thinking we were at
when we created them.

– Albert...
what if what is actual
is actually not normal...?




        http://www.flickr.com/photos/pagedooley/2121472112
and now for a little
cerebral gymnastics...




      http://www.flickr.com/photos/jb-london/4112837448
display size/width
+ a little cerebral gymnastics...


                                                             and ou...
1280




                                                             1024

                                    a more con...
and
what would happen
if we designed content...




      http://www.flickr.com/photos/pasteberlusconi/5352932503
in a manner similar
to how we design software...?



            http://www.flickr.com/photos/stephi2006/4428932249
...could we design content
that 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 />




                         ...
monetization
                        focused on delivering ads
                       and providing navigation...
        ...
<put content here />
All the Numbers, All the Facts on Mobile the Trillion-Dollar Industry. Why is ...




Yes, Google (outgoing) CEO Eric Schm...
where context is
completely irrelevant...




        http://www.flickr.com/photos/wengs/3938347495
resulting in an
                                                                          experience similar to this...


...
please note...

                  The use of @tomiahonen    's site is for illustration
                  purposes only, a...
“   There still is no such thing as
    a mobile-friendly CMS...
    http://pinchzoom.com/posts/7-things-we-learned-during...
our assets
     we treat our content
as rubbish with no value...




          http://www.flickr.com/photos/dnorman/3590132...
...doh!




http://www.flickr.com/photos/proimos/4199675334
which of course provides exciting
       opportunities for others...




                  http://www.flickr.com/photos/joh...
Instapaper Flipboard Readable
                     +   Reader in Safari...
who are very good at
                                                                                                    t...
and automagically
turning it into this...
and this...
http://communities-dominate.blogs.com/brands/2011/02/all-the-numbers-all-the-facts-on-mobile-the-



...and look, we're ba...
http://communities-dominate.blogs.com/brands/2011/02/all-the-numbers-all-the-facts-on-mobile-the-




                    ...
#!/usr/bin/perl -w

use   strict;
use   XML::RSS;
use   LWP::Simple;
use   HTML::Entities;

my $rss = new XML::RSS (versio...
but can we...




http://www.flickr.com/photos/jaako/218844774
do significantly
better than a PDF...?
object database


                           gs,
booleans , numbers, strainies,
                         r
names, arrays, ...
%!PS-Adobe-3.0 EPSF-3.0

%%BoundingBox:0 0 288 288         context*
%%ColorUsage: Color
%%DocumentProcessColors: Cyan Mage...
but not known for being
      terribly adaptive...
but the web wasn't designed to
be constrained to a single context...
http://communities-dominate.blogs.com/brands/2011/02/all-the-numbers-all-the-facts-on-mobile-the




                     ...
features & constraints
                                           web design is
                                       sof...
to a brave, new
content.app




                      content as
                   applications...



              http://www.flickr.com/...
February 17, 2011

All the Numbers, All the Facts on Mobile the Trillion-Dollar Industry. Why is Google saying: Put your B...
February 17, 2011



All the Numbers, All the Facts on Mobile the Trillion-
Dollar Industry. Why is Google saying: Put you...
February 17, 2011



All the Numbers, All the Facts on Mobile the Trillion-
Dollar Industry. Why is Google saying: Put you...
http://www.flickr.com/photos/farleyj/2768941171
/*	
  dimensions	
  */
                                                                     ...check out   if you use
$min...
February 17, 2011



All the Numbers, All the Facts on Mobile the Trillion-
Dollar Industry. Why is Google saying: Put you...
February 17, 2011



All the Numbers, All the Facts on Mobile the Trillion-
Dollar Industry. Why is Google saying: Put you...
February 17, 2011


                 All the Numbers, All the Facts on Mobile
                 the Trillion-Dollar Industr...
but images
     can also be...




http://www.flickr.com/photos/johanl/4382372758
data




                                   ...applications

                                                             ...
that adapt
constraints




              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, 2011



All the Numbers, All the Facts on Mobile the Trillion-
Dollar Industry. Why is Google saying: Put you...
<aside />
                  #rant




http://paulrouget.com/e/infographicsInHTML5
Yes, Google (outgoing) CEO Eric Schmidt had been
saying 'Mobile First' but his latest version of his 'Mobile
mobile mobile...
@bdconf
If you're not at #mobilism you can still
watch the browser panel at
http://mobilism.nl/2011/stream at 16:00
CET! v...
make it usable
and meaningful...




 http://www.flickr.com/photos/aubergene/970367879
add structure to
enable manipulation...


      http://www.flickr.com/photos/aubergene/970367879
tag
identifier   @bdconf
            If you're not at #mobilism you can still
            watch the browser panel at
      ...
If you're not at #mobilism you can still
watch the browser panel at
http://mobilism.nl/2011/stream at 16:00
CET! via @ppk ...
Yes, Google (outgoing) CEO Eric Schmidt had been
                                        saying 'Mobile First' but his lat...
typically
"Links don't open apps" Google (outgoing) CEOlatestSchmidt of his 'Mobile
                     Yes,
            ...
Yes, Google (outgoing) CEO Eric Schmidt had been
                                            saying 'Mobile First' but his...
Muddling Through the Mobile Web
Muddling Through the Mobile Web
Muddling Through the Mobile Web
Muddling Through the Mobile Web
Muddling Through the Mobile Web
Muddling Through the Mobile Web
Muddling Through the Mobile Web
Muddling Through the Mobile Web
Muddling Through the Mobile Web
Muddling Through the Mobile Web
Upcoming SlideShare
Loading in …5
×

of

Muddling Through the Mobile Web Slide 1 Muddling Through the Mobile Web Slide 2 Muddling Through the Mobile Web Slide 3 Muddling Through the Mobile Web Slide 4 Muddling Through the Mobile Web Slide 5 Muddling Through the Mobile Web Slide 6 Muddling Through the Mobile Web Slide 7 Muddling Through the Mobile Web Slide 8 Muddling Through the Mobile Web Slide 9 Muddling Through the Mobile Web Slide 10 Muddling Through the Mobile Web Slide 11 Muddling Through the Mobile Web Slide 12 Muddling Through the Mobile Web Slide 13 Muddling Through the Mobile Web Slide 14 Muddling Through the Mobile Web Slide 15 Muddling Through the Mobile Web Slide 16 Muddling Through the Mobile Web Slide 17 Muddling Through the Mobile Web Slide 18 Muddling Through the Mobile Web Slide 19 Muddling Through the Mobile Web Slide 20 Muddling Through the Mobile Web Slide 21 Muddling Through the Mobile Web Slide 22 Muddling Through the Mobile Web Slide 23 Muddling Through the Mobile Web Slide 24 Muddling Through the Mobile Web Slide 25 Muddling Through the Mobile Web Slide 26 Muddling Through the Mobile Web Slide 27 Muddling Through the Mobile Web Slide 28 Muddling Through the Mobile Web Slide 29 Muddling Through the Mobile Web Slide 30 Muddling Through the Mobile Web Slide 31 Muddling Through the Mobile Web Slide 32 Muddling Through the Mobile Web Slide 33 Muddling Through the Mobile Web Slide 34 Muddling Through the Mobile Web Slide 35 Muddling Through the Mobile Web Slide 36 Muddling Through the Mobile Web Slide 37 Muddling Through the Mobile Web Slide 38 Muddling Through the Mobile Web Slide 39 Muddling Through the Mobile Web Slide 40 Muddling Through the Mobile Web Slide 41 Muddling Through the Mobile Web Slide 42 Muddling Through the Mobile Web Slide 43 Muddling Through the Mobile Web Slide 44 Muddling Through the Mobile Web Slide 45 Muddling Through the Mobile Web Slide 46 Muddling Through the Mobile Web Slide 47 Muddling Through the Mobile Web Slide 48 Muddling Through the Mobile Web Slide 49 Muddling Through the Mobile Web Slide 50 Muddling Through the Mobile Web Slide 51 Muddling Through the Mobile Web Slide 52 Muddling Through the Mobile Web Slide 53 Muddling Through the Mobile Web Slide 54 Muddling Through the Mobile Web Slide 55 Muddling Through the Mobile Web Slide 56 Muddling Through the Mobile Web Slide 57 Muddling Through the Mobile Web Slide 58 Muddling Through the Mobile Web Slide 59 Muddling Through the Mobile Web Slide 60 Muddling Through the Mobile Web Slide 61 Muddling Through the Mobile Web Slide 62 Muddling Through the Mobile Web Slide 63 Muddling Through the Mobile Web Slide 64 Muddling Through the Mobile Web Slide 65 Muddling Through the Mobile Web Slide 66 Muddling Through the Mobile Web Slide 67 Muddling Through the Mobile Web Slide 68 Muddling Through the Mobile Web Slide 69 Muddling Through the Mobile Web Slide 70 Muddling Through the Mobile Web Slide 71 Muddling Through the Mobile Web Slide 72 Muddling Through the Mobile Web Slide 73 Muddling Through the Mobile Web Slide 74 Muddling Through the Mobile Web Slide 75 Muddling Through the Mobile Web Slide 76 Muddling Through the Mobile Web Slide 77 Muddling Through the Mobile Web Slide 78 Muddling Through the Mobile Web Slide 79 Muddling Through the Mobile Web Slide 80 Muddling Through the Mobile Web Slide 81 Muddling Through the Mobile Web Slide 82 Muddling Through the Mobile Web Slide 83 Muddling Through the Mobile Web Slide 84 Muddling Through the Mobile Web Slide 85 Muddling Through the Mobile Web Slide 86 Muddling Through the Mobile Web Slide 87 Muddling Through the Mobile Web Slide 88 Muddling Through the Mobile Web Slide 89 Muddling Through the Mobile Web Slide 90 Muddling Through the Mobile Web Slide 91 Muddling Through the Mobile Web Slide 92 Muddling Through the Mobile Web Slide 93 Muddling Through the Mobile Web Slide 94 Muddling Through the Mobile Web Slide 95 Muddling Through the Mobile Web Slide 96 Muddling Through the Mobile Web Slide 97 Muddling Through the Mobile Web Slide 98 Muddling Through the Mobile Web Slide 99 Muddling Through the Mobile Web Slide 100 Muddling Through the Mobile Web Slide 101 Muddling Through the Mobile Web Slide 102 Muddling Through the Mobile Web Slide 103 Muddling Through the Mobile Web Slide 104 Muddling Through the Mobile Web Slide 105 Muddling Through the Mobile Web Slide 106 Muddling Through the Mobile Web Slide 107 Muddling Through the Mobile Web Slide 108 Muddling Through the Mobile Web Slide 109 Muddling Through the Mobile Web Slide 110 Muddling Through the Mobile Web Slide 111 Muddling Through the Mobile Web Slide 112 Muddling Through the Mobile Web Slide 113 Muddling Through the Mobile Web Slide 114 Muddling Through the Mobile Web Slide 115 Muddling Through the Mobile Web Slide 116 Muddling Through the Mobile Web Slide 117 Muddling Through the Mobile Web Slide 118 Muddling Through the Mobile Web Slide 119 Muddling Through the Mobile Web Slide 120 Muddling Through the Mobile Web Slide 121 Muddling Through the Mobile Web Slide 122 Muddling Through the Mobile Web Slide 123 Muddling Through the Mobile Web Slide 124 Muddling Through the Mobile Web Slide 125 Muddling Through the Mobile Web Slide 126 Muddling Through the Mobile Web Slide 127 Muddling Through the Mobile Web Slide 128 Muddling Through the Mobile Web Slide 129 Muddling Through the Mobile Web Slide 130 Muddling Through the Mobile Web Slide 131 Muddling Through the Mobile Web Slide 132 Muddling Through the Mobile Web Slide 133 Muddling Through the Mobile Web Slide 134 Muddling Through the Mobile Web Slide 135 Muddling Through the Mobile Web Slide 136 Muddling Through the Mobile Web Slide 137 Muddling Through the Mobile Web Slide 138 Muddling Through the Mobile Web Slide 139 Muddling Through the Mobile Web Slide 140 Muddling Through the Mobile Web Slide 141 Muddling Through the Mobile Web Slide 142 Muddling Through the Mobile Web Slide 143 Muddling Through the Mobile Web Slide 144
Upcoming SlideShare
6° básico b semana del lunes 07 al 11 de noviembre
Next
Download to read offline and view in fullscreen.

113 Likes

Share

Download to read offline

Muddling Through the Mobile Web

Download to read offline

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

Related Books

Free with a 30 day trial from Scribd

See all

Related Audiobooks

Free with a 30 day trial from Scribd

See all

Muddling Through the Mobile Web

  1. Muddling Through the Mobile Web designing for rapid change and increasing diversity http://creativecommons.org/licenses/by/2.0 http://www.flickr.com/photos/booleansplit/2806792407
  2. things are moving pretty quickly these days... http://www.flickr.com/photos/joo0ey/4630950433
  3. until very recently ‘best practice’ was to build a separate mobile site... typically m.domain.com || domain.mobi http://www.forum.nokia.com/Develop/Web/Mobile_web_browsing/Web_templates
  4. but lately, old ideas are being revisited... http://www.alistapart.com/articles/understandingprogressiveenhancement
  5. ...and new ideas are really shaking things up http://www.alistapart.com/articles/responsive-web-design
  6. ...of course the elusive ‘One Web’ still beckons madmen & dreamers http://www.flickr.com/photos/3oheme/4069616710
  7. ...of which we’re pragmatic devotees ;) http://www.flickr.com/photos/aerosolhalos/5134483703
  8. You must have a goal in life. BUT http://www.flickr.com/photos/christopherdombres/4493564844
  9. rethinking mobile web yiibu try to keep an open mind and regularly challenge our beliefs... http://www.flickr.com/photos/fpat/3692425154
  10. this is rhetorical... Are we there yet? http://yiibu.com
  11. ...why are kiwi fruit fuzzy? many questions remain unanswered... http://www.flickr.com/photos/wwworks/2427001802
  12. @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? many Rethinking 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? web no mobile? yes @media no queries? http://yiibu.com
  13. automagically scaling detailed images isn't 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 many web 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
  14. 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 ? y B? many many device dB? one is ? yes one web? yes ? device dB? web? no adapt? no no f yes yes yes care? yes many o care? yes ? UA sni ng? http://yiibu.com
  15. 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 ? yes B? many device dB? one device dB? web? no adapt? yes few yes yes care? yes many http://yiibu.com
  16. 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 available B? 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 desktop apt? no mobile? yes yes? no @media es yes queries? many ce dB? @240 *.mobi? yes web es http://yiibu.com no mobile? yes
  17. every stylesheet is not required 3 columns, really? @font support varies desktop scripts aren't suitable for mobile typically perhaps a bit ambitious? ...what about scripts & stylesheets that aren't suitable? ...a bit late, no? device detect early
  18. too many HTTP...do we requests...simply provide alternates? ...that's 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
  19. ...available bandwidth? ...is orthogonal to... ...screen size? this only deals with codecs - not context*... ...or factors that you just can't detect c.2000... http://www.w3.org/TR/html5/video.html
  20. 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
  21. 'we' being yiibu... obviously delusional ...so we've done a little mild insanity brainstorming... research harmless sketches something else...? prototypes crazy ideas cerebral gymnastics Research is what I’m doing when I don’t know what I’m doing. – Wernher von Braun http://www.flickr.com/photos/humblog/4522388767
  22. server-side media queries and we have a little filters dirty laundry to share... XSLT http://www.flickr.com/photos/katayun/4288456971
  23. ...a selection of content filtering + transformation prototypes http://www.flickr.com/photos/digger_twit/1353837770
  24. g in n er tioes lt a typ t firm roto en fo p nt ns Co ra t rs ... + Fi lte Plan B .D OM server-side media queries... a http://www.flickr.com/photos/mwichary/2614644341
  25. begin with some existing HTML content...
  26. Raw user agent: Mozilla/5.0 (SymbianOS/9.1; U; en-us) AppleWebKit/413 ... Device identified as: Nokia N73 Actual Root Device ID: nokia_n73_ver1 WURFL ID: nokia_n73_ver1_submozilla50 physical_screen_height: 49 columns: 21 dual_orientation: false physical_screen_width: 37 $wurfl->getDevice($id); rows: 6 max_image_width: 229 resolution_height: 320 resolution_width: 240 max_image_height: 260 this is what we're after! ... http://www.tera-wurfl.com/explore/
  27. resolution_width: 240 device property $html->find('img[src]');
  28. resolution_width: 240 device property <img /> <img /> <img />
  29. 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
  30. 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
  31. in n g er tioes lt a typ t firm roto en fo p nt ns Co 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
  32. ...an interesting idea {{mustache}} inspired...
  33. *H AC K* FAIL yet revolting ...an interesting idea that quickly got out of control... {{mustache}} inspired... written in slippery slope PHP hacked together in PHP almost reinvent ed... to (should have been C for speed)... XSLT! ...apologies to @stephenhay
  34. 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 features C 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
  35. ...use XSLT – after all it was made to style content!? WTFF? AIL found massive inspiration yup, that's "99 for XSLT here! Bottles of Beer" in XSLT...? ...we honestly tried, but we @$*#& XSLT! http://www.angelfire.com/tx4/cus/shapes/bottles.html
  36. 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 features C 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
  37. ...eventually we came to accept that we can't get there, from here http://www.flickr.com/photos/awfulshot/180189401
  38. but we did learn two things... http://www.flickr.com/photos/meddygarnet/3390890516
  39. respon sive design & one web the mobile web is really bloody difficult... http://www.flickr.com/photos/vauvau/3466024918
  40. everything we believed about the web today is wrong... http://www.flickr.com/photos/congaman/4059136660
  41. in hindsight...the problem becomes obvious... http://www.flickr.com/photos/sketch22/2460898332
  42. display size/width in the beginning we had computers... 512 x 342 1984 1990 1994 1998 2004 2007
  43. 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
  44. 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
  45. 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
  46. 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
  47. “ 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
  48. yet we're inherently constrained by human factors... http://www.flickr.com/photos/carbonnyc/4213684953
  49. which presents us with one problem... nagging http://www.flickr.com/photos/whiskeytango/471826517
  50. the hell how do we make content meaningful in all of these varied contexts? http://www.flickr.com/photos/izzyplante/4009893952
  51. ...let's first deal with what we mean by 'context'... http://www.flickr.com/photos/sporst/3999795549
  52. con•text [kon-tekst] – the set of circumstances or facts that surround a particular event, situation, etc. http://dictionary.reference.com/browse/context
  53. human beings are a generally unpredictable lot... http://www.flickr.com/photos/collinmesser/4567027786
  54. meaningful determining user context remains an impossible task... http://www.flickr.com/photos/collinmesser/4567027786
  55. meaningful while determining device context is often a much simpler endeavour... and opportunity.. . http://www.flickr.com/photos/hejgustav/3631418869
  56. and stuff you stuff you know wish you didn't... 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
  57. feature detection the client with both client & server working together... device database and the server "first-run" http://www.flickr.com/photos/donkeyhotey/5527263186
  58. first load... http://www.flickr.com/photos/wscullin/3770015203
  59. Hmm, Huston - we have a problem... JavaScript HTML fonts initial request stylesheets images Flash video ...no idea what we can deliver to this client... 1 http://www.flickr.com/photos/wscullin/3770015203
  60. $wurfl->getDevice($id); ...or another dB! PHP, Java, etc. http://www.flickr.com/photos/wscullin/3770015203
  61. 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
  62. 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
  63. be sure to compress them if you can... {    width:{        screen:320    } } http://www.flickr.com/photos/wscullin/3770015203
  64. initial response {    width:{        screen:320    } } http://www.flickr.com/photos/wscullin/3770015203
  65. {    width:{        screen:320    } } 3 detectFeatures(); JavaScript http://www.flickr.com/photos/wscullin/3770015203
  66. {    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
  67. 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
  68. now, send only what's 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 we're playing with instead of WURFL... http://www.flickr.com/photos/wscullin/3770015203
  69. Ogg javascript input methods or profile storage 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
  70. features & constraints device profile but only those that are screen size actually relevant... Flash Embed to us HTML5 JavaScript http://www.flickr.com/photos/dullhunk/4422952742
  71. http://www.flickr.com/photos/aturkus/4040454167
  72. The significant problems we face, cannot be solved at the same level of thinking we were at when we created them. – Albert Einstein
  73. what if what is actual is actually not normal...? http://www.flickr.com/photos/pagedooley/2121472112
  74. and now for a little cerebral gymnastics... http://www.flickr.com/photos/jb-london/4112837448
  75. 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
  76. 1280 1024 a more constrained context first...? 800 natural progression? 512 x 342 640 1024 x 768 ...mobile first? 480 320 x 480 320 1984 1990 1994 1998 2004 2007
  77. and
  78. what would happen if we designed content... http://www.flickr.com/photos/pasteberlusconi/5352932503
  79. in a manner similar to how we design software...? http://www.flickr.com/photos/stephi2006/4428932249
  80. ...could we design content that adapts to 40,000 contexts?
  81. hmm... http://www.flickr.com/photos/seatbelt67/502255276
  82. {insert fave CMS here} most websites today are built using a CMS...
  83. where page templates tend to dominate content... <put content here /> http://www.nytimes.com
  84. monetization focused on delivering ads and providing navigation... longer visits <put content here /> http://www.wired.com/magazine/2011/04/st_thompson_homophily/
  85. <put content here />
  86. 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 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 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. 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
  87. where context is completely irrelevant... http://www.flickr.com/photos/wengs/3938347495
  88. 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
  89. 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 you've never re ad any of Tomi's posts, you're missing out! ;) Sincerely, Bryan 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
  90. “ 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
  91. our assets we treat our content as rubbish with no value... http://www.flickr.com/photos/dnorman/3590132503
  92. ...doh! http://www.flickr.com/photos/proimos/4199675334
  93. which of course provides exciting opportunities for others... http://www.flickr.com/photos/johanl/4816110696
  94. Instapaper Flipboard Readable + Reader in Safari...
  95. 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
  96. and automagically turning it into this...
  97. and this...
  98. http://communities-dominate.blogs.com/brands/2011/02/all-the-numbers-all-the-facts-on-mobile-the- ...and look, we're 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
  99. 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/
  100. #!/usr/bin/perl -w use 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 => "Telsa's 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
  101. but can we... http://www.flickr.com/photos/jaako/218844774
  102. do significantly better than a PDF...?
  103. object database gs, booleans , numbers, strainies, r names, arrays, diction.. . streams and null ...a fascinating little technology... database
  104. %!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 %here's an example call to the "ok_Ellipses" routine 144 144 0 0 24 36 .5 24 [0 0 0 1] ok_Ellipses database application 144 144 0 76 18 60 3 6 [1 0 1 0] ok_Ellipses 144 144 0 76 12 48 2 12 [.8 0 .8 0] ok_Ellipses http://www.adobe.com/products/adobemag/archive/spirogf1.html 144 144 0 78 11 44 2 12 [.6 0 .6 0] ok_Ellipses
  105. but not known for being terribly adaptive...
  106. but the web wasn't designed to be constrained to a single context...
  107. 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?
  108. features & constraints web design is software design... + object model view controller device context ...keep an eye on these!
  109. to a brave, new
  110. content.app content as applications... http://www.flickr.com/photos/colindunn/4479309983
  111. 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? 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 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 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.7 billion 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 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. 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 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 modern conveniences like electricity (5.3 billion people). Or another way? 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 than the 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 people have 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 account per person alive. We'll hit that point roughly at the end of 2013. But I'm using an age-related count-down. So if we allocate all existing active mobile phone accounts 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 every person 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 at the rate of four years of age, per year. By the end of this year we'll be at about age 8... And its everywhere. In the USA the mobile phone penetration rate is rapidly 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 countries are 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 USERS The 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 mobile phone, 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
  112. 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? typography matters Yes, 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 a interested in mobile is: "Put your best people on mobile." Why? Because Mobile today 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 Instapaper 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 near you. This is definitely the "industry of the decade" and we have only begun. So how big is big? Its huge. Lets review Flipboard the numbers. 5.2 BILLION SUBSCRIBERS 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 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 users, 2.0 billion internet users, 2.2 billion people with a banking account, and 3.9 billion radio receivers in use worldwide.
  113. 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? 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 byto and don't be afraid a wide margin, the fastest-growing giant industry on the planet. Because all their ideas... steal major digital technologies are headed to mobile - telecoms, computers, the internet, etc - and all major ie. 'preferences' 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 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. 5.2 BILLION SUBSCRIBERS 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 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 users, 2.0 billion internet users, 2.2 billion people with a banking account, and 3.9 billion radio receivers in use worldwide.
  114. http://www.flickr.com/photos/farleyj/2768941171
  115. /*  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
  116. 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? Yes, Google (outgoing) CEO Eric Schmidt had been saying 'Mobile First' but his latest version 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 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 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. 5.2 BILLION SUBSCRIBERS 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 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 users, 2.0 billion internet users, 2.2 billion people with a banking account, and 3.9 billion radio receivers in use worldwide.
  117. 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? 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 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. 5.2 BILLION SUBSCRIBERS So first the biggest number - 5.2. That is in billions with a B. There are 1.2 billion personal
  118. 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 context device 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
  119. but images can also be... http://www.flickr.com/photos/johanl/4382372758
  120. data ...applications data design elements focus 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
  121. that adapt constraints http://www.flickr.com/photos/johanl/4382372758
  122. focus region to changes... http://www.flickr.com/photos/johanl/4382372758
  123. in context... http://www.flickr.com/photos/johanl/4382372758
  124. 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? 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 coins to banking to credit cards, is headed to a phone near you. This is definitely the
  125. <aside /> #rant http://paulrouget.com/e/infographicsInHTML5
  126. 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 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 the numbers. 5.2 BILLION SUBSCRIBERS 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 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 ...and what about all that text? 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. 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 are we? One way
  127. @bdconf If you're not at #mobilism you can still watch the browser panel at http://mobilism.nl/2011/stream at 16:00 CET! via @ppk ...or for that matter this text?
  128. make it usable and meaningful... http://www.flickr.com/photos/aubergene/970367879
  129. add structure to enable manipulation... http://www.flickr.com/photos/aubergene/970367879
  130. tag identifier @bdconf If you're 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...?
  131. If you're not at #mobilism you can still watch the browser panel at http://mobilism.nl/2011/stream at 16:00 CET! via @ppk this is also recognisable...
  132. 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
  133. typically "Links don't 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
  134. 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 SUBSCRIBERS ion Billions 6 ubscribers 5.2 4.5  computers  in  use 1.2 chart tools API ndline  phones 1.1 3 visualise ed  automobiles  in  use 1.0 on  sets 1.6 1.5 ard  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 television ceivers  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
  • williammdavis

    Feb. 17, 2017
  • NiallLonergan

    Jan. 6, 2016
  • criana1

    Jun. 23, 2015
  • tibortovt5

    Oct. 13, 2014
  • DavidWagoner1

    May. 22, 2014
  • alainpapazoglou

    Jan. 12, 2014
  • leohousen

    Nov. 29, 2013
  • tillwb

    Oct. 23, 2013
  • erikcollier

    Jul. 9, 2013
  • viatropos

    Jul. 9, 2013
  • wesbeyrent

    Apr. 30, 2013
  • stefaniefleisch

    Apr. 12, 2013
  • terryyip1119

    Apr. 3, 2013
  • junk5311

    Mar. 19, 2013
  • KrayF

    Mar. 16, 2013
  • renatoalbano

    Feb. 26, 2013
  • liperuf

    Feb. 24, 2013
  • b4z81

    Feb. 4, 2013
  • leozacha

    Jan. 20, 2013
  • oleksiiponomarenko

    Dec. 28, 2012

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

Views

Total views

92,279

On Slideshare

0

From embeds

0

Number of embeds

4,316

Actions

Downloads

942

Shares

0

Comments

0

Likes

113

×