網頁設計中圖片的使用基本原則

導語：實際上，每一幅圖片，都可以看做現實生活的縮影，而用户喜歡這種熟悉感，所以能夠營造良好的用户體驗。下面是網頁設計中圖片的使用基本原則，希望對你有所幫助：

巧妙用圖也算是一種設計

即便是內容主導的網站，也需要圖像作為潤色，每次設計這種網站，我都需要尋覓一些優秀的照片或者插畫。這種圖像搜尋對我來説至關重要，因為我不會畫畫，如果你會畫畫，或者你的團隊中有有天賦的繪畫能手，那你真的太幸運了!我都有點嫉妒你的好運。

良好的照片運用能夠成就優秀的設計。人都是視覺動物，在瀏覽網頁時，對於圖像有一種渴望，因此添加圖片非常重要。而且，一定要是合適的、相關的圖片。

　對比

可用性至上!因此你的圖像必須與整體相協調，並且與文字產生對比。幹讀文字非常讓人厭煩。想象一下，一面小黑板，密密麻麻幾千個字，白板黑字，讀吧!這裏有你要的`全部。

要想產生鮮明的上下對比，就要學會觀察;圖片比較亮，那麼文字可以使用較深的顏色，反之亦然。如果想要使用白色字體和亮色背景，那麼最好使用一些黑色元素作為過渡。比如，精美的投影技法就很不錯。

　質量

比方説你要為一家餐館設計網頁。在設計中想要用什麼樣的圖?好吧，現在你決定開始抓起想起，去這家餐館攝影了。你拍第一張照片的時候，站在餐館門口，離桌子上的美食非常遙遠，照片根本無法體現美食的細節;你拍第二張的時候，手突然抖了起來，導致拍攝的照片十分模糊。你覺得這種照片能放在網站上嗎?

如果你的客户不提供專業的攝影作品，那麼趕快去勸勸他們，趕緊拍攝點高清大圖吧。

如果客户很頑固，説”就不!”，那趕緊換個思路，建議採用字體設計、佈局新穎、極簡主義等風格，打造處一種極簡風，然後不帶圖像。寧缺毋濫。寧肯一張圖也不配!也不能配上一堆20k的圖!

關聯性

一圖勝千言，但是有時候文字為主，那麼配上的圖就一定要與文字相關。這是常識，保持元素一致性。還是上面那個例子，人家讓你設計個餐館網頁，你給配上了股票走勢圖，可以隨便感受一下甲方收到作品後的臉色。

如果網頁中的內容比較靈活，比如説賣保險的，那麼配圖可以符號化一點，但是還是要和產品/服務相關。而且符號象徵意義一定要強，這樣就很便於辨認。而且要注意的是，不同國家、不同文化的符號象徵不同。

　大圖受歡迎

這條原則再明顯不過了，圖像越大，視覺衝擊也越大。

有人不相信，比如Econsultancy的人，他們就非要來個數據調查，他們做了三份研究，有興趣的可以看一下 here.

　圖像也是內容的一種

圖像不但利於設計，還是非常棒的內容，當圖像和文字、音頻相結合時，能夠產生下列作用：

　攫取注意力

當文章和頁面中有吸引眼球的圖像時，愛屋及烏，用户會對內容高度敏感。當用户在網上面臨大段大段的文本時，人類的大腦便傾向於”略過這片內容”吧，很少有人會保持注意力，繼續閲讀細節。

圖像能夠打破視覺的單調性，幫助用户聚集註意於文章、鏈接、故事。簡而言之，圖像讓用户集中注意力。

　　更好的理解上下文

好的圖像，相當於一種”過渡句”，能夠很好的引導下文。

而且選圖一定要謹慎，圖像能夠激發用户的一種情緒，一定要確保這種情緒和內容屬於同一個”點”，要做到到位。

　其他注意事項

　　許可問題

如果圖像不屬於你也不屬於用户，那麼一定要獲得許可。最好是書面的許可，而且一定要註明攝像者。

因此在設計前，一定要預先要到許可。不過還有一種辦法，那就是圖庫搜刮一些素材

　　圖庫：免費好還是付費的好?

無論是收費還是免費，圖庫的好處在於，你不用關心這圖是誰的，不用關心許可問題。不過在為網頁配圖時，一般都會使用一些付費的圖片。

免費圖庫的好處：

不花錢

可選擇的非常多

免費圖庫的弊端：

垃圾圖片也多

某些專門的圖片不好找

有些圖片中有水印和鏈接

推薦幾個吧： g, StockVault，DeviantArt.

付費圖庫的優點：

許可問題白紙黑字，沒有版權糾紛

分門別類，種類齊全。

付費圖庫的弊端：

沒錢還是別想了。而且容易上癮，買完一堆，發現超支了

推薦幾個： Shutterstock, iStockphoto ， Dreamstime.

人物攝影

好處是有一種真實感。

如果在產品或服務中採用真人圖片，展示他們工作時的場景。會讓人有一種真實可信感。

可如果你選的模特作態扭捏，露出假惺惺的白牙，會讓用户感到這是個牙醫廣告，太假了。因此，一定要貼近產品。

　結論：

選圖要謹慎!

圖片要合理!

一圖勝千言!