網(wǎng)絡(luò)操作系統(tǒng)課程設(shè)計(jì)

1、 網(wǎng)絡(luò)操作系統(tǒng) 課程設(shè)計(jì)題 目：DNS服務(wù)器搭建及網(wǎng)站測(cè)試 系 別： 信息與計(jì)算機(jī)科學(xué)系 專業(yè)班級(jí)： 網(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實(shí)驗(yàn)環(huán)境.52.2安裝DNS服務(wù)器.5（1）實(shí)驗(yàn)準(zhǔn)備.5（2）配置DNS服務(wù)器.6（3） 創(chuàng)建主機(jī)記錄和指針15（4） 測(cè)試18三. IIS的安裝與配置21四.設(shè)計(jì)總結(jié).25五參考文獻(xiàn)25第二章 網(wǎng)頁(yè)制作（26-42）引 言當(dāng)TCP/IP正式成為互聯(lián)網(wǎng)事實(shí)上的工業(yè)標(biāo)準(zhǔn)后，隨著

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

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

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

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

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

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

8、行域名服務(wù)器軟件但沒(méi)有域名數(shù)據(jù)庫(kù)，它從某個(gè)域名服務(wù)器取得查詢結(jié)果，將它放在高速緩存中，以后查詢相同的信息時(shí)就用它予以回答。、轉(zhuǎn)發(fā)域名服務(wù)器：負(fù)責(zé)所有非本地域名的本地查詢，接到查詢要求時(shí)，在其緩存中查找，如果找不到就把請(qǐng)求依次轉(zhuǎn)發(fā)到指定域名服務(wù)器，直到查詢到結(jié)果為止。二 搭建DNS服務(wù)器2.1 實(shí)驗(yàn)環(huán)境正確安裝虛擬機(jī)和Server20032.2 安裝DNS服務(wù)器(1)實(shí)驗(yàn)準(zhǔn)備：首先把本機(jī)的TCP/IP屬性改好，例如（DNS的IP要填上本機(jī)的IP，本機(jī)IP一定是固定IP） 安裝好DNS組件(2) 配置DNS服務(wù)器1 打開DNS控制臺(tái)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ū)域文件，文件名稱采用默認(rèn)值，單擊【下一步】8 在彈出的窗口中可以選擇是否接受動(dòng)態(tài)更新，如果對(duì)安全要求不高，可以選擇【允許非安全和安全動(dòng)態(tài)更新（A）】，本實(shí)驗(yàn)選【不允許動(dòng)態(tài)更新】9 選擇【是，現(xiàn)在創(chuàng)建反向查找區(qū)域（Y）】，單擊【下一步】10 選擇【主要區(qū)域（P）】，單擊【下一步】 11 在

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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