Image Picker 從任何網頁快速下載圖片,一鍵列出所有圖片尺寸和格式(Chrome 擴充功能)

最後更新於 2020 年 07 月 07 日

大家都知道要取得網頁上的圖片非常簡單,只要在圖片按右鍵另存圖片即可,但有時候會遇到一些問題,例如無法儲存圖檔(最常出現在網站 Logo),或是網頁鎖右鍵無法直接下載圖片,除了可以從原始碼去找到圖片路徑,也能透過下載器協助找到圖片,例如之前介紹過的 Image Cyborg 可批次下載網頁所有圖片,或是 Imageye 這類的瀏覽器外掛都有相同效果。

本文要推薦的「Image Picker」是最近發現的免費 Chrome 擴充功能,點選後可以在下拉是選單快速顯示出網頁的所有圖片,包括預覽圖、尺寸大小、圖片格式,按下圖片後就會自動下載圖檔,非常方便。

對於經常會需要下載網頁圖片的使用者來說,Image Picker 解決了無法順利下載圖片的問題,例如你不需要去翻找原始碼、CSS 樣式表來找出圖片路徑。不過這個工具對於要下載大量圖片來說就沒有 Imageye 那麼方便,Imageye 提供批次下載網頁所有圖片的功能。

Image Picker
Chrome 線上應用程式商店

使用教學

STEP 1

開啟 Image-Picker 擴充功能頁面後點選「加到 Chrome」進行安裝,如果對於這個外掛有興趣,它也是一個開放原始碼程式,可以從 GitHub 專案找到更多資訊。

安裝後 Image-Picker 會在右上角顯示一個照相機圖示。

STEP 2

當你想從某個網頁下載圖片、卻又無法直接右鍵另存圖片時,點選 Image Picker 圖示就會在下拉頁面顯示出偵測到的所有圖片檔案,每張預覽圖的下方會標示圖片的解析度大小、檔案格式。

STEP 3

點選圖片就會跳出「下載」功能,快速儲存到瀏覽器的下載路徑。

值得一試的三個理由:

  1. 快速顯示網頁上的所有圖片檔案
  2. 每張圖片會有預覽圖、尺寸大小和圖片格式資訊
  3. 點選就能快速下載、取得圖片檔案非常方便

 

相關的文章

Instagram Picker 免費 IG 抽獎工具,貼上貼文網址指定抽獎人數隨機抽取

現在很常看到網紅或品牌在 Instagram 辦抽獎活動,其實這在早期 Facebook 剛在台灣紅起來時經常看到,主要是透過留言、分享轉貼和標記朋友等方式增加互動率,再以抽獎程式隨機抽出幸運的朋友,以前介紹過「粉絲團留言抽籤小助手」就是非常有用的抽獎工具,IG 則是使用另一個「Instagram 抽獎神器」進行抽獎,前者在免費下依然可以用於粉絲專頁抓留言或是心情回覆,後者現在必須要支付一年 450 元年費來維持程式維護和伺服器支出才能使用。

無痛轉移!微軟 Microsoft Edge 瀏覽器安裝 Chrome 擴充功能教學

年初微軟推出全新 Microsoft Edge 瀏覽器,雖然名稱沿用之前的 Edge,卻是將整個瀏覽器砍掉重練,直接以 Chromium 做為核心,也和 Google Chrome 一樣有著非常好的速度、安全性和穩定度,更重要的是也能使用 Chrome 龐大的擴充功能!雖然 Microsoft Edge 預設安裝擴充功能會連接到 Microsoft Store,如果你要使用的外掛只有在 Chrome 線上應用程式商店上架,只要設定一下也能回到熟悉的商店安裝瀏覽器擴充功能。

Full Page Screen Capture 快速擷取完整網頁畫面,轉為圖片或 PDF 格式(Chrome 擴充功能)

對於可以保存網頁畫面的截圖工具相信大家都不陌生,像是 WinSnap、FastStone Capture 或 Mac 系統很好用的 Jing(現在是 TechSmith Screencast)都能達到類似效果,或是透過瀏覽器擴充功能和線上工具也能做到,通常保存下來的都是靜態圖片格式。如果你想要完整保存某個網頁在某個時間點的樣貌,透過第三方建立更具公信力的網頁備份可能是更好的選擇,我曾介紹過 Wayback Machine 網頁時光機就能讓使用者將頁面完整保存在線上,以便隨時回溯到特定時間:

Block Website Notification Requests 自動封鎖網站顯示通知請求(Chrome 擴充功能)

幾年前開始 Google Chrome、Firefox 等瀏覽器就加入「通知」功能,網站可透過使用者同意的權限推播桌面通知,但我一直覺得這個功能很惱人,特別是一進入網站就跳出的提示畫面,如果是線上應用(例如網頁版即時通訊軟體),我想通知有其必要,但大部分都被新聞網站或部落格拿來推送文章鏈結,我想這不應該是通知功能的本意吧!所以我從沒有考慮過在免費資源網路社群加進通知功能,也想幫大家省下點選封鎖通知的那一點時間。

在 Google 搜尋結果加入切換不同國家語言的選項(Chrome 擴充功能)

現今搜尋資料時大家一定會先去求助 Google 大神,如果撇開隱私不說,Google 搜尋引擎確實能找到非常多的結果,而且內容相當準確,這當中存在很多技術,例如 Google 會依照使用者來源國家和使用語言等等顯示出最適合的搜尋結果,畢竟它強調的是解決問題,與其說是給使用者相關結果更不如說是提供解答。不過另一方面也就表示搜尋結果會受限於個人化,若沒有透過一些選項調整很難找到其他國家語言的搜尋結果。

Responsive Viewer 在單一頁面查看網頁在不同螢幕大小裝置的顯示樣貌(Chrome 擴充功能)

如果要讓行動裝置正常瀏覽網頁,可以另外製作手機版頁面或是透過自適應網頁設計(Responsive Web Design,簡稱 RWD)技術來調整版型,那麼要怎麼知道一個網站有沒有支援 RWD 呢?最簡單的方法就是拖曳調整視窗大小,看看網頁是不是在寬度較窄時仍可正常顯示,例如選單可能會縮起變成點選後才展開的按鈕。大部分的開發者都會使用行動裝置測試版型,但每個裝置大小都有差異,若沒辦法同時擁有這麼多裝置進行測試,其實透過一些電腦上的工具也能達到相同效果。

回應