網站開發一般分為前端和後端兩個部分。前端負責實現頁面效果，後端主要負責功能開發。一般的開發流程是先由美工或網頁設計師進行網頁設計和切圖，所謂切圖就是將設計好的網頁效果圖利用html開發工具進行程式碼實現成網頁形式，並且加入一些網頁特效。再交給後端開發人員進行功能開發，一般採用主流的php技術進行開發。
那web開發都用什麼工具呢？最常用的前端開發工具有哪些呢？ 本文推薦8款最好用的web前端開發工具供美工或前端開發人員使用，當然若你是NB的全端工程師也可以下載使用。
web前端開發工具排行
工具簡介:
#老牌的網頁編輯軟體，功能非常強大，最大的優點是視覺化編輯，還有錯誤提示，深受前端開發人員和網站開發人員歡迎！ Dreamweaver CC 專注於快速回應設計、程式碼編輯功能的改進、在裝置上進行網頁預覽以及從 Photoshop 複合中大量提取具有多種解析度的 Web 最佳化影像。與 Bootstrap 框架的整合可協助您建立行動優先、快速回應的網站。視覺媒體查詢透過讓您在各種斷點處對您的設計進行視覺化和修改，進一步完善了快速回應網頁設計的體驗。
工具簡介：
Photoshop簡稱PS，全球最受歡迎的圖形影像處理軟體。網頁設計師或web前端開發人員可利用此軟體進行網頁的設計與切圖，PS的切圖工具非常強大，可自動產生html網頁格式，大幅提升了網頁開發效率。
工具簡介：
非常好用的JavaScript開發工具，被廣大中國JS開發者譽為「Web前端開發神器」、「最強大的HTML5編輯器」、「最聰明的JavaScript IDE」等。與IntelliJ IDEA同源，繼承了IntelliJ IDEA強大的JS部分的功能。
工具簡介：
#省時的瀏覽器同步測試工具，Browsersync能讓瀏覽器即時、快速回應您的檔案變更（html、js、css、sass、less等）並自動刷新頁面。更重要的是 Browsersync可以同時在PC、平板、手機等裝置下進項調試。您可以想像一下：「假設您的桌子上有pc、ipad、iphone、android等設備，同時打開了您需要調試的頁面，當您使用browsersync後，您的任何一次代碼保存，以上的設備都會同時顯示您的改動」。無論您是前端還是後端工程師，使用它將提高您30%的工作效率。
作為前端開發工程師，以上這些工具基本上就夠用了，若是想更專業、裝逼一點，可以參考下面的htm程式碼編輯器工具
其它4款html開發工具推薦
工具簡介：
Sublime Text是一款流行的程式碼編輯器。 Sublime Text 具有漂亮的使用者介面和強大的功能，例如程式碼縮圖，Python的插件，程式碼片段等。也可自訂鍵綁定，選單和工具列。 Sublime Text 的主要功能包括：拼字檢查，書籤，完整的 Python API ， Goto 功能，即時專案切換，多選擇，多視窗等等。 Sublime Text 是一個跨平台的編輯器，同時支援Windows、Linux、Mac OS X等作業系統。
工具簡介：
Notepad++是在微軟視窗環境下的一個免費的程式碼編輯器。它使用較少的CPU功率，降低電腦系統能源消耗，但輕巧且執行效率高，使得Notepad++可完美取代微軟視窗的記事本。內建支援多達27種語法高亮度顯示(包括各種常見的原始程式碼、腳本，能夠很好地支援.nfo檔案檢視)，也支援自訂語言；可自動偵測檔案類型，根據關鍵字顯示節點，節點可自由折疊/打開，還可顯示縮進引導線，代碼顯示得很有層次感；可打開雙窗口，在分窗口中又可打開多個子窗口，允許快捷切換全屏顯示模式(F11)，支持滑鼠滾輪改變文件顯示比例；提供了一些有用工具，如鄰行互換位置、巨集功能等；可顯示選取文字的位元組數(而非一般編輯器所顯示的字數，這在某些情況下，例如軟體本地化很方便)。
工具簡介：
Zend Studio是一個屢獲大獎的專業PHP整合開發環境，具備強大的專業編輯工具和調試工具，支援PHP語法加亮顯示，支援語法自動填充功能，支援書籤功能，支援語法自動縮排和程式碼複製功能，內建一個強大的PHP程式碼偵錯工具，支援本地和遠端兩種偵錯模式，支援多種進階偵錯功能。
Zend Studio 9 正式發布，主要包含以下更新：
Git和Github支援雲端開發部署深度，Zend Framework和Zend Server整合更快、更精簡的IDE。
工具簡介：
phpstorm免費版是目前網路上最受歡迎的php開發軟體。 phpstorm免費版能全面的提升用戶php程式碼編寫的效率，並且提供能程式碼補全、快速導航、即時錯誤檢查等等功能，大大的節省php程式碼編寫時間，phpstorm 2016.2版全新的軟體介面，全面的提升所有編寫功能，希望大家能夠喜歡，下載使用。
註：更多相關工具請到php中文網工具下載欄位免費下載！
相關開發工具推薦：
#
