1、第4章 網站(wn zhn)設計與評價第1節 了解(lioji)與設計網站 共二十六頁【學習目標】1、知識性目標：知道WWW、網頁、主頁、網站的基本概念及其相互關系，了解構成網頁的基本元素；知道靜態網頁和動態網頁的差異，并能解釋它們的工作原理；了解常用的網站建設技術和網站的策劃與設計方法。2、技能性目標：能夠分析網站的結構，辨別靜態網頁和動態網頁；能夠根據主題策劃與設計網站。3、情感性目標：通過觀察不同的網頁結構，提高審美情操；通過活動體驗協作的樂趣(lq)，培養客觀真實的價值觀。共二十六頁通過前面的學習，大家對網頁瀏覽已經有了初步的了解。下面我們一起來對網站方面(fngmin)的知識進行系統

2、地學習。 共二十六頁一、網站(wn zhn)與網頁1、網頁：是利用各種軟件或開發工具制作而成的文件，它可以傳遞文字、圖片(tpin)、聲音等各種信息。網頁可分為靜態網頁和動態網頁。共二十六頁靜態網頁是一種用HTML代碼組成的文件(wnjin)，往往用于發布無需用戶參與、內容固定的信息。靜態網頁通常用HTML語言或Dreamwaver、FrontPage等工具編制。動態網頁：包括動態表現網頁和動態內容網頁。動態表現網頁是在網頁外觀上實現動態，常用制作技術有GIF動畫、Flash、JavaScript（JSP）等。動態內容網頁是通過一定的計算機編程語言（如CGI、ASP、JSP、PHP等）來實現與

3、用戶的實時交互，生成內容發生變化的網頁。例如，查詢、留言板、聊天室等網頁。共二十六頁2、網站：由一些互聯的網頁構成的一個整體。3、主頁：又叫首頁，是指一個網站的起始網頁，它是網站的門面，體現(txin)了整個網站的主題、風格及架構，還具有引導的功能。共二十六頁二、網站(wn zhn)的結構常見的網站結構有樹形、星形和混合形。1、樹形結構：主頁上的超級鏈接指向一級子頁，一級子頁的超級鏈接指向二級子頁，依次類推。優點：條理清晰。缺點：瀏覽效率低，訪問者如果想從一個欄目的子頁轉到另一個欄目的子頁，必須(bx)先返回主頁。共二十六頁2、星形結構：每個頁面上都設置一個共同的超級鏈接按鈕，所有頁面都可以通

4、過(tnggu)該按鈕保持鏈接，這個超級鏈接按鈕就是所有頁面的入口。優點：瀏覽方便，訪問者隨時可以切換到自己想看的頁面。缺點：鏈接太多，訪問者容易迷失方向。共二十六頁3、混合形結構：常見的混合形結構是主頁和一級子頁之間采用(ciyng)星形結構鏈接，一級和二級子頁、二級和三級子頁之間采用(ciyng)樹形結構鏈接。共二十六頁三、構成網頁(wn y)的元素 1、文字與圖片2、動畫：GIF動畫、Flash動畫等3、音頻：網上流行(lixng)的音頻格式主要有MIDI、WAV、MP3等共二十六頁4、視頻：常用(chn yn)的視頻格式有RM、AVI、MPG等5、超級鏈接：超級鏈接通常內嵌在文字或圖片

5、中，當用戶的鼠標移至超級鏈接上時會顯示出手指形狀。6、動態內容：動態內容是在與用戶交互的過程中產生的，主要包括查詢、留言板、論壇、聊天室等。共二十六頁四、靜態網頁和動態網頁的工作(gngzu)原理（一）靜態網頁的工作原理(yunl)用戶通過在瀏覽器的地址欄中輸入網址或單擊超級錠接發出請求，該請求會在網絡上傳送，并根據網址或超級鏈接所指定的位置，找到存有所需文件的服務器。服務器在收到請求后，便檢查自己是否存有所需請求的文件，如果有則將文件送出。客戶端在收到服務器返回的文件后，由瀏覽器對其進行解讀，并將結果呈現在客戶端屏幕上。共二十六頁共二十六頁（二）動態網頁的工作原理1、動態表現網頁的工作原理當

6、用戶瀏覽包含GIF動畫和Flash動畫等動態內容的網頁時，所有的動態內容都會從服務器端下載到客戶端，由客戶端的瀏覽器程序(chngx)對其進行解讀，并將結果呈現在屏幕上。共二十六頁2、動態內容網頁的工作原理例如，互動出版網的圖書查詢過程中動態內容網頁的瀏覽(li ln)過程為：（1）用戶在互動出版網的主頁中輸入需要查詢的圖書名稱或作者姓名等信息，瀏覽器將用戶的請求發送給Web服務器；（2）Web服務器接收到客房端發來的請求后，運行與圖書查詢相應的ASP或JSP程序，并向數據庫服務器發出查詢請求；（3）數據庫服務器將查詢結果返回給Web服務器；（4）Web服務器將查詢結果返回到用戶的瀏覽器。共二

7、十六頁共二十六頁五、常用的網站建設(jinsh)技術1、HTML：即超文本標記語言，是一種用來制作超文本文檔的簡單標記語言，一直被用作萬維網上的信息表示語言。2、JavaScript：是目前應用最廣的頁面描述語言之一，它通常(tngchng)被嵌入在HTML語言中，無需編譯就可以直接在瀏覽器中執行，非常適合于建立網頁前端與使用者的互動，用于開發一些瀏覽器客戶端的應用程序。3、DHTML：即動態超文本標記語言，可以使頁面具有動態效果。共二十六頁4、CGI：通用網關接口（common gateway interface），是一種(y zhn)用來定義服務器程序和腳本程序之間的溝通標準的機制。5、A

8、SP：是微軟公司開發的動態網頁技術。6、PHP：是一種跨平臺解釋執行的腳本語言。7、JSP：是由Sun公司提出、多家公司參與制定的動態網頁技術標準。共二十六頁六、網站(wn zhn)的策劃與設計 （一）網站主題(zht)和內容的選擇與定位1、選擇自己最熟悉、最擅長的題材；2、網站的主題要小而精；3、內容要有創新；4、網站的名稱要易記、健康、有特色；5、兼顧網站主要訪問群體的興趣和瀏覽習慣。 共二十六頁（二）網站(wn zhn)欄目的設計網站欄目設計的原則：一是要緊扣主題；二是要突出重點。共二十六頁（三）網站風格(fngg)設計1、色彩的選擇和搭配2、圖片的選擇3、字體的設計4、語言的風格共二十

9、六頁（四）網站(wn zhn)內容的收集和篩選（五）網站結構和超級鏈接的設計共二十六頁（六）網頁的布局網頁的布局大致可分為“國”字型、拐角型、標題正文型、左右框架型、上下框架型、綜合(zngh)框架型、封面型、Flash型及變化型等。設計網頁布局的主要參考要素有：1、平衡2、呼應3、對比4、疏密共二十六頁（七）網站建設(jinsh)技術和工具的選擇 共二十六頁完共二十六頁內容摘要第4章 網站設計與評價。3、主頁：又叫首頁，是指一個網站的起始網頁，它是網站的門面，體現了整個網站的主題、風格及架構，還具有引導的功能。1、樹形結構：主頁上的超級鏈接指向一級子頁，一級子頁的超級鏈接指向二級子頁，依次類推。缺點：瀏覽(li ln)效率低，訪問者如果想從一個欄目的子頁轉到另一個欄目的子頁，必須先返回主頁。用戶通過在瀏覽(li ln)器的地址欄中輸