若你有接手編輯過他人網頁,或是複製其他頁面版型的經驗,應該會發現最困難的往往不是編輯網站,而是將現有的程式碼整理乾淨,讓它能夠格式化,呈現出一致的效果。尤其對於一些較為複雜的頁面,可能經過許多人無數次編輯後已經有些四不像,這時候就必須將不必要的部份代碼刪除,只留下最基本的部分,而這些過程大部分都是手動進行,不但很耗費時間心力,而且很可能因為修改錯誤而讓整個頁面跑掉。
本文要介紹的「HtmlWasher」是一款網頁程式碼清理工具,屬於比較少見的服務,這款免費工具可以自動將網頁中雜亂、無用的部分代碼清除,僅保留下最基本的標籤,只要一個按鍵就能快速完成!HtmlWasher 可直接複製、貼上程式碼來進行清理,或是上傳 HTML 檔案,完全不用額外下載軟體,非常好用。
更確切地介紹,HtmlWasher 會修復或刪除錯誤、不正確格式的標籤及屬性(例如圖片缺少 alt 屬性時加入),將標籤轉為 HTML5(如果是 XHTML),支援清理的標籤包括:
<a href>, <body>, <br>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <head>, <hr>, <html>, <i>, <img src width height alt>, <li>, <ol>, <p>, <ruby>, <strong>, <table>, <tbody>, <td colspan rowspan>, <th colspan rowspan>, <title>, <tr>, <ul>
亦能將 <b> 取代為 <strong>,重新格式化 HTML,包括換行符號或縮排等等。
網站名稱:HtmlWasher
網站鏈結:https://www.htmlwasher.com/
使用教學
STEP 1
開啟 HtmlWasher 網站後,可以看到 Html cleanup tool ,雖然說是清理,不過可以把它想像成是格式化工具,使用方法非常簡單,只要把網頁原始碼直接複製、貼上然後點擊右下角的「Wash」即可進行。
另一個方法是上傳要清理、格式化的網頁檔案(Html 格式),點擊「Select a File」選取檔案、上傳一樣可以透過這個免費工具來快速進行,大幅縮短節省時間。
STEP 2
HtmlWasher 會即時完成程式碼格式化,將不必要、錯誤或雜亂的標籤刪除,例如:將 <p class="funny" onlick="alert('LOL')">bla bla</p>
丟進去 HtmlWasher 整理後會轉為 <p>bla bla</p>
,直接將格式或其他標籤刪掉看起來就變得乾淨許多吧!
如果你想編輯網頁程式碼,可以考慮先透過這個工具來進行初步編輯,或許能讓你的工作流程更省順暢、更得心應手。
值得一試的三個理由:
- 一鍵快速清理 HTML 程式碼,將無用或錯誤屬性去除
- 直接複製貼上即可使用,亦支援上傳 HTML 網頁檔
- 自動修正舊語法,可處理換行符號或縮排