趁著最近空閒時間較多，介紹一些特殊、趣味性十足的小工具吧！如果你是網站開發者，一定知道瀏覽器都會內建「開發人員工具」，也就是打開後有很多輔助開發功能，例如最常用的是檢查打開網頁時載入那些圖片、程式或檔案，這也可用於瞭解網站是否有被拖慢速度的問題，還能點選網頁中的元件，快速查看相關程式碼、CSS 等資訊，非常好用！當然開發人員工具功能不少，這只是其中幾項，那還有沒有其他的應用方式呢？
JavaScript
OneLinePlayer 免費網頁影音播放器，嵌入影片可自訂各種模式和按鈕樣式
如果要在個人網站、部落格、作品集或社交媒體放入影片，大部分開發者可能會選擇使用線上影音平台提供的播放器語法，而不會自行托管影片，因為影音檔案容量較大，也會影響整體網站載入速度。不過一般播放器不一定能呈現最佳效果，運用一些小技巧能讓影片嵌入時效果更理想，例如「如何嵌入 YouTube 影片設定自動重播、隱藏 Logo 或靜音播放？」或「嵌入 YouTube 影片為音樂播放器教學，僅保留音樂點擊自動播放」。
CSSPeeper 為設計師量身打造，更聰明視覺化檢視網站 CSS 樣式表（Chrome 擴充功能）
對於網頁設計或開發者來說，想要改善使用者網頁瀏覽體驗通常會從參考其他網站設計著手，我在發現不錯的網站都會去看一下原始碼或樣式表，雖然 Google Chrome 本身就有強大的開發人員工具可以使用，但如果遇到要查詢某個網頁使用的字型或色彩時還是習慣以 Fontface Ninja、Type Sample 這類工具快速找到我要的資訊。
RawGit 將 GitHub 的 Raw 檔案轉為 CDN 格式直接存取使用
HtmlWasher 網頁程式碼清理工具，快速去除雜亂代碼保留基本標籤
若你有接手編輯過他人網頁，或是複製其他頁面版型的經驗，應該會發現最困難的往往不是編輯網站，而是將現有的程式碼整理乾淨，讓它能夠格式化，呈現出一致的效果。尤其對於一些較為複雜的頁面，可能經過許多人無數次編輯後已經有些四不像，這時候就必須將不必要的部份代碼刪除，只留下最基本的部分，而這些過程大部分都是手動進行，不但很耗費時間心力，而且很可能因為修改錯誤而讓整個頁面跑掉。
CSS & JavaScript Compressor 線上程式碼壓縮工具，有效提高網站速度
在更新網站時，經常透過網站檢測工具來檢查網站有沒有可以改進的部份，例如我個人相當常用 PageSpeed Insights 和 Think With Google，通常會出現 CSS、JavaScript 程式碼可以被壓縮的最佳化提示資訊。如果沒有特別設定，大部分情況下會維持程式碼的可讀性，對於開發者在編輯來說會很有用，但其實放在網路上只要求能夠越快被下載越好，利用壓縮方式將不必要的空格、註解或換行清除，讓檔案盡量維持在最小狀態，不僅可提高下載效率，也能節省網站流量耗費。
超實用！一行程式碼將瀏覽器變身網頁編輯器，支援各種常見瀏覽器
這幾天在 Twitter 看到一則推文分享，只要一段程式碼，就能開啟 Google Chrome 瀏覽器內建開發者工具的編輯器功能，直接在網頁內進行內容編輯測試（對，直接編輯網頁中的文字），這對於網頁開發者來說很有用，尤其是當你想知道選單可以容納多少文字，或是標題、內文會在多少字以後換行，就能以更直覺的方式看到結果。相較於之前介紹過的「Edit Any Website 只要一行程式碼就能編輯任何網頁！直接把瀏覽器變身網頁測試工具」又要更簡單一些。
WhatRuns 查看網站背後使用那些第三方服務和技術（Chrome、Firefox）
對於開發或經營網站的朋友來說，應該很常會去研究其他網站使用那些技術，一來可知己知彼，另一方面也能從其他網站來找到更合適的功能。如果有經驗的話，通常透過瀏覽器或檢視原始碼就能知道一些什麼，但這比較耗費時間，因此有線上工具可以讓你在輸入網址後快速找出該網站使用的工具、第三方應用或程式庫技術等資訊，例如之前介紹過的 SimilarTech、Wappalyzer 分析網站使用什麼樣的架站程式和環境，找出其他類似的服務選項，對開發者來說很實用。
Local CDN 將 JavaScript 程式庫快取在瀏覽器，加速上網更省流量（Chrome 擴充功能）
在設計網站或部落格時經常使用一些外部的 JavaScript 程式庫，例如最常看到的 jQuery、AngularJS 或 CSS 框架，但 JavaScript 程式通常伴隨著拖延網站載入速度的問題，因此才會有所謂的「免費開放式 CDNs 服務」用以改善網站效能，這些服務多由世界級企業提供，例如：Google、Microsoft 和百度、新浪網等等，只要以 CDN 提供的網址來存取 JavaScript 程式就有減少主機流量、加速網站載入等效果，現階段來說非常建議使用。
CDNPerf 監測七大開放式免費 CDN 服務，查詢延遲時間和上線率資訊
我之前寫過一篇關於「免費開放式 CDNs 服務」的整理介紹，這類服務針對網頁開發者提供，主要用於托管用於網頁的開放原始碼專案，例如常見的 jQuery、Boostrap、AngularJS 等等，利用開放式的 CDN 服務除了可以節省流量。最大優勢是大幅加速網頁載入速度，因為內容傳遞網路特性，能從距離較近的伺服器將檔案傳送給使用者，減少載入時間，不過檔案不是托管在自己主機，你可能會擔心其穩定性或速度。