如何使用 Google Chrome、Firefox 和 Opera 截取整個網站頁面

已發表: 2016-06-13
如何使用 Google Chrome、Firefox 和 Opera 截取整個網站頁面

之前我們已經討論過如何使用 Windows 10 的截圖工具和 PrtSc 熱鍵來截取桌面截圖。 您還可以使用它們來捕獲瀏覽器窗口的快照,但您無法捕獲在瀏覽器中打開的完整網站頁面的快照。 因此,最好使用 Google Chrome、Opera 和 Firefox 擴展程序來捕獲網頁截圖。

在 Google Chrome 中捕獲網站頁面截圖

在 Chrome 中捕獲網頁快照的最佳擴展之一是Awesome Screenshot 。 單擊此處打開擴展程序的頁面並將其添加到瀏覽器。 這也是您可以從此處添加到 Firefox 的附加組件。 安裝擴展程序後,打開一個頁面並按下工具欄上的 Awesome Screenshot 按鈕,如下所示。

網站快照

從菜單中選擇捕獲整個頁面以捕獲整頁快照。 然後將打開下圖中顯示的選項卡,其中包括您剛剛拍攝的整頁照片。 請注意,它會捕獲快照中的整個頁面,包括在您拍攝時在瀏覽器中不可見的區域,這不是 Snipping Tool 可以做到的。

網站快照2

從此選項卡中,您可以為圖像選擇各種額外的註釋選項。 例如,您可以通過選擇工具欄上的箭頭按鈕在圖像上繪製直箭頭。 按住鼠標左鍵並拖動箭頭將其展開。 按刪除選定按鈕以刪除選定的箭頭和其他對象。

網站快照3

文本按鈕將文本添加到圖像。 這將在快照中添加一個文本框。 輸入文本會展開該框。 單擊頂部的小圓圈並按住鼠標左鍵旋轉框。 選擇文本框時,您可以從工具欄中選擇新的字體和文本顏色。

Blur是 Awesome Screenshot 工具欄上的另一個選項,您在 Snipping Tool 中找不到。 有了它,您可以對圖像產生模糊效果。 單擊“模糊”選項,然後在圖像的某個區域上拖動一個框以向其添加模糊,如下所示。

網站快照4

完成按鈕保存您的網頁截圖。 然後將打開一些圖像的保存選項,如下所示。 您可以選擇一些本地保存選項或將其保存到 Google+ 等帳戶。

網站快照5

要捕獲網站頁面的較小部分,請從 Awesome Screenshot 按鈕菜單中選擇捕獲的選定區域。 然後,您可以在頁面區域上拖動一個矩形以包含在鏡頭中,這與截圖工具非常相似。 單擊捕獲以確認選擇。

右鍵單擊擴展程序的按鈕並選擇選項以打開更多設置。 這將打開下面的選項卡,您可以從中配置 Awesome Screenshot 熱鍵。 此外,您還可以為圖像選擇其他文件格式。

網站快照6

使用 Nimbus 截屏

Nimbus Screen Capture是一個替代擴展,您可以使用它來捕獲頁面快照。 您可以在 Google Chrome、Firefox 和 Opera 中使用它。 它的工作原理與令人敬畏的屏幕截圖非常相似,帶有Nimbus 屏幕截圖和工具欄上的 Screencast按鈕,您可以按下以選擇其選項。

網站快照7

因此,按下上方截圖中顯示的按鈕,然後選擇整個頁面以拍攝在瀏覽器中打開的整個頁面。 然後它將打開下面的編輯 - Nimbus 屏幕截圖選項卡。 此選項卡也與 Awesome Screenshot 非常相似,頂部有一個工具欄,其中包含註釋選項。

網站快照8

此處的選項也類似,您可以通過選擇draw arrow為圖像添加箭頭。 如果單擊該按鈕旁邊的小箭頭,則可以選擇更多種類的箭頭。 您還可以選擇陰影選項以向所選箭頭添加陰影或發光效果。 按工具欄最右側的顯示數字按鈕以將數字添加到箭頭。

網站快照9

選擇繪圖註釋選項以將箭頭與文本框組合。 這會在快照中添加一個箭頭和文本框,如下所示。 單擊文本框和箭頭周圍的圓圈以調整其​​角度和尺寸。

網站快照10

Nimbus 還具有 Awesome Screenshot 中包含的模糊選項。 但是,它有一個額外的設置可供您選擇,可以為完整快照添加模糊,而不僅僅是較小的選定區域。

網站快照11

完成按鈕保存快照。 然後按另存為圖像將快照保存到台式機或筆記本電腦。 或者,您也可以通過選擇保存到 Nimbus選項將這些保存到您的 Nimbus 帳戶。

網站快照12

單擊Nimbus Screenshot and Screencast按鈕和Selected area以捕獲網站頁面的較小區域。 然後,您可以拖動並展開一個矩形以選擇要在快照中捕獲的頁面區域。 單擊矩形下方的Edit按鈕,在 Edit – Nimbus Screenshot 選項卡中打開快照。 按保存按鈕保存矩形的裁剪位置。 您還需要選中選項 - Nimbus 屏幕截圖選項卡上的保存裁剪位置複選框以啟用該選項。

在 Edge 中捕獲完整的網頁截圖

您無需任何擴展即可在 Edge 中捕獲完整的網頁快照。 您可以使用其製作 Web 筆記選項來捕獲網站頁面快照。 在 Edge 中打開一個頁面以捕獲圖像,然後按工具欄上的“製作 Web 筆記”按鈕。 這將拍攝頁面快照並打開註釋工具欄,如下所示。

網站快照13

Edge 工具欄上的選項比 Awesome Screenshot 和 Nimbus 中的選項更有限。 您可以按剪輯按鈕剪切頁面的較小部分。 這將打開一個矩形,您可以將其拖過頁面的某個區域以復製到剪貼板。 通過打開軟件並按 Ctrl + V 將頁面的複制區域粘貼到畫圖或其他圖像編輯器中。

網站快照14

在 Edge 和任何其他瀏覽器中捕獲完整網站頁面快照的另一種方法是使用 web-capture.net 工具。 這是一個網站頁面,用於處理您輸入的完整網頁屏幕截圖中的 URL。 單擊此處打開如下所示的 web-capture.net 工具。

網站快照15

然後在“輸入要捕獲的頁面的 URL”文本框中輸入 URL ,並從下拉菜單中選擇圖像的文件格式。 按捕獲網頁按鈕以獲取捕獲的圖像。 然後單擊查看以獲取所捕獲鏡頭的完整預覽。 單擊下載(首選)將快照保存到下載文件夾。

因此,您可以使用 Awesome Screenshot、Nimbus Screen Capture、Edge 的Make a Web Note選項和 web-capture.net 來捕獲整頁網站快照。 瀏覽器擴展具有最廣泛的捕獲完整網頁屏幕截圖的選項,您可以使用 Awesome Screenshot 拍攝桌面軟件快照。 因此,Awesome Screenshot 是 Windows 10 截圖工具的絕佳替代品。