SlideShare ist ein Scribd-Unternehmen logo
1 von 68
Downloaden Sie, um offline zu lesen
Metrics of the mobile Web
                               State of the fragmentation




 Roland Gülle
Sevenval GmbH




      21. September 2011   www.mobile-devcon.de
about:sevenval

Leading Technologies for
Mobile Web Development
and beyond.
                 Experts in Web Technologies
                 Founded 1999
                 Operating globally
                 O!ces in Germany (HQ), US und UK
                 Strong backup
                 Subsidiary of YOC AG (market-listed)
                 Highly trusted
                 500+ web portals , serving Fortune 500 companies
• Fragmentation
• Metrics
 • Brands / OS / Browser / HTML5
• Future
• Solutions
?
                 at ion exists
• Why  fragment                  on
                  )fra gmentati
         of (Web-
• Kinds        p
 •W  eb vs. Ap
 • WebApps


                        Fragmentation.
In Mobile, fragmentation is forever.
              Deal with it. in AdMob and GetJar
                 Richard Wong, Investor
Why?
regions, people and situations
require a di"erent use of services.
Innovation in mobile is fast. The technology
adaptation lifecycle generates fragmentation at the
user base.
                                                  Time

                   Technology
                                                         Users



Crossing the Chasm by Geo"rey A. Moore
http://en.wikipedia.org/wiki/Crossing_the_Chasm
Web Standards




 Web standards is a general term for the formal standards and other
   technical specifications that define and describe aspects of the
 World Wide Web. In recent years, the term has been more frequently
  associated with the trend of endorsing a set of standardized best
 practices for building web sites, and a philosophy of web design and
              development that includes those methods.

            http://en.wikipedia.org/wiki/Web_standard
The nice thing about

            standards
     is that you have
         so many to choose from.

                        Andrew S. Tanenbaum
                        Author of MINIX and many computer science textbooks,
                        regarded as standard texts in the field.
                        Computer Networks, 2nd ed., p. 254 as cited in http://
                        en.wikiquote.org/wiki/Andrew_S._Tanenbaum
Web or App?
App ≠ Web




     The more you limit an o"ering,                          The more comprehensive your
     the easier it gets to access it                         content gets the more meaningful
     through an App.                                         it gets to access it through the Web.



   “Apps are like Songs“                                 “Cool URIs don't change“
Daniel K. Appelquist                                                                       Tim Berners-Lee
http://www.torgo.com/blog/2009/06/apps-are-like-songs.html             http://www.w3.org/Provider/Style/URI
WebApps ≠ Web Sites



        http://
                pinchzo
                        o   m.com
                                 /posts
           „Budg         /anato
                                my-of-
                   et app              a-htm
                                             l5-mob
            This is         ropriat                 ile-app

      and it         not a w              ely.
             will co            ebsite,
                     st you
                               a lot m
                                             ore.“
Result: Fragmentation.




                    And YOU have to care about it.
e
            a rket Shar
• Vendor M
                    e
         rket Shar
• OS Ma
               ons
 •O  S & Versi
                 re
  • Bro wser Sha             mentatio
                                      n
                         rag
               Markup F
  • HTML5 &

                              Metrics.
metrics: base



    source:             fitml.com (& others)


    date:                       08-11
    sites:                      500+
    page impressions:   1.300.524.157
Handset Brands
Brands: DE
Brands: AT
Brands: UK
Operating Systems
OS: DE
OS: US
OS: Asia




           Nokia OS
           (incl. S40)
OS: iOS
           2%
     7%
            2%                                1%
      7%                                 9%




                             iOS 4.x
                             iOS 3.x
                             iOS 2.x




                 91%
                  91%                               90%
                             2%
                        8%




                                              iOS 4.x
                                              iOS 3.x
                                              iOS 2.x




                                   90%
OS: Android & DE/UK/AT

                      2%
               1%3%


        15%

                                 2.2
                                 2.3
                           45%
                                 2.1
                                 1.5
                                 1.6
                                 Tail

         34%
OS: Android & US

                        2%
                       1%
                  9%




      15%                          2.2
                                   2.3
                             49%   2.1
                                   1.5
                                   1.6
                                   Tail


            24%
OS: Android & Asia

                   1%
                  2%
            12%



                              2.2
      12%                     2.3
                        42%
                              2.1
                              1.5
                              1.6
                              Tail



            31%
Browsers
Browsers: DE/AT

          14%
                      Apple Mobile Safari

     3%               Open Handset Alliance
 4%                   Android Build-In
                42%   Nokia BrowserNG
7%
                      Dolfin

                      Opera Mini

                      Tail
          30%
                                   17%               Open Handset Alliance
                                                     Android Build-In
                                                     Apple Mobile Safari
                             3%
                                               41%
                         4%                          Nokia BrowserNG

                                                     Dolfin
                         9%
                                                     Research In Motion
                                                     Browser
                                                     Tail

                                         26%
Browsers: US


               2% 3%
                             Apple Mobile Safari

     22%                     Open Handset Alliance
                             Android Build-In
                       41%
                             Research In Motion
                             Browser
                             Opera Mini

                             Access Netfront

                             Tail
           31%
Browsers: Asia



                             Apple Mobile Safari
          23%

                       34%   Open Handset Alliance
                             Android Build-In
                             Opera Mini

    5%
                             Nokia BrowserNG

     6%                      Research In Motion
                             Browser
                             Tail
          10%
                 22%
Browsers: Rendering Engines & WebKit Versions
                                Prozent
                 0%   10%   20%   30%     40%   50%                               Webkit
        534.0
        533.0                                                                     Presto
        525.0
        532.0                                                                     Netfront
        528.0
        530.0                                                                     Trident
          Tail
                                                                                  Tail

                 0%   10%     20%       30%     40%            0%   10%   20%   30%   40%   50%
        533.0                                         534.0
        534.0                                         533.0
        525.0                                         528.0
        530.0                                         530.0
        528.0                                         532.0
        532.0                                         525.0
          Tail                                          Tail




                 0%     20%         40%         60%            0%   10%   20%   30%   40%   50%
        534.0                                         534.0
        533.0                                         533.0
        525.0                                         525.0
        528.0                                         528.0
        413.0                                         413.0
        532.0                                         532.0
          Tail                                          Tail
Markup
Support of                input tags
Percentage$of$devices$not$suppor4ng$any$HTML5$input$tags$




                                                              37%$
                                   27%$
                                          25%$

         10%$
                                          21%$




                       There$is$no$device$suppor4ng$all$23$HTML5$input$tags.$
                       Maximum$tags:$19$out$of$23$
Support of OnTouch



                      76%




                58%

       76%              71%

                              58%
Mediaquery


                         Mediaquery
        0%   10%   20%   30%   40%   50%   60%    70%    80%

  DE                                                    74%
  AT                                                    72%
  US                                                70%
 Asia                                       58%
  UK                                       56%
AJAX / JavaScript / DOM Manipulation
                    Script DOM Handling
       0%   10%   20%   30%   40%   50%   60%    70%     80%

 US                                                      75%


 DE                                                    71%


 AT                                               68%


 UK                                        57%


Asia                                      54%
s
• Good New
•B ad News                ge
             ne d Challen
 •T he Redefi




                               Future.
Good News: Everyone is moving to HTML5




http://www.slideshare.net/sevenval/why-html5-is-getting-on-my-nerves
10
                                                                           ce 11-20
                                                                        ren
                                                                tC onfe
                                                           ip
                                                     avascr
                                             on tal J
                                       ll Fr uget
                                     Fu Ro
Bad News: You still have to do it.    Pau
                                           l
The challenge
                            is redefined.
  Keep it running on all handsets/
browsers (including the older ones).
The challenge
                                 is redefined.
   Keep it running on all handsets/
 browsers (including the older ones).




keep your site/app „state of the art“!
               (...and don‘t break it.)
se
• Devic e Databa
•T emplates
              eW  eb Design
 •R esponsiv
             all
 • Combine


                              Solutions.
Device Description Repository
Device Description Repository
Device Description Repository




                                     d Handset
                              1Androi
                earc h: 201
            S
Device Description Repository



                      Hardware
Device Description Repository




            Think about software,
                not hardware.
Templates




            desktop.html
            tablet.html
            smartphone.html
            featurePhone.xhtml
Templates: Separate Clients
                                                               HTM
                                                                     L5 P
                                                                          ART
                                                                             Y!




                  M L5/ n.                         ks if
                                                         the
                HT versio                     he c
             ed                      er, who c enough“.
       b loat CSS3              rkeep „smart
   Full cript/               Doo ce is                                                Simpl
                                                                                              e XH
   ava
       S                       devi                                                               TML
  J                                                                                                  /MP
                                                                                                         V   ersion

           sm
                ar                                                                ture phone
                  tp                                                       fea
                     ho
                        ne
Templates: The party starts.
                           HTM
                                 L5 P
                                      ART
                                         Y!




      sm
           ar                                 ture phone
             tp                        fea
                ho
                   ne
Templates
                       HTM
                             L5 P
                                  ART
                                     Y!




                                                   go  ?
                                               Man




     sm
          ar                              ture phone
            tp                     fea
               ho
                  ne
Templates
                                        HTM
                                              L5 P
                                                   ART
                                                      Y!




                          ndroid?ugh!
                         A eno
                               not
                       This it



     sm
          ar                                               ture phone
            tp                                      fea
               ho
                  ne
Templates
                       HTM
                             L5 P
                                  ART
                                     Y!




     sm
          ar                              ture phone
            tp                     fea
               ho
                  ne
Templates
                       HTM
                             L5 P                                    oin
                                  ART
                                     Y!                   rea dy to j
                                                Not really 5 party...
                                                         ML
                                                 our HT




                            aM   ini
                       Oper



     sm
          ar                              ture phone
            tp                     fea
               ho
                  ne
Templates
                                 HTM
                                       L5 P
                                            ART
                                               Y!




                          Don‘t think in
                       „black-and-white“.
               The world is colorful!
                                  Oper
                                       aM   ini




     sm
          ar                                        ture phone
            tp                               fea
               ho
                  ne
Responsive Web Design

                      @media only screen and (max-device-width: 480px){
                        ...
                      }




<link rel="stylesheet" type="text/css"
  media="only screen and (max-device-width: 480px)"
  href="small-device.css" />



http://www.slideshare.net/yiibu/pragmatic-responsive-design
Responsive Web Design




           One URL, one document.
Responsive Web Design
Responsive Web Design
Responsive Web Design




    Smart Browsers, Developers
       and Designers needed,
     to let it work as expected.            g
                                                   he
                                              e t t ss.
                                      lients proce
                                 all c ent &
                            And cont
                                 e
                             sam
Combine all together
Server & Client Side Adaptation
                        (Us
                             e
                      (Ja r-Age
                            v       n
                     = i aScri t: /i
                          Pho      pt:       Ph
                               ne
                                  4     win one/)
                    HTT                      dow
   src.examples        P(s)                      .de +
                                                    vic
                                    Property            eP             ixe
                                           Detection                         lRa
                                                                                   tio
                                                                                         ===
                    HTT                                                                        2)
  anywebsite.com       P(s)
                                            Device
                                            Device
                                            Client
                                           Database
                    HTT                    Database
 feed.example.com      P(s)
                                          Adaptation
                                              &
                                            Filter
                    HTT
     any API           P(s)
                                                                 yer
                                                / Adap tation La
                                          ion
                              Presentat
                                                Files
Thats our solution :)

                           Sevenval
                        FIT Technology
  FITML
   src.examples
                           Property
                           Detection
   HTML
  anywebsite.com
                            Client
                          Description
XML/RSS                   Repository

 feed.example.com
                            FITML
                           Processor
    JSON
     any API


                           Files
Sevenval FIT
One Technology – Two Products




                Free
                     Pl   an a
                              vaila
                                    bl e   !
         Cloud Solution                        On-Premise
thank you!
                                                                         @sevenval
                                                                            @fitml




                                               Rock the mobile web!
                                                 http://fitml.com
http://www.flickr.com/photos/akira_1972/4376398576
http://www.flickr.com/photos/ethanhein/2298278791
http://www.flickr.com/photos/baldheretic/2902896742
http://www.flickr.com/photos/garryknight/4888370567
http://www.flickr.com/photos/novecentino/1020778171/
http://www.flickr.com/photos/tbrg-dan/3802885100/
http://www.flickr.com/photos/spitzgogo/286917522
http://www.flickr.com/photos/pand0ra23/5176011116
http://www.flickr.com/photos/uberculture/20323507
http://www.flickr.com/photos/mybloodyself/2876923509
http://www.flickr.com/photos/voxpelli/2954947277
http://www.flickr.com/photos/24293932@N00/2752221871
http://www.flickr.com/photos/brykmantra/29475958/
http://www.flickr.com/photos/jenosaur/5313047889
http://www.flickr.com/photos/ronbennetts/5516621911
http://www.flickr.com/photos/matalyn/414083243
http://www.flickr.com/photos/timparkinson/2436223445
http://www.flickr.com/photos/luthercollegearchives/1484927223
                                                                      @rolandguelle

Weitere ähnliche Inhalte

Was ist angesagt?

HTW2011: Thai Tran - Android: Opportunities and challenges
HTW2011: Thai Tran - Android: Opportunities and challengesHTW2011: Thai Tran - Android: Opportunities and challenges
HTW2011: Thai Tran - Android: Opportunities and challenges
How to Web
 
Facebbok Spartan
Facebbok SpartanFacebbok Spartan
Facebbok Spartan
Erol Dizdar
 
Future of Web is Mobile by Dag Olav Norem
Future of Web is Mobile by Dag Olav NoremFuture of Web is Mobile by Dag Olav Norem
Future of Web is Mobile by Dag Olav Norem
MobileMonday Norway
 
CASE STUDY: Leading the Pack in the Chinese and Western Markets
CASE STUDY: Leading the Pack in the Chinese and Western MarketsCASE STUDY: Leading the Pack in the Chinese and Western Markets
CASE STUDY: Leading the Pack in the Chinese and Western Markets
Kantar Media CIC
 
Tablet Metrics From iMonitor
Tablet Metrics From iMonitorTablet Metrics From iMonitor
Tablet Metrics From iMonitor
Dan Vigil
 

Was ist angesagt? (15)

HTW2011: Thai Tran - Android: Opportunities and challenges
HTW2011: Thai Tran - Android: Opportunities and challengesHTW2011: Thai Tran - Android: Opportunities and challenges
HTW2011: Thai Tran - Android: Opportunities and challenges
 
Facebbok Spartan
Facebbok SpartanFacebbok Spartan
Facebbok Spartan
 
Future of Web is Mobile by Dag Olav Norem
Future of Web is Mobile by Dag Olav NoremFuture of Web is Mobile by Dag Olav Norem
Future of Web is Mobile by Dag Olav Norem
 
Começando com Android
Começando com AndroidComeçando com Android
Começando com Android
 
What’s Next in Mobility? Key Areas of Cyberinfrastructure
What’s Next in  Mobility?  Key Areas of CyberinfrastructureWhat’s Next in  Mobility?  Key Areas of Cyberinfrastructure
What’s Next in Mobility? Key Areas of Cyberinfrastructure
 
CASE STUDY: Leading the Pack in the Chinese and Western Markets
CASE STUDY: Leading the Pack in the Chinese and Western MarketsCASE STUDY: Leading the Pack in the Chinese and Western Markets
CASE STUDY: Leading the Pack in the Chinese and Western Markets
 
Cic Study
Cic StudyCic Study
Cic Study
 
Robert Meza - Government on the go
Robert Meza - Government on the goRobert Meza - Government on the go
Robert Meza - Government on the go
 
Project of mobile apps
Project of mobile appsProject of mobile apps
Project of mobile apps
 
Complexity At The Edge How To Maximize The Mobile Opportunity In China
Complexity At The Edge  How To Maximize The Mobile Opportunity In ChinaComplexity At The Edge  How To Maximize The Mobile Opportunity In China
Complexity At The Edge How To Maximize The Mobile Opportunity In China
 
Creating a Case for Mobility - Philly Tech Week
Creating a Case for Mobility - Philly Tech WeekCreating a Case for Mobility - Philly Tech Week
Creating a Case for Mobility - Philly Tech Week
 
iPhone Apps - What, how, why?
iPhone Apps - What, how, why?iPhone Apps - What, how, why?
iPhone Apps - What, how, why?
 
Mobile Web vs. Native Apps | Design4Mobile
Mobile Web vs. Native Apps | Design4MobileMobile Web vs. Native Apps | Design4Mobile
Mobile Web vs. Native Apps | Design4Mobile
 
Tablet Metrics From iMonitor
Tablet Metrics From iMonitorTablet Metrics From iMonitor
Tablet Metrics From iMonitor
 
一秒間にソーシャルとモバイルで何が起きているか
一秒間にソーシャルとモバイルで何が起きているか一秒間にソーシャルとモバイルで何が起きているか
一秒間にソーシャルとモバイルで何が起きているか
 

Ähnlich wie Mobile devcon metrics of the mobile web

Android Workshop Session 1
Android Workshop Session 1Android Workshop Session 1
Android Workshop Session 1
NAILBITER
 
Philly ete-2011
Philly ete-2011Philly ete-2011
Philly ete-2011
davyjones
 
Mobile Developer's Guide To The Galaxy, 5th edition
Mobile Developer's Guide To The Galaxy, 5th editionMobile Developer's Guide To The Galaxy, 5th edition
Mobile Developer's Guide To The Galaxy, 5th edition
Marco Tabor
 
Ugly truths about html5 moosecon - robert virkus - 2013-03-07
Ugly truths about html5   moosecon - robert virkus - 2013-03-07Ugly truths about html5   moosecon - robert virkus - 2013-03-07
Ugly truths about html5 moosecon - robert virkus - 2013-03-07
Enough Software
 
Day1 what is android(print)
Day1 what is android(print)Day1 what is android(print)
Day1 what is android(print)
Dongchul Shin
 
HTML5 is the Future of Mobile, PhoneGap Takes You There Today
HTML5 is the Future of Mobile, PhoneGap Takes You There TodayHTML5 is the Future of Mobile, PhoneGap Takes You There Today
HTML5 is the Future of Mobile, PhoneGap Takes You There Today
davyjones
 

Ähnlich wie Mobile devcon metrics of the mobile web (20)

Fighting Fragmentation with Fragments
Fighting Fragmentation with FragmentsFighting Fragmentation with Fragments
Fighting Fragmentation with Fragments
 
Developers Guide To The Galaxy 8th edition
Developers Guide To The Galaxy 8th editionDevelopers Guide To The Galaxy 8th edition
Developers Guide To The Galaxy 8th edition
 
Android Workshop Session 1
Android Workshop Session 1Android Workshop Session 1
Android Workshop Session 1
 
The Chronicles of a Mobile-Web Economy
The Chronicles of a Mobile-Web EconomyThe Chronicles of a Mobile-Web Economy
The Chronicles of a Mobile-Web Economy
 
Android Fundamentals & Figures of 2012
Android Fundamentals & Figures of 2012Android Fundamentals & Figures of 2012
Android Fundamentals & Figures of 2012
 
Mobile Developer's Guide To The Galaxy Vol.7
Mobile Developer's Guide To The Galaxy Vol.7Mobile Developer's Guide To The Galaxy Vol.7
Mobile Developer's Guide To The Galaxy Vol.7
 
Android By Manish Seth
Android By Manish SethAndroid By Manish Seth
Android By Manish Seth
 
Philly ete-2011
Philly ete-2011Philly ete-2011
Philly ete-2011
 
De fluwelen revolutie van android
De fluwelen revolutie van androidDe fluwelen revolutie van android
De fluwelen revolutie van android
 
Mobile Developer's Guide To The Galaxy, 5th edition
Mobile Developer's Guide To The Galaxy, 5th editionMobile Developer's Guide To The Galaxy, 5th edition
Mobile Developer's Guide To The Galaxy, 5th edition
 
Accenture Mobility MWC 2012 - Bubble over barcelona - lars kamp
Accenture Mobility MWC 2012 - Bubble over barcelona - lars kampAccenture Mobility MWC 2012 - Bubble over barcelona - lars kamp
Accenture Mobility MWC 2012 - Bubble over barcelona - lars kamp
 
Mobile development : reaching critical mass
Mobile development : reaching critical massMobile development : reaching critical mass
Mobile development : reaching critical mass
 
Is Free Software here to stay?
Is Free Software here to stay?Is Free Software here to stay?
Is Free Software here to stay?
 
Mobile Apps - The Business & Technology
Mobile Apps - The Business & TechnologyMobile Apps - The Business & Technology
Mobile Apps - The Business & Technology
 
Platform war in mwc 2013
Platform war in mwc 2013Platform war in mwc 2013
Platform war in mwc 2013
 
Ugly truths about html5 moosecon - robert virkus - 2013-03-07
Ugly truths about html5   moosecon - robert virkus - 2013-03-07Ugly truths about html5   moosecon - robert virkus - 2013-03-07
Ugly truths about html5 moosecon - robert virkus - 2013-03-07
 
Day1 what is android(print)
Day1 what is android(print)Day1 what is android(print)
Day1 what is android(print)
 
Mobile Developers Guide To The Galaxy Vol.6
Mobile Developers Guide To The Galaxy Vol.6Mobile Developers Guide To The Galaxy Vol.6
Mobile Developers Guide To The Galaxy Vol.6
 
HTML5 is the Future of Mobile, PhoneGap Takes You There Today
HTML5 is the Future of Mobile, PhoneGap Takes You There TodayHTML5 is the Future of Mobile, PhoneGap Takes You There Today
HTML5 is the Future of Mobile, PhoneGap Takes You There Today
 
Appium - Reality check on the world’s leading Open Source Framework for Mobil...
Appium - Reality check on the world’s leading Open Source Framework for Mobil...Appium - Reality check on the world’s leading Open Source Framework for Mobil...
Appium - Reality check on the world’s leading Open Source Framework for Mobil...
 

Mehr von Avenga Germany GmbH

1400710 sevenva device_trends_2014
1400710 sevenva device_trends_20141400710 sevenva device_trends_2014
1400710 sevenva device_trends_2014
Avenga Germany GmbH
 

Mehr von Avenga Germany GmbH (20)

HTTP/2 turns 3 years old // Web Performance Meetup wao.io 20180612
HTTP/2 turns 3 years old // Web Performance Meetup wao.io 20180612HTTP/2 turns 3 years old // Web Performance Meetup wao.io 20180612
HTTP/2 turns 3 years old // Web Performance Meetup wao.io 20180612
 
Sevenval Company Presentation 2017 (EN)
Sevenval Company Presentation 2017 (EN)Sevenval Company Presentation 2017 (EN)
Sevenval Company Presentation 2017 (EN)
 
Sevenval Company Presentation 2017 (DE)
Sevenval Company Presentation 2017 (DE)Sevenval Company Presentation 2017 (DE)
Sevenval Company Presentation 2017 (DE)
 
2015 sevenval mobile-trends_september
2015 sevenval mobile-trends_september2015 sevenval mobile-trends_september
2015 sevenval mobile-trends_september
 
2015 sevenval mobile-trends_september
2015 sevenval mobile-trends_september2015 sevenval mobile-trends_september
2015 sevenval mobile-trends_september
 
2015 sevenval device-trends_august
2015 sevenval device-trends_august2015 sevenval device-trends_august
2015 sevenval device-trends_august
 
2015 sevenval device-trends-july
2015 sevenval device-trends-july2015 sevenval device-trends-july
2015 sevenval device-trends-july
 
2015 sevenval device-trends-june
2015 sevenval device-trends-june2015 sevenval device-trends-june
2015 sevenval device-trends-june
 
sevenval device Trends may 2015
sevenval device Trends may 2015 sevenval device Trends may 2015
sevenval device Trends may 2015
 
Mobile Monday Austria 20150601 mobilegeddon
Mobile Monday Austria 20150601 mobilegeddonMobile Monday Austria 20150601 mobilegeddon
Mobile Monday Austria 20150601 mobilegeddon
 
2015 sevenval device-trends-april
2015 sevenval device-trends-april2015 sevenval device-trends-april
2015 sevenval device-trends-april
 
2015 sevenval device-trends-march
2015 sevenval device-trends-march2015 sevenval device-trends-march
2015 sevenval device-trends-march
 
2015 sevenval device-trends-feb
2015 sevenval device-trends-feb2015 sevenval device-trends-feb
2015 sevenval device-trends-feb
 
Sevenval_device_trends-january2015
Sevenval_device_trends-january2015Sevenval_device_trends-january2015
Sevenval_device_trends-january2015
 
Sevenval_device_trends-january2015
Sevenval_device_trends-january2015Sevenval_device_trends-january2015
Sevenval_device_trends-january2015
 
20152601 sevenval_device_trends_dezc
20152601  sevenval_device_trends_dezc20152601  sevenval_device_trends_dezc
20152601 sevenval_device_trends_dezc
 
Sevenval Device Trends November 2014
Sevenval Device Trends November 2014Sevenval Device Trends November 2014
Sevenval Device Trends November 2014
 
2014 09 device_trends sevenval-1
2014 09 device_trends sevenval-12014 09 device_trends sevenval-1
2014 09 device_trends sevenval-1
 
1400710 sevenva device_trends_2014
1400710 sevenva device_trends_20141400710 sevenva device_trends_2014
1400710 sevenva device_trends_2014
 
100607 device trends_2014-2
100607 device trends_2014-2100607 device trends_2014-2
100607 device trends_2014-2
 

Kürzlich hochgeladen

Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Safe Software
 

Kürzlich hochgeladen (20)

Introduction to Multilingual Retrieval Augmented Generation (RAG)
Introduction to Multilingual Retrieval Augmented Generation (RAG)Introduction to Multilingual Retrieval Augmented Generation (RAG)
Introduction to Multilingual Retrieval Augmented Generation (RAG)
 
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin WoodPolkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
 
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
 
presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century education
 
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ..."I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
 
Exploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusExploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with Milvus
 
Six Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal OntologySix Myths about Ontologies: The Basics of Formal Ontology
Six Myths about Ontologies: The Basics of Formal Ontology
 
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWEREMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
 
MS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectorsMS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectors
 
[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf
 
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyArtificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : Uncertainty
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor Presentation
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
 
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
 
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptx
 
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
 

Mobile devcon metrics of the mobile web

  • 1. Metrics of the mobile Web State of the fragmentation Roland Gülle Sevenval GmbH 21. September 2011 www.mobile-devcon.de
  • 2. about:sevenval Leading Technologies for Mobile Web Development and beyond. Experts in Web Technologies Founded 1999 Operating globally O!ces in Germany (HQ), US und UK Strong backup Subsidiary of YOC AG (market-listed) Highly trusted 500+ web portals , serving Fortune 500 companies
  • 3.
  • 4. • Fragmentation • Metrics • Brands / OS / Browser / HTML5 • Future • Solutions
  • 5. ? at ion exists • Why fragment on )fra gmentati of (Web- • Kinds p •W eb vs. Ap • WebApps Fragmentation.
  • 6. In Mobile, fragmentation is forever. Deal with it. in AdMob and GetJar Richard Wong, Investor
  • 8. regions, people and situations require a di"erent use of services.
  • 9. Innovation in mobile is fast. The technology adaptation lifecycle generates fragmentation at the user base. Time Technology Users Crossing the Chasm by Geo"rey A. Moore http://en.wikipedia.org/wiki/Crossing_the_Chasm
  • 10. Web Standards Web standards is a general term for the formal standards and other technical specifications that define and describe aspects of the World Wide Web. In recent years, the term has been more frequently associated with the trend of endorsing a set of standardized best practices for building web sites, and a philosophy of web design and development that includes those methods. http://en.wikipedia.org/wiki/Web_standard
  • 11. The nice thing about standards is that you have so many to choose from. Andrew S. Tanenbaum Author of MINIX and many computer science textbooks, regarded as standard texts in the field. Computer Networks, 2nd ed., p. 254 as cited in http:// en.wikiquote.org/wiki/Andrew_S._Tanenbaum
  • 13. App ≠ Web The more you limit an o"ering, The more comprehensive your the easier it gets to access it content gets the more meaningful through an App. it gets to access it through the Web. “Apps are like Songs“ “Cool URIs don't change“ Daniel K. Appelquist Tim Berners-Lee http://www.torgo.com/blog/2009/06/apps-are-like-songs.html http://www.w3.org/Provider/Style/URI
  • 14. WebApps ≠ Web Sites http:// pinchzo o m.com /posts „Budg /anato my-of- et app a-htm l5-mob This is ropriat ile-app and it not a w ely. will co ebsite, st you a lot m ore.“
  • 15. Result: Fragmentation. And YOU have to care about it.
  • 16. e a rket Shar • Vendor M e rket Shar • OS Ma ons •O S & Versi re • Bro wser Sha mentatio n rag Markup F • HTML5 & Metrics.
  • 17. metrics: base source: fitml.com (& others) date: 08-11 sites: 500+ page impressions: 1.300.524.157
  • 25. OS: Asia Nokia OS (incl. S40)
  • 26. OS: iOS 2% 7% 2% 1% 7% 9% iOS 4.x iOS 3.x iOS 2.x 91% 91% 90% 2% 8% iOS 4.x iOS 3.x iOS 2.x 90%
  • 27. OS: Android & DE/UK/AT 2% 1%3% 15% 2.2 2.3 45% 2.1 1.5 1.6 Tail 34%
  • 28. OS: Android & US 2% 1% 9% 15% 2.2 2.3 49% 2.1 1.5 1.6 Tail 24%
  • 29. OS: Android & Asia 1% 2% 12% 2.2 12% 2.3 42% 2.1 1.5 1.6 Tail 31%
  • 31. Browsers: DE/AT 14% Apple Mobile Safari 3% Open Handset Alliance 4% Android Build-In 42% Nokia BrowserNG 7% Dolfin Opera Mini Tail 30% 17% Open Handset Alliance Android Build-In Apple Mobile Safari 3% 41% 4% Nokia BrowserNG Dolfin 9% Research In Motion Browser Tail 26%
  • 32. Browsers: US 2% 3% Apple Mobile Safari 22% Open Handset Alliance Android Build-In 41% Research In Motion Browser Opera Mini Access Netfront Tail 31%
  • 33. Browsers: Asia Apple Mobile Safari 23% 34% Open Handset Alliance Android Build-In Opera Mini 5% Nokia BrowserNG 6% Research In Motion Browser Tail 10% 22%
  • 34. Browsers: Rendering Engines & WebKit Versions Prozent 0% 10% 20% 30% 40% 50% Webkit 534.0 533.0 Presto 525.0 532.0 Netfront 528.0 530.0 Trident Tail Tail 0% 10% 20% 30% 40% 0% 10% 20% 30% 40% 50% 533.0 534.0 534.0 533.0 525.0 528.0 530.0 530.0 528.0 532.0 532.0 525.0 Tail Tail 0% 20% 40% 60% 0% 10% 20% 30% 40% 50% 534.0 534.0 533.0 533.0 525.0 525.0 528.0 528.0 413.0 413.0 532.0 532.0 Tail Tail
  • 36. Support of input tags Percentage$of$devices$not$suppor4ng$any$HTML5$input$tags$ 37%$ 27%$ 25%$ 10%$ 21%$ There$is$no$device$suppor4ng$all$23$HTML5$input$tags.$ Maximum$tags:$19$out$of$23$
  • 37. Support of OnTouch 76% 58% 76% 71% 58%
  • 38. Mediaquery Mediaquery 0% 10% 20% 30% 40% 50% 60% 70% 80% DE 74% AT 72% US 70% Asia 58% UK 56%
  • 39. AJAX / JavaScript / DOM Manipulation Script DOM Handling 0% 10% 20% 30% 40% 50% 60% 70% 80% US 75% DE 71% AT 68% UK 57% Asia 54%
  • 40. s • Good New •B ad News ge ne d Challen •T he Redefi Future.
  • 41. Good News: Everyone is moving to HTML5 http://www.slideshare.net/sevenval/why-html5-is-getting-on-my-nerves
  • 42. 10 ce 11-20 ren tC onfe ip avascr on tal J ll Fr uget Fu Ro Bad News: You still have to do it. Pau l
  • 43. The challenge is redefined. Keep it running on all handsets/ browsers (including the older ones).
  • 44. The challenge is redefined. Keep it running on all handsets/ browsers (including the older ones). keep your site/app „state of the art“! (...and don‘t break it.)
  • 45. se • Devic e Databa •T emplates eW eb Design •R esponsiv all • Combine Solutions.
  • 48. Device Description Repository d Handset 1Androi earc h: 201 S
  • 50. Device Description Repository Think about software, not hardware.
  • 51. Templates desktop.html tablet.html smartphone.html featurePhone.xhtml
  • 52. Templates: Separate Clients HTM L5 P ART Y! M L5/ n. ks if the HT versio he c ed er, who c enough“. b loat CSS3 rkeep „smart Full cript/ Doo ce is Simpl e XH ava S devi TML J /MP V ersion sm ar ture phone tp fea ho ne
  • 53. Templates: The party starts. HTM L5 P ART Y! sm ar ture phone tp fea ho ne
  • 54. Templates HTM L5 P ART Y! go ? Man sm ar ture phone tp fea ho ne
  • 55. Templates HTM L5 P ART Y! ndroid?ugh! A eno not This it sm ar ture phone tp fea ho ne
  • 56. Templates HTM L5 P ART Y! sm ar ture phone tp fea ho ne
  • 57. Templates HTM L5 P oin ART Y! rea dy to j Not really 5 party... ML our HT aM ini Oper sm ar ture phone tp fea ho ne
  • 58. Templates HTM L5 P ART Y! Don‘t think in „black-and-white“. The world is colorful! Oper aM ini sm ar ture phone tp fea ho ne
  • 59. Responsive Web Design @media only screen and (max-device-width: 480px){ ... } <link rel="stylesheet" type="text/css" media="only screen and (max-device-width: 480px)" href="small-device.css" /> http://www.slideshare.net/yiibu/pragmatic-responsive-design
  • 60. Responsive Web Design One URL, one document.
  • 63. Responsive Web Design Smart Browsers, Developers and Designers needed, to let it work as expected. g he e t t ss. lients proce all c ent & And cont e sam
  • 65. Server & Client Side Adaptation (Us e (Ja r-Age v n = i aScri t: /i Pho pt: Ph ne 4 win one/) HTT dow src.examples P(s) .de + vic Property eP ixe Detection lRa tio === HTT 2) anywebsite.com P(s) Device Device Client Database HTT Database feed.example.com P(s) Adaptation & Filter HTT any API P(s) yer / Adap tation La ion Presentat Files
  • 66. Thats our solution :) Sevenval FIT Technology FITML src.examples Property Detection HTML anywebsite.com Client Description XML/RSS Repository feed.example.com FITML Processor JSON any API Files
  • 67. Sevenval FIT One Technology – Two Products Free Pl an a vaila bl e ! Cloud Solution On-Premise
  • 68. thank you! @sevenval @fitml Rock the mobile web! http://fitml.com http://www.flickr.com/photos/akira_1972/4376398576 http://www.flickr.com/photos/ethanhein/2298278791 http://www.flickr.com/photos/baldheretic/2902896742 http://www.flickr.com/photos/garryknight/4888370567 http://www.flickr.com/photos/novecentino/1020778171/ http://www.flickr.com/photos/tbrg-dan/3802885100/ http://www.flickr.com/photos/spitzgogo/286917522 http://www.flickr.com/photos/pand0ra23/5176011116 http://www.flickr.com/photos/uberculture/20323507 http://www.flickr.com/photos/mybloodyself/2876923509 http://www.flickr.com/photos/voxpelli/2954947277 http://www.flickr.com/photos/24293932@N00/2752221871 http://www.flickr.com/photos/brykmantra/29475958/ http://www.flickr.com/photos/jenosaur/5313047889 http://www.flickr.com/photos/ronbennetts/5516621911 http://www.flickr.com/photos/matalyn/414083243 http://www.flickr.com/photos/timparkinson/2436223445 http://www.flickr.com/photos/luthercollegearchives/1484927223 @rolandguelle