Thu, Apr 14, 11:14:29am PDT

Fantastic session with Rey Bango. Great blend of broad and specific information, enthusiasm, and further reading.

Thu, Apr 14, 11:10:41am PDT

Recommended books on HTML5: Introducing HTML5 by Lawson & Sharp; HTML5 for Web Designers by Keith; CSS3 for Web Designers by Cederholm #mix11

Thu, Apr 14, 11:08:57am PDT

http://yepnopejs.com integrates with Modernizr to test for features and load the scripts needed on the fly. #html5

Thu, Apr 14, 11:08:08am PDT

Take Away: Use feature not browser detection; Use Modernizr; Opt for a polyfill or shim that mimics a standard API.

Thu, Apr 14, 11:01:36am PDT

Can define the object tag or an iframe (Silverlight or Flash) as a fallback within the video tag for non-modern browsers. (Or if you don’t have the ability to encode your video in multiple codecs, the browser will fall back to the 3rd party.)

Thu, Apr 14, 11:00:28am PDT

Fortunately, multiple video codecs can be defined in as fallback options, solving the codec issue.

Thu, Apr 14, 10:59:30am PDT

HTML5 video tag is nice and clean, but the video codec debate rages on, leaving different browsers supporting different features.

Thu, Apr 14, 10:57:43am PDT

Third, load up a shim: start by loading up jQuery then load jquery.corner (or whatever feature is missing) to complete the picture.

Thu, Apr 14, 10:55:34am PDT

Next, load up a standard reset defining styles for the new HTML5 semantic tags, including defining the proper ones as Block.

Thu, Apr 14, 10:54:48am PDT

Solving the HTML5 semantic tag styling issue: load up the Modernizr library to load up the shim that creates the new elements.

Thu, Apr 14, 10:51:33am PDT

Sadly, older browsers don’t recognize the new HTML5 semantic tags. :( You can’t style a non-recognized element.

Thu, Apr 14, 10:50:02am PDT

HTML tags have no semantic meaning, hence the new HTML5 layout tags.

Thu, Apr 14, 10:49:04am PDT

Be sure you vet the code when relying on polyfills or shims; you may also need to maintain it yourself.

Thu, Apr 14, 10:47:22am PDT

Big list of polyfills: http://bit.lyb5HV1x (some good, not so good).

Thu, Apr 14, 10:46:33am PDT

Polyfill: replicates a standards API. Shim: Provides own API.

Thu, Apr 14, 10:45:01am PDT

Awesome. We just got treated to the Hamster Dance in a demo.

Thu, Apr 14, 10:43:15am PDT

Modernizr library is good for feature detection support, prevents insanely long code detection blocks.

Thu, Apr 14, 10:39:35am PDT

Detect for features, not the browsers themselves. Much more reliable, future-proof method.

Thu, Apr 14, 10:36:24am PDT

The issue isn’t just older browsers, but also browser fragmentation. Many obscure ones don’t fit in common user-agent-string.

Thu, Apr 14, 10:34:21am PDT

This speaker is amazingly excited about HTML5/CSS3. Love it. #mix11

Thu, Apr 14, 10:32:34am PDT

Now at “Filling the HTML5 Gaps with Polyfills and Shims”. He plugged http://scriptjunkie.com right off.