SlideShare une entreprise Scribd logo
1  sur  45
Télécharger pour lire hors ligne
Mobile
HTML, CSS, JavaScript
       David Calhoun
Mobile HTML, CSS, and JavaScript
Viewport Meta Tag




   :(        :)
Viewport Meta Tag

<meta name="viewport"
content="width=device-width"/>
URI Schemes




href="sms:18005555555"   href="tel:18005555555"
Home Screen Icon




          Android too!
Home Screen Icon

<link rel="apple-touch-icon"
href="icon.png"/>
Full Screen Flag (iOS)


         vs
Full Screen Flag (iOS)


<meta name="apple-mobile-web-
app-capable" content="yes"/>
Splash Screen (iOS)
       <link rel="apple-touch-
       startup-image"
       href="startup.png"/>
Status Bar Style
Default         Black
Status Bar Style

<meta name="apple-mobile-web-
app-status-bar-style"
content="black"/>
<input type=”search”>
<input type=”tel”>
<input type=”email”>
Media Capture




                3.0
Media Capture

• Opens straight to the camera or
  microphone for file input




                                    3.0
Media Capture

 • Opens straight to the camera or
    microphone for file input

<input type="file" accept="image/*;capture=camera"/>




                                                       3.0
Media Capture

 • Opens straight to the camera or
    microphone for file input

<input type="file" accept="image/*;capture=camera"/>
<input type="file" accept="video/*;capture=camcorder"/>




                                                          3.0
Media Capture

 • Opens straight to the camera or
    microphone for file input

<input type="file" accept="image/*;capture=camera"/>
<input type="file" accept="video/*;capture=camcorder"/>
<input type="file" accept="audio/*;capture=microphone"/>




                                                           3.0
The Joys of Autocorrect
Controlling autocorrect
<input autocorrect="off"
autocomplete="off"
autocapitalize="off"/>
Mobile HTML, CSS, and JavaScript
Media Queries

• based on screen size and device size
• based on orientation
• based on screen resolution
• etc...
Media Queries
@media   all and (max-width: 480px) {
  body   { }
}
@media   all and (max-device-width: 480px) { }
@media   all and (orientation: portrait) { }
tap-highlight-color
        .no-highlight {
          -webkit-tap-highlight-color:
        transparent;
        }

        .red-highlight {
          -webkit-tap-highlight-color:
        red;
        }
user-select

     .no-user-select {
       -webkit-user-select: none;
       -moz-user-select: none;
       user-select: none;
     }




                      ?
touch-callout

                   .no-callout {
                     -webkit-touch-callout:
                   none;
                   }




Default behavior
JavaScript
Touch Events

         • touchstart
         • touchmove
         • touchend
         • (touchcancel)
Touch Events
document.addEventListener('touchstart',
function(e){
  //e.touches
  //e.changedTouches
}, false);




http://frontendstuff.com/javascript/examples/touch.html
Gesture Events (iOS)

            • iOS only
            • 2+ fingers
            • gesturestart
            • gesturechange
            • gestureend
Gesture Events (iOS)
  document.addEventListener('gesturestart',
  function(e){
    //e.scale
    //e.rotation
  }, false);




http://frontendstuff.com/javascript/examples/gesture.html
orientationchange
// fired every 90 degrees of rotation
window.addEventListener('orientationchange',
function(e){
  //window.orientation (0 is portrait, 90 and
-90 are landscape)
}, false);
deviceorientation
   • taps into the gyroscope
   • not just every 90 degrees



                                                  3.0       4.2
http://frontendstuff.com/javascript/examples/deviceorientation.html
deviceorientation

// fired a LOT
window.addEventListener('deviceorientation', function(e){
  //e.alpha;
  //e.beta;
  //e.gamma;
}, false);
devicemotion
                                         • taps into accelerometer
                                         • practical application: shake
                                              gesture?




                                                                3.0           4.2
http://developer.apple.com/library/safari/#documentation/SafariDOMAdditions/Reference/
        DeviceMotionEventClassRef/DeviceMotionEvent/DeviceMotionEvent.html
devicemotion
 window.addEventListener('devicemotion', function (e){
   // e.accelerationIncludingGravity.x
   // e.accelerationIncludingGravity.y
   // e.accelerationIncludingGravity.z
 }, false);




http://frontendstuff.com/javascript/examples/devicemotion.html
window.devicePixelRatio
window.devicePixelRatio


• 1.5 (Nexus One, etc.)
• 2 (iPhone 4, etc.)
navigator.connection
     (Android)
  {
      "type": "3",
      "UNKNOWN": "0",
      "ETHERNET": "1",
      "WIFI": "2",
      "CELL_2G": "3",
      "CELL_3G": "4"
  }                      2.2
navigator.connection
       (Android)

navigator.connection.CELL_3G
navigator.connection.CELL_2G
navigator.connection.WIFI
Mobile JavaScript Libraries




                       and much more...

  http://davidbcalhoun.com/2010/mobile-javascript-libraries-and-frameworks
Photo Credits
   •   http://www.flickr.com/photos/kk/106960641/

   •   http://www.flickr.com/photos/geirarne/110995239/

   •   http://www.flickr.com/photos/aldrin_muya/3133715902/

   •   http://crockfordfacts.com/

   •   http://www.flickr.com/photos/equanimity/535648833/

   •   http://www.flickr.com/photos/71518947@N00/4698968858/
That’s All Folks!
• Twitter: @franksvalli
• SpeakerRate: http://bit.ly/hMEEfo

Contenu connexe

Tendances

Design patterns revisited with PHP 5.3
Design patterns revisited with PHP 5.3Design patterns revisited with PHP 5.3
Design patterns revisited with PHP 5.3Fabien Potencier
 
Building Web Sites that Work Everywhere
Building Web Sites that Work EverywhereBuilding Web Sites that Work Everywhere
Building Web Sites that Work EverywhereDoris Chen
 
High Performance JavaScript (CapitolJS 2011)
High Performance JavaScript (CapitolJS 2011)High Performance JavaScript (CapitolJS 2011)
High Performance JavaScript (CapitolJS 2011)Nicholas Zakas
 
Angular를 활용한 웹 프론트단 개발과 2.0에서 달라진점
Angular를 활용한 웹 프론트단 개발과 2.0에서 달라진점Angular를 활용한 웹 프론트단 개발과 2.0에서 달라진점
Angular를 활용한 웹 프론트단 개발과 2.0에서 달라진점Jeado Ko
 
09 - express nodes on the right angle - vitaliy basyuk - it event 2013 (5)
09 - express nodes on the right angle - vitaliy basyuk - it event 2013 (5)09 - express nodes on the right angle - vitaliy basyuk - it event 2013 (5)
09 - express nodes on the right angle - vitaliy basyuk - it event 2013 (5)Igor Bronovskyy
 
Building scalable applications with angular js
Building scalable applications with angular jsBuilding scalable applications with angular js
Building scalable applications with angular jsAndrew Alpert
 
jQuery Anti-Patterns for Performance & Compression
jQuery Anti-Patterns for Performance & CompressionjQuery Anti-Patterns for Performance & Compression
jQuery Anti-Patterns for Performance & CompressionPaul Irish
 
Bootstrap과 UI-Bootstrap
Bootstrap과 UI-BootstrapBootstrap과 UI-Bootstrap
Bootstrap과 UI-BootstrapWebFrameworks
 
Angular or Backbone: Go Mobile!
Angular or Backbone: Go Mobile!Angular or Backbone: Go Mobile!
Angular or Backbone: Go Mobile!Doris Chen
 
the 5 layers of web accessibility - Open Web Camp II
the 5 layers of web accessibility - Open Web Camp IIthe 5 layers of web accessibility - Open Web Camp II
the 5 layers of web accessibility - Open Web Camp IIDirk Ginader
 
#NoXML: Eliminating XML in Spring Projects - SpringOne 2GX 2015
#NoXML: Eliminating XML in Spring Projects - SpringOne 2GX 2015#NoXML: Eliminating XML in Spring Projects - SpringOne 2GX 2015
#NoXML: Eliminating XML in Spring Projects - SpringOne 2GX 2015Matt Raible
 
Building a Startup Stack with AngularJS
Building a Startup Stack with AngularJSBuilding a Startup Stack with AngularJS
Building a Startup Stack with AngularJSFITC
 
The DOM is a Mess @ Yahoo
The DOM is a Mess @ YahooThe DOM is a Mess @ Yahoo
The DOM is a Mess @ Yahoojeresig
 
JavaScript Presentation Frameworks and Libraries
JavaScript Presentation Frameworks and LibrariesJavaScript Presentation Frameworks and Libraries
JavaScript Presentation Frameworks and LibrariesOleksii Prohonnyi
 
Getting touchy - an introduction to touch events / Web Standards Days / Mosco...
Getting touchy - an introduction to touch events / Web Standards Days / Mosco...Getting touchy - an introduction to touch events / Web Standards Days / Mosco...
Getting touchy - an introduction to touch events / Web Standards Days / Mosco...Patrick Lauke
 
Enjoy the vue.js
Enjoy the vue.jsEnjoy the vue.js
Enjoy the vue.jsTechExeter
 
HTML5: where flash isn't needed anymore
HTML5: where flash isn't needed anymoreHTML5: where flash isn't needed anymore
HTML5: where flash isn't needed anymoreRemy Sharp
 
HTML5 and the dawn of rich mobile web applications pt 1
HTML5 and the dawn of rich mobile web applications pt 1HTML5 and the dawn of rich mobile web applications pt 1
HTML5 and the dawn of rich mobile web applications pt 1James Pearce
 

Tendances (20)

Design patterns revisited with PHP 5.3
Design patterns revisited with PHP 5.3Design patterns revisited with PHP 5.3
Design patterns revisited with PHP 5.3
 
Building Web Sites that Work Everywhere
Building Web Sites that Work EverywhereBuilding Web Sites that Work Everywhere
Building Web Sites that Work Everywhere
 
High Performance JavaScript (CapitolJS 2011)
High Performance JavaScript (CapitolJS 2011)High Performance JavaScript (CapitolJS 2011)
High Performance JavaScript (CapitolJS 2011)
 
Angular를 활용한 웹 프론트단 개발과 2.0에서 달라진점
Angular를 활용한 웹 프론트단 개발과 2.0에서 달라진점Angular를 활용한 웹 프론트단 개발과 2.0에서 달라진점
Angular를 활용한 웹 프론트단 개발과 2.0에서 달라진점
 
09 - express nodes on the right angle - vitaliy basyuk - it event 2013 (5)
09 - express nodes on the right angle - vitaliy basyuk - it event 2013 (5)09 - express nodes on the right angle - vitaliy basyuk - it event 2013 (5)
09 - express nodes on the right angle - vitaliy basyuk - it event 2013 (5)
 
Building scalable applications with angular js
Building scalable applications with angular jsBuilding scalable applications with angular js
Building scalable applications with angular js
 
jQuery Anti-Patterns for Performance & Compression
jQuery Anti-Patterns for Performance & CompressionjQuery Anti-Patterns for Performance & Compression
jQuery Anti-Patterns for Performance & Compression
 
Bootstrap과 UI-Bootstrap
Bootstrap과 UI-BootstrapBootstrap과 UI-Bootstrap
Bootstrap과 UI-Bootstrap
 
Angular or Backbone: Go Mobile!
Angular or Backbone: Go Mobile!Angular or Backbone: Go Mobile!
Angular or Backbone: Go Mobile!
 
the 5 layers of web accessibility - Open Web Camp II
the 5 layers of web accessibility - Open Web Camp IIthe 5 layers of web accessibility - Open Web Camp II
the 5 layers of web accessibility - Open Web Camp II
 
#NoXML: Eliminating XML in Spring Projects - SpringOne 2GX 2015
#NoXML: Eliminating XML in Spring Projects - SpringOne 2GX 2015#NoXML: Eliminating XML in Spring Projects - SpringOne 2GX 2015
#NoXML: Eliminating XML in Spring Projects - SpringOne 2GX 2015
 
Building a Startup Stack with AngularJS
Building a Startup Stack with AngularJSBuilding a Startup Stack with AngularJS
Building a Startup Stack with AngularJS
 
The DOM is a Mess @ Yahoo
The DOM is a Mess @ YahooThe DOM is a Mess @ Yahoo
The DOM is a Mess @ Yahoo
 
Dan Webb Presentation
Dan Webb PresentationDan Webb Presentation
Dan Webb Presentation
 
JavaScript Presentation Frameworks and Libraries
JavaScript Presentation Frameworks and LibrariesJavaScript Presentation Frameworks and Libraries
JavaScript Presentation Frameworks and Libraries
 
Getting touchy - an introduction to touch events / Web Standards Days / Mosco...
Getting touchy - an introduction to touch events / Web Standards Days / Mosco...Getting touchy - an introduction to touch events / Web Standards Days / Mosco...
Getting touchy - an introduction to touch events / Web Standards Days / Mosco...
 
Enjoy the vue.js
Enjoy the vue.jsEnjoy the vue.js
Enjoy the vue.js
 
HTML5: where flash isn't needed anymore
HTML5: where flash isn't needed anymoreHTML5: where flash isn't needed anymore
HTML5: where flash isn't needed anymore
 
HTML5 and the dawn of rich mobile web applications pt 1
HTML5 and the dawn of rich mobile web applications pt 1HTML5 and the dawn of rich mobile web applications pt 1
HTML5 and the dawn of rich mobile web applications pt 1
 
Symfony2 and AngularJS
Symfony2 and AngularJSSymfony2 and AngularJS
Symfony2 and AngularJS
 

En vedette

Understanding & Designing for the Mobile Web
Understanding & Designing for the Mobile WebUnderstanding & Designing for the Mobile Web
Understanding & Designing for the Mobile WebWebFX
 
Kullanilabilirlik Sözlüğü
Kullanilabilirlik SözlüğüKullanilabilirlik Sözlüğü
Kullanilabilirlik SözlüğüUserspots
 
iPhone Web Applications: HTML5, CSS3 & dev tips for iPhone development
iPhone Web Applications: HTML5, CSS3 & dev tips for iPhone developmentiPhone Web Applications: HTML5, CSS3 & dev tips for iPhone development
iPhone Web Applications: HTML5, CSS3 & dev tips for iPhone developmentEstelle Weyl
 
HRA Coalition Letter (June 15, 2016)
HRA Coalition Letter (June 15, 2016) HRA Coalition Letter (June 15, 2016)
HRA Coalition Letter (June 15, 2016) PeopleKeep
 
Refactoring out of the mess
Refactoring out of the messRefactoring out of the mess
Refactoring out of the messwolframkriesing
 
ES6Katas.org - an introduction and the story behind
ES6Katas.org - an introduction and the story behindES6Katas.org - an introduction and the story behind
ES6Katas.org - an introduction and the story behindwolframkriesing
 
завуч и директор
завуч и директорзавуч и директор
завуч и директорOlga Gorbenko
 
Presentationfor lnl
Presentationfor lnlPresentationfor lnl
Presentationfor lnlWebFX
 
Frontend Engineer Toolbox
Frontend Engineer ToolboxFrontend Engineer Toolbox
Frontend Engineer ToolboxYnon Perek
 
САЙТ ГИМНАЗИИ
САЙТ ГИМНАЗИИ САЙТ ГИМНАЗИИ
САЙТ ГИМНАЗИИ Olga Gorbenko
 
Kontseptsiya nova shkola
Kontseptsiya nova shkolaKontseptsiya nova shkola
Kontseptsiya nova shkolaOlga Gorbenko
 
Hard-Won Lessons In Responsive Email Design - SmashingConf Oxford 2014
Hard-Won Lessons In Responsive Email Design - SmashingConf Oxford 2014Hard-Won Lessons In Responsive Email Design - SmashingConf Oxford 2014
Hard-Won Lessons In Responsive Email Design - SmashingConf Oxford 2014Fabio Carneiro
 
02 JavaScript Syntax
02 JavaScript Syntax02 JavaScript Syntax
02 JavaScript SyntaxYnon Perek
 
Context Switching
Context SwitchingContext Switching
Context Switchingfranksvalli
 
Arquitectura protoracionalista
Arquitectura protoracionalistaArquitectura protoracionalista
Arquitectura protoracionalistacarolina gastelum
 
43 Inspirational Mobile Splash Screens
43 Inspirational Mobile Splash Screens43 Inspirational Mobile Splash Screens
43 Inspirational Mobile Splash ScreensPocket Your Shop
 
Mobile html5 today
Mobile html5 todayMobile html5 today
Mobile html5 todayIdo Green
 
System Analysis and Design Proposal presentation
System Analysis and Design Proposal presentationSystem Analysis and Design Proposal presentation
System Analysis and Design Proposal presentationLeslie Ybañez
 

En vedette (20)

Understanding & Designing for the Mobile Web
Understanding & Designing for the Mobile WebUnderstanding & Designing for the Mobile Web
Understanding & Designing for the Mobile Web
 
The Mobile Inbox 201: Design & Coding
The Mobile Inbox 201: Design & Coding The Mobile Inbox 201: Design & Coding
The Mobile Inbox 201: Design & Coding
 
Web 2 sms corporate
Web 2 sms corporate Web 2 sms corporate
Web 2 sms corporate
 
Kullanilabilirlik Sözlüğü
Kullanilabilirlik SözlüğüKullanilabilirlik Sözlüğü
Kullanilabilirlik Sözlüğü
 
iPhone Web Applications: HTML5, CSS3 & dev tips for iPhone development
iPhone Web Applications: HTML5, CSS3 & dev tips for iPhone developmentiPhone Web Applications: HTML5, CSS3 & dev tips for iPhone development
iPhone Web Applications: HTML5, CSS3 & dev tips for iPhone development
 
HRA Coalition Letter (June 15, 2016)
HRA Coalition Letter (June 15, 2016) HRA Coalition Letter (June 15, 2016)
HRA Coalition Letter (June 15, 2016)
 
Refactoring out of the mess
Refactoring out of the messRefactoring out of the mess
Refactoring out of the mess
 
ES6Katas.org - an introduction and the story behind
ES6Katas.org - an introduction and the story behindES6Katas.org - an introduction and the story behind
ES6Katas.org - an introduction and the story behind
 
завуч и директор
завуч и директорзавуч и директор
завуч и директор
 
Presentationfor lnl
Presentationfor lnlPresentationfor lnl
Presentationfor lnl
 
Frontend Engineer Toolbox
Frontend Engineer ToolboxFrontend Engineer Toolbox
Frontend Engineer Toolbox
 
САЙТ ГИМНАЗИИ
САЙТ ГИМНАЗИИ САЙТ ГИМНАЗИИ
САЙТ ГИМНАЗИИ
 
Kontseptsiya nova shkola
Kontseptsiya nova shkolaKontseptsiya nova shkola
Kontseptsiya nova shkola
 
Hard-Won Lessons In Responsive Email Design - SmashingConf Oxford 2014
Hard-Won Lessons In Responsive Email Design - SmashingConf Oxford 2014Hard-Won Lessons In Responsive Email Design - SmashingConf Oxford 2014
Hard-Won Lessons In Responsive Email Design - SmashingConf Oxford 2014
 
02 JavaScript Syntax
02 JavaScript Syntax02 JavaScript Syntax
02 JavaScript Syntax
 
Context Switching
Context SwitchingContext Switching
Context Switching
 
Arquitectura protoracionalista
Arquitectura protoracionalistaArquitectura protoracionalista
Arquitectura protoracionalista
 
43 Inspirational Mobile Splash Screens
43 Inspirational Mobile Splash Screens43 Inspirational Mobile Splash Screens
43 Inspirational Mobile Splash Screens
 
Mobile html5 today
Mobile html5 todayMobile html5 today
Mobile html5 today
 
System Analysis and Design Proposal presentation
System Analysis and Design Proposal presentationSystem Analysis and Design Proposal presentation
System Analysis and Design Proposal presentation
 

Similaire à Mobile HTML, CSS, and JavaScript

Handys und Tablets - Webentwicklung jenseits des Desktops - WebTech Mainz 12....
Handys und Tablets - Webentwicklung jenseits des Desktops - WebTech Mainz 12....Handys und Tablets - Webentwicklung jenseits des Desktops - WebTech Mainz 12....
Handys und Tablets - Webentwicklung jenseits des Desktops - WebTech Mainz 12....Patrick Lauke
 
HTML5 on Mobile
HTML5 on MobileHTML5 on Mobile
HTML5 on MobileAdam Lu
 
Bringing the open web and APIs to mobile devices with Firefox OS - Whisky W...
 	Bringing the open web and APIs to mobile devices with Firefox OS - Whisky W... 	Bringing the open web and APIs to mobile devices with Firefox OS - Whisky W...
Bringing the open web and APIs to mobile devices with Firefox OS - Whisky W...Robert Nyman
 
Web APIs & Apps - Mozilla
Web APIs & Apps - MozillaWeb APIs & Apps - Mozilla
Web APIs & Apps - MozillaRobert Nyman
 
Firefox OS, HTML5 to the next level - Python Montreal - 2014-05-12
Firefox OS, HTML5 to the next level - Python Montreal - 2014-05-12Firefox OS, HTML5 to the next level - Python Montreal - 2014-05-12
Firefox OS, HTML5 to the next level - Python Montreal - 2014-05-12Frédéric Harper
 
Intro To webOS
Intro To webOSIntro To webOS
Intro To webOSfpatton
 
WebAPIs & Apps - Mozilla London
WebAPIs & Apps - Mozilla LondonWebAPIs & Apps - Mozilla London
WebAPIs & Apps - Mozilla LondonRobert Nyman
 
Firefox OS, a startup opportunity - Mobile Startups Toronto & HTML Toronto me...
Firefox OS, a startup opportunity - Mobile Startups Toronto & HTML Toronto me...Firefox OS, a startup opportunity - Mobile Startups Toronto & HTML Toronto me...
Firefox OS, a startup opportunity - Mobile Startups Toronto & HTML Toronto me...Frédéric Harper
 
Firefox OS, fixing the mobile web - FITC Toronto - 2014-04-28
Firefox OS, fixing the mobile web - FITC Toronto - 2014-04-28Firefox OS, fixing the mobile web - FITC Toronto - 2014-04-28
Firefox OS, fixing the mobile web - FITC Toronto - 2014-04-28Frédéric Harper
 
Academy PRO: HTML5 API multimedia
Academy PRO: HTML5 API multimediaAcademy PRO: HTML5 API multimedia
Academy PRO: HTML5 API multimediaBinary Studio
 
Adaptive Layouts - standards>next London 28.05.2011
Adaptive Layouts - standards>next London 28.05.2011Adaptive Layouts - standards>next London 28.05.2011
Adaptive Layouts - standards>next London 28.05.2011Patrick Lauke
 
JavaScript APIs - The Web is the Platform
JavaScript APIs - The Web is the PlatformJavaScript APIs - The Web is the Platform
JavaScript APIs - The Web is the PlatformRobert Nyman
 
HTML for the Mobile Web, Firefox OS - All Things Open - 2014-10-22
HTML for the Mobile Web, Firefox OS - All Things Open - 2014-10-22HTML for the Mobile Web, Firefox OS - All Things Open - 2014-10-22
HTML for the Mobile Web, Firefox OS - All Things Open - 2014-10-22Frédéric Harper
 
The Death of a Mouse
The Death of a MouseThe Death of a Mouse
The Death of a MouseGeert Bevin
 
Making your site mobile-friendly - DevCSI Reading 21.07.2010
Making your site mobile-friendly - DevCSI Reading 21.07.2010Making your site mobile-friendly - DevCSI Reading 21.07.2010
Making your site mobile-friendly - DevCSI Reading 21.07.2010Patrick Lauke
 
Windows Store app using XAML and C#: Enterprise Product Development
Windows Store app using XAML and C#: Enterprise Product Development Windows Store app using XAML and C#: Enterprise Product Development
Windows Store app using XAML and C#: Enterprise Product Development Mahmoud Hamed Mahmoud
 
Web versus Native: round 1!
Web versus Native: round 1!Web versus Native: round 1!
Web versus Native: round 1!Chris Mills
 
Sperimentazioni lezione6 from_designtoapplication copy
Sperimentazioni lezione6 from_designtoapplication copySperimentazioni lezione6 from_designtoapplication copy
Sperimentazioni lezione6 from_designtoapplication copySalvatore Iaconesi
 
Fake it 'til you make it
Fake it 'til you make itFake it 'til you make it
Fake it 'til you make itJonathan Snook
 
Chris Wilson: Progressive Web Apps
Chris Wilson: Progressive Web AppsChris Wilson: Progressive Web Apps
Chris Wilson: Progressive Web AppsDanielle A Vincent
 

Similaire à Mobile HTML, CSS, and JavaScript (20)

Handys und Tablets - Webentwicklung jenseits des Desktops - WebTech Mainz 12....
Handys und Tablets - Webentwicklung jenseits des Desktops - WebTech Mainz 12....Handys und Tablets - Webentwicklung jenseits des Desktops - WebTech Mainz 12....
Handys und Tablets - Webentwicklung jenseits des Desktops - WebTech Mainz 12....
 
HTML5 on Mobile
HTML5 on MobileHTML5 on Mobile
HTML5 on Mobile
 
Bringing the open web and APIs to mobile devices with Firefox OS - Whisky W...
 	Bringing the open web and APIs to mobile devices with Firefox OS - Whisky W... 	Bringing the open web and APIs to mobile devices with Firefox OS - Whisky W...
Bringing the open web and APIs to mobile devices with Firefox OS - Whisky W...
 
Web APIs & Apps - Mozilla
Web APIs & Apps - MozillaWeb APIs & Apps - Mozilla
Web APIs & Apps - Mozilla
 
Firefox OS, HTML5 to the next level - Python Montreal - 2014-05-12
Firefox OS, HTML5 to the next level - Python Montreal - 2014-05-12Firefox OS, HTML5 to the next level - Python Montreal - 2014-05-12
Firefox OS, HTML5 to the next level - Python Montreal - 2014-05-12
 
Intro To webOS
Intro To webOSIntro To webOS
Intro To webOS
 
WebAPIs & Apps - Mozilla London
WebAPIs & Apps - Mozilla LondonWebAPIs & Apps - Mozilla London
WebAPIs & Apps - Mozilla London
 
Firefox OS, a startup opportunity - Mobile Startups Toronto & HTML Toronto me...
Firefox OS, a startup opportunity - Mobile Startups Toronto & HTML Toronto me...Firefox OS, a startup opportunity - Mobile Startups Toronto & HTML Toronto me...
Firefox OS, a startup opportunity - Mobile Startups Toronto & HTML Toronto me...
 
Firefox OS, fixing the mobile web - FITC Toronto - 2014-04-28
Firefox OS, fixing the mobile web - FITC Toronto - 2014-04-28Firefox OS, fixing the mobile web - FITC Toronto - 2014-04-28
Firefox OS, fixing the mobile web - FITC Toronto - 2014-04-28
 
Academy PRO: HTML5 API multimedia
Academy PRO: HTML5 API multimediaAcademy PRO: HTML5 API multimedia
Academy PRO: HTML5 API multimedia
 
Adaptive Layouts - standards>next London 28.05.2011
Adaptive Layouts - standards>next London 28.05.2011Adaptive Layouts - standards>next London 28.05.2011
Adaptive Layouts - standards>next London 28.05.2011
 
JavaScript APIs - The Web is the Platform
JavaScript APIs - The Web is the PlatformJavaScript APIs - The Web is the Platform
JavaScript APIs - The Web is the Platform
 
HTML for the Mobile Web, Firefox OS - All Things Open - 2014-10-22
HTML for the Mobile Web, Firefox OS - All Things Open - 2014-10-22HTML for the Mobile Web, Firefox OS - All Things Open - 2014-10-22
HTML for the Mobile Web, Firefox OS - All Things Open - 2014-10-22
 
The Death of a Mouse
The Death of a MouseThe Death of a Mouse
The Death of a Mouse
 
Making your site mobile-friendly - DevCSI Reading 21.07.2010
Making your site mobile-friendly - DevCSI Reading 21.07.2010Making your site mobile-friendly - DevCSI Reading 21.07.2010
Making your site mobile-friendly - DevCSI Reading 21.07.2010
 
Windows Store app using XAML and C#: Enterprise Product Development
Windows Store app using XAML and C#: Enterprise Product Development Windows Store app using XAML and C#: Enterprise Product Development
Windows Store app using XAML and C#: Enterprise Product Development
 
Web versus Native: round 1!
Web versus Native: round 1!Web versus Native: round 1!
Web versus Native: round 1!
 
Sperimentazioni lezione6 from_designtoapplication copy
Sperimentazioni lezione6 from_designtoapplication copySperimentazioni lezione6 from_designtoapplication copy
Sperimentazioni lezione6 from_designtoapplication copy
 
Fake it 'til you make it
Fake it 'til you make itFake it 'til you make it
Fake it 'til you make it
 
Chris Wilson: Progressive Web Apps
Chris Wilson: Progressive Web AppsChris Wilson: Progressive Web Apps
Chris Wilson: Progressive Web Apps
 

Mobile HTML, CSS, and JavaScript

Notes de l'éditeur

  1. \n
  2. \n
  3. \n
  4. \n
  5. \n
  6. \n
  7. \n
  8. \n
  9. \n
  10. \n
  11. \n
  12. \n
  13. \n
  14. \n
  15. \n
  16. \n
  17. \n
  18. \n
  19. \n
  20. \n
  21. \n
  22. \n
  23. \n
  24. \n
  25. \n
  26. \n
  27. \n
  28. \n
  29. \n
  30. \n
  31. \n
  32. \n
  33. \n
  34. \n
  35. \n
  36. \n
  37. \n
  38. \n
  39. \n
  40. \n
  41. \n
  42. \n
  43. \n
  44. \n