Google Chrome 瀏覽器內建螢幕截圖,抓取網頁畫面免安裝擴充功能

Google Chrome 瀏覽器內建螢幕截圖,抓取網頁畫面免安裝擴充功能

一般來說我比較習慣使用 Mac 內建的截圖功能,只要熟記快捷鍵就能快速擷取特定範圍、視窗畫面或整個螢幕,之前寫過「變更 Mac 內建拍攝截圖功能格式、儲存路徑和螢幕快照檔名」教學搭配使用就能將螢幕擷圖功能發揮到最大、最完整,跟 Windows 內建截圖功能有異曲同工之妙,不過如果平常偶爾才擷取網頁特定畫面、上傳雲端圖片空間或傳給朋友,其實 Google Chrome 瀏覽器也內建螢幕截圖工具,接下來就教大家怎麼把這項功能打開吧!

FireShot 免費網頁截圖工具推薦,可捕捉完整網頁畫面或可見範圍

FireShot 免費網頁截圖工具推薦,可捕捉完整網頁畫面或可見範圍

想要抓取電腦螢幕畫面方法很多,除了使用系統內建的擷圖功能,也有不少擷圖軟體或瀏覽器擴充功能可用,當然現在還有線上螢幕錄影工具,只要打開瀏覽器就能進行桌面錄影或攝影機影像錄製,還能搭配上麥克風或其他聲音輸入,對於要製作教學或素材就變得很有用。順帶一提,上個月介紹的 Dropbox Capture 是我覺得非常便捷的螢幕擷取軟體,截圖錄影後可立即產生分享鏈結。

Microsoft Edge 內建網頁擷取功能,快速截圖加入附註標示匯出 Jpeg

Microsoft Edge 內建網頁擷取功能,快速截圖加入附註標示匯出 Jpeg

因為工作需要我每天都會用到螢幕擷取工具,以前多半是使用 TechSmith 的 Jing 做為首要選擇(後來已經以 TechSmith Screencast 替代),搭配上 Skitch 進行標註或是馬賽克處理,後來對 Mac 更熟悉就改用內建的擷取功能,內建的拍攝截圖工具可以變更預設檔案儲存格式自動儲存路徑和快照檔名,搭配上 iCloud 或是其他同步工具就能在多台電腦間進行寫作。如果你平常比較沒有擷圖需求,但偶爾又需要保存網頁畫面的話,可以參考接下來要介紹的瀏覽器內建擷圖工具。

在 iPhone 和 iPad 使用 Safari 瀏覽器擷取完整網頁

在 iPhone 和 iPad 使用 Safari 瀏覽器擷取完整網頁畫面

因為工作需要平時在 iPhone 手機最常用到的功能之一大概就是螢幕截圖吧!相信許多朋友對於手機、平板電腦擷取畫面並不陌生,而且很多時候要暫存資料也會用到,像我在搜尋想寫的主題時除了直接把資料丟進 Pocket 稍後閱讀,也會透過擷圖方式把資料儲存起來,除此之外,手機拍攝截圖也經常用於分享內容,例如從 Facebook、Twitter 看到的資訊想貼到其他平台可能很多人會選擇使用截圖呈現。

Snippyly 擷取網頁畫面、編輯並產生可編輯分享鏈結(Chrome 擴充功能)

Snippyly 擷取網頁畫面、編輯並產生可編輯分享鏈結(Chrome 擴充功能)

如果要跟同事或朋友說明網站上某個功能的位置,用文字可能容易有誤差或找不到,通常會直接擷取網頁、標註框線或加入文字描述,這個流程使用手機操作並不會太難,若是要在電腦前進行就必須要知道如何擷圖、編輯圖片甚至是上傳到圖片空間,有些瀏覽器擴充功能就解決這一系列麻煩,像是 Smartshot 可以快速擷取網頁畫面、對圖片裁切或加上框線、標記箭頭;qSnap 一鍵將網頁轉圖片,可編輯後上傳產生分享鏈結。

變更 Mac 內建拍攝截圖功能格式、儲存路徑和螢幕快照檔名

變更 Mac 內建拍攝截圖功能格式、儲存路徑和螢幕快照檔名

在免費資源網路社群寫文章已經是維持十多年的習慣,既然每篇文章都是文字搭配圖片的教學文,擷圖就是我每天都會用到的工具,較早以前我是使用 Jing(在 Windows 時代是使用 WinSnap),後來因為 Catalina 不再支援 32 位元應用程式,開發商就決定推出全新 TechSmith Screenshot 取代原有的 Jing,而付費的 Snagit 真的用不習慣,經過幾次試用後依然無法順利上手。

Screenshot Tracker 擷取並追蹤網頁長截圖,測試在不同裝置顯示情形

Screenshot Tracker 擷取並追蹤網頁長截圖,測試在不同裝置顯示情形

網站開發者經常需要測試網頁在不同裝置、螢幕大小的顯示樣貌,以前會針對行動裝置另外製作一個行動版,現在比較普遍作法是使用響應式網頁設計(Responsive web design,簡稱 RWD),可自動調整為最適合閱讀的大小,但這些開發過程可能都得借助於測試工具幫忙,例如瀏覽器外掛程式 Responsive Viewer 可在單一頁面查看不同螢幕大小裝置的顯示樣式,或是透過線上工具 ScreenDump 預覽網站在不同尺寸螢幕顯示效果。

PicPick 全功能免費螢幕擷取軟體,內建編輯器和各項實用工具

PicPick

以前在 Windows 都是用 FastStone Capture 做為擷圖軟體,後來才知道另一款 PicPick 也非常強大!雖然曾寫過介紹,不過已經有相當長的時間,剛好這幾天更新到全新 v5.0,介面全部換新,或許該找機會重新介紹一下了。PicPick 是一款全功能的設計工具,適合各種職業使用,更準確地說它就是一款螢幕擷取軟體,內建簡易圖片編輯功能,包括一些增強效果或畫線、箭頭、加入文字都可以做到,對於平常會需要用到畫面擷取功能的朋友來說是非常好的選擇。

變更 macOS 螢幕截圖預設檔案格式,可改 JPEG、GIF、TIFF 和 PDF

變更 macOS 螢幕截圖預設檔案格式,可改為 JPEG、GIF、TIFF 和 PDF
Copyright: rh2010 / 123RF Stock Photo

本文參考資料為 How to Change macOS Screenshot File Format, 原作者 Hongkiat Lim。

無論你是使用 Windows 或 macOS,作業系統都有內建截圖功能,可透過快捷鍵快速擷取當前視窗或全部畫面,Windows 是按下鍵盤上的 Print Screen 按鍵,Mac 則是 Shift-Command 然後加上 3 或 4 拍攝螢幕快照或部分螢幕(視窗)。我很喜歡 Mac 截圖功能的另一原因是會自動在視窗外框加入陰影效果,看起來更有質感,但平常還是習慣使用 Jing 來擷取工作上需要的畫面範圍,記得更早以前在 Windows 是使用 FastStone Capture。

使用 Chrome 內建工具製作網頁長截圖,擷取網站畫面免安裝下載外掛

使用 Chrome 內建工具製作網頁長截圖教學,擷取網站畫面免安裝下載外掛

幾個月前介紹過「Firefox Screenshots」免費網頁擷圖工具,也是火狐瀏覽器 Firefox 內建的快速拍照、分享螢幕功能,在全新 Firefox Quantum 推出後成為內建功能之一,可見不單單只有工作上會用到,對於一般使用者來說網頁擷圖也是相當必要。現在 Google Chrome 也內建網頁擷取工具以及將完整頁面保存下來的「網頁長截圖」製作功能,不用額外下載、安裝外掛或擴充功能,只要輸入指令就能做到。