一般來說我比較習慣使用 Mac 內建的截圖功能，只要熟記快捷鍵就能快速擷取特定範圍、視窗畫面或整個螢幕，之前寫過「變更 Mac 內建拍攝截圖功能格式、儲存路徑和螢幕快照檔名」教學搭配使用就能將螢幕擷圖功能發揮到最大、最完整，跟 Windows 內建截圖功能有異曲同工之妙，不過如果平常偶爾才擷取網頁特定畫面、上傳雲端圖片空間或傳給朋友，其實 Google Chrome 瀏覽器也內建螢幕截圖工具，接下來就教大家怎麼把這項功能打開吧！
網頁截圖
FireShot 免費網頁截圖工具推薦，可捕捉完整網頁畫面或可見範圍
想要抓取電腦螢幕畫面方法很多，除了使用系統內建的擷圖功能，也有不少擷圖軟體或瀏覽器擴充功能可用，當然現在還有線上螢幕錄影工具，只要打開瀏覽器就能進行桌面錄影或攝影機影像錄製，還能搭配上麥克風或其他聲音輸入，對於要製作教學或素材就變得很有用。順帶一提，上個月介紹的 Dropbox Capture 是我覺得非常便捷的螢幕擷取軟體，截圖錄影後可立即產生分享鏈結。
Microsoft Edge 內建網頁擷取功能，快速截圖加入附註標示匯出 Jpeg
因為工作需要我每天都會用到螢幕擷取工具，以前多半是使用 TechSmith 的 Jing 做為首要選擇（後來已經以 TechSmith Screencast 替代），搭配上 Skitch 進行標註或是馬賽克處理，後來對 Mac 更熟悉就改用內建的擷取功能，內建的拍攝截圖工具可以變更預設檔案儲存格式、自動儲存路徑和快照檔名，搭配上 iCloud 或是其他同步工具就能在多台電腦間進行寫作。如果你平常比較沒有擷圖需求，但偶爾又需要保存網頁畫面的話，可以參考接下來要介紹的瀏覽器內建擷圖工具。
在 iPhone 和 iPad 使用 Safari 瀏覽器擷取完整網頁
因為工作需要平時在 iPhone 手機最常用到的功能之一大概就是螢幕截圖吧！相信許多朋友對於手機、平板電腦擷取畫面並不陌生，而且很多時候要暫存資料也會用到，像我在搜尋想寫的主題時除了直接把資料丟進 Pocket 稍後閱讀，也會透過擷圖方式把資料儲存起來，除此之外，手機拍攝截圖也經常用於分享內容，例如從 Facebook、Twitter 看到的資訊想貼到其他平台可能很多人會選擇使用截圖呈現。
變更 Mac 內建拍攝截圖功能格式、儲存路徑和螢幕快照檔名
在免費資源網路社群寫文章已經是維持十多年的習慣，既然每篇文章都是文字搭配圖片的教學文，擷圖就是我每天都會用到的工具，較早以前我是使用 Jing（在 Windows 時代是使用 WinSnap），後來因為 Catalina 不再支援 32 位元應用程式，開發商就決定推出全新 TechSmith Screenshot 取代原有的 Jing，而付費的 Snagit 真的用不習慣，經過幾次試用後依然無法順利上手。
everysize 輸入網址就能測試響應式網頁在各種裝置尺寸的顯示效果
現在很多人是透過智慧型手機或平板電腦瀏覽網頁，在網頁設計上就要考量到如何讓不同尺寸螢幕大小也能正常顯示，以往會製作成電腦版和手機版兩種格式，後來多半以響應式網頁設計（Responsive web design）技術直接在不同尺寸螢幕上顯示最適合的樣式，更重要的是可以節省維護的成本和時間。想測試自適應設計在各種裝置顯示情形，除了直接使用手機瀏覽外，其實也有不少工具可以輔助，像是 Responsive Viewer、ScreenDump 或是 Responsive Screenshots。
Screenshot Tracker 擷取並追蹤網頁長截圖，測試在不同裝置顯示情形
網站開發者經常需要測試網頁在不同裝置、螢幕大小的顯示樣貌，以前會針對行動裝置另外製作一個行動版，現在比較普遍作法是使用響應式網頁設計（Responsive web design，簡稱 RWD），可自動調整為最適合閱讀的大小，但這些開發過程可能都得借助於測試工具幫忙，例如瀏覽器外掛程式 Responsive Viewer 可在單一頁面查看不同螢幕大小裝置的顯示樣式，或是透過線上工具 ScreenDump 預覽網站在不同尺寸螢幕顯示效果。
Full Page Screen Capture 快速擷取完整網頁畫面，轉為圖片或 PDF 格式（Chrome 擴充功能）
對於可以保存網頁畫面的截圖工具相信大家都不陌生，像是 WinSnap、FastStone Capture 或 Mac 系統很好用的 Jing（現在是 TechSmith Screencast）都能達到類似效果，或是透過瀏覽器擴充功能和線上工具也能做到，通常保存下來的都是靜態圖片格式。如果你想要完整保存某個網頁在某個時間點的樣貌，透過第三方建立更具公信力的網頁備份可能是更好的選擇，我曾介紹過 Wayback Machine 網頁時光機就能讓使用者將頁面完整保存在線上，以便隨時回溯到特定時間：