英文 | https://javascript.plainenglish.io/14-useful-tools-for-faster-and-easier-web-development-9fd0ebc1f3f8
翻譯 | web前端開發
我從事網站開發多年，我不認為保留自己使用的工具會給我在就業市場競争中帶來強大優勢。
我知道Web開發真的會令人沮喪，但是，借助線上工具，我們可以使工作變得越來越快，提升我們的工作效率。
是以，我很高興分享我使用的工具，這些工具使我的Web開發任務更加輕松。
1、Metatags.io
在Google，Facebook或Twitter上檢視時，我使用此工具來測試和檢視我的網站的預覽。你将完全按照通路者看到的方式看到網站的标題，描述和圖像。
你也可以上傳你自己的圖檔并修改你網站的标題和說明标簽，而無需更改網站上的任何内容。
2、ExtractCSS
我使用此線上工具，主要從HTML文檔中提取ID元素，類和内聯樣式，并将其輸出為CSS樣式表。除了鍵入或複制/粘貼HTML外，無需執行任何其他操作，此工具即可完成工作。
3、WhatRuns
這個工具可以幫助我窺視其他站點的主題，插件和伺服器資訊。WhatRuns可以安裝在Firefox和Chrome上，而不會占用計算機記憶體的太多空間。
4、Unminify
免費解壓縮或反混淆JavaScript，CSS，HTML，XML和JSON代碼的工具，使其代碼可讀性強。
5、Octotree
如果你确切知道要查找的内容，就可以使用此工具，請按鍵盤上的“ T”并立即在存儲庫中搜尋檔案名，這将節省你一些時間。
6、 優化網站檢索工具
我有時會忘記檢查我的網站元素。當我開始使用此工具時，讓我想起從前端SEO到移動網站上要檢查的重要事項。
7、表單填寫器
該工具将友善開發人員測試表單功能。這不僅可以節省你輸入所需詳細資訊的時間，而且可以幫助你更快地完成工作。
8、EditThisCookie
老實說，這對于Web開發人員來說都是必須具備的工具。我很高興能夠輕松修改Cookie。我喜歡這個工具，簡單易用。你隻需單擊一下，即可獲得所有的功能。
9、GTMetrix
一旦解決了所确定的問題，這便使我能夠确定是哪些因素導緻我的網站速度下降，并提高了轉化率。有時，這些問題通常與伺服器有關，或者與超大圖像，代碼問題以及許多其他可幫助你解決的問題有關。
10、Google Page Speed
我使用此工具掃描任何網站，以查找任何需要改進的後端問題，例如，導緻頁面加載速度變慢的原因。
11、Browserling
這使我可以在不同的浏覽器（例如Opera，Chrome和Firefox）中檢視任何網站。我還可以更改要通路的作業系統，例如Windows或Android技術。
12 、響應式應用設計
該工具旨在幫助你在不同的技術裝置上檢視網站的外觀效果。當我的工具箱中沒有此工具時，我會一次在不同的裝置上檢查該網站。想象一下，我要花多少時間才能完成？而使用此工具可以快速完成。
13、Compressior.io
我使用此工具來減少在手機和DSLR相機上捕獲的圖像，因為預設情況下，它們的檔案大小超過1MB，這對于圖像來說很重。品質保持不變，但大小差異很大。
你可以使用此工具線上優化和壓縮JPEG，PNG，SVG，GIF和WEBP圖像。
14、DrawKit
我使用此工具在網頁設計中查找免費的矢量插圖。這些設計幹淨，專業，專為沒有署名的網站而設計。
本文完~