/* syntax highlight */ /* end of syntax highlight */

2010年10月25日 星期一

HTML5 相關概念整理

Bookmark and Share

image

這篇文章主要紀錄一些 HTML 5 的相關訊息

分為以下幾個部份

 

一、前言

HTML5 是新版本的 html, xhtml , 為了改進 html 之前版本所出現的相容性問題, 且加強 元件控制、多媒體與程式繪圖等等功能, 並統一了許多的標準, 讓跨瀏覽器之間的支援度提升

 

二、支援瀏覽器

大致來說, Chrome, Opera, Safari, Firefox 等等瀏覽器支援度較高, 而 IE 支援度較差, 這個 網站有提供許多服務支援與不支援的列表。

 

三、著名 HTML5 服務

1. Sketchpad - 一款基於 html5 的線上繪圖工具

2. Apple HTML5 showcase - 蘋果公司為了推 HTML5, 列出用 html5 可以呈現的一些結果

3. Rgrahp – html5 所開發的圖形 library

 

四、Apple 與 Adobe 的戰爭

Adobe 公司所開發的 flash 取得網路多媒體播放的 90% 以上之安裝率, 但 apple 公司的官方態度卻不支援, 甚至明爭暗鬥, 這篇 文章有蠻深的一些描述。所以 Apple 公司一直希望能夠推廣 HTML5 的多媒體播放能力, 以取代 Flash 的市場獨霸地位。

 

五、大致功能上的改變

1. 影片播放 - 可任意變更大小, 請看 這裡

2. 文字呈現 - 可任何調整大小, 透明度, 斜度, 間隔等等, 請看 這裡

3. 藝廊 – 可做出 2D, 3D 藝廊, 且不用第三幫程式來幫忙, 請看 這裡

4. 淡出 - 可做出各種不同的淡入淡出模式, 請看 這裡

5. 360 度旋轉 - 利用 javascript 即可做出三百六十度旋轉的功能, 請看 這裡

6. 可被編輯的文字 - 請看 這裡

7. 拖拉物件之功能 - 請看 這裡 以及 這裡

8. 漸層式畫布 - 請看 這裡

9. 根據 ip 找到位置 - 請看 這裡 (但我似乎一直試不成功)

10. 本端資料紀錄功能 - 請看 這裡

11. Web SQL - 請看 這裡

12. 整體網頁語法框架的改變 - 請看 這裡

13. 新的資料輸入型態 - 請看 這裡

14. 可任意更改的 column 數目 - 請看 這裡

15. 文字邊框 - 請看 這裡

16.圓角匡 - 請看 這裡

17. 文字陰影 - 請看 這裡

 

六、結論

觀察 HTML5 相對於 HTML4 所帶來的改變, 大致上在於可以利用 html, css, javascript 刻出許多以前不可能的效果, 這對於提升使用者在使用網路的滿意度, 尤其從前要播放影片或是做出藝廊等等特效的時候都需要依賴 flash 技術, 但 HTML5 不管在影片的播放或是文字、物件特效的表現方面都有提升。但是觀察的結果有發現其實 html5 各瀏覽器支援的程度還是不一致, 尤其 IE 是大部份都沒有支援, 在 IE 全世界市佔率還是最高的情況之下, 我認為 HTML5 在一般電腦平台上還是很難有伸展的空間…, 不過由於智慧型手機的興起, 尤其是 iphone, 並不支援 flash, 甚至推崇 html5, 因此我覺得有可能的發展方向是如果是要給智慧型手機使用的網路服務, 有可能會漸漸的支援 html5 , 但是一般電腦上面看的網站, 還是會以 flash 為主流。到時候最麻煩的, 大概還是網頁設計師們了, 畢竟號稱 html5 能夠有更強的跨瀏覽器能力, 但是平台越來越擴張, 從前 web designer 只需要負責電腦上面的網頁, 但之後這些網頁還要能支援智慧型手機的瀏覽, 應該也會是個挑戰吧。

 

 

參考文獻

1. 維基百科

2. http://html5demos.com/

3. W3C - HTML5

4. HTML5 vs. Flash 誰主未來?

5. THE HTML5 test

6. HTML5 Rocks

7. Apple Support HTML5

8. html5 examples in the wild

0 意見:

張貼留言

Related Posts Plugin for WordPress, Blogger...