HTML5雖然各瀏覽器還在如火如荼加緊腳步支援，但是...規格還有可能變動，而各家瀏覽器對於標準的支援可能也還不一致。另外...舊的瀏覽器當然也不支援。面對這樣子複雜的狀況，與其偵測瀏覽器版本來決定功能，不如效法jQuery的做法，利用偵測瀏覽器的「能力」來決定要用什麼方法來支援。

另外，html本來就允許擴充標籤名稱，所以除非跟功能與效能緊密相關（像是Canvas, Audio, Video等），其實有一些方法可以提供某些標籤與舊版瀏覽器一些起碼的相容性。
為了試試看HTML5，自己第一個想到的就是要如何偵測瀏覽器對於HTML5標籤的支援。要快速而簡便地做到這件事情，當然一定得靠Javascript，而且要假設瀏覽器對於DOM及標籤的支援是一致的。在這個前提下，利用document.createElement()產生與HTML5標籤對應的DOM物件，然後檢測他是不是具有該有的屬性及方法，應該就可以做到快速的測試。

利用document.createElement()也可以產生自訂標籤的對應物件，不過在這個狀況下，這個物件只會有HTMLElement的基本屬性。所以即使瀏覽器不真正支援HTML5標籤及對應的DOM物件，使用document.createElement()也不會產生任何錯誤。所以需要更詳細地針對個別物件應該具備的屬性，特別去做檢查。Javascript透過for...in敘述，就可以做出reflection的功能，但是有陷阱。有些瀏覽器可能會在'''內部'''將某些屬性設定為[DontEnum]（不可列舉）的，這樣使用for...in無法列舉出這些屬性，不過使用這些屬性並不會有問題。保險的方式，是把該有的屬性全部找出來（這只好在標準文件內一個一個找），一個一個檢查。另外，既然所有的標籤都是HTMLElement，也可以透過這裡面只在HTML5才定義的屬性，來檢查這些標籤。因為有些標籤並沒有個別的屬性，只單純使用HTMLElement定義的屬性，不這樣檢查，也沒有別的辦法。

以下是之前自己寫的測試程式（太長了，貼不下...還是更新到blog上）：
嘗試偵測瀏覽器對於html5 tag的支援（補充）

除了各標籤的特定屬性之外，選擇了contentEditable作為HTML5 HTMLElement通用屬性偵測的標的。為什麼選這個？因為...其實很多屬性雖然在HTMLElement有定義，但是除了Chrome7全部都支援，其他瀏覽器對於通用屬性的支援其實並不一致，所以測試了一下，挑了contentEditable，因為他看起來大家都支援。

Mozilla網站上，有不少介紹HTML5的文章，其中有一篇提到了一些在不支援HTML5的瀏覽器中支援Sections相關標籤的方式：Using HTML5 Elements in Non-HTML5 Browsers。他的方法是透過CSS及針對IE的patch，來讓這些標籤當作「自訂標籤」來使用。不過這樣只是讓畫面顯示不會出問題，而文件大綱的邏輯並不會用這樣的方式就可以支援。

HTML5的許多功能，主要是在簡化過去需要依賴外掛（Flash）、Javascript（例如表單驗證）等才能做到的事情，沒有HTML5，有許多功能並不是做不到，只是很麻煩。不過像Canvas繪圖、Web Worker多工、通訊等，大概很難有替代方案。另外，由於這些東西納入到HTML，所以CSS也對他可以產生作用，如果靠外掛也是無法做到的。例如使用CSS，可以讓Video標籤播放的影片，做出即時倒影或是半透明的效果等等。這些都有聽說...之後再來試試

總之，如果想讓支援與不支援HTML5的瀏覽器都可以使用自己開發的網頁應用程式，需要花很大個功夫。偵測是否支援某項功能是比較簡單的，只要偵測某個標籤及相對應屬性是否可用就好了。複雜的是針對支援HTML5跟不支援HTML5分別做出相對應的功能。

另外一種想法是，用HTML5做出超酷炫功能，吸引使用者放棄舊版瀏覽器，這是Eric大神的意見...請看黑暗執行緒大大在TechDay的筆記：
TechDays 2010 隨堂筆記 0930

明天來看看HTML5的文件結構。

參賽文章