設計網站的第1步是了解網站地圖，設計師依據網站的版面劃分來編排不同版面的空間大小和方位關系。網站的布局實際上就是把文本、圖片、多媒體等在頁面里邊進行合理的安排排列。由此，網站設計也衍生出許多種類的布局款式。

　　Banner式布局：顧名思義，Banner式布局就是指頁面上方是導航條，頂部是一個Banner，下方是其他內容。這種布局辦法的長處是頁面的結構十清楚晰，主次清楚。不管屏幕的尺寸是什么，網頁的內容都會明晰地出現出來。

　　Banner式布局是網站設計中基本也是遍及的一種設計方法，比方說站酷、好奇心日報等。雖然有的設計師會將Banner設計成固定寬或許橫跨整個頁面的大小，但總體的布局款式都是差不多的。

　　上下型布局：指的是網頁的上下都有一個廣告條，左右兩側是超鏈接，中心放置主要內容，下面是網站的基本信息、聯系方式、版權聲明等。

　　很顯然，這種布局辦法的長處是能夠充分使用版面，盡可能多地傳達信息量。同時，網站設計師需要注意板塊的內容和面積大小，不能讓頁面過火臃腫。

　　左右型布局：是將網頁分為左右兩頁的框架結構，左邊是導航鏈接，頂端是小標題，右面是主要內容。

　　現在大部分的導航網站、論壇都采取了這種結構，十清楚晰，一目了然。比方說科技網站36氪，左邊是咨詢分類，中心是新聞和文章。

　　POP式布局：POP是廣告中的術語，意思是售點廣告。在網站設計中，POP式布局是指頁面的布局設計像一張宣揚海報，精巧又吸睛。

　　通常情況下，時髦購物類網站會采取POP式布局，用一張精巧的圖片作為頁面中心，在頂端或許下方放置導航條。POP式布局的缺陷是由于圖片過大，渲染速度較慢。

　　有時，POP式布局還加上小動畫，或許直接在圖片上放上對應的鏈接。這種設計一般會出現在企業介紹的主頁或許個人網頁，給人一種簡潔、優雅的視覺享受。

　　標題正文型布局：這種類型的布局是網站設計中簡單的一種款式，通常是頂端放置標題，下方用作正文區。設計師們喜愛在咨詢文章頁面、注冊頁面等使用標題正文型的布局款式，這樣的款式能夠小程度地打擾用戶，還給用戶一個安靜的閱讀體驗。

　　其實，不管設計師采用哪一種布局，在網頁設計中，重要的要求是主次清楚和重點突出。只有當頁面中有一個明確的視覺中心時，網站用戶才能夠迅速找到內容重點，不至于進入到網站后變得一頭霧水。

　　網站設計師還能夠使用留白來制造視覺會集的作用，引導用戶的視線到主要內容區域。比方蘋果官網中，在產品的介紹頁面，僅保留了中心的概況圖片和上下方的導航條，很多的留白使得用戶會集注意力在產品圖上面。