Chrome網頁截圖主要透過開發人員工具中的一個指令來實現,簡單三步就可以實現4種不同方式的截圖,可以截取整個網頁和指定區域截圖等,相比專業截圖工具來說,Google截圖是完全免費的,屬於Google Chrome內建功能,簡單三步輕鬆掌握截圖秘笈。
前言
Google Chrome是用戶使用最多的網路瀏覽器,Chrome有非常多的實用功能,但是大家估計很少用Chrome截圖功能,可能根本就不知道Chrome還可以截圖。其實Chrome有一個極其有用的擷取螢幕截圖的內建功能,是不需要用擴充程式,很靈活,很有效,用起來也特別方便。而且支援Windows和Mac二大主流作業系統,該功能比較隱蔽如果不用,您根本發現不了Google 截圖。可以在Chrome瀏覽器區域內截圖。
在網頁截圖Chrome瀏覽器中主要有下列4種方式:
- 擷取完整大小的螢幕截圖——可以實現網頁內Chrome 長截圖。
- 擷取指定區域的螢幕截圖
- 擷取螢幕截圖——可以實現Chrome 螢幕截圖。
- 當前節點螢幕截圖——可以實現純淨的網站截圖。
下面我們就來一起探索這四種Chrome 截圖方式是如何實現的吧!
Chrome截圖網頁透過內建功能指令Screenshot實現
這個Chrome瀏覽器截圖方法需要您開啟某些特殊區域,而一般人是不應該進入這些區域進行操作,該區域就是——開發人員工具區塊。顧名思義是開發人員使用的工具,裡面有很多高級的功能,如果您一不小心觸碰點擊到某些地方,可能就會導致您的瀏覽器出錯,不過您也別擔心,按照下列詳細步驟操作就可避免以外發生。
步驟1:首先,將您的Chrome瀏覽器更新到最新版本,開啟瀏覽器並在鍵盤上按下列組合快速鍵:
- Windows作業系統在鍵盤上按:Ctrl+Shift+I或者F12
- Mac作業系統在鍵盤上按:Command+Option+I
此時會在Chrome瀏覽器頁面彈出開發人員工具區塊。
步驟2:繼續在鍵盤上按快速鍵:
- Windows作業系統在鍵盤上按:Ctrl+Shift+P
- Mac作業系統在鍵盤上按:Command+Option+P
然後,會彈出一個執行指令輸入框,您只需要在輸入框中複製貼上以下Google網頁截圖字元:
截圖
!请注意:在有些Chrome版本中,可能輸入英文的Screenshot也會出現Chrome網頁截圖的各種選項,不過至少Chrome版本114之後,會區分中英文,在中文狀態下必須輸入指令:截圖這兩個字才有效。而英文狀態下必須輸入指令:Screenshot這個單字才有效,需要大家注意一下。
即可自動彈出下滑選單,選擇其中Chrome 網頁截圖的類型,並按Enter鍵,稍等片刻,會直接將截圖以PNG格式下載到預設的Chrome資料夾位置中。
溫馨提示:可能有用戶預設Chrome開發人員工具是英文版或其他語言版本,變更為繁體中文版教學:按F12開啟開發人員工具>按F1開啟偏好設定>找到語言區塊>將語言設定為中文(台灣)-Chinese(Taiwan)>關閉開發人員工具。當再次開啟時,您將會看到中文版本。
輸入截圖或Screenshot指令後,會有4種不同的網頁截圖方式:
- 如果您想要截取加載完成的整個網頁,您就選擇擷取完整大小的螢幕截圖,並按Enter鍵進行Chrome網頁長截圖。
- 如果您想截取網頁上的特定區域,您就選擇擷取指定區域的螢幕截圖,此時滑鼠游標會變成十字形,然後在您想要區域按住滑鼠左鍵不放移動滑鼠畫一個方框,滑鼠左鍵鬆開即可保存方框區域內的截圖。
- 如果您截圖電腦螢幕顯示區域內的網頁,您就選擇擷取螢幕截圖,並按Enter鍵截圖。
- 如果您只想截取當前網頁所顯示的內容,您就選擇當前節點螢幕截圖,這不包含瀏覽器外掛所附加的板塊,這是純淨版截取整個當前網頁的方式,這和截取整個網頁有微妙的差別。
下面我說明下差別在哪裡?比如我的Chrome安裝了SEOquake擴充程式外掛,該程式會在每個站點網頁上方顯示網站排名等訊息,會有一個浮動區塊。完整截圖會截取該浮動區塊,節點截圖(我稱為純淨版截圖)則不會截取該區域。
Chrome網頁截圖您需要特別注意的事情
利用Chrome截圖,只能截取瀏覽器區域內的頁面,所以我覺得一般需要使用Chrome截圖的人群可能使用截取當前節點螢幕截圖的方式偏多一些,如:發現很漂亮網頁就可以利用這種方式輕鬆截取。透過我對該功能的研究,Chrome網頁截圖還有很多需要改進或者說是BUG的地方,為了大家能完美的透過Chrome截取網頁,下列幾點在截圖前一定要遵循:
- 長截圖 Chrome一定要讓網頁中的元素全部加載完成並顯示出來,如:圖像、背景圖像、視頻等,否則會出現截取的網頁全是方塊或網頁不完整。
- 在截圖時,一定要讓網頁從最上方顯示,不能拖動網頁到頁面底部或中間區域,這是因為有些網頁導航分類區塊是浮動顯示,如果沒在頁面最上方截圖,浮動區塊在截圖時會錯亂顯示。
- 如果使用當前節點螢幕截圖不能截取整個網頁,可能是網站本身HTML原始碼結構有問題,3.可使用完整螢幕截圖方式進行Chrome長截圖。
總結
Google Chrome截圖主要透過Screenshot內建指令實現,總體來說還是比較方便,一共三部,可稱之為Chrome截圖三步法,相對於電腦截圖或下載截圖軟體,還是稍微遜色一些,但是不用安裝截圖軟體是一大優勢,回想一下我們截圖絕大多數還是截取瀏覽器中的內容,所以還是蠻實用。
不過,Chrome瀏覽器內建功能的指定區域截圖可以使用連續截圖的方式會更好,這種方式應該可以透過程式來實現,當使用鼠標截取指定區域截圖後,十字游標再執行下一次指定區域截圖,如果用戶不想截圖,可以按一下滑鼠的右鍵退出當前指定區域截圖,我覺得這種方式更好一些。期待Chrome團隊能優化此功能,讓Google 網頁截圖變得更完美。
Chrome還有很多的隱藏功能,Chrome清除快取也有一個隱藏方法,它可以快速清除快取並強制重新載入網頁,趕快點擊連結來試一試吧!
如對文章有任何疑問和建議請發送電子郵件到wanda.mytech@gmail.com,我會不定期更新文章內容,希望幫助更多的人解決問題。
本篇文章於最近更新修正過,以保證文章內容的有效性和全面性。