本章首先將對一些與網(wǎng)絡相關的概念做一些淺顯的解釋，使讀者對Internet 傳遞信息的基本原理有所了解，然后對HTML （超文本標簽語言）的基本知識進行闡述，并對Dreamweaver 的操作環(huán)境做一

本章首先將對一些與網(wǎng)絡相關的概念做一些淺顯的解釋，使讀者對Internet 傳遞信息的基本原理有所了解，然后對HTML （超文本標簽語言）的基本知識進行闡述，并對Dreamweaver 的操作環(huán)境做一些介紹，最后對網(wǎng)頁設計的頁一些原則和方法作一個簡單的概述，從而為后面的章節(jié)的學習打下基礎。

1.1 網(wǎng)頁制作基礎知識

1.1.1 理解網(wǎng)頁

當運行打開瀏覽器程序以后，在地址欄中輸入一個網(wǎng)站的地址，就會展示出相應的網(wǎng)頁內容了。

網(wǎng)頁中可以包含很多種類型的內容作為網(wǎng)頁的元素，最基本的是文字，此外還可以使用靜態(tài)的圖形以及動畫，以及聲音和視頻等多媒體文件。網(wǎng)頁的最終目的就給訪問者深刻的印象，展示有價值的信息。

1.1.2 網(wǎng)頁制作中的基本概念

服務器與瀏覽器

互聯(lián)網(wǎng)就是全世界數(shù)百萬臺計算機互相連接而成的一個計算機網(wǎng)絡。我們坐在家中查看各種網(wǎng)站上的內容，實際上就是從遠程的計算機中讀取了一些內容，然后在本地的計算機上顯示出來的過程。

因此，內容信息的提供者的計算機就稱為“服務器”，用戶使用“瀏覽器”程序，例如Internet Explorer ，就可以通過網(wǎng)絡取得上面的文件以及其他信息。服務器可以同時供許多不同的人（“瀏覽器”）訪問。

訪問的具體的過程簡單來說，就是當訪問網(wǎng)頁的人的計算機連入Internet 后，通過瀏覽器發(fā)出訪問某個站點的請求，然后這個站點的服務器就把信息傳送到用戶的瀏覽器上，即將文件下載到本地的計算機，瀏覽器再顯示出文件內容，這樣用戶就可以坐在家中查詢萬里之外的信息了。

超鏈接

對超鏈接其實并不陌生，例如我們可能會經常訪問新浪網(wǎng)去看新聞，在它的首頁中有很多新聞的標題，當我們用鼠標點擊一個新聞標題以后，就會顯示出新聞的內容。這就是超鏈接的作用。

超鏈接是一種可以指向其他文件的文字或圖片，這種作用稱為超鏈接。瀏覽器可以使用戶利用超鏈接方便地取得超鏈接所指向的另一份文件。在超鏈接文件中，想要更多地了解關于該文件中所提到的一些主題的信息，可以通過對目標用“按下鼠標”的方式來取得更詳細的資料。事實上該文件也可以被鏈接到其他不同作者所編寫的文件上。在Internet 上，一方面數(shù)千萬臺計算機相互連接，另一方面，世界范圍的大量信息通過超本文的方式相互鏈接。 URL

URL 我們也不陌生，每當我們要訪問一個網(wǎng)站的時候，都要在瀏覽器的地址欄中輸入網(wǎng)站的地址，它的學名就是URL 。

URL 為“Uniform Resource Locator”的縮寫，通常翻譯為“統(tǒng)一資源定位器”，也就是人們通常說的“網(wǎng)址”。它是一個指定Internet 上資源位置的標準，也就是人們常說的網(wǎng)址。URL 常見的有以下幾種形式：

ftp://www.artech.cn

HTML

實際上，網(wǎng)頁文件是用一種被稱為 HTML （Hyper Text Markup Language）的標簽語言書寫的。有兩種方式來產生HTML 文件：一種是自己寫HTML 文件，事實上這并不非常困難，也不需要特別的技巧；另一種是使用HTML 編輯器，它可以輔助使用者來做編寫的工作。本書在后面著重講述HTML 。

如果讀者想先看一下HTML 語言是什么樣子，可以用瀏覽器打開任意一個網(wǎng)頁，然后選擇瀏覽器的菜單“查看///源文件”命令，這時會自動打開記事本程序，里面顯示的就是這個網(wǎng)頁的HTML 源文件。也許會感覺非常復雜，實際上它并不難掌握，本書后面的任務就是交給讀者如何編寫HTML 網(wǎng)頁。

上傳與下載

前面已經提到，為了讓全世界的人都可以瀏覽我們制作的網(wǎng)頁，就必須把網(wǎng)頁放到服務器上，當然如果我們有條件也可以把自己的計算設置成服務器，日夜不停地運行并連接在互聯(lián)網(wǎng)上。

當時這樣做很麻煩，因此大多數(shù)情況，我們回去花一點錢租用一個服務器，這樣我們就必須把作好的網(wǎng)站傳送到服務器上，這個過程就稱為“上傳”，而大家通過瀏覽器訪問網(wǎng)頁的時候，所經歷的過程就是下載的過程，并網(wǎng)頁下載到自己的計算機中，這樣才能看到它。 域名

一個公司如果希望在網(wǎng)絡上建立自己的主頁，就必須取得一個域名，域名也是由若干部分組成，包括數(shù)字和字母。例如， www.artech.cn 就是本書作者的域名，通過該地址，訪問者可以找到我們出版過的圖書的信息，還有討論區(qū)可以討論各種技術話題等等。

域名是上網(wǎng)單位和個人在網(wǎng)絡上的重要標識，起著識別作用，便于他人識別和檢索某一企業(yè)、組織或個人的信息資源，從而更好地實現(xiàn)網(wǎng)絡上的資源共享。除了識別功能外，在虛擬環(huán)境下，域名還可以起到引導、宣傳、代表等作用。

域名可分為不同級別，包括頂級域名、二級域名等。頂級域名又分為兩類。

一是國家頂級域名，目前200多個國家都按照ISO3166國家代碼分配了頂級域名，例如中國是“cn”，美國是“us”，日本是“jp”等。

二是國際頂級域名，例如表示工商企業(yè)的“.Com”，表示網(wǎng)絡提供商的“.net”，表示非盈利組織的“.org”，表示教育機構的“.edu”等。

二級域名是指頂級域名之下的域名，在國際頂級域名下，它是指域名注冊人的網(wǎng)上名稱，例如“ibm”，“yahoo”，“Microsoft”等；在國家頂級域名下，它是表示注冊企業(yè)類別的符號，例如“com”，“edu”，“gov”，“net”等等。

例如“artech.com.cn”這個域名中，“cn”是頂級域名，“com”二級域名，“Artech”是三級域名。原來中國的域名管理機構（CNNIC ）沒有開放二級域名的注冊，因此二級域名只有“com”，“edu”，“gov”，“net”等這幾個。幾年前，CNNIC 開放了二級域名的注冊，因此就可以注冊“artech.cn”這樣的域名了。

網(wǎng)站

網(wǎng)站就是在互聯(lián)網(wǎng)上一塊固定的面向全世界發(fā)布消息的地方。它由域名（也就是網(wǎng)站地址）和網(wǎng)站空間構成。網(wǎng)站空間里面存放的就是各種網(wǎng)頁。小的網(wǎng)站可能只包含一個網(wǎng)頁，大的網(wǎng)站可能需要很多計算機來存儲數(shù)據(jù)，例如著名的Google 網(wǎng)站，就依靠數(shù)萬臺計算機來為全世界的網(wǎng)民提供服務。我們也可以把一個網(wǎng)站類比為一棟房屋，域名就是他的門牌，網(wǎng)頁里面的所有網(wǎng)頁構成了房屋里的內容。

衡量一個網(wǎng)站的性能通常從網(wǎng)站空間大小、網(wǎng)站位置、網(wǎng)站連接速度、網(wǎng)站提供服務等幾方面考慮。

當一個的公司在互聯(lián)網(wǎng)上建立一個網(wǎng)站，訪問者可以進入他的網(wǎng)站查詢相關的信息。有時候，網(wǎng)站也被稱作站點。

1.2 HTML 入門

我們常常講起網(wǎng)頁，事實上每一個網(wǎng)頁都是一個文件，這個文件里面包含了HTML 指令，所以這些文件就被稱為HTML 文件。HTML 語言不是一種編程語言，而是一種描述性的標簽語言，這些標簽符用來定義HTML 文件中信息的格式和功能。當瀏覽器接收到HTML 文件后，就解釋HTML 文件內的標簽符，根據(jù)標簽符去執(zhí)行相應的顯示功能或實現(xiàn)某些功能。注意這些標簽符必須用小于號“<”和大于號“>”括起來。

HTML 標簽符最基本的格式是：<標簽符>內容。標簽符通常成對使用，前面的“<標簽符>”表示某種格式的開始，后面的“”表示這種格式的結束。

例如，HTML 文件中的標簽符用來定義HTML 文件中的文字為粗體字。就是說，在這一對標簽中的內容都以粗體的格式在瀏覽器中顯示。例如在文件中有“Hello，World ! ”，那么在瀏覽器中將顯示出粗體字“Hello ，World !”。

HTML 的概念很簡單，就是寫入什么樣的標簽符，瀏覽器就會相應執(zhí)行該標簽符所能實現(xiàn)的功能。不過有一點要注意，我們最常用的Netscape 和Internet Explorer瀏覽器并不完全兼容，即有的標簽只能被其中一種瀏覽器識別。就目前的情形來看，Internet Explorer 已經取得了很大的優(yōu)勢，但在制作網(wǎng)頁時最好還是二者兼顧。另外Dreamweaver 已經充分考慮到了兼容性的問題，盡可能地使制作出的網(wǎng)頁在兩個瀏覽器上都能正確顯示。

此外HTML 文件只是一個純文本文件，可以用任何文本編輯器來編輯它，最簡單就是用Windows 系統(tǒng)里的“記事本”來建立或編輯。HTML 文件的擴展名是.htm 或.html 。

現(xiàn)在已經對HTML 有了一些最基本、最簡單的認識，那么就開始學習一些HTML 的基本語句。完整的HTML 規(guī)則完全可以寫成一本幾百頁的書，在這里僅能講述HTML 中最重要的幾個標簽。

下面是一個最簡單的HTML 文件。

HTML 文件的內容就寫在這里... ...

用任何文本編輯器都可以把上面這個文件輸入并存成普通的文本文件，注意文件的擴展名必須是“.htm”或“.html”，例如“test.htm”，然后就可以用瀏覽器來瀏覽這個頁面了。另外，HTML 文件中的空格都是無效的，也就是說它最終的顯示效果完全由標簽來決定，因此在書寫HTML 文件時最好能使每對標簽上下對齊，并縮進排版，這樣很容易看出各標簽是如何配對的。

在Windows 的“記事本”中輸入這個源文件文檔，并保存文件。注意，在保存這個文件的時候，要在把保存文件對話框中，將“保存類型”設置為“所有文件”，然后再文件名輸入框中給文件名的后綴設置為“htm”，然后再按“保存”按鈕。

然后就可以用瀏覽器，例如最常用是Windows 中的Internet Explorer來打開這個網(wǎng)頁了，在Windows 的“我的電腦”中，雙擊這個保存好的文件，就會打開瀏覽器的窗口。 注意這個文件中有以下4對標簽。

HTML 標簽:

標簽放在HTML 文件的開頭，告訴瀏覽器，這個文件是HTML 文件。而在文件的結尾，是結束標簽。雖然這對標簽可以省略不用，但希望讀者能養(yǎng)成使用該標簽的習慣。

“文件頭”標簽:

文件頭標簽是 和，一般放在標簽的后面，用來標明文件的題目或定義部分。

“文件標題”標簽:

標題標簽為 。這對標簽用來設定文件的標題，注釋這個文件的內容。瀏覽器通常都會將文件標題顯示在瀏覽器窗口的左上角，所以這個標題就顯得很有用。 “文件體”標簽:

文件體標簽為 和 。這對標簽一般都被用來指明HTML 文檔的內容，例如文字、標題、段落和列表等，也可以用來定義主頁背景顏色。

下面再介紹幾個標簽，使這個網(wǎng)頁更復雜一些。

“標題”標簽:

標題標簽的格式為 和（? 代表從1～6的數(shù)字）。這個標簽被用來設置標題字體的大小。HTML 準許有

至

這6級標題，例如“

這是H1標題字

這是H6標題字

HTML 文件的內容就寫在這里... ...

這是H1標題字

這是H2標題字

這是H3標題字

這是H4標題字

這是H5標題字

這是H6標題字

對齊標簽:

平時人們用Word 排版，可以將文字隨意移動，而Word 又可以自動調整字間距，以使段落左右對齊。在HTML 中，沒有字間距這個標簽，不能像Word 那樣對文字進行隨心所欲的編排，一個字符占一個字符空間，絕不能多出或減少。

需要說明的是，HTML 語言本身是不能調整字間距的，但是通過使用層疊樣式表示可以的，這與層疊樣式表的概念，在下一章中介紹。

這里我們又要引入一個新的概念——“屬性”，HTML 語言的標簽還可以帶有一些屬性，例如

前面介紹的H1到H6標簽都有一個 “align”的屬性，用來設置“對齊方式”。每個屬性都可以設置一個“屬性值”，例如align 屬性可以有三種屬性值： left （左對齊）、Center （居中對齊）或者Right （右對齊）。

現(xiàn)在把前面的源文件修改為下面的樣子。

HTML 文件的內容就寫在這里... ...

文本左對齊

文本居中對齊

文本右對齊

1.3 Dreamweaver 的操作環(huán)境

Dreamweaver 8的用戶界面非常友好，為設計是帶來了很大的方便。下面就來把幾個主要部分介紹一下。

Dreamweaver 8的整體界面如圖1.1所示。

圖1.1 Dreamweaver 8 的操作界面

文檔窗口

在界面的中部，是文檔窗口，它是用來編排網(wǎng)頁的區(qū)域，與在瀏覽器中的結果近似，但仍有一些差異。

“插入”面板

選擇菜單“窗口→插入”命令，可以打開或關閉“插入”面板，它位于界面的上側。它的作

用是在光標位置插入各種對象。單擊面板左端的的卡片可切換不同頁，每頁中有不同類型的對象。使用“插入”菜單中的命令也可以實現(xiàn)插入各種對象的目的，與使用“插入”面板是一致的。使用菜單還是使用“插入”面板，可完全根據(jù)用戶的習慣來決定。

“插入”面板默認打開的是 “常用”頁，它包括了最常用的一些對象，例如在文檔中的光標位置插入一段超級鏈接文本、一個表格或者一個圖像等等。其他7頁并不像基本對象那樣常用，因此這里僅進行簡單介紹，后面還會詳細介紹。

·“布局”頁的作用是為了方便使用Dreamweaver 的布局功能。

·“表單”頁中的對象都用來制作表單，例如在文檔中插入表單、文字輸入框和按鈕等。 ·“文本”頁可以方便用戶在文檔中插入一些已經設定好的帶有HTML 格式的文本。

·“HTML”頁可以方便用戶在文檔中插入水平線、文件頭、腳本編制、框架和腳本對象。 ·“應用程序”頁中可以方便用戶插入服務器端的動態(tài)元素，本書不作介紹。

·“Flash 元素”頁可以方便用戶在文檔中插入格式為.swf 的Flash 元素。

·“收藏夾”頁可以方便用戶在收藏夾中自定義常用的插入對象。

“屬性”面板

依次選擇菜單“窗口→屬性”，就可以打開或關閉“屬性”面板。當鼠標選中一些文字或某個對象時，“屬性”面板就會顯示相關信息和參數(shù)，并可對其進行修改和設定。

“屬性”面板幾乎是最常用的一個面板，因為無論要編輯哪個對象的屬性，都要用到它，其內容也隨著選擇對象的不同而改變。

其他面板和工具條

除了上面介紹的兩種面板之外，這里還有必要對一些重要的界面元素做簡單介紹。 在文檔窗口的上方有文檔和標準兩個工具條。

文檔工具條的功能是對文檔進行控制。最左面的3個按鈕十分常用，它們可以切換文檔窗口的顯示方式。

按下按鈕，文檔窗口中只顯示HTML 代碼；按下按鈕，文檔窗口分為上下兩個部分，上面顯示HTML 代碼，下面顯示頁面效果；按下按鈕，文檔窗口中只顯示頁面效果。

除此之外，針對不同的控制對象，還有其他若干面板，如“行為”面板、“框架”面板和“層”面板等，它們都針對不同的對象起作用。 我們在后面的章節(jié)中再進行介紹。

在制作過程中，用戶需要關閉或者打開這些面板和工具條時，具體的方法如下。

選擇菜單“查看→工具欄→文檔”可以打開或者關閉文檔工具條（當“文檔”菜單項前面有一個對勾的時候，工具條被打開，反之則關閉）。

按鍵盤的“F4”鍵可以隱藏所有面板，再按“F4”鍵又可以打開所有面板。如果要打開一個面板，可以在“窗口”菜單中找到相應的菜單項。比如選擇菜單“窗口→文件”就可以打開“文件”面板。隨著Dreamweaver 版本的不斷升高，面板數(shù)量越來越多，因此在Dreamweaver 8中，出現(xiàn)了面板組的概念，也就是幾個功能相關的面板放在一起，組成一組，成為一個面板組，比如選擇菜單“窗口→文件”打開“站點”面板的同時，在它的旁邊也打開了“資源”和“代碼片斷”面板，二者共同組成了“文件”面板組。

1.4 網(wǎng)站開發(fā)的流程

在本節(jié)中，將介紹一下網(wǎng)站設計和開發(fā)的整個工作流程。前面最開始的時候，曾經簡單介紹過一下網(wǎng)站開發(fā)的基本流程。在本節(jié)將這個流程再細化一下，這樣可以更深入地作講解。 經過近10年的發(fā)展，互聯(lián)網(wǎng)已經深入到社會的各個領域，伴隨著這個發(fā)展的過程，網(wǎng)站開發(fā)已經成為了一個擁有大量從業(yè)人員的行業(yè)，從而整個的工作流程也日趨成熟和完善。

明確網(wǎng)站定位

首先在做網(wǎng)站之前給要做的網(wǎng)站一個準確的定位，明確建站目地是什么。誰能決定網(wǎng)站的定位呢？如果網(wǎng)站是做給自己的，比如一個個人網(wǎng)站，那么自己說了算；而如果是為客戶建立網(wǎng)站，那么一定要與客戶的決策層人士共同討論，要理解他們的想法，這是十分重要的。 在理解了客戶的想法后，就要站在客戶的立場上，探討網(wǎng)站的定位。根據(jù)經驗，如果設計師能夠從客戶的立場出發(fā)，給客戶提出一些中肯的建議，結合到策劃中去，那么設計已經成功了一半，也可以大大避免在日后與客戶的溝通中發(fā)生不愉快的可能性。

收集信息和素材

在明確建站目的和網(wǎng)站定位以后，開始收集相關的意見，結合公司其他部門的實際情況，這樣可以發(fā)揮網(wǎng)站的最大作用。

這一步是前期策劃中最為關鍵的一步，因為做網(wǎng)站一定是為公司服務的，所以全面地收集相關的意見和想法是最為必要的。這一步需要整理成文檔，可以讓相關部門配合提交一份本部門需要在網(wǎng)上開辟的欄目計劃書。這份計劃書一定要考慮充分，因為如果要把網(wǎng)站作為一個正式的站點來運營的話，所做的每一項欄目的設置都應該是有規(guī)劃的。如果考慮不充分，會導致以后突如其來的新加內容破壞網(wǎng)站的整體規(guī)劃和風格。當然，這也并不意味著網(wǎng)站成形后是不許添加欄目的，只是在添加的過程中需要結合網(wǎng)站的具體情況，最好是當初策劃時考慮全面！

策劃欄目內容

收集完所有的相關信息以后，對其進行整理，整理以后找出重點，根據(jù)重點以及公司業(yè)務的側重點，結合網(wǎng)站定位來確定網(wǎng)站的欄目需要有哪幾項?？赡荛_始時會因為欄目較多而難以確定最終需要哪幾項，這又是一個討論的過程，需要所有設計和開發(fā)人員在一起闡述自己的意見，一起反復比較，將定下來的內容進行歸類，形成網(wǎng)站欄目的樹狀列表用以清晰表達站點結構。

對于比較大的網(wǎng)站，可能還需要討論和確定二級欄目以下的子欄目，對它進行歸類，并逐一確定每個二級欄目的主頁面需要放哪些具體的東西，二級欄目下面的每個小欄目需要放哪些內容，讓欄目負責人能夠很清楚地了解本欄目的每個細節(jié)和每個欄目，討論完以后，就應由欄目負責人來按照討論過的結果寫欄目規(guī)劃書。欄目規(guī)劃書要求寫得詳細具體，并有統(tǒng)一的格式，以備網(wǎng)站留檔。這次的策劃書只是第一版本，以后在制作的過程當中如果出現(xiàn)問題應及時修改該策劃書，并且也需要留檔。

設計頁面方案

再接下來，需要做的就是讓美術設計師（也稱為美工）根據(jù)每個欄目的策劃書來設計頁面。這里需要再次指出，在設計之前，應該讓欄目負責人把需要特殊處理的地方跟設計人員講明。在設計頁面時實際是要根據(jù)策劃書把每個欄目的具體位置和網(wǎng)站的整體風格確定下來。為了讓網(wǎng)站有整體感，應該在網(wǎng)頁中放置一些貫穿性的元素，最終要拿出至少3種不同風格的方案。每種方案應該考慮到公司的整體形象，與公司的精神相結合。設計方案拿出以后，經討論后定稿。最后挑選出兩種方法交給客戶選擇，由客戶確定最終的方案。 制作頁面

方案設計完成以后，下一步是實現(xiàn)靜態(tài)頁面，由制作人員負責根據(jù)設計師給出的設計方案，制作出網(wǎng)頁，并制作成模版。在這個過程中需要十分注意網(wǎng)站的頁面之間的邏輯，并區(qū)分靜態(tài)頁面和需要服務器端實現(xiàn)的動態(tài)頁面。

在這個過程實現(xiàn)的同時，欄目負責人應該開始收集每個欄目的具體內容并整理。模版制作完成后，由欄目負責人往每個欄目里面添加具體內容。對于靜態(tài)頁面，將內容添加到頁面中即可，對于需要服務器端編程實現(xiàn)的頁面交由編程人員繼續(xù)完成。

為了便于讀者理解，在這里舉一個例子，以區(qū)分動態(tài)和靜態(tài)頁面的含義。例如某個公司

的網(wǎng)站，需要展示1000種商品，如果只用靜態(tài)頁面來制作，那么如果在一個頁面中展示10個商品，則一共需要100個靜態(tài)頁面，而且日后如果需要修改某商品的信息，就需要重新制作相應的頁面，這樣工作量就會非常大。而如果借助于服務器端的程序，制作為動態(tài)頁面，例如使用ASP 技術，只需要制作一個頁面，然后把1000種商品的信息存儲在數(shù)據(jù)庫中。頁面根據(jù)瀏覽者的需求動態(tài)地顯示這些商品，則只需要制作一個頁面以及編制若干程序就可了，而且便于修改。這就是動態(tài)頁面的作用。

實現(xiàn)后臺功能

在前一步中，將動態(tài)頁頁面設計好后，只剩下程序部分需要完成了。在這一步中，由程序員來根據(jù)功能需求，編寫程序，完成動態(tài)頁面。

需要說明的是，網(wǎng)站的建設過程中，“如何統(tǒng)籌”是一個比較重要的問題。在上面所講述的過程進行的同時，網(wǎng)站的程序人員正處于開發(fā)程序的階段，如果實現(xiàn)的過程中出現(xiàn)什么問題，編程人員應和制作人員及時溝通，以免程序開發(fā)完成后發(fā)現(xiàn)問題再進行大規(guī)模的返工。 整合與測試網(wǎng)站

接下來，當兩邊的工作都完成以后，就是整合。把程序和頁面進行整合。整合完成以后，需要內部測試，測試完成，即可上傳到服務器上，交由客戶檢驗。通?？蛻魰岢鲆恍┬薷囊庖姡@時根據(jù)客戶要求完成修改即可。

如果這時客戶發(fā)現(xiàn)了一些問題，由于客戶并不了解工作的原理，可能他們會覺得很容易修改，而實際上有可能是結構型的調整，工作量會很大，這時就很容易產生不愉快的情況。因此最好在開發(fā)的前期準備階段就充分理解用戶的想法和需求，同時對于一些可能發(fā)生的情況提前告訴客戶，這樣就容易與客戶報紙愉快的合作關系。

1.5 網(wǎng)頁布局概述

現(xiàn)在把焦點集中在頁面方案的設計上。傳統(tǒng)的媒體如報刊和雜志，只有文字和圖片而沒有聲音；廣播只有聲音卻沒有文字和圖像；電視是擁有聲音、圖像和文字的媒體，但觀者只能被動地接受，而不能自由而有選擇地觀看，也不能進一步查看詳細資料。

只有網(wǎng)頁可以做到兩者兼容。觀眾的自由度像報紙一樣，可自由選擇喜愛的內容，同時又可以聽和看更多的聲音和視頻信息，更全面了解事物。這種利用圖像、音效和動畫的版面構成形式，必將使媒體視覺傳播策略更加深入。因此有必要根據(jù)網(wǎng)頁的特點，來介紹一下頁面設計中的一些基本知識。其中“網(wǎng)頁布局”就是首要的一個方面。

網(wǎng)頁的布局千變萬化，很難尋到幾條固定的規(guī)則，這里只是就比較常見的幾種類型作一說明，并舉一些例子，使讀者能有一個基本的認識。實際上各種類型之間并沒有嚴格的界限。 “廠”字型布局

所謂“廠”型結構，就是指頁面頂部為橫條網(wǎng)站標識和廣告條，下方左面（也可放在右邊）為主菜單，右面顯示內容的布局。菜單條與背景，整體效果類似“廠”字。這是目前最常見的一種網(wǎng)頁布局方式。這種布局的優(yōu)點是頁面結構清晰，主次分明。缺點是由于被使用得過多，顯得缺乏創(chuàng)意，略顯呆板。

“國”字型布局

這種頁面通常上下各有一個廣告條或者其他欄目條，左面是主菜單，右面放友情連接或者其他欄目等，中間是主要內容。這種布局的優(yōu)點是充分利用版面，信息量大。缺點是頁面顯得比較擁擠和局促，不夠靈活。

“三”字型布局

這種布局多用于國外站點，通常頁面上方橫向幾條色塊，將頁面整體分割為若干部分，色塊中大多放廣告圖片或者Flash 動畫。

宣傳單型布局

這類頁面布局就像一張宣傳海報，以一張精美圖片作為頁面的設計中心，常用于個性類站點。優(yōu)點是漂亮吸引人，缺點就是頁面中大面積使用圖片，導致瀏覽速度相對較慢。同時可以作為宣傳單使用。

門戶型網(wǎng)頁布局

這類網(wǎng)頁通常內容多，信息量大，通常沒有明顯的線條作為邊界，圖片用得也比較少，一般通過文字的排列產生視覺上的分區(qū)效果。

區(qū)塊型布局

這類網(wǎng)頁現(xiàn)在出現(xiàn)得越來越多，在網(wǎng)頁上各個區(qū)域具有封閉的邊界，經過合理放置顯得清晰美觀。缺點是由于版面固定，各區(qū)域很難根據(jù)其中內容的多少而調整大小，因此不適宜用于區(qū)域內容的長度經常變化的網(wǎng)頁。