家好，請允許我做一個尷尬而又不失禮貌的微笑^_^，今天小編就來盤點一下當下主流的html 5 開發工具。

1：HBuilder

小編引用一下他們的slogan：飛速編碼的極客工具，手指爽，眼睛爽。

小編先好好介紹一下它：

• 內置emmet：tab一下生成一串代碼

• 無死角提示：除了語法，還能提示ID、Class、圖片、鏈接、字體

• 多語言支持：php、jsp、ruby、python、nodejs等web語言，less、coffee等編譯型語言均支持

• 實時預覽，一邊敲一邊看

• 超級全的與法庫

• 轉到定義和一鍵搜索

2：Animatron

小伙伴們，這是一個在線工具，但是功能的確很強大并且還簡單。隨意設計和發布，所見即所得，不用編碼。有沒有很方便呢？

將工程保存到云端，隨時隨地訪問，真的不要再方便。

3：JetBrains WebStorm

WebStorm 是jetbrains公司旗下一款JavaScript 開發工具。目前已經被廣大中國JS開發者譽為“Web前端開發神器”、“最強大的HTML5編輯器”、“最智能的JavaScript IDE”等。

特點：

• 智能的代碼補全

• 代碼格式化

• html提示

• 聯想查詢

• 代碼重構

• 代碼檢查和快速修復

• 代碼調試

• 代碼結構瀏覽

• 代碼折疊

• 包裹或者去掉外圍代碼

4：Sencha Architect

Sencha Architect 2是個可視化的應用構建器，它使用Sencha Touch 2來構建移動應用，使用ExtJS 4來構建桌面應用。

特點：

1、通過拖拽組件來創建富用戶界面并連接到后端的數據源。

2、支持通過Sencha Touch 2來構建移動Web應用以及通過Ext JS 4來構建桌面Web應用。其提供的代碼編輯功能可以在Sencha Architect中創建整個應用。

3、支持模型--視圖--控制器模式。內置的針對iOS與Android的一鍵式原生打包功能。

5：Adobe Edge

Adobe Edge是adobe公司的一款新型網頁互動工具。

Adobe Edge的目的是幫助專業設計師制作網頁動畫乃至簡單游戲。該工具的重點放在動畫引擎上，但adobe承諾將增加更多HTML5功能，比如Canvas、HTML5音頻/視頻標簽等。支持Android、iOS、webOS、黑莓PlayBook、Firefox、Chrome、Safari和IE9等各個平臺。Adobe于2014年正式推出Adobe Edge AnimateCC集成了hml5、js、css的開發工具。

Adobe對于我們來講，真的再熟悉不過了。

有人說，Edge是不是要代替flash，哦，不。Edge只是為網頁設計人員提供了一種工具，幫助他們在不支持Flash的設備(比如蘋果iOS設備)上制作網絡動畫。

Ps：如今的flash，不用怕被誰代替，因為它會慢慢成為歷史。

6：Adobe Dreamweaver

這款神一樣的軟件，小編就不做介紹啦。

7：Visual Studio Code

VSCode 好多小伙伴在評論區推薦，小便漏掉了，現在補上。

Microsoft在2015年4月30日Build 開發者大會上正式宣布了 Visual Studio Code 項目：一個運行于 Mac OS X、Windows和 Linux 之上的，針對于編寫現代 Web 和云應用的跨平臺源代碼編輯器。

8、Sublime Text

Sublime Text 是一個代碼編輯器（Sublime Text 2是收費軟件，但可以無限期試用），也是HTML和散文先進的文本編輯器。Sublime Text是由程序員Jon Skinner于2008年1月份所開發出來，它最初被設計為一個具有豐富擴展功能的Vim。

Sublime Text具有漂亮的用戶界面和強大的功能，例如代碼縮略圖，Python的插件，代碼段等。還可自定義鍵綁定，菜單和工具欄。Sublime Text 的主要功能包括：拼寫檢查，書簽，完整的 Python API ， Goto 功能，即時項目切換，多選擇，多窗口等等。Sublime Text 是一個跨平臺的編輯器，同時支持Windows、Linux、Mac OS X等操作系統。

快在留言區告訴小編，你都在用什么軟件開發HTML5呢？一起交流學習吧！

eb前端開發工程師需要核心掌握HTML/CSS/JS開發，在幾年前HTML5標準進入國內后，得到了快速的應用于推廣，開發人員為了實現更多的效果和功能，將HTML5的應用推崇到了極高的位置。作為Web前端開發工程師你是否了解HTML5常用的開發工具呢？本文，千鋒武漢Web前端培訓小編列舉HTML5常用的10款開發工具！

1、Initializr——Initializr是制作HTML5網站頂好的入門輔助開發工具，你可以使用提供的特色模板迅速生成網站，也可以自定義，Initializr會為你生成代碼簡潔的可定制的網頁模板。

2、HTML5 visual cheat sheet——HTML5 visual cheat sheet是一個非常酷的速查手冊，每個Web開發人員的必備神器，可以幫助大家高速查找一個標簽或者屬性。

3、Cross browser HTML5 forms——HTML5中的日歷，取色板，滑塊部件等都是非常棒工具，但是有些瀏覽器不支持。Cross browser HTML5 forms還可以幫助你構建完美的HTML5表單兼容方案。

4、HTML5demos——HTML5demos會告訴你每一個HTML5特性在哪些瀏覽器中支持，比如說你的瀏覽器是否支持HTML5 Canvas?Safari是否可以運行簡單的HTML5聊天客戶端等問題。

5、Switch To HTML5——Switch To HTML5是一個基礎而實用的模板生成工具。

6、HTML5 Tracker——HTML5 Tracker可以跟蹤HTML5全新修訂信息。使用HTML5 Tracker可以了解HTML5的全新動向。

7、HTML5 Test——HTML5 Test會為你當前使用的瀏覽器生成一份對video、audio、canvas等等特性的支持情況的完整報告。快快讓你的瀏覽器準備好迎接HTML5革命吧。

8、HTML5 Canvas cheat——sheet Canvas元素是HTML5的重要元素之一，它可以在網頁中繪制圖形，非常強大。這是一個Canvas元素的詳細速查手冊。

9、Lime JS——LimeJS是一個HTML5游戲開發框架，用于高速構建運行于觸屏設備和桌面瀏覽器的游戲。非常棒的HTML5開發工具，一定要用用試試。

10、HTML5 Reset——HTML5 Reset是一組文件，包括HTML、CSS等，用于在開始新項目的時候幫助你節省時間，提供HTML5的空白WordPress模板。

以上就是千鋒武漢Web前端培訓小編列舉的Web前端工程師需要了解的10個HTML5常用工具。這些工具在不同的開發領域發揮著極大的作用。你可以根據你現在從事的崗位對照一下，是否你已經掌握的這些比較高效的工具了呢？

如果你想學習Web前端，就來千鋒武漢Web前端培訓，大牛講師全程面授，嚴格管理，緊貼主流企業一線需求，助力學員畢業即高薪就業。現在還可以來千鋒武漢Web前端培訓，申請兩周免費試聽，親身感受講師的授課水平。

reamweaver對一個web前端工作者來說，再熟悉不過了，像我07年接觸web前端開發就是用的Dreamweaver，一直用到現在， 身邊的朋友有跟我推薦過各種更好用的可替代Dreamweaver的工具，一開始我是拒絕的，但是后來我發現竟然真有比Dreamweaver好用的工 具，智能提示，自動補全工具，模糊編碼這些用上手了以后根本停不下來。

Sublime Text

Sublime Text2是一款跨平臺的編輯器，再也不用為換平臺而找不到合適的、熟悉的編輯器擔憂了。

Sublime Text2 是一款具有代碼高亮、語法提示、自動完成且反應快速的編輯器軟件，不僅具有華麗的界面，還支持插件擴展機制，用她來寫代碼，絕對是一種享受。

Sublime Text 2 的特色功能：

良好的擴展功能，官方稱之為安裝包(Package)右邊沒有滾動條，取而代之的是代碼縮略圖，這個功能非常贊強大的快捷命令“可以實時搜索到相應的命令、選項、snippet 和 syntex，按下回車就可以直接執行，減少了查找的麻煩。”即時的文件切換隨心所欲的跳轉到任意文件的任意位置多重選擇(Multi-Selection)功能允許在頁面中同時存在多個光標支持 VIM 模式支持宏，簡單地說就是把操作錄制下來或者自己編寫命令，然后播放剛才錄制的操作或者命令更新非常勤快

TopStyle5

TopStyle 是一款 CSS 開發輔助工具，即 HTML5 / CSS3 編輯器，它專注于 HTML CSS 設計輔助，提供比較多的功能，如 CSS 代碼檢查等，據稱 TopStyle 的幫助文件非常好，有詳細的 CSS 指令，適于初次接觸 CSS 的學習之用。

不過如果你想對 CSS 了如指掌，對 CSS 網頁布局非常熟練，還是扔掉一切輔助軟件，用記事本開發，而熟練 CSS 之后，再使用此類輔助軟件，可以提高工作效率和開發速度。

Chocolat

Chocolat 是Mac系統上新出現的一款強大的文本編輯器，兼具原生的Cocoa及強大的文本編輯功能。Chocolat支持多種編程語言的關鍵字高亮顯示、窗口分割、標簽頁、色彩主題等功能。界面和MacVim非常相似。

Aptana

Aptana 是一個非常強大、開源、專注于Java的Ajax開發IDE。它的特性包括：

Java，Java函數，HTML，CSS語言的Code Assist功能Outliner(大綱)：顯示Java，HTML和CSS的代碼結構支持Java，HTML，CSS代碼提示，包括Java 自定函數代碼語法錯誤提示支持Aptana UI自定義和擴展支持跨平臺支持FTP/SFTP調試Java支持流行AJAX框架的Code Assist功能：AFLAX，Dojo，JQuery，MochiKit，Prototype，Rico，.aculo.us，Yahoo UI，ExtAdobe AIR與iPhone開發工具

Komodo IDE

Komodo 是一個跨平臺支持多種程序語言的Integrated Development Environment (IDE)軟件，目前他支持了在Windows與Linux上 ，Pythone、Ruby、Rails、Perl、HTML、CSS、Java等的程序語言開發，以及多種程序語言語法著色。

Eclipse

Eclipse是 著名的跨平臺的自由集成開發環境(IDE)。初主要用來Java語言開發，但是目前亦有人通過插件使其作為其他計算機語言比如C++和Python的開 發工具。Eclipse的本身只是一個框架平臺，但是眾多插件的支持使得Eclipse擁有其他功能相對固定的IDE軟件很難具有的靈活性。許多軟件開發 商以Eclipse為框架開發自己的IDE

Eclipse的基礎是富客戶機平臺(Rich Client Platform，即RCP)。RCP包括下列組件：

核心平臺(啟動Eclipse，運行插件)OSGi(標準集束框架)SWT(可移植構件工具包)JFace(文件緩沖，文本處理，文本編輯器)Eclipse工作臺(即Workbench ，包含視圖(views)、編輯器(editors)、視角(perspectives)、和向導(wizards))

Eclipse 采用的技術是IBM公司開發的(SWT)，這是一種基于Java的窗口組件，類似Java本身提供的AWT和Swing窗口組件;不 過IBM聲稱SWT比其他Java窗口組件更有效率。Eclipse的用戶界面還使用了GUI中間層JFace，從而簡化了基于SWT的應用程序的構建。

Eclipse 的插件機制是輕型軟件組件化架構。在富客戶機平臺上，Eclipse使用插件來提供所有的附加功能，例如支持Java以外的其他語 言。 已有的分離的插件已經能夠支持C/C++(CDT)、Perl、Ruby，Python、telnet和數據庫開發。插件架構能夠支持將任意的擴展加入到 現有環境中，例如配置管理，而決不僅僅限于支持各種編程語言。

Eclipse的設計思想是：一切皆插件。Eclipse核心很小，其它所有功能都以插件的形式附加于Eclipse核心之上。Eclipse基本內核包括：圖形API (SWT/Jface)， Java開發環境插件(JDT )，插件開發環境(PDE)等。 Eclipse由各種不同的計劃組成。以下列出了部分計劃。