时尚美容

如何設計網頁橫幅

從劃分空間開始：

一個網頁橫幅的寬度橫跨整個網頁，網頁設計而高度又相當窄。將其分成三個區域：名稱，圖片及導航鏈接。然後我們分別對其進行設計。
如何分配區域：一般來說，我們都是將名稱放在左上方，而導航欄目放在下方。其空間的分配應該慎重。空間的比例大小是根據具體的名稱（長或短）和圖片而定的，很難說有什麼最佳的比例。但是，應該避免將上方空間分成兩等份，因為分成兩等份會讓人的注意力都放在版式上，而不是放在內容上。採用不對稱的分佈效果會更好。

設計一個吸引人的網頁主橫幅其實可以很簡單，我們思考的只是如何分配區域。

在一個簡單的網頁中，上方的橫幅是最重要的視覺元素。在很多博客網頁中，網頁設計它甚至是唯一的視覺元素。所以它的作用可以說是相當大的。它必須能夠與網站的風格配合，並能傳達視覺上的信息。它必須讓人看上一眼就讓人知道這個網站是屬於什麼類型，風格是什麼。這個橫幅還必須能夠提供簡單明了的導航鏈接。所有這些，我們都可以通過將橫幅分成三個區域而輕鬆實現：每一個區域都具有自己的功能，而我們還要將這三個區域在視覺上統一，使三者俱有相似性及協調性。看一下我們在本文中所介紹的例子。

尋找一張具表現力的圖片：
截取照片時應記住一點：盡可能截取能夠傳達最多信息的那一部分。在上圖這張田園式的風景圖片中，網頁設計有樹，有草，有山，有陽光——看一下我們截取的部分，都將這幾個主要的圖片元素都包括了，這正是我們所需要的，面積雖比原圖小很多，但截取後的圖片所要傳達的信息不但沒有減少，而且在層次感上還加強了。圖片上有豐富的明暗區域（見黑白圖片），形成近、中、遠三種視覺效果。

一張漂亮的圖片是設計一個漂亮橫幅的關鍵。在找到照片後，網頁設計我們還要仔細研究一下截取照片的哪一部分可以最有效傳達相關的信息。其實在實踐中你會發現，要發掘這一點並不難。