http://static.oschina.net/uploads/img/201401/19231106_smp1.jpg" >
html5 是在開發者和設計者之間最流行的語言之一，提供了大量的功能來幫助開發者們快速的設計 web 應用。html5 有很多特性，例如支援現代化的浏覽器（比如：firefox 6，google chrome，ie9 等等），結構特定标簽，可視化元素：圓角内置，内部拖拽，新的視訊，音頻和 canvas 元素等。
這篇文章主要是推薦了 16 款 線上 html5 工具來幫助使用者們簡化建構 html5 網站的步驟和加快 html5 的編碼速度。希望能在一下清單中找到對你項目有用的工具，enjoy !
mockups
moqups 是款非常棒的 html5 應用，允許使用者自由調用相關功能來建立網站線框，實物模型，ui 概念，原型模型等等。moqups 緻力于把所有的元素簡單化，直覺化，讓使用者自由發揮自己的創造力而無須擔心任何障礙問題。同時，moqups 是建立在開放的标準上的，努力的再衆多浏覽器中創造最好的體驗，不會向任何浏覽器妥協！
source
stitches
http://static.oschina.net/uploads/img/201401/19231108_4qqz.jpg" >
stitches 是個 html5 圖像小圖示生成器。使用者隻需要經過簡單的拖拽圖檔檔案到空白處，然後點選“generate”就可以生成一個圖像圖示和樣式表了。sititches 使用了一系列的 html5 apis，是以它隻相容最新版本的 chrome 和 firefox 浏覽器。同時，它也不能再 ie 9 上面運作，如果是舊版的浏覽器需要安裝 jquery 1.7.1 及以上的版本，modernizr，dropfile 以及 flashcanvas。stitches 是遵循 mit 協定的。
html5 maker
http://static.oschina.net/uploads/img/201401/19231109_yz9t.jpg" >
html5 maker 是一款線上動畫制作的工具和服務，使用 html5，html，css 和 javascript 來建立互動内容。這款工具非常容易使用，同時還還能幫助使用者實作很棒的動畫效果。它允許建立跨浏覽器的動畫内容，比如 javascript 和 html5 動畫，幻燈片，示範效果和滑塊效果。
initializr
initializr 是一款 html5 模闆生成器，幫助使用者在 html5 模闆檔案的引導下開始新的項目。隻要使用者打開了這個工具，那麼就可以生成一個整潔幹淨，允許使用者自定義的網站模闆。
sprite box
http://static.oschina.net/uploads/img/201401/19231111_illu.jpg" >
spritebox 是一款所見即所得的工具，幫助 web 設計者根據精靈小圖像來簡便快速的建立 css 類和 ids。它是基于使用背景位置屬性原則來調整插入到網頁塊元素中的精靈小圖像。這款工具是使用 jquery，html5 和 css3 組合來運轉的，而且是一款完全免費的工具。
liveweave
liveweave 是有點像 runjs，是一個 html5 ，css 3 和 javascript 的線上編輯工具。liveweave 是内置了自動完成 html4/html5 和 css2/css3 的上下文敏感，是以使得工具更容易使用能力。使用者隻需要寫入 html5 和 css3 标簽和元素就可以建立網頁了，它除了可以編輯，也可以線上測試，使用裡面的 js 庫來建立網頁。
literally canvas
literally canvas 是一款開源的 html5 部件，允許使用者線上繪畫然後整合到任何的網頁中，帶有一系列的工具：繪畫，擦除，顔色選擇器，撤銷，重複上一步，拖動和縮放。這個部件是需要 jquery 和 underscore.js 一起建立的，擁有一個 api 來定義背景顔色，工具和尺寸。
html5 demos
http://static.oschina.net/uploads/img/201401/19231113_cjxn.jpg" >
html5 demos 讓使用者很直覺的知道 html5 canvas 是支援 firefox，或者是 safari 是否可以運作 html5 的簡單用戶端。
html5 visual cheat sheet
http://static.oschina.net/uploads/img/201401/19231114_edpp.jpg" >
html 5 visual cheat sheet 是提供非常有用的參考清單給 web 設計者和開發者，包括一系列簡單的可視化 html 标簽清單和屬性網格，支援 html 4.01 和 5。允許使用者看一眼就找到自己需要使用的 html 标簽和屬性内容，非常快速和有效。
switch to html5
http://static.oschina.net/uploads/img/201401/19231115_eaht.jpg" >
switch to html5 是一個基礎的但又是非常高效的模闆生成器。如果你需要開始一個新項目，毫不猶豫的打開這個網頁吧，這裡提供大量免費的 html5 網站模闆哦：）
online svg to html5 canvas tool
online svg to html5 canvas tool 就像它名字一樣，是個把 svg 轉換成一個 html5 canvas javascript 函數的工具。它适用于任何的主機，可以讓使用者好好體驗 canvas 的功能。大部分的矢量藝術包（illustrator, inkscape etc）都可以導出 svg。
on/off flipswitch
http://static.oschina.net/uploads/img/201401/19231117_hqgl.jpg" >
html5 test
html5 test 是款測試浏覽器支援即将到來的 html5 标準和相關規範的線上工具，用分數來表示支援的程度，雖然這些規範還沒真正完成，但是這有助于所有浏覽器生産商确認他們的浏覽器是否已經為未來 html5 的發展做好了充分的準備。這款工具還會分析浏覽器是支援了 html5 哪部分的特性，還會給出跟其他浏覽器比較的結果。
sourcepatternizer
http://static.oschina.net/uploads/img/201401/19231118_gxpn.jpg" >
patternizer 是一款很簡單的條紋圖案生成器。
lime js
http://static.oschina.net/uploads/img/201401/19231119_gjvr.jpg" >
limejs 是一款建構遊戲的 html5 遊戲架構，讓你輕松體驗在現代觸摸屏和桌面浏覽器上的速度，性能非常好。 limejs 是結合了 google 建立的 closure 庫和相關的函數和類來控制時間軸，時間，形狀和動畫。同時，這個架構完全支援精靈圖表（使用者可以搜集所有的精靈圖表存儲到一個檔案中）。
html5 reset
html5 reset 是一系列的檔案（html，css 等等），都是用來幫助使用者設計他們新項目的時候節省時間。
via codegeekz.com