Modernizr - Detecting HTML5 and CSS3 support
Upcoming SlideShare
Loading in...5
×
 

Modernizr - Detecting HTML5 and CSS3 support

on

  • 4,990 views

 

Statistics

Views

Total Views
4,990
Views on SlideShare
4,932
Embed Views
58

Actions

Likes
5
Downloads
88
Comments
3

2 Embeds 58

http://www.slideshare.net 37
http://speakerrate.com 21

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment
  • awesome shit! <br /> <br /> js solutions for many of these, but in 95% of cases, the result with the native css approach has a better result - responsive, faster, less code. <br /> <br /> transforms. transitions. @font-face
  • omg is html5ready yet ?? <br /> UGH. <br /> <br /> the challenge is: how do you use these features across browsers, progressively enhancing where possible
  • omg is html5ready yet ?? <br /> UGH. <br /> <br /> the challenge is: how do you use these features across browsers, progressively enhancing where possible
  • in other words: super easy to have multiple levels of support in site, one for each degree of sophistication <br /> that&#x2019;s how i ended up w/modernizr <br /> allows you to start using html5+css3 coolness today, and have full control over what your html,css and js do in browsers that don&#x2019;t have features <br /> Which brings me to the most important part of this presentation:
  • FEATURE DETECTION aka object detection is good <br /> sniffing is bad <br /> <br /> all browsers. future-proof
  • FEATURE DETECTION aka object detection is good <br /> sniffing is bad <br /> <br /> all browsers. future-proof
  • awesome shit! <br /> <br /> js solutions for many of these, but in 95% of cases, the result with the native css approach has a better result - responsive, faster, less code.

Modernizr - Detecting HTML5 and CSS3 support Modernizr - Detecting HTML5 and CSS3 support Presentation Transcript

  • Progressive Enhancement in the age of HTML5 and CSS3 using Modernizr Paul Irish Molecular Standards.Next ’09 NYC
  • HTML5 & CSS3 Coolness™
  • HTML5 & CSS3 Coolness™ Rounded corners 2D Transformations @font-face fonts CSS Gradients Canvas SVG rgba(), hsla() colors Geolocation border-image CSS Columns box-shadow HTML5 Forms HTML5 Audio & Video Web Workers CSS Animations Offline Web Apps CSS Transitions …and so on and so on.
  • ishtml5readyyet.com
  • ishtml5readyyet.com U P ! HU T wrong. S y ou ’re
  • Modernizr Making use of tomorrow’s technologies, today!
  • Feature Detection Just Detect It™
  • Native No Native Implementation Implementation .fontface h1 { .no-fontface h1 { // use cool custom font! // far less awesome font // it’ll rock! } } if (Modernizr.fontface == false){ // Cufon fallback }
  • OM G it onl ’s y7 k!
  • We got you covered, b. Rounded corners 2D Transformations @font-face fonts CSS Gradients Canvas SVG rgba(), hsla() colors Geolocation border-image CSS Columns box-shadow HTML5 Forms HTML5 Audio & Video Web Workers CSS Animations Offline Web Apps CSS Transitions …and so on and so on.
  • Modernizr http://modernizr.com @modernizr Me: http://paulirish.com @paul_irish Yah, it’s open source. Fork it, baby.