1、 網(wǎng)絡(luò)操作系統(tǒng) 課程設(shè)計題 目：DNS服務(wù)器搭建及網(wǎng)站測試 系 別： 信息與計算機科學(xué)系 專業(yè)班級： 網(wǎng)絡(luò)工程 小組成員： 史文娜 馬曉麗 指導(dǎo)老師： 徐維昌 2013 年12月24日目錄1引言2第一章 DNS服務(wù)器搭建3一DNS搭建.3 1.1域名空間.31.2域名解析.41.3域名服務(wù)器.4二搭建DNS服務(wù)器5 2.1實驗環(huán)境.52.2安裝DNS服務(wù)器.5（1）實驗準(zhǔn)備.5（2）配置DNS服務(wù)器.6（3） 創(chuàng)建主機記錄和指針15（4） 測試18三. IIS的安裝與配置21四.設(shè)計總結(jié).25五參考文獻25第二章 網(wǎng)頁制作（26-42）引 言當(dāng)TCP/IP正式成為互聯(lián)網(wǎng)事實上的工業(yè)標(biāo)準(zhǔn)后，隨著

2、Internet規(guī)模的擴大，出現(xiàn)了一些迫切需要解決的問題，其中最重要的就是實現(xiàn)IP地址與域名的轉(zhuǎn)換。眾所周知，在網(wǎng)絡(luò)中唯一能夠用來標(biāo)識計算機身份和定位計算位置的方式就是IP地址，但網(wǎng)絡(luò)中存在著許多服務(wù)器，記憶這些純數(shù)字的IP地址不僅枯燥無味，而且容易出錯。如果將這些IP地址與形象易記的域名一一對應(yīng)，使用戶在訪問服務(wù)器或網(wǎng)站時不是使用IP地址，而是使用簡單易記的域名，這樣就可以解決易記與尋址不能兼顧的問題。DNS（Domain Name System域名系統(tǒng)）是Internet和本地局域中最重要的服務(wù)之一，屬于TCP/IP協(xié)議族中的標(biāo)準(zhǔn)服務(wù)，它解決了IP地址與域名的互相轉(zhuǎn)換問題。通過安裝了域名系

3、統(tǒng)的DNS服務(wù)器，可以將用戶輸入的域名自動翻譯成相應(yīng)的IP地址，從而使網(wǎng)絡(luò)服務(wù)的訪問變得更加簡單，對于網(wǎng)站的推廣發(fā)布也起到了極其重要的作用。本課題的主要目的包括：1、通過學(xué)習(xí)，了解DNS的基本原理和相關(guān)知識；2、通過實驗，達到熟練搭建與維護DNS服務(wù)器的能力；3、實現(xiàn)計算機間的互相訪問。第一章 DNS服務(wù)器搭建一 、DNS的搭建1 DNS概述1.1 域名空間DNS的命名系統(tǒng)是一種稱作域名空間（Domain Name Space）的層次性的邏輯樹形結(jié)構(gòu)，它的核心思想是分級。域名空間分為四層（如圖1-1所示）：netcomcngooglemicrosoftbaiduwww根 域頂級域子 域請把你所

4、如果論文正文頁數(shù)較多，按已有格式繼續(xù)添加內(nèi)容，每一章開始應(yīng)另起一頁。閱后刪除此文本框。在的學(xué)習(xí)中心名稱完整填寫。閱后刪除此文本框主 機字體要求：宋體，小四號，行距為固定值22磅。閱后刪除此文本框及內(nèi)容，按原格式加入你自己的內(nèi)容。字體要求：宋體，小四號，行距固定值22磅。閱后刪除此文本框及內(nèi)容，按原格式加入你自己的內(nèi)容。FQDN：字體要求：宋體，小四號，行距為固定值22磅。閱后刪除此文本框及內(nèi)容，按原格式加入你自己的內(nèi)容。字體要求：宋體，小四號，行距固定值22磅。閱后刪除此文本框及內(nèi)容，按原格式加入你自己的內(nèi)容。圖1-1 域名空間的層次結(jié)構(gòu)、根 域：位于域?qū)哟谓Y(jié)

5、構(gòu)的最高層，由InterNIC管理，以尾部句點來表示，如“ .” ，一般都不需要表示出來。根域服務(wù)器中并沒有保存任何網(wǎng)址，只具有初始指針指向第一層域，也就是項級域。、頂級域：位于根域之下，由InterNIC管理，數(shù)目有限且不能輕易變動。一般分為地理域（各個國家地區(qū)的頂級域）和機構(gòu)域（各種組織的頂級域）兩類，如“ .cn ” 、“ .com ” 。、子 域：位于頂級域之下的二級域，通常由域名的申請者自己定義，如“ . ” 。、主 機：位于DNS樹中的末端節(jié)點并標(biāo)識特定的資源，由各個域的管理員自行建立，如“ www.microsoft.c

6、om ” 。1.2 域名解析DNS客戶端向DNS服務(wù)器提出查詢請求，DNS服務(wù)器作出響應(yīng)的過程稱為域名解析。域名解析分為兩類：、正向解析：DNS客戶端向DNS服務(wù)器提交域名來查詢IP地址。、反向解析：DNS客戶端向DNS服務(wù)器提交IP地址來查詢域名。域名的查詢方式分為兩種：、遞歸查詢：是DNS客戶端發(fā)往DNS服務(wù)器，要求DNS服務(wù)器提供查詢完整答案的查詢。對遞歸查詢的響應(yīng)要么是完整的答案，要么就是表示無法解析名稱的回復(fù)。不能將遞歸查詢重定位到其它DNS服務(wù)器。、迭代查詢：當(dāng)收到DNS客戶的查詢請求后，如果在DNS服務(wù)器中沒有查到所需的數(shù)據(jù)，該DNS服務(wù)器便會告訴DNS客戶另外一臺DNS服務(wù)器的

7、IP地址，然后再由DNS客戶自行向此DNS服務(wù)器查詢，以此類推，直至查到所需的數(shù)據(jù)。1.3 域名服務(wù)器域名服務(wù)器用來存儲域名的分布式數(shù)據(jù)庫，并為DNS客戶提供域名解析。域名服務(wù)器也是按照域名層次來安排的，每一個域名服務(wù)器都只對域名體系中的一部分進行管轄。域名服務(wù)器按照用途分為四類：、主域名服務(wù)器：負責(zé)維護指定區(qū)域的所有域名信息，是特定域的所有信息的權(quán)威信息源，所存儲的是該區(qū)域的正本數(shù)據(jù)，系統(tǒng)管理員可以對這些數(shù)據(jù)進行修改。、輔助域名服務(wù)器：當(dāng)主域名服務(wù)器出現(xiàn)故障、關(guān)閉或負載過重時，作為備份服務(wù)提供域名解析服務(wù)，所存儲的數(shù)據(jù)是從另外一個域名服務(wù)器復(fù)制過來的，這些數(shù)據(jù)無法修改。、緩存域名服務(wù)器：可運

8、行域名服務(wù)器軟件但沒有域名數(shù)據(jù)庫，它從某個域名服務(wù)器取得查詢結(jié)果，將它放在高速緩存中，以后查詢相同的信息時就用它予以回答。、轉(zhuǎn)發(fā)域名服務(wù)器：負責(zé)所有非本地域名的本地查詢，接到查詢要求時，在其緩存中查找，如果找不到就把請求依次轉(zhuǎn)發(fā)到指定域名服務(wù)器，直到查詢到結(jié)果為止。二 搭建DNS服務(wù)器2.1 實驗環(huán)境正確安裝虛擬機和Server20032.2 安裝DNS服務(wù)器(1)實驗準(zhǔn)備：首先把本機的TCP/IP屬性改好，例如（DNS的IP要填上本機的IP，本機IP一定是固定IP） 安裝好DNS組件(2) 配置DNS服務(wù)器1 打開DNS控制臺2 右鍵【SERVER1】選擇【配置DNS服務(wù)器】3 出現(xiàn)下圖-【

9、下一步】3 選擇【創(chuàng)建正向和反向查找區(qū)域（適合大型網(wǎng)絡(luò)使用）】-【下一步】4 選擇【是，創(chuàng)建正向查找區(qū)域（推薦）（Y）】，單擊【下一步】5 選擇【主要區(qū)域（P）】，單擊下一步6 填入?yún)^(qū)域名稱 （如果網(wǎng)絡(luò)中的服務(wù)器要使用的完整域名是“”,則在區(qū)域名稱中填入“”）7 創(chuàng)建新區(qū)域文件，文件名稱采用默認值，單擊【下一步】8 在彈出的窗口中可以選擇是否接受動態(tài)更新，如果對安全要求不高，可以選擇【允許非安全和安全動態(tài)更新（A）】，本實驗選【不允許動態(tài)更新】9 選擇【是，現(xiàn)在創(chuàng)建反向查找區(qū)域（Y）】，單擊【下一步】10 選擇【主要區(qū)域（P）】，單擊【下一步】 11 在

10、【網(wǎng)絡(luò)ID】處輸入“11.1.1.”，單擊【下一步】 12 反向區(qū)域文件名稱采用默認值，單擊【下一步】 13 選擇【不允許動態(tài)更新（D）】,單擊【下一步】 14 在彈出的窗口中設(shè)置NDS的轉(zhuǎn)發(fā)器，在轉(zhuǎn)發(fā)器中輸入“6”和“”（在該DNS服務(wù)器中無法解析的域名，該DNS服務(wù)器可以轉(zhuǎn)發(fā)給其他指定的DNS服務(wù)器上進行解析，如向ISP（互聯(lián)網(wǎng)服務(wù)提供商）的DNS服務(wù)器轉(zhuǎn)發(fā)） 15 等待收集根提示16 單擊【完成】17 如果出現(xiàn)下圖，單擊【確定】即可。(3) 創(chuàng)建主機記錄和指針1 完成“DNS服務(wù)器的配置”后，在DNS控制臺的正向查找區(qū)域可以看到下圖畫面。2 右鍵“t

11、”，點擊【新建主機】3 創(chuàng)建完整域名為“”的主機記錄。在下個畫面填入主機名“dns”，IP地址為“”。同時你也可以勾上復(fù)選框“創(chuàng)建相關(guān)的指針PTR” 4 在【反向查找區(qū)域】中的【11.1.1.x Subnet】中右鍵，選擇【新建指針】5 填入主機IP號，再在瀏覽中找到里面的主機名為dns的記錄. 6 完成后 再按 【確定】（這是建立反向解析，指向域名）（4） 測試。在命令提示符中，依次鍵入nslookup，測試域名:和IP:都出現(xiàn)

12、相應(yīng)的解析畫面，如下圖，則dns服務(wù)器解析成功。將網(wǎng)頁搭建到網(wǎng)站中進行網(wǎng)站的發(fā)布：把制作的網(wǎng)頁文件添加到已經(jīng)建好的IIS服務(wù)器中，進行計算機之間的互相訪問與網(wǎng)頁呈現(xiàn)，展示。三 IIS的安裝與配置安裝IIS若操作系統(tǒng)中還未安裝IIS服務(wù)器，可打開“控制面板”，然后單擊啟動 “添加/刪除程序”， 在彈出的對話框中選擇 “添加/刪除Windows組件”，在Windows組件向?qū)υ捒蛑羞x中“Internet信息服務(wù)（IIS）”，然后單擊“下一步”，按向?qū)е甘?，完成對IIS的安裝。圖1windows組件向?qū)?圖2windows組件向?qū)?啟動Internet信息服務(wù)（IIS）單擊Windows開始菜單-

13、所有程序-管理工具-Internet信息服務(wù)（IIS）管理器，即可啟動“Internet信息服務(wù)”管理工具（如圖）配置IISIIS安裝后，系統(tǒng)自動創(chuàng)建了一個默認的Web站點，該站點的主目錄默認為C:Inetpubwww.root。用鼠標(biāo)右鍵單擊“默認Web站點”，在彈出的快捷菜單中選擇“屬性”，此時就可以打開站點屬性設(shè)置對話框，（如圖）在該對話框中，可完成對站點的全部配置。默認Web站點屬性單擊“主目錄”標(biāo)簽，切換到主目錄設(shè)置頁面，（如圖5）該頁面可實現(xiàn)對主目錄的更改或設(shè)置。注意檢查啟用父路徑選項是否勾選，如未勾選將對以后的程序運行有部分影響。（如圖），主目錄配置-選項。默認Web站點主目錄設(shè)

14、置設(shè)置主頁文檔單擊“文檔”標(biāo)簽，可切換到對主頁文檔的設(shè)置頁面，（如圖6）主頁文檔是在瀏覽器中鍵入網(wǎng)站域名，而未制定所要訪問的網(wǎng)頁文件時，系統(tǒng)默認訪問的頁面文件。常見的主頁文件名有index.htm、index.html、index.asp、index.php、index.jap、default.htm、default.html、default.asp等IIS默認的主頁文檔只有default.htm和default.asp，根據(jù)需要，利用“添加”和“刪除”按鈕，可為站點設(shè)置所能解析的主頁文檔。測試IIS配置打開本機或客戶機瀏覽器，在地址欄中輸入IP地址或域名，就可以瀏覽站點，測試Web服務(wù)器是否

15、安裝成功。 測試IIS配置四、設(shè)計體會這次設(shè)計脫離了老師寫出步驟由我們驗證結(jié)果的常規(guī)模式，我們必須得自己查資料、上機逐步探索、調(diào)試、找出解決的方案，成功配置DNS,DNS的配置不是一下就能成功的，幾次的失敗不但鞏固了理論知識，還鍛煉了我們的動手能力，總之一切都得靠自己。通過這種學(xué)習(xí)模式我學(xué)到了很多，也成長了很多。在完成課程設(shè)計以前，我覺得課程設(shè)計很難，簡直就是無從下手，但一步一步做下來直到全部完成，我才發(fā)現(xiàn)，世上事，只怕有心人。沒有掌握不了的知識，只有沒有下到的功夫。在這學(xué)期里，我系統(tǒng)、深入地學(xué)習(xí)了計算機以及其它相關(guān)的理論知識。老師們嚴謹?shù)闹螌W(xué)態(tài)度和淵博的專業(yè)學(xué)識使我在今后的工作中受益匪淺，我

16、衷心感謝老師的講授，為自己這學(xué)期能夠掌握這些專業(yè)知識而感到高興。五 、參考文獻陸麗丹 . 網(wǎng)絡(luò)操作系統(tǒng)Windows Server 2003版 ， 北京理工大學(xué)出版社 . 第二章 網(wǎng)頁制作1.1 研究目的與意義1.1.1 研究目的寵物之家網(wǎng)站是我們的小組網(wǎng)頁設(shè)計課程的期末考試作業(yè)。作為一個電子商務(wù)專業(yè)的學(xué)生，我認為學(xué)會如何做網(wǎng)站是我們必備的技能。因此，這個網(wǎng)站對于我而言，不僅僅是一個作業(yè)，是我們?yōu)榱藢W(xué)會一種技能，也是我們提高自己能力的過程。我們努力完成一個具有多種功能的網(wǎng)站。人貴在有一技之長。研究這個網(wǎng)站的構(gòu)建情況，有助于我們很好的了解構(gòu)建一個網(wǎng)頁所需要的整體過程，從一開始的設(shè)計到建設(shè)到維護階

17、段。每一個階段都需要我們認真地對待，需要我們進行統(tǒng)籌分析并進行實施。我們每個人都需要百分百的投入其中，并進自己的一份力。 1.1.2 選題背景 隨著時代的不斷發(fā)展，我們的腳步已經(jīng)邁入信息社會的大門。計算機技術(shù)的發(fā)展，特別是網(wǎng)絡(luò)技術(shù)的飛速發(fā)展，給文檔的保存和管理提供極大的方便。在這信息化的社會里，人門對信息傳遞服務(wù)需求的及時性越來越迫切，要求越來越高。工作和生活中要涉及到大量的信息查詢與修改，信息存儲和共享。在具體制作中，用ASP技術(shù)來實現(xiàn)B/S系統(tǒng)，ASP技術(shù)與數(shù)據(jù)庫技術(shù)結(jié)合，用戶在瀏覽器端可以隨意查詢自己需要的標(biāo)本，而數(shù)據(jù)的后臺操作則由服務(wù)器端處理。這樣提高了網(wǎng)頁的互動性，使整個系統(tǒng)能更好的

18、為用戶服務(wù)。我們所學(xué)的就是以Dreamweaver和ASP相結(jié)合作網(wǎng)頁的技術(shù)。本網(wǎng)頁是我們根據(jù)小組同學(xué)的個人愛好以及當(dāng)代人的偏好而設(shè)計開發(fā)的。界面簡潔、使用方便，內(nèi)容豐富，而重在實現(xiàn)功能，是我們寵物網(wǎng)站的目標(biāo)。作為初學(xué)網(wǎng)站設(shè)計的學(xué)生，我們對于如何構(gòu)建一個網(wǎng)頁還不是很清楚，一切從頭做起。根據(jù)我們小組八個成員的討論，我們本來想做一個有關(guān)80后為主題的網(wǎng)站，但是由于這個網(wǎng)站所涉及的內(nèi)容太過廣泛，難度過大，所以最終我們確定以寵物作為我們的主題，在當(dāng)今時代，越來越多的人將寵物作為生活的一部分，這使得這幾年寵物行業(yè)得到了大力的發(fā)展。網(wǎng)絡(luò)上也出現(xiàn)了很多與寵物有關(guān)的網(wǎng)站。我們小組也以寵物為主題，設(shè)計并實現(xiàn)功能

19、。我們的網(wǎng)站由寵物社區(qū)，寵物照片，寵物視頻，寵物趣事，寵物博客，寵物游戲，寵物百科，寵物商店八個模塊構(gòu)成。網(wǎng)絡(luò)是信息傳播工具，從它登場那一天起就是一種新型的信息傳播工具,它和任何工具一樣供人利用,來為人類服務(wù)。我們做為新時代的大學(xué)生，更要努力的掌握我們所學(xué)的知識，學(xué)以致用。無論我們寵物之家網(wǎng)站最后做的是好是壞，它都是我們這一個多月的努力成果。我們希望可以通過自己的努力而獲得成功，當(dāng)然我們的網(wǎng)站有非常多的不足之處，功能也很簡陋，但是仍然希望老師和同學(xué)們可以認可。 1.1.3 研究意義本論文旨在對于我們寵物之家網(wǎng)站的一個總結(jié)和概括，是為了將我們網(wǎng)站的構(gòu)建過程完整的呈現(xiàn)給大家。便于我們及時糾正和改正

20、在制作網(wǎng)站中的錯誤。同時，加強同學(xué)之間的交流。開拓我們的思維，培養(yǎng)我們的創(chuàng)新精神，提高我們的團隊意識，增強我們的實踐能力。也是我們個人對我們寵物之家網(wǎng)站的一個小結(jié)。1.2 基本理論 Dreamweaver是美國MACROMEDIA公司開發(fā)的集網(wǎng)頁制作和管理網(wǎng)站于一身的所見即所得網(wǎng)頁編輯器，它是第一套針對專業(yè)網(wǎng)頁設(shè)計師特別發(fā)展的視覺化網(wǎng)頁開發(fā)工具，利用它可以輕而易舉地制作出跨越平臺限制和跨越瀏覽器限制的充滿動感的網(wǎng)頁。它有一個很好聽的中文名字，叫做“織夢者”。它的出現(xiàn)以及不斷的推陳出新，取代了當(dāng)時網(wǎng)頁制作的龍頭老大Frontpage。我們所學(xué)習(xí)的網(wǎng)站設(shè)計與制作就是建立在Dreamweaver的基

21、礎(chǔ)之上的，同時結(jié)合ASP構(gòu)建動態(tài)網(wǎng)頁，利用Photoshop和Flash作為輔助。下面介紹在寵物之家網(wǎng)頁建設(shè)中所使用到得理論基礎(chǔ)和概念。界面是一種由色彩、文字、圖象、符號等視覺元素以及多媒體元素為主構(gòu)成的，傳達特定信息的，以方便人機交流為目的的中間媒體。網(wǎng)頁界面的構(gòu)成要素由文字，圖形，頁面版式，色彩，多媒體，技術(shù)等構(gòu)成。界面就是網(wǎng)站給瀏覽者的第一印象，往往決定著網(wǎng)站的可看性，在確定網(wǎng)站的界面時要注意欄目與板塊編排，構(gòu)建一個網(wǎng)站就好比寫一篇論文，首先要列出題綱，才能主題明確、層次清晰。網(wǎng)站建設(shè)初學(xué)者，最容易犯的錯誤就是：確定題材后立刻開始制作，沒有進行合理規(guī)劃。從而導(dǎo)致網(wǎng)站結(jié)構(gòu)不清晰，目錄龐雜混

22、亂，板塊編排混亂等。結(jié)果不但瀏覽者看得糊里糊涂，制作者自己在擴充和維護網(wǎng)站也相當(dāng)困難。所以，我們在動手制作網(wǎng)頁前，一定要考慮好欄目和板塊的編排問題。 網(wǎng)站的題材確定后，就要將收集到的資料內(nèi)容作一個合理的編排。比如，將一些最吸引人的內(nèi)容放在最突出的位置或者在版面分布上占優(yōu)勢地位。欄目的實質(zhì)是一個網(wǎng)站的大綱索引，索引應(yīng)該將網(wǎng)站的主體明確顯示出來。在制定欄目的時候，要仔細考慮，合理安排。在欄目編排時需要注意的是： 盡可能刪除那些與主題無關(guān)的欄目； 盡可能將網(wǎng)站內(nèi)最有價值的內(nèi)容列在欄目上； 盡可能從訪問者角度來編排欄目以方便訪問者的瀏覽和查詢；輔助內(nèi)容，如站點簡介、版權(quán)信息、個人信息等大可不必放在主欄

23、目里，以免沖淡主題。而文字部分包括標(biāo)題、文字信息、文字鏈接；圖形包括標(biāo)題背景、主圖、鏈接按鈕；多媒體包括視頻，音頻，動畫；技術(shù)包括瀏覽器，傳輸速度，屏幕分辨率、顏色顯示。網(wǎng)頁界面的特征主要是主體的經(jīng)濟性，手段的先進性，對象的廣泛性，內(nèi)容的豐富性，形式的多樣性，操作的交互性。設(shè)計以功能為主，主要體現(xiàn)在信息傳遞功能和審美功能。形象明確，易于接受，形式簡潔，因此需要加強網(wǎng)頁界面的視覺沖擊力，迅速傳遞信息的要求，也是形式美的要求。信息傳播是網(wǎng)頁界面設(shè)計的首要因素。網(wǎng)頁界面的信息傳播功能主要體現(xiàn)在三個方面，科學(xué)技術(shù)作為生產(chǎn)力組成員要素的作用日益明顯的表現(xiàn)出來。社會文化的發(fā)展飛速進行，由此帶來的社會變化比

24、以往任何時候都更加顯著。網(wǎng)絡(luò)使人們跨越心理屏障和社會階層差異進行溝通的有效工具。網(wǎng)頁界面的主要形式主要有信息查詢類，大眾媒體類，宣傳窗口類，電子商務(wù)類，交流平臺類，網(wǎng)絡(luò)社區(qū)類。電子商務(wù)網(wǎng)站建設(shè)是互聯(lián)網(wǎng)發(fā)展的一個增長點，我們建立網(wǎng)站的目的是為了充分利用網(wǎng)絡(luò)資源，開展電子商務(wù)與客戶互動來往，建立企業(yè)形象，主動搶占先機，做網(wǎng)上廣告。下面主要介紹寵物商店以及首頁所用的理論基礎(chǔ)：關(guān)于背景，由于很多我們下載的圖片都是很小的圖，或者分辨率很低。這樣就會導(dǎo)致在我們的頁面上會顯示很不協(xié)調(diào)的背景。用Photoshop進行調(diào)整，但是仍然會比較詭異。另外在表格布局中，想將一張照片插入到不同單元中，就需要進行切分。因此

25、必要的Photoshop技術(shù)是我們需要的。關(guān)于色調(diào)搭配，作為一個寵物主題網(wǎng)站，我們盡量運用鮮艷的顏色。網(wǎng)站首頁顏色是紅色。在顏色變化方面，盡量以暖色調(diào)為主，背景以冷色調(diào)為主，營造一種反差，可以突出所要表現(xiàn)的內(nèi)容。并且我們的網(wǎng)站有諸多的版塊，但是我們不僅要把版塊內(nèi)容放在導(dǎo)航欄上，更要讓登陸我們網(wǎng)站的人一眼就能看到自己感興趣的內(nèi)容在哪里。所以我們主頁大部分的空間是對版塊的重新排版，讓最新的最好玩的信息集中體現(xiàn)到首頁上，這樣不僅能吸引更多的寵物迷，還能讓網(wǎng)站看起來生動活潑。另外各種分頁面我們沒有采用統(tǒng)一的色彩搭配要求，希望每個組員都可以自由發(fā)揮。1.3 文獻綜述本網(wǎng)頁共涉及到的知識以及內(nèi)容是以我們的

26、教材電子商務(wù)網(wǎng)頁設(shè)計與網(wǎng)站建設(shè)為主。此書結(jié)構(gòu)安排合理、語言通俗易懂、內(nèi)容圖文并茂，以培養(yǎng)思維能力為主，精選了大量有針對性的實例，并將要求掌握的知識點融入到實例中，力求讓讀者通過親自動手操作達到掌握所學(xué)知識、培養(yǎng)動手能力的目的，真正做到授之以漁和授之以魚兼得。 共分十六章，具體內(nèi)容如下：1網(wǎng)頁的基礎(chǔ)知識2構(gòu)建靜態(tài)HTML頁面3構(gòu)建交互式頁面4 ASP的應(yīng)用二、寵物之家網(wǎng)站設(shè)計策劃2.1網(wǎng)站的主題構(gòu)建網(wǎng)站，我們要做的是確定網(wǎng)站主題，確定網(wǎng)站界面，進行形象設(shè)計，確定網(wǎng)站風(fēng)格，有創(chuàng)意的內(nèi)容選擇 網(wǎng)站的設(shè)計可以從以下幾點出發(fā)：設(shè)計網(wǎng)站標(biāo)志(LOGO)，設(shè)計網(wǎng)站色彩，設(shè)計網(wǎng)站字體，設(shè)計網(wǎng)站宣傳語。我們寵物

27、之家網(wǎng)站的主題，顧名思義，以寵物為主題。設(shè)計到寵物的方方面面，從寵物的習(xí)性到收養(yǎng)注意事項。是為熱愛寵物的朋友們提供了一個平臺，可以是大家在我們的網(wǎng)站中進行交流。2.2實現(xiàn)的功能進入首頁后，會有圖片顯示等等。在寵物社區(qū)里，可以看到最新更新的文章，以及發(fā)表文章，相當(dāng)于一個論壇。在寵物圖片里，主要是以大量圖片為主，穿插著超鏈接。通過超鏈接進入下一個網(wǎng)頁進行相關(guān)知識的閱讀。2.3頁面風(fēng)格我們小組在頁面風(fēng)格上沒有做統(tǒng)一的規(guī)定和要求，主要強調(diào)的是簡潔，清爽。首頁以天藍色做作為背景，填充的色彩以紅色為主，對比性很強。它保持了簡單性，各分網(wǎng)頁力求以暖色調(diào)為主。適當(dāng)?shù)氖褂妙伾珴u變的技巧，全譜色彩漸變完美地吸引了

28、注意?？傊η蠛啙嵉?，以海洋世界為例，以藍色為底，黑色做為標(biāo)題，使得整個頁面給人清爽和舒心的感覺。色彩的鮮明性，獨特性，藝術(shù)性，合適性，聯(lián)想性，色彩搭配的合理性都是我們要考慮的內(nèi)容。網(wǎng)頁風(fēng)格的三個基本要素，顏色、線條和形狀、版式。我們要協(xié)調(diào)運用顏色，不同的色彩影響著人們對網(wǎng)站的第一感覺，紅色系象征著激烈、興奮，寵物能給我們帶來歡樂和幸福。一個網(wǎng)站不可能單一運用一種顏色，這會讓人感覺單調(diào)，乏味；但是也不可能把所有顏色運用到網(wǎng)站中，給人感覺輕浮、花哨。一個網(wǎng)站必須有一種或兩種主題色。我們的網(wǎng)站就是兩種主題色，分別是白色和藍色。這樣既不會讓用戶迷失方向，也不至于單調(diào)、乏味。所以確定網(wǎng)站主題色是我們

29、必須慎重考慮的問題之一。首頁以黃色為主，給人以溫馨的感覺；狗狗歡樂站則是以粉色為主。通常情況下，一個頁面內(nèi)盡量不要使用超過4種色彩，太多的色彩容易讓人感覺沒有方向、沒有側(cè)重。當(dāng)主題色確定好以后，考慮其他配色時，一定要考慮其他配色與主題色的關(guān)系，要體現(xiàn)什么樣的效果；另外還要考慮哪種因素可能占主要地位，是明度、純度還是色相。我們網(wǎng)站有的文字鏈接采用暖色系，這樣一冷一暖的搭配可以更好的突出所表現(xiàn)的內(nèi)容，從而達到很好的效果。適當(dāng)選擇線條和形狀，文字、標(biāo)題、圖片等的組合，會在頁面上形成各種各樣的線條和形狀。這些線條與形狀的組合，構(gòu)成了主頁的總體藝術(shù)效果。必須注意藝術(shù)地搭配好這些線條和形狀，才能增強頁面的

30、藝術(shù)魅力。一般網(wǎng)站有以下三種線條和形狀的使用方法：直線（矩形）的應(yīng)用。直線條的藝術(shù)效果是流暢、挺拔、規(guī)矩、整齊的，也就是所謂的有輪有廓。直線和矩形在頁面上的重復(fù)組合可以呈現(xiàn)井井有條、涇渭分明的視覺效果。一般應(yīng)用于比較莊重、嚴肅的主頁題材。 曲線（弧形）的應(yīng)用。曲線的效果是流動、活躍，具有動感的，曲線和弧形在頁面上的重復(fù)組合可以呈現(xiàn)流暢、輕快、富有活力的視覺效果。一般應(yīng)用于青春、活潑的主頁題材。 曲、直線（矩形、弧形）的綜合應(yīng)用。把以上兩種線條和形狀結(jié)合起來運用，可以大大豐富主頁的表現(xiàn)力，使頁面呈現(xiàn)更加豐富多彩的藝術(shù)效果。這種形式的主頁，適應(yīng)的范圍更大，各種主題的主頁都可以應(yīng)用。但是，在頁面的編

31、排處理上，難度也會相應(yīng)大一些，處理得不好會產(chǎn)生凌亂的效果。最簡單的途徑是，在一個頁面上以一種線條（形狀）為主，只在局部的范圍內(nèi)適當(dāng)用一些其他線條（形狀）。 由于我們的技術(shù)條件有限，我們本想采用曲、直線綜合應(yīng)用的版面形狀，可惜我們工作只能在dreamweaver上進行，在這款軟件上還沒有發(fā)現(xiàn)類似功能，所以為了節(jié)約時間，我們就采用直線線條的版面形狀。均衡的分割板式，在網(wǎng)頁設(shè)計中，頁面因為內(nèi)容元素的需要被分割成很多區(qū)塊，區(qū)塊之間的均衡就是版式設(shè)計上需要著重考慮的問題。均衡并非簡單理性的等量不等形的計算，一幅好的、均衡的網(wǎng)頁版面設(shè)計，是布局、重心、對比等多種形式原理創(chuàng)造性全面應(yīng)用的結(jié)果，是對設(shè)計師的藝

32、術(shù)修養(yǎng)、藝術(shù)感受力的一種檢驗。在面積對比強烈(不等形)而又均衡(等量)的設(shè)計中，我們可以看到對比法則的成功參與；而在一些對比不十分強烈、典雅的不對稱設(shè)計中，我們則可感受到設(shè)計者的別具用心。 需要注意的是，傳統(tǒng)網(wǎng)頁設(shè)計的版式控制都是在不超越大眾顯示器分辨率寬度的前提下，依照內(nèi)容多少縱向延展設(shè)計。而如今流行的產(chǎn)品型網(wǎng)站，更傾向于在一屏內(nèi)表達最主要的東西，尤其是首頁，盡量不出現(xiàn)滾動條。而在分頁面中，像是寵物美容，則出現(xiàn)大量滾動條來顯示信息。另外適當(dāng)美化，去除冗余，在必要的元素都設(shè)計完成之后，回顧整個頁面，根據(jù)整站的風(fēng)格需要，也許你會覺得設(shè)計得過于復(fù)雜了，或者是設(shè)計得不夠完美，不能突出想要的風(fēng)格。這個

33、時候就需要適當(dāng)調(diào)整對頁面的美化控制。簡潔的往往是美的，而美的東西不一定簡潔。尤其在網(wǎng)頁設(shè)計上，對于內(nèi)容很多的門戶網(wǎng)站，任何多余的修飾都會加重瀏覽者眼睛的負擔(dān)，所以可以看到門戶的設(shè)計往往特別簡單；而某些專業(yè)型網(wǎng)站，就首頁來說確實沒有什么東西可以展示，那么則需要刻意增加一些點綴而不顯得特別空洞。當(dāng)然，這也不是定理，針對行業(yè)不同或者突發(fā)性事件，適當(dāng)?shù)貙υO(shè)計進行調(diào)整也能夠起到很好的效果。2.4推廣自己的網(wǎng)站 想特別說明一下網(wǎng)站的推廣情況，與剛學(xué)的市場營銷是緊密聯(lián)系的。網(wǎng)站的營銷推廣在個人網(wǎng)站的運行中也占著重要的地位，在推廣個人網(wǎng)站之前，請確保已經(jīng)做好了以下內(nèi)容：網(wǎng)站信息內(nèi)容豐富、準(zhǔn)確、及時；網(wǎng)站技術(shù)具

34、有一定專業(yè)水準(zhǔn)，網(wǎng)站的交互性能良好。一般來說，網(wǎng)站的推廣有以下幾種方式： 1.搜索引擎注冊與搜索目錄登錄技巧 注冊著名的搜索引擎站點是在技術(shù)上推廣網(wǎng)站的第一步。注冊搜索引擎有一定的技巧，像AltaVista、搜索客這樣的搜索引擎，它自動收錄提交的網(wǎng)址。另外，注意Meta的使用，不要提交分欄Frame頁面，大部分搜索引擎不識別Frame，所以一定要提交有內(nèi)容的Main頁面。 而像Yahoo、搜狐等搜索目錄網(wǎng)站采用手工方式收錄網(wǎng)址，以保證收錄網(wǎng)站的質(zhì)量，在分類查詢時獲得的信息相關(guān)性比搜索引擎站點（靠Spider自動搜索的）更強。由于搜索目錄網(wǎng)站收錄網(wǎng)站的人為因素相對較多，因此在提交網(wǎng)站時要注意遵守

35、規(guī)則。如Yahoo要求注冊站點描述不超過25個單詞。在此要注意：將網(wǎng)址提交到最合適的目錄下面，要認真詳細的介紹網(wǎng)站，千萬不要有虛假、夸張的成分。 三、寵物之家網(wǎng)站設(shè)計實現(xiàn)3.1網(wǎng)站建設(shè)網(wǎng)頁設(shè)計的流程和具體實現(xiàn)寵物之家網(wǎng)站的具體流程是，通過主頁分別鏈接到分網(wǎng)頁，首頁狗狗歡樂站貓咪一家親魚兒大雜匯鳥兒歡樂巢新手養(yǎng)寵物。每個頁面都有自己的特點和功能。具體實現(xiàn)將在后面的章節(jié)體現(xiàn)。3.2介紹整個網(wǎng)站的頁面效果、功能實現(xiàn)我們網(wǎng)站的預(yù)覽效果如下：（以部分為例）首頁 首頁為靜態(tài)網(wǎng)頁，網(wǎng)站的形象代表著品牌形象，人們在網(wǎng)上了解寵物的主要方式就是訪問寵物相關(guān)的網(wǎng)站，網(wǎng)站形象代表了一個網(wǎng)站的制作水平，設(shè)計理念，內(nèi)容豐

36、富度等多個方面。實現(xiàn)鏈接為主要功能，擁有大量圖片和文字。狗狗歡樂站此網(wǎng)頁主要以粉色為背景顏色放了大量的狗狗圖片以及配有的簡短的介紹在最下面還加了一個連接“新手養(yǎng)寵物”在這里面教新手怎樣養(yǎng)護狗狗以及許多狗狗養(yǎng)護知識。貓咪一家親主要以白色為背景色，在這個網(wǎng)頁中主要為大家介紹了倆種貓咪的介紹。魚兒大雜匯由于海洋是藍色的所以在這個網(wǎng)頁中我主要運用了藍色為背景色。在這其中主要放置了大量的魚兒的圖片給大家展示了多彩的海洋世界。鳥兒歡樂巢 考慮到天空應(yīng)該是純凈的所以我們的鳥兒歡樂巢網(wǎng)頁以白色為主，在這個網(wǎng)頁中并沒有給大家介紹各種各樣的鳥兒，而是主要以鸚鵡為主然大家了解到鸚鵡的知識。新手養(yǎng)寵物 主要給大家介紹

37、怎樣養(yǎng)幼犬、介紹養(yǎng)幼犬與養(yǎng)成年犬有什么不同、以及教會你幼犬的急救處理、怎樣給狗狗選擇飯盆、項圈、窩以及玩具等等。讓大家從各個方面學(xué)習(xí)怎樣養(yǎng)狗。四、 靜態(tài)網(wǎng)頁制作4.1.1 網(wǎng)頁布局 對于寵物商店的布局，對于首頁以表格布局，四段式，即標(biāo)題欄（圖標(biāo)是用photoshop修改過的），中間分三欄，左邊是分類頁面的向?qū)?，中間是對于商品的展示，旁邊是圖片顯示。分頁面均以相同表格的形式布局，保持頁面的一致性。同時使得左邊的分類向?qū)щS著頁面的變化而變化。4.1.2 圖片鏈接“屬性”面板中拖動“鏈接”文本框右邊的“指向文件”按鈕，拖動鼠標(biāo)時會出現(xiàn)一條帶箭頭的細線，指向鏈接文件后釋放鼠標(biāo)，即會鏈接到該文件。由于寵

38、物商店涉及到大量的圖片的文字內(nèi)容，在分網(wǎng)頁中，添加錨點等功能方便用戶使用。4.1.3 CSS樣式的使用Cascading Style Sheet（CSS）層疊樣式表（或級聯(lián)樣式表）用于定義文字屬性、文本屬性等網(wǎng)頁中基本信息，是網(wǎng)頁中的字體、大小、顏色等一系列基本信息，不隨著瀏覽器及系統(tǒng)顯示的分辨率等因素的變化而變化，使得網(wǎng)頁具有一定“固定”性。使用“CSS樣式”面板附加樣式表新建CSS樣式，里面含有編輯樣式表、刪除CSS樣式、創(chuàng)建新的CSS樣式三項。在“CSS樣式”面板底部單擊“新建CSS樣式”按鈕，在彈出的“新建CSS規(guī)則”對話框中進行設(shè)置，選擇器類型：選擇“標(biāo)簽”，自定義標(biāo)簽名稱，選擇“新建樣式表文件”點擊確定，保存新建的樣式表，即可創(chuàng)建CSS樣式表。在對于網(wǎng)頁的文字和標(biāo)題部分，我大量使用了CSS樣式表，這樣可以使得標(biāo)題更加美觀和突出。 4.1.4網(wǎng)頁制作首頁源代碼寵物網(wǎng) 寵 物 網(wǎng) 首頁 狗狗歡樂站 貓咪一家親 魚兒大雜匯 鳥兒歡樂巢          &nbs