如果你是初學者，那么最好明白下面網頁布局的基本概念：1.頁面尺寸：由于頁面尺寸和顯示器大小及分辨率有關系，網頁的局限性就在于你無法突破顯示器的范圍，而且因為瀏覽器也將占去不少空間，留下給你的頁面范圍變得越來越小。一般分辨率在800x600的情況下，頁面的顯示尺寸為778x435個象素：；分辨率在640x480的情況下，頁面的顯示尺寸為:618X311個象素；分辨率在1024X768的情況下，頁面的顯示尺寸為：1007x600。從以上數據可以看出，分辨率越高頁面尺寸越大。因為目前較為常用的是800x600分辨率，所以一般都把頁面做成778x435個象素，普通網頁只要保證寬度不超過778個象素就可以了。瀏覽器的工具欄也是影響頁面尺寸的原因。一般目前的瀏覽器的工具欄都可以取消或者增加，那么當你顯示全部的工具欄時，和關閉全部工具欄時，頁面的尺寸是不一樣的。在網頁設計過程中，向下拖動頁面是惟一給網頁增加更多內容(尺寸)的方法。但我想提醒大家除非你能肯定站點的內容能吸引大家拖動，否則不要讓訪問者拖動頁面超過三屏。如果需要在同一頁面顯示超過三屏的內容，那么你最好能在上面做上頁面內部連接，方便訪問者瀏覽。2.網頁布局類型網頁布局大致可分為“國”字型、拐角型、標題正文型、左右框架型、上下框架型、綜合框架型、封面型、Flash型、變化型，下面分別論述。2.1、“國”字型：也可以稱為“同”字型，是一些大型網站所喜歡的類型，即最上面是網站的標題以及橫幅廣告條，接下來就是網站的主要內容，左右分列一些兩小條內容，中間是主要部分，與左右一起羅列到底，最下面是網站的一些基本信息、聯系方式、版權聲明等。這種結構是我們在網上見到的差不多最多的一種結構類型。2.2、拐角型：這種結構與上一種其實只是形式上的區別，其實是很相近的，上面是標題及廣告橫幅，接下來的左側是一窄列鏈接等，右列是很寬的正文，下面也是一些網站的輔助信息。在這種類型中，一種很常見的類型是最上面是標題及廣告，左側是導航鏈接。2.3、標題正文型：這種類型即最上面是標題或類似的一些東西，下面是正文，比如一些文章頁面或注冊頁面等就是這種類。2.4、左右框架型：這是一種左右為分別兩頁的框架結構，一般左面是導航鏈接，有時最上面會有一個小的標題或標致，右面是正文。我們見到的大部分的大型論壇都是這種結構的，有一些企業網站也喜歡采用。這種類型結構非常清晰，一目了然。2.5、上下框架型：與上面類似，區別僅僅在于是一種上下分為兩頁的框架。2.6、綜合框架型：上面兩種結構的結合，相對復雜的一種框架結構，較為常見的是類似于“拐角型”結構的，只是采用了框架結構。2.7、封面型：這種類型基本上是出現在一些網站的首頁，大部分為一些精美的平面設計結合一些小的動畫，放上幾個簡單的鏈接或者僅是一個“進入”的鏈接甚至直接在首頁的圖片上做鏈接而沒有任何提示。這種類型大部分出現在企業網站和個人主頁，如果說處理的好，會給人帶來賞心悅目的感覺。2.8、Flash型：其實這與封面型結構是類似的，只是這種類型采用了目前非常游戲行的Flash，與封面型不同的是，由于Flash強大的功能，頁面所表達的信息更豐富，其視覺效果及聽覺效果如果處理得當，絕不差于傳統的多媒體。2.9、變化型（混合型）：即上面幾種類型的結合與變化，比如本站在視覺上是很接近拐角型的，但所實現的功能的實質是那種上、左、右結構的綜合框架型。關于第一屏所謂第一屏，是指我們到達一個網站在不拖動滾動條時能夠看到的部分。那么第一屏有多“大”呢？其實這是未知的。一般來講，在800*600的屏幕顯示模式(這也是最常用的)下，在IE安裝后默認的狀態(即工具欄地址欄等沒有改變)下，IE窗口內能看到的部分為778px*435px，一般來講，我們以這個大小為標準就行了，畢竟，在無法適合所有人的情況下，我們只能為大多數考慮了。說了那么多，無非是一個標準的問題，其實接下來不用我說大家也能想到，第一屏當然要放最主要的內容，關鍵要知道的是，我們要對第一屏能顯示的面積要有個估計，而不要僅僅以自己的機器為準。其實網頁制作的一個很麻煩的地方就是瀏覽者的機器是未知的。有關導航欄的位置導航欄能讓我們在瀏覽時容易的到達不同的頁面，是網頁元素非常重要的部分，所以導航欄一定要清晰、醒目，一般來講，導航欄要在“第一屏”能顯示出來，但是有時第一屏可能會小于上面所說的435px，積于這點考慮，那種橫向放置的導航欄要優于縱向的導航欄考慮，原因很簡單：如果瀏覽者的第一屏很矮，橫向的仍能全部看到，而縱向的就很難說了，因為窗口的寬度一般是不會受瀏覽器設置影響的，而縱向的則不確定性要大的多。什么樣的布局是最好的這是初學者可能會問的問題。其實這要具體情況具體分析的：比如如果內容非常多，就要考慮用“國字型”或拐角型；而如果內容不算太多而一些說明性的東西比較多，則可以考慮標題正文型；那幾種框架結構的一個共同特點就是瀏覽方便，速度快，但結構變化不靈活；而如果是一個企業網站想展示一下企業形象或個人主頁想展示個人風采，封面性是首選；Flash型更靈活一些，好的Flash大大豐富了網頁，但是它不能表達過多的文字信息。還沒有提到的就是變化型了，我只是想把這個留給讀者了，因為，只有不斷的變化才會提高，才會不斷豐富我們的網頁。關于網頁的布局大致就說這些，希望您有所啟發。3.頁頭：頁頭又可稱之為頁眉，頁眉的作用是定義頁面的主題。比如一個站點的名字多數都顯示在頁眉里。這樣，訪問者能很快知道這個站點是什么內容。頁頭是整個頁面設計的關鍵，它將牽涉到下面的更多設計和整個頁面的協調性。頁頭常放置站點名字的圖片和公司標志以及旗幟廣告。4.文本：文本在頁面中出現都數以行或者塊(段落)出現，它們的擺放位置決定者整個頁面布局的可視性。在過去因為頁面制作技術的局限，文本放置的位置的靈活性非常小，而隨著DHTML的興起，文本已經可以按照自己的要求放置到頁面的任何位置。5.頁腳：頁腳和頁頭相呼應。頁頭是放置站點主題的地方，而頁腳是放置制作者或者公司信息的地方。你能看到，許多制作信息都是放置在頁腳的。6.圖片圖片和文本是網頁的兩大構成元素，缺一不可。如何處理好圖片和文本的位置成了整個頁面布局的關鍵。而你的布局思維也將體現在這里。7.多媒體除了文本和圖片，還有聲音，動畫，視頻等等其它媒體。雖然它們不是經常能被利用到，但隨著動態網頁的興起，它們在網頁布局上也將變得更重要。網頁設計應注意的問題1.網頁應易讀網站設計最重要的訣竅，恐怕就是你的網頁要易讀。這就意味著,你必須花點心思來規劃文字與背景顏色的搭配方案。注意不要使背景的顏色沖淡了文字的視覺效果，別用花里胡哨的色彩組合，讓人看起來你的網頁來很費勁。一般來說，淺色背景下的深色文字為佳。這個原則也意味著，你最好別把文字的規格設得太小、也不能太大。文字太小，人家讀起來難受；文字太大，或者文字視覺效果變化頻繁，像是沖著人大喊大叫，看起來不舒服。另外，最好讓文本左對齊，而不是居中。按當代中文的閱讀習慣，文本大都居左的。當然，標題一般應該居中，因為這符合讀者的閱讀習慣。2.網站導航要清晰所有的超鏈接應清晰無誤地向讀者標識出來，所有導航性質的設置，像圖像按鈕，都要有清晰的標識，讓人看得明白，千萬別光顧視覺效果的熱鬧的，而讓人家不知東西南北。鏈接文本的顏色最好用約定俗成的：未訪問的，藍色；點擊過的，紫色或栗色。如果你一定要別出心裁，鏈接的文本就要想著以什么方式加以突出，比如說加粗體？加字號？兩側加豎標？或者幾者兼用�？傊�，文本鏈接一定要和頁面的其他文字有所區分，給讀者清楚的導向。清晰導航還要求：讀者進入目的頁的點擊次數，不能超過三次。如果三次以上還找不到，人家可就沒有耐心陪你玩了！3.網頁風格要統一其實，這個原則和傳統的印刷出版物沒什么區別。你網頁上所有的圖像、文字，包括像背景顏色、區分線、字體、標題、注腳什么的，要統一風格，貫穿全站。這樣子讀者看起來舒服、順暢，會對你的網站留下一個“很專業”的印象。舉個簡單例子。如果你在列示一二三四若干條的情況下，在每條前面用黑圓點加強視覺效果，那么其他似地方，也應該用保持同樣的風格。色彩斑斕的站點，尤其要注意風格的顏色可以變，不過字體、主體文本對齊風格、標題、背景效果以及特殊圖像效果等等都應保持統一。很多缺乏編輯、出版背景的網友，很容易忽視這點，特別是網頁一多，更容易忘。4.頁面容量越小越好，別超過75K有研究顯示，如果一個網站頁面的主體在15秒之內顯現不出來，訪客會很快失去對該站的興趣。當然，也有例外，比如內容實在太精彩，人家不去不行。再像視覺藝術類站點，也不能以“快”為唯一設計標準。不過，即使這類站點，也該在加個導引頁，給讀者一個提示，別不理睬人家的心情。有人或許要和我抬杠：不見得吧？微軟和Sn公司的站點怎么也慢得可怕？沒錯，就是這樣慢，還有人繞開高峰時間去上，誰叫人家那么大的名氣呢？如果你的名頭沒那么響，還是合作一點，放讀者一馬吧！要限定頁面的大小，就得從各個角度考慮節省。最大的一頭是圖像，有的好東西，只得割愛了。想想看，在創意表達、品牌形象、掙錢幾個目標之中，哪個最重要？5.使用網頁設計工具軟件中的站點管理6.標題要好記又新穎，體現網站的風格和內容字體不要太單調，也不能太講求視覺效果7.網頁特效不要使用太多8.圖片應小而精，圖片的使用不能喧賓奪主9.圖片最好經過專業圖片處理軟件處理使用特殊字體時要做成圖片10.使用多媒體文件時要考慮到網絡傳輸速度和用戶機性能11.文件命名時用英文名稱12.盡量使用表格規劃網頁布局