網頁設計師都在用的照片圖庫網站（免費下載、高畫質、可商用）

Pexels 是我覺得最適合做網頁設計的照片圖庫網站了！不僅有強大的搜尋引擎（輸入中文也可以），我們還可以透過標籤、類似圖片來擴大搜尋範圍，而每張照片 ... GetunlimitedaccessOpeninappHomeNotificationsListsStoriesWrite網頁設計師都在用的照片圖庫網站（免費下載、高畫質、可商用）本篇原文刊載於Riven個人網站：https://riven.design/2271嗨囉，我是設計師Riven🙂運用高品質的照片一直都是設計網頁很需要學會的技巧，或是網站上創作文章內容也很常會用到，比如說營造情境感、提升形象或是作為UI介面上的視覺元素等等，適當使用不但可以節省大量時間，也能夠省下拍攝預算，同時還能夠讓網站看起來更專業。

那麼今天這篇文章將會跟大家分享幾個設計師常用到的照片圖庫網站，以及幾個簡單的使用小技巧，可以幫助我們去進行編輯與調整，讓照片更為我們所用，最後也會提醒大家一些授權上面要注意的事情噢！趕緊來看看吧～推薦使用的照片圖庫PexelsPexels是我覺得最適合做網頁設計的照片圖庫網站了！不僅有強大的搜尋引擎（輸入中文也可以），我們還可以透過標籤、類似圖片來擴大搜尋範圍，而每張照片幾乎都支援到可以下載5000x3000像素以上的尺寸，品質很好之外質感也都不錯，還能免費下載並獲得商用授權。

https://www.pexels.com/zh-tw/可以透過搜尋關鍵字的方式找到適合的照片點開圖片可以選擇大小來下載而以長期使用來看，我們也可以註冊會員後，「關注」喜歡的風格作者、「收集」喜歡的照片，之後可以找到更多相關的可用資源，並網站也能紀錄曾經的下載紀錄，如果未來有一天想要找曾經使用過的照片來用，也能夠追回來～而如果想贊助照片提供的作者，也能夠輕鬆抖內；當然啦，如果你也是有在拍照攝影的朋友，也可以上傳作品來獲得收益。

而Pexels的授權也非常清楚，我們可以在授權頁面看到相關規則，基本上所有照片都可以免費下載使用，用在網站上或部落格文章都可以，且不強迫要放上來源。

Pexels有很清楚寫明的授權規則Unsplash這個在很多網誌部落格會看到，常常會被引用到文章當中，而且很多媒體編輯器都有內建可以使用。

而授權部分則是跟Pexels擁有相同的免費下載、可商用與不強迫標注來源的規則，都是相當清楚且友善的。

https://unsplash.comUnsplash上有很大量的照片數量與分類可以找而Unsplash我最喜歡的功能，就是「Collections」——在搜尋結果旁邊我們可以看到由其他使用者所蒐集而來的分類，點開之後就可以看到相關的圖片，由於上面的照片數量實在是太多了，由這樣經過別人挑選的集合，有時候可以更快發現合用的照片！透過Collections可以找到別的使用者蒐集的資料夾PAKUTASOPAKUTASO是日本的照片素材網站，那如果想找一些日系感的攝影，在這邊就比較容易找到，而因為在台灣其實工作上滿容易遇到喜歡日本風格的客戶與利害關係人等，所以直接使用日本的平台找會更精準一些，我們可以更快地達成想要的設計感。

https://www.pakutaso.comPAKUTASO比較建議使用分類去找而使用PAKUTASO的另一個好處是，上面比較多人像的照片都是親切的「亞洲臉孔」，可以避免運用圖庫在網站上時，出現的歐美臉很容易會出戲，這樣會讓使用者感到疏離。

而且還可以從「模特」去找到同一位人物入鏡的更多相關照片。

下載後調整照片的小訣竅而在網站平台上取得照片後，我們通常還會再做一點簡單的加工處理，為的就是讓照片更符合網頁的需求，而以下我列出幾個常見的處理步驟。

簡易調色照片的顏色對網頁視覺的影響最大，所以通常只要色調感上不要相差太多，放上去都是還算OK的。

而我們可以透過如macOS裡面內建的編輯工具（Windows也有內建圖片編輯工具），就可以針對剛下載來的照片進行調整，比如說冷暖色溫、對比與飽和度等等。

而如果是想在照片上再墊一層色塊，則是可以利用網頁語法，或是透過UI設計軟體AdobeXd也可以輕鬆達成。

AdobeXd是可以免費下載使用的設計軟體：官方載點覆蓋上一個透明度低的黑色矩形，就能在照片上疊加清楚文字。

照片裁切今天如果抓下來的圖片尺寸很大（可以的話當然是先選好再下載省一道功），則我們可以先裁切小張一點，不然容易造成檔案過大。

電腦內建的圖片編輯工具都可以直接幫助我們做照片裁切而在AdobeXd裡面，則可以透過剪裁遮色片來把照片調整成我們想要的形狀。

剪裁遮色片(MaskwithShape)，快捷鍵為Command+Shift+M(Windows:Ctrl+Shift+M)。

壓縮檔案今天下載來的照片，要上傳到網站之前，都記得一定要經過壓縮，因為從圖庫網站上下載來的照片，通常品質很高、同時檔案也會很肥大，而直接丟上去網站上容易拖垮網站的載入瀏覽速度。

這邊推薦一個好用的網站工具：TinyPNG（餵熊貓），只要把圖片丟上去，就可以自動幫我們壓縮完成，並且是用肉眼幾乎看不到差異的壓縮方式。

可以看到熊貓幫我們原本1.3MB的圖片，壓縮到只有335KB，省下73%的檔案空間。

當然啦，如果真的很在意圖片的壓縮品質，我們可以透過Photoshop來進行壓縮，但那樣步驟上就會繁瑣許多。

使用圖庫要注意的事情最後，再次提醒大家使用網路上的圖庫資源，一定要看好使用的授權規範，通常各家的網站規則都是不同的，如果不小心觸法那可是很麻煩的哦～特別是有動漫卡通或電影的截圖，以及常見的梗圖等等，都是不能夠直接拿來用的️同時，我們也要盡量找到風格與構圖相近的照片素材，這樣整個網站看起來才有一致性，就算原始素材不太搭嘎，我們也還是可以透過上面提到的幾個調整編輯技巧來盡可能地修改，而修改在CC0的使用授權上都是允許的，而這也是大多圖庫網站所採用的授權方式。

而如果今天提到的幾個免費資源上面，還是找不到符合你標準的照片，我們則還可以更進一步地透過付費下載的方式來找到更適合的素材，這個我們會在下一篇文章中，好好地跟大家聊一下！（有足夠預算的話當然是找專業攝影師商攝囉～）今天的內容就先到這邊，如果想要看到更多相關教學，可以訂閱本站設計攻略電子報，或是到FacebookRAR設計攻略按讚追蹤噢！訂閱RAR設計攻略電子報|Riven林育正Editdescriptionriven.design先這樣啦，我是Riven，希望你喜歡今天的文章🙂我們下次見～Morefrom林育正RivenFollow是數位遊牧型態的設計師💻喜歡邊旅行邊工作的生活，逐網路、插座與咖啡而居。

期待能夠將艱難的設計與開發技術，用麻瓜都能夠聽得懂的話，說給每一個人聽。

更多關於我：riven.designLovepodcastsoraudiobooks?Learnonthegowithournewapp.TryKnowableAboutHelpTermsPrivacyGettheMediumappGetstarted林育正Riven7.8KFollowers是數位遊牧型態的設計師💻喜歡邊旅行邊工作的生活，逐網路、插座與咖啡而居。

期待能夠將艱難的設計與開發技術，用麻瓜都能夠聽得懂的話，說給每一個人聽。

更多關於我：riven.designFollowHelpStatusWritersBlogCareersPrivacyTermsAboutKnowable