推薦：網頁設計中圖片展現形式的思考
圖片，是構成網頁的基本元素之一。圖片不僅能夠增加網頁的吸引力，傳達給用戶更加豐富的信息，同時也大大地提升了用戶在瀏覽網頁的體驗。圖片的展示形式豐富多樣，不同形式

設計師總會說設計是一件很累人的事，但這部分原因可能是你自找的。時間與設計出來的效果也并不一定成正比。平面設計師或許應該培養一種“懶人”設計思維，面對一個設計時，心里應該想著的只是如何以最簡單的方式完成，出來的效果可能也會更出色，畢竟，簡潔的設計往往也是最好的設計。

大多數的設計都會同時涉及到文字與圖片，這兩者的差異是非常大的，也很難事先預料到兩者一起使用時的互相影響，圖片與文字如何搭配得漂亮，往往也是設計師的一個很大的挑戰，一不留神，就會造成風格矛盾、細節沖突，對比錯誤。而且就算有一次給你做得不錯，但下一次你面對另一個新項目時，你還是會為此而抓狂。

一些設計師在設計時往往會出現“設計過度”的現象。更好的方式就是象一個懶人的思維一樣，圖片放在這里，文字放在那里，搞定！關鍵是讓每一個元素都簡單清晰，讓兩者的互相影響減至最低，而且這種設計手法還可以讓你一再使用，永不過時。讓我們看具體的例子吧：

這是一家室內家居專業攝影工作室的冊子封面，修改前的設計是一種“吃力”的設計。 設計師選擇了毫不相關的字體及顏色，然后又加上背景及線條，希望使其成為一個有機的整體。其實，設計沒必要搞得這么復雜！

修改后的設計，文字內容并沒有改變，但整個版面分成兩個區域，圖片及文字各占據一個，出來的效果就是漂亮、干凈、整潔，所用的時間精力也不多，而且這種構圖及手法也可以一用再用！

讓我們深入分析這兩者的設計過程。

吃力的設計：

幾經辛苦，這個設計完成了。每一步似乎都有理有據，設計師也將協調、對比、風格一致這些理論緊記于心，但老實說，出來的效果并不理想，從視覺上說也不吸引。為什么？因為設計師是事先想好了某種風格，然后強加在版面上，但偏偏主題元素又與這種設想的風格不一致，強加未遂。

我們再來總結一下這個設計：

在這個設計中，設計師主要采用了Round Bauhaus Demi字體，這種字體是一種有趣新奇的字體——處處呈現一種圓弧的感覺。然而，為了展現這種字體圓形的特點，我們需要將字體顯得比較大，字母間距緊密，并且是要小寫字母（上圖），但問題是，設計師在設定介紹文字時，將其全部設為大寫——這個時候，字體的直線感壓抑了圓弧感，而且下面的文字尺寸又很小，其文字塊邊緣呈現向兩邊發散的直線視覺感（見上圖箭頭線段），這樣的文字排版削弱了字體特有的風格，圓弧不見了，我們感覺到的只是凌亂的字體元素。

設計師深明在風格中細節必須呼應的重要性，所以他將一些地方設為圓角來呼應字體的特點（上圖）。問題是，它還是不夠圓，出來的效果仍然是直線占支配地位。特別是上圖右所示的，我們可以觀察到，這里顯得非常局促，讀者在觀看時，看得的并不是一個整體，而是還得仔細區別你這細小的區域——竟然有4個“步驟”讓讀者去練眼力！毫無必要的設計。

分析完這個設計，讓我們看一下“懶人”是如何設計這個項目的。

“懶人”的設計：

修改后的設計，圖片異常搶眼，元素與版面風格配合，名稱的文字同樣醒目張揚，出來的效果漂亮清晰，為什么這種簡簡單單的設計手法卻更能發揮作用？

通過大小及色值來區分：

精心設計的文字包含了四個視覺引導。從位置來說，呈現由上至下的引導；從字體尺寸來說，是由大至小的引導；從字體樣式來說，是由粗至細的引導；從顏色明暗來說，是由暗到亮的引導。這種特點在這個設計中發揮重要的作用，你的眼睛很自然的由一個元素去到下一個元素，毫無阻礙。

介紹文字采用全大寫，字母間距及行距都設得非常緊密（小寫字母很難呈現這種緊縮的排列），形成了很短的文字行。文字整體呈現一種精細、垂直的視覺特點。文字放在左邊，使右邊留出較大的白色區域，這個區域呈現視覺張力，讓人的眼睛不由自主地移到文字上來。

變化：

“懶人”就算面對一個系列的設計，也是氣定神閑，以不變應萬變，談笑間就能出色完成任務！

無論上下左右，怎么放都讓人滿意。因為圖片及元素都自成一體，互不干擾，文字放在上面， 效果與放在下面一樣出色。水平放置，同樣顯得優雅精美。其實這是顏色的功勞，不同的圖片要用不同的顏色，文字顏色取自于圖片中，這樣文字與圖片既分離，但又有聯系，整體總是顯得和諧一致。當然，還要記住視覺引導：名稱要重點強調，而其它的字體則低調處理。

上面幾個修改后的字體及顏色是我們自由選擇的，如果客戶就認定最初的那種字體及綠色他最喜歡，認為最能體現室內裝修的風格，非得要用回原來的那種字體及綠色。怎么辦？不用一頭撞墻，認為自己如果不是有其它的人生際遇否則一早就成為一個藝術家的客戶大有人在，反正我們一樣應付自如：

仍然保留簡潔的構圖，版面仍然是圖片及文字各就各位；

我們采用原來的字體，但正如我們在上面所分析的，我們會采用小寫字母（就算是第一個字母也是小寫），并且采用細體，這樣的修整，能使包豪斯的字體風格得到最大程度的體現，文字呈現更豐富的特色。

保留字體引導的特性：仍然采用上至下，大至小，暗到亮。在這個設計中，字母不需要粗細變化。

保留對齊特性：包豪斯這種字體結構決定了你很難將它們的字母緊縮排列，所以也意味著我們很難象上面一樣，將文字整體設置成一個具有強烈視覺效果的列狀區域。我們需要隨機應變：調整成右對齊，將名稱的尺寸盡量拉大，然后將字母“g“突出右邊的空白區域，起到強調的作用。作用是讓文字整體搭配得更密切（想象一下，如果g不突出來，名稱與下方的文字會顯得很松散），當然，也使版面更活。

加深綠色：加深綠色的作用是減少與紅色形成過于強烈的對比，現在紅色及綠色的“份量”大概平等，起到恰當的互補關系，而沒有出現誰要控制誰的現象。

分享：淺談頁面設計中光影的特效
為了展現頁面的主題或者是貼近游戲的氛圍，常常會看見游戲的頁面中運用了許多不同類型的光效的渲染，一個簡單的元素有時候加上一點光效就可以化腐朽為神奇。那么光效究竟是