如果你是自行架站的網站管理者，對網頁原始碼結構應該不陌生，若以 WordPress 架設網站通常會有完整 <head> 段落，取決於你使用的佈景主題，這部份是用來描述一個頁面的相關資訊，例如網頁標題、語言、樣式表、說明、關鍵字和略縮圖等等，很多時候會透過 SEO 外掛工具產生各種常用的 Meta Tags 以擴充佈景主題不足的部分，如果你要從頭開始寫一個網頁或佈景主題，就必須知道 <head> 有那些可用的標籤。
原始碼
httpstatus.io 快速檢查網站狀態碼、回應標頭和重新轉向情形
自行架站會遇到各式各樣的狀況，其中很常發生的是要檢查某項功能有沒有正常運作（舉例來說，在 WordPress 網站使用 Cloudflare 外掛建立快取），除了檢查網頁原始碼，大多會透過瀏覽器內建的「開發人員工具」進行各項除錯工作，查看一個網頁究竟載入多少元件檔案，也會檢查相關檔案在使用時從伺服器端回傳的「Response Headers」，這些看起來複雜的資訊代表著某個文件是如何被載入使用，也能找出拖慢網頁速度的原因。
Codeimg 程式碼轉圖片，可自訂視窗陰影效果更適合分享社群網站
如果想把一小段程式碼分享到社群網站，透過 GitHub Gist 產生鏈結是個不錯的方式，或是參考我之前介紹的「5個程式碼分享服務，貼上後立即產生鏈結並加入高亮效果」，若要轉為精美的圖片，我也推薦過 Carbon、CodeZen 可以將程式碼轉成圖片、加上視窗陰影和上色效果的線上工具，對於要分享至社群網站來說更好用。大家都知道社群網站在不同區塊或類別都有不一樣的圖片尺寸限制，接下來要介紹的這項服務就是整合社群網站模版和程式碼轉圖片工具，讓你可以做出更適合分享的程式碼圖片。
Tables Generator 線上製作產生表格 HTML、LaTeX、Markdown 原始碼
如果有接觸過網頁設計或曾經嘗試在網站、部落格放入表格，應該會覺得表格（Tables）是一個非常難搞的東西，不但原始碼複雜，沒有所見即所得編輯器似乎也很難直接寫出來，而在瀏覽器上使用的網頁編輯器又很難修改表格內容，有時候從其他文書處理工具直接複製貼上就會自帶很多用不到的程式碼，程式碼看起來很髒又無法符合當前的頁面風格，總之表格一直是很多人的痛，我也很少在網頁中用到表格，不過表格還是呈現一些數據相當好的方式。
CodeCopy 在程式碼旁加一個「複製到剪貼簿」按鈕，支援 GitHub 等網站
身為開發者一定對於 GitHub 不陌生，有許多開放原始碼（Open Source）專案都能在這裡找到，其他像是 StackOverflow 則是尋找解決方案絕佳去處，在搜尋問題時很多時候都可以在這網站找到網友提供的解法，如果要用於網站呈現原始碼，我個人習慣選擇 GitHub Gist，我在「5個程式碼分享服務，貼上後立即產生鏈結並加入高亮效果」曾經推薦，要分享程式碼或嵌入文章都非常值得一試。
CodeZen 將程式碼轉為 JPG、PNG 圖片，上色後加入視窗及陰影效果
如果要呈現一段程式碼，通常會加入更易於閱讀的色彩效果，這在網頁裡不難做到，甚至大多數編輯器都已經內建上色功能，對於不支援 JavaScript 的平台來說也有像是 hilite.me 工具可以轉換。假如你是要讓程式碼呈現在簡報或紙本中，製作成圖片或許是個不錯的方法，之前介紹過「Carbon 將程式碼轉為美麗圖片，在社群分享更引人注目」是一款可將程式碼轉為圖片格式的線上工具，還能加入色彩、陰影和視窗外框，讓一段枯燥無味的程式碼更吸引人。