Tech Support Websites

  • Subscribe to our RSS feed.
  • Twitter
  • StumbleUpon
  • Reddit
  • Facebook
  • Digg

Saturday, 9 July 2011

HOW TO check what HTML5 features a browser supports

Posted on 11:54 by Unknown
Now that I'm getting my feet wet in HTML5, I thought I should spend more time with features that are supported by all popular browsers rather than digging into HTML5 features that are implemented by only one or two browsers.
Table showing browser support for HTML5 Input types from W3Schools.com
I noticed a nice demo by Craig Shoemaker in the Pluralsight HTML5 Fundamentals course on feature detection with Modernizr that lists all supported features. Not finding any readymade sample similar to his script after some googling and lazy to write it on my own, I tweeted him to ask if could share his code.

I appreciate that he did and I got it working locally after tweaking the CSS a bit to ignore a few images that he had used in his slightly old (it uses Modernizr 1.6) original code. I hope to work on it further while I learn more about HTML5 & Modernizr.

Meanwhile, here is the HTML5 Feature detection script using Modernizr 1.6 (red indicates a feature is 'not supported' while green means 'supported')

Update: haz.io & the Modernizr Test Suite  show a much larger list of HTML5 features supported by a browser opening their test page.

Browserscope compares all browsers on supported HTML5 features in a single page. I wish the first row & column of the table there were frozen for better readability.
Email ThisBlogThis!Share to XShare to FacebookShare to Pinterest
Posted in Browsers, HOWTO, HTML5 | No comments
Newer Post Older Post Home

0 comments:

Post a Comment

Subscribe to: Post Comments (Atom)

Popular Posts

  • Windows 8 keyboard shortcuts
    Win + X   - context menu to access common features like Control Panel, Task Manager, File Explorer, Programs & Features, Run, Search etc...
  • Dashboard-like info with Browser tabs, Windows 7 Taskbar tabs
    Browser tabs & Windows 7 Taskbar tabs are turning self-aware.  This is how my browser looked the other day: I had the summary of all tha...
  • The State Of HTML5 Video
    Key points from the  The State Of HTML5 Video  report by LongTailVideo (last updated on April 19, 2012): 75% of the desktop & mobile bro...
  • Archive tweets & favorites with Google Reader
    There are numerous ways to archive tweets but rather than use yet another tool, I prefer using Google Reader to preserve the tweets I mark ...
  • TWIL - Week #3
    This Week I Learned: New Azure VM Image Templates include SQL Server, BizTalk Server, and SharePoint Server (2013?) images . This can be han...
  • What is the difference between Browser Mode & Document Mode in IE
    If you're a web developer and your job actively involves building web pages that work the same in all browsers including the last three ...
  • My 30-day personal project - watch 100 hours of Pluralsight videos
    Inspired by Matt Cutts' 30-day challenges , I plan to watch 100 hours of Pluralsight online videos to get up-to-date with current ...
  • Azure in Pictures - overview of Windows Azure Features, Services and Common Uses
    Download the Windows Azure Poster in PDF format (1.1MB)
  • Indian comparison shopping sites
    Did you know, India has 120 million Internet users & the Indian e-commerce market is worth $7 billion ?  Travel accounts for over 80 per...
  • HOW TO dynamically generate a Word document with custom header & footer
    Way back in 2004, a project I was working on required a web page to be exported as a Word document (.DOC). Without relying on any components...

Categories

  • AJAX
  • Android
  • APIs
  • App
  • ASP
  • ASP.NET
  • ASP.NET-MVC
  • Azure
  • Azure SQL Database
  • AzureInPictures
  • Bing
  • Book Review
  • Bookmarklet
  • Browsers
  • C#
  • chart
  • Chrome
  • Cloud
  • CSS
  • CSS3
  • DidYouKnow
  • E-Commerce
  • Excel
  • FB
  • Fiddler
  • Firefox
  • Gadgets
  • GeoLocation
  • GMail
  • Google
  • Google Docs
  • Google Reader
  • Health
  • Hotmail
  • HOWTO
  • HTML
  • HTML/CSS
  • HTML5
  • Humor
  • Hyderabad
  • IE
  • IIS
  • India
  • Internet
  • IT
  • Javascript
  • jQuery
  • JSON
  • JSONP
  • Laptop
  • Learning Resources
  • Lists
  • Map
  • Metrics
  • Microsoft
  • miscellaneous
  • Mobile
  • NAPA
  • Office365
  • Opera
  • PDF
  • Performance
  • Personal
  • PHP
  • PM
  • PowerShell
  • Privacy
  • Programming
  • Rant
  • Safari
  • Science
  • Search Engines
  • SearchEngines
  • Security
  • SEO
  • Sharepoint
  • SharePoint2013
  • Silverlight
  • Software Engineering
  • Solutions
  • SQL Azure
  • SQL Server
  • TFS
  • Tip
  • Tips
  • Tools
  • Tools/Utilities
  • Trivia
  • TWIL
  • Twitter
  • UX
  • VM
  • VS.NET
  • VS2010
  • VS2012
  • WCF
  • WebApps
  • Websites
  • WF
  • Windows Phone
  • Windows7
  • Windows8
  • Word
  • WP7
  • WPF

Blog Archive

  • ►  2013 (112)
    • ►  October (16)
    • ►  September (14)
    • ►  August (8)
    • ►  July (8)
    • ►  June (13)
    • ►  May (12)
    • ►  April (12)
    • ►  March (8)
    • ►  February (15)
    • ►  January (6)
  • ►  2012 (127)
    • ►  December (11)
    • ►  November (14)
    • ►  October (13)
    • ►  September (14)
    • ►  August (16)
    • ►  July (16)
    • ►  June (6)
    • ►  May (5)
    • ►  April (11)
    • ►  March (12)
    • ►  February (7)
    • ►  January (2)
  • ▼  2011 (98)
    • ►  December (5)
    • ►  November (2)
    • ►  October (5)
    • ►  September (7)
    • ►  August (7)
    • ▼  July (15)
      • Learning with Pluralsight videos gets even better ...
      • Free JavaScript & jQuery learning resources
      • Learn IIS 7 - IIS 7.x's Configuration System
      • Older ASP.NET Starter Kits
      • Why formatting of a ASP.NET page looks different w...
      • HTML5 at work
      • Discover public transport in India with Google Tra...
      • Adobe BrowserLab vs Browsershots.org: online servi...
      • Overview of Pluralsight course "A Beginner's Guide...
      • You can now use an actual image as Google Image se...
      • HOW TO check what HTML5 features a browser supports
      • Online database of medicines used in India - MedGu...
      • HOW TO see how your web pages are ranking in realtime
      • Learn IIS7 with Scott Forsyth's 52-week video less...
      • India IT - facts, numbers & trivia
    • ►  June (10)
    • ►  May (7)
    • ►  April (8)
    • ►  March (10)
    • ►  February (11)
    • ►  January (11)
  • ►  2010 (163)
    • ►  December (14)
    • ►  November (19)
    • ►  October (19)
    • ►  September (15)
    • ►  August (18)
    • ►  July (17)
    • ►  June (20)
    • ►  May (17)
    • ►  April (19)
    • ►  March (5)
Powered by Blogger.

About Me

Unknown
View my complete profile