陽(yáng)光購(gòu)物網(wǎng)站設(shè)計(jì)

[鍵入文字]陽(yáng)光購(gòu)物網(wǎng)站設(shè)計(jì) I陽(yáng)光購(gòu)物網(wǎng)站設(shè)計(jì)學(xué)校：遼寧石油化工大學(xué)專業(yè)：軟件技術(shù)班級(jí)：0931軟件學(xué)號(hào)：09姓名：孟昭龍指導(dǎo)教師：蘇金芝陽(yáng)光購(gòu)物網(wǎng)站設(shè)計(jì)摘要網(wǎng)站設(shè)計(jì)是一種建立在新型媒體之上的新型設(shè)計(jì)。它具有很強(qiáng)的視覺(jué)效果、互動(dòng)性、互操作性、受眾面廣等其它媒體所不具有的特點(diǎn)，它是區(qū)別于報(bào)刊、影視的一個(gè)新媒體。它既擁有傳統(tǒng)媒體的優(yōu)點(diǎn)，同時(shí)又使傳播變得更為直接、省力和有效；為了適應(yīng)當(dāng)今時(shí)代發(fā)展，必須增加網(wǎng)頁(yè)設(shè)計(jì)的學(xué)習(xí)；為了更好的體現(xiàn)網(wǎng)頁(yè)這一新型設(shè)計(jì)的特點(diǎn)，將它和傳統(tǒng)媒體進(jìn)行比較，了解它的優(yōu)勢(shì)所在；一個(gè)成功的網(wǎng)站，首先在觀念上要確立動(dòng)態(tài)的思維方式，其次，要有效地將圖形引入網(wǎng)頁(yè)設(shè)計(jì)之中，增加人們?yōu)g覽網(wǎng)站的興趣，在崇尚鮮明個(gè)性風(fēng)格的今天，網(wǎng)站應(yīng)增加個(gè)性化因素。網(wǎng)站設(shè)計(jì)發(fā)展如此迅速，作為計(jì)算機(jī)專業(yè)的學(xué)生本次畢業(yè)設(shè)計(jì)我就選擇了陽(yáng)光購(gòu)物網(wǎng)站設(shè)計(jì)，本論文也是針對(duì)本次畢業(yè)設(shè)計(jì)所編寫的論文！本論文一共分為六章。第1章是引言，概括的介紹了陽(yáng)光購(gòu)物網(wǎng)站制作的相關(guān)信息，如選擇的語(yǔ)言，軟件以及大體思想等。第2章介紹的是陽(yáng)光購(gòu)物網(wǎng)站制作的背景及目標(biāo)，論述了本次畢業(yè)設(shè)計(jì)選擇陽(yáng)光購(gòu)物網(wǎng)站制作的原因和想要達(dá)到什么樣的目標(biāo)。第3章介紹了網(wǎng)站制作的運(yùn)行環(huán)境及軟件需求，也就是論述了陽(yáng)光購(gòu)物網(wǎng)站制作和運(yùn)行需要的各種軟硬件環(huán)境。第4章網(wǎng)站詳細(xì)設(shè)計(jì)，也是本次論文的最主要的章節(jié)。詳細(xì)的介紹了陽(yáng)光購(gòu)物網(wǎng)站制作的流程，并對(duì)每一流程都做了詳細(xì)的介紹，其中包含了一些結(jié)構(gòu)流程圖，網(wǎng)頁(yè)圖片，還有部分程序段，增加了論文的可讀性，讓大家更好，更明確，更主觀的了解個(gè)人網(wǎng)站制作的步驟和制作效果！第5章是測(cè)試與發(fā)布，介紹了個(gè)人網(wǎng)站制作完成的后期工作，包括如何通過(guò)測(cè)試使網(wǎng)站正常運(yùn)行和如何將網(wǎng)站發(fā)布到網(wǎng)上。第6章結(jié)論與展望，論述了在本次設(shè)計(jì)中的體會(huì)與心得感悟。由于時(shí)間倉(cāng)促，加上本人所學(xué)知識(shí)水平有限，畢業(yè)設(shè)計(jì)與論文中存在許多的錯(cuò)誤，希望老師與同學(xué)們批評(píng)指正！關(guān)鍵字：陽(yáng)光購(gòu)物網(wǎng)站；；網(wǎng)頁(yè)制作；目錄第1章引言 1第2章網(wǎng)站制作的背景及目標(biāo) 32.1網(wǎng)站制作的背景 32.2網(wǎng)站制作的目標(biāo) 4第3章網(wǎng)站制作環(huán)境及軟件 63.1制作環(huán)境 63.1.1軟件環(huán)境 63.1.2硬件環(huán)境 63.2制作軟件 6第4章網(wǎng)站詳細(xì)設(shè)計(jì) 104.1網(wǎng)站的主題定位 104.2資料搜集 114.3結(jié)構(gòu)設(shè)計(jì) 114.4詳細(xì)設(shè)計(jì) 124.4.1導(dǎo)航欄 124.4.2首頁(yè)設(shè)計(jì) 144.4.3用戶等登陸頁(yè)面 164.4.4用戶注冊(cè)頁(yè)面 174.4.5商品瀏覽頁(yè)面 194.4.6商品管理登陸頁(yè)面 204.4.7商品管理員注冊(cè)頁(yè)面 224.4.8商品管理頁(yè)面 234.5形象設(shè)計(jì) 254.6數(shù)據(jù)庫(kù)設(shè)計(jì) 25第5章測(cè)試與發(fā)布 275.1網(wǎng)站測(cè)試 275.2網(wǎng)站發(fā)布 28第6章結(jié)論與展望 306.1結(jié)論 306.2展望 30參考文獻(xiàn) 32致謝 34第1章引言在這個(gè)世紀(jì)之交的時(shí)刻，我們每個(gè)人都清晰的感覺(jué)的到信息時(shí)代的氣息，科幻小說(shuō)里的幻想已逐漸變成現(xiàn)實(shí)——你可以在千里之外看到家人的音容外貌，大夫可以通過(guò)網(wǎng)絡(luò)跨洲際給病人會(huì)診，而這一切是時(shí)代發(fā)展的必然。Internet已經(jīng)融入千家萬(wàn)戶，成為我們生活中必不可少的一部分。作為Internet的一部分，網(wǎng)站使得瀏覽Internet變得非常簡(jiǎn)單，只要用鼠標(biāo)點(diǎn)擊，就可以顯示圖文并茂的網(wǎng)頁(yè)，甚至可以有聲音、視頻、動(dòng)畫等！網(wǎng)站是由一個(gè)特定人群和組織控制的一組網(wǎng)頁(yè)的集合。與簡(jiǎn)單的網(wǎng)頁(yè)不同，網(wǎng)站中的網(wǎng)頁(yè)結(jié)構(gòu)性較強(qiáng)，具有層次性，組織比較嚴(yán)密！隨著社會(huì)信息化的飛速發(fā)展，網(wǎng)站技術(shù)的應(yīng)用也越來(lái)越普及，網(wǎng)頁(yè)設(shè)計(jì)師與網(wǎng)站開(kāi)發(fā)人員在企業(yè)中的需求量日益增加。擁有一個(gè)具有陽(yáng)光購(gòu)物特色的精美網(wǎng)站是網(wǎng)上購(gòu)物者用戶的夢(mèng)想。一些企業(yè)和商家也通過(guò)制作公司主頁(yè)來(lái)宣傳自己的產(chǎn)品，進(jìn)行網(wǎng)上業(yè)務(wù)等活動(dòng)！網(wǎng)站設(shè)計(jì)已成為當(dāng)今社會(huì)的一個(gè)潮流！用于網(wǎng)站設(shè)計(jì)的語(yǔ)言有很多種，為了讓自己制作的購(gòu)物網(wǎng)站信息量豐富，功能盡可能的強(qiáng)大，本次購(gòu)物網(wǎng)站制作我主要運(yùn)用Microsoft公司動(dòng)態(tài)服務(wù)器頁(yè)面的最新版本ASP.NET語(yǔ)言。它是一種基于服務(wù)器的功能強(qiáng)大的技術(shù)，用于為萬(wàn)維網(wǎng)站點(diǎn)或企業(yè)的內(nèi)部創(chuàng)建動(dòng)態(tài)的、交互式的HTML頁(yè)。ASP.NET語(yǔ)言具有效率高，可重用性強(qiáng)，代碼量小等眾多優(yōu)點(diǎn)。是網(wǎng)站制作首選較強(qiáng)的一種語(yǔ)言！同時(shí)在制作過(guò)程中間接或直接的運(yùn)用到了Dreamweaver，F(xiàn)lash，Photoshop，VisualStudio2005等各種與網(wǎng)站設(shè)計(jì)有關(guān)的軟件來(lái)編輯和完善本次網(wǎng)站。提高網(wǎng)站的美觀性，豐富網(wǎng)站的內(nèi)容，提高網(wǎng)站的可視化，讓網(wǎng)站吸引更多人的目光！網(wǎng)站共分為首頁(yè)，用戶注冊(cè)登陸，用戶觀看商品，選擇購(gòu)物，管理者注冊(cè)登陸，管理商品六大板塊。分別向大家展示了有關(guān)購(gòu)物的各種信息。用戶信息，商品信息，購(gòu)物信息，管理員信息！為了提供網(wǎng)站的交互性和動(dòng)態(tài)性，這幾大模塊主要采用的是動(dòng)態(tài)網(wǎng)頁(yè)。制作過(guò)程中運(yùn)用到了數(shù)據(jù)庫(kù)，Css樣式單等各種技術(shù)。下面的章節(jié)中將詳細(xì)的介紹這幾大板塊的制作過(guò)程，設(shè)計(jì)的頁(yè)面效果和制作中運(yùn)用到的技術(shù)。這個(gè)網(wǎng)站設(shè)計(jì)師是屬于個(gè)人開(kāi)發(fā)，針對(duì)的瀏覽者范圍較少的網(wǎng)站，主要用于展示簡(jiǎn)單購(gòu)物過(guò)程的一個(gè)小平臺(tái)！本次網(wǎng)站是對(duì)我三年學(xué)習(xí)的一個(gè)檢驗(yàn)，所以在制作過(guò)程中我盡量的使用學(xué)習(xí)到的各種知識(shí)點(diǎn)來(lái)豐富網(wǎng)站，使其內(nèi)容更豐富，頁(yè)面更美觀，功能更全面！希望可以給大家一個(gè)好的印象！在以后的章節(jié)中我會(huì)對(duì)網(wǎng)站制作過(guò)程中涉及到的知識(shí)點(diǎn)做適當(dāng)?shù)慕榻B。同時(shí)也會(huì)為大家詳細(xì)介紹購(gòu)物網(wǎng)站制作的過(guò)程與效果！從最初的設(shè)想，到制作的流程再到最終的成果，一步一步走來(lái)，一步一步的成長(zhǎng)與進(jìn)步！第2章網(wǎng)站制作的背景及目標(biāo)2.1網(wǎng)站制作的背景雖然這不是專業(yè)的網(wǎng)站設(shè)計(jì)，購(gòu)物者們大多是上網(wǎng)的人們，他們能夠登陸這個(gè)網(wǎng)頁(yè)，張揚(yáng)他們的個(gè)性，釋放了他們的需求，就已經(jīng)展現(xiàn)了他們的自信和對(duì)生活的信心，雖然他們進(jìn)入的網(wǎng)頁(yè)并不是那么的完美，但給他們的感覺(jué)是簡(jiǎn)潔、直接，值得他們?nèi)バ刨?。我以“?yáng)光購(gòu)物”這一理念，已經(jīng)在生活中影響了大多數(shù)的購(gòu)物者，被這種健康的理念所感染，更多的人愿意參與進(jìn)來(lái)，陽(yáng)光購(gòu)物走進(jìn)我們的生活。歲月如流，時(shí)光匆匆，三年一起走過(guò)的日子里留下了許許多多的回憶，許許多多的不舍！在網(wǎng)上購(gòu)物作為一員，為了將來(lái)即使遠(yuǎn)在天邊釋放彼此的信息，為了給自己一個(gè)展示的平臺(tái)，所以本次畢業(yè)設(shè)計(jì)我選擇了制作購(gòu)物網(wǎng)站。一方面可以將自己的信息，自己的所知隨時(shí)發(fā)布在網(wǎng)上，方便與其他同學(xué)聯(lián)系，交流信息，真心的希望時(shí)間拉開(kāi)的只是我們彼此的手卻無(wú)法拉開(kāi)我們心靈的距離，希望通過(guò)這個(gè)網(wǎng)站與遠(yuǎn)在他方的同學(xué)們?cè)鲞M(jìn)了解，增進(jìn)聯(lián)系！另一方面也希望通過(guò)這個(gè)網(wǎng)站向眾人介紹購(gòu)物簡(jiǎn)單的過(guò)程，讓更多的人認(rèn)識(shí)網(wǎng)購(gòu)，了解網(wǎng)購(gòu)！正所謂多個(gè)朋友多條路，希望可以通過(guò)這個(gè)網(wǎng)站獲得更多來(lái)自五湖四海的交流，認(rèn)識(shí)更多志同道合的朋友，與他們交流在這個(gè)小小的溫馨的平臺(tái)上！還有一方面就是在這個(gè)網(wǎng)絡(luò)不斷發(fā)展的信息時(shí)代，擁有一個(gè)屬于自己的網(wǎng)站是許多人的夢(mèng)想，也是許多人的向往的天堂，作為計(jì)算機(jī)專業(yè)的學(xué)生，作為即將走出校園的我，非常希望可以擁有一個(gè)運(yùn)用所學(xué)的知識(shí)，制作的真正屬于自己的網(wǎng)站，誠(chéng)然，在茫茫網(wǎng)海里，在許多專業(yè)的網(wǎng)站制作者，網(wǎng)站設(shè)計(jì)師面前我所制作的網(wǎng)站根本就是小巫見(jiàn)大巫，班門弄斧，可我仍想嘗試一下，用自己的力量，用自己學(xué)的知識(shí)制作一個(gè)簡(jiǎn)單的網(wǎng)站，向大家展示自己！希望這個(gè)網(wǎng)站可以在我與已經(jīng)在遠(yuǎn)方或是即將走向遠(yuǎn)方的同學(xué)們之間建立起一架永恒的橋梁！希望這個(gè)網(wǎng)站可以讓我認(rèn)識(shí)更多我的不足！希望這個(gè)網(wǎng)站可以讓我更好的理解與運(yùn)用我所學(xué)到的知識(shí)！希望我可以順利的完成本次畢業(yè)設(shè)計(jì)，制作出一個(gè)成功的網(wǎng)站！2.2網(wǎng)站制作的目標(biāo)在制作網(wǎng)站之前曾對(duì)本次網(wǎng)站制作有很多很多的設(shè)想，然而由于自己的能力有限，有些設(shè)想根本就是自己可望而不可即的奢望，所以最終根據(jù)自己的實(shí)際情況，對(duì)網(wǎng)站制作制定了比較現(xiàn)實(shí)的目標(biāo)，希望自己可以一一達(dá)到。網(wǎng)站分為首頁(yè)，用戶登陸，用戶注冊(cè)，瀏覽商品，管理員登陸，管理員注冊(cè)及管理商品七個(gè)版面，下面先對(duì)各個(gè)版面想要達(dá)到的目標(biāo)做下簡(jiǎn)單的介紹：（1）首頁(yè)：制作成一個(gè)簡(jiǎn)單的頁(yè)面。頁(yè)面中除了必要的Logo，便是簡(jiǎn)單的圖片，一些簡(jiǎn)單的文字，幾個(gè)簡(jiǎn)單的功能，希望給人簡(jiǎn)簡(jiǎn)單單，一目了然的印象！頁(yè)面中動(dòng)態(tài)的顯示問(wèn)候語(yǔ)連接等作用！主要的功能是跳轉(zhuǎn)到其他界面，讓大家了解網(wǎng)站的大體的風(fēng)格，使大家對(duì)網(wǎng)站有一個(gè)初步的印象！首頁(yè)有用戶管理，管理員管理和購(gòu)物車三張鏈接圖片，讓網(wǎng)站主人具有不同的權(quán)限，實(shí)現(xiàn)對(duì)網(wǎng)站的管理與操作！首頁(yè)的制作宗旨就一個(gè)字：簡(jiǎn)（2）用戶登陸版面：一個(gè)讓用戶登陸進(jìn)入瀏覽商品的版面！主要的功能用戶名和密碼點(diǎn)擊登陸按鈕，就可以利用系統(tǒng)默認(rèn)進(jìn)入瀏覽商品！同時(shí)還有注冊(cè)按鈕如果用戶是第一進(jìn)入這個(gè)界面，必須先去注冊(cè)?。?）用戶注冊(cè)版面：用戶注冊(cè)版面分界線下分別有三個(gè)文本框分別輸入用戶名、密碼和確認(rèn)密碼，一個(gè)名為注冊(cè)的按鈕版面！在這里主人可以將自己的喜歡的名輸入出來(lái)，作為以后本網(wǎng)站的購(gòu)物者一員。這個(gè)版面實(shí)現(xiàn)的功能有：輸入所需要的內(nèi)容，通過(guò)點(diǎn)擊按鈕，所輸入的內(nèi)容存入數(shù)據(jù)庫(kù)?。?）瀏覽商品版面：一個(gè)用于瀏覽的版面！在這里可以瀏覽所有的商品簡(jiǎn)單信息，點(diǎn)擊詳細(xì)信息看到一件商品詳細(xì)信息，有自己看中的可以點(diǎn)擊“放入購(gòu)物車”，進(jìn)入另一個(gè)窗口界面，所選商品放入購(gòu)物車。這個(gè)版面主要由Datalist數(shù)據(jù)服務(wù)控件，需要實(shí)現(xiàn)的功能是：顯示商品類別及商品簡(jiǎn)單的信息，點(diǎn)擊“詳細(xì)信息”出現(xiàn)所看信詳細(xì)息。這是在一個(gè)窗口實(shí)現(xiàn)的。（5）管理員登陸版面：同用戶登陸版面相似。（6）管理員注冊(cè)版面：同用戶注冊(cè)版面相似！(7)商品管理版面:這是一個(gè)側(cè)重于管理的版面，因?yàn)槭莻€(gè)人版面，網(wǎng)站的管理權(quán)也歸個(gè)人所有，所以也可以說(shuō)這是一個(gè)商品管理員的版面，在這里，主人可以對(duì)數(shù)據(jù)庫(kù)中的數(shù)據(jù)進(jìn)行刪除，修改，添加等功能，實(shí)現(xiàn)數(shù)據(jù)的管理！同時(shí)可以返回用戶界面，實(shí)現(xiàn)瀏覽商品權(quán)限！網(wǎng)站的配色原則是“總體一致，局部協(xié)調(diào)”，就是網(wǎng)頁(yè)的整體效果應(yīng)該是和諧的，只有局部、小范圍的地方讓色彩有一些強(qiáng)烈的對(duì)比！網(wǎng)站的主打色為象征一塵不染的白色，讓人產(chǎn)生肅然起敬的感覺(jué)！可以因?yàn)樵O(shè)計(jì)效果的需要，或是為了強(qiáng)調(diào)某部分而使用其他的色調(diào)，給人一種對(duì)比和深刻的印象！網(wǎng)站制作過(guò)程中要盡可能多的向大家展示更多的信息，盡可能的豐富頁(yè)面的內(nèi)容，盡可能的利用更多的知識(shí)點(diǎn)，當(dāng)然不能是沒(méi)有任何作用或是與網(wǎng)站主題無(wú)關(guān)的內(nèi)容！要在圍繞主題的情況下豐富網(wǎng)站，豐富網(wǎng)站，提高自己！第3章網(wǎng)站制作環(huán)境及軟件3.1制作環(huán)境3.1.1軟件環(huán)境由于本次個(gè)人網(wǎng)站的制作主要運(yùn)用的是ASP.NET語(yǔ)言，所以網(wǎng)站的制作環(huán)境也就是運(yùn)行ASP.NET的環(huán)境。需要先對(duì)其軟件運(yùn)行環(huán)境做一下介紹。首先需要安裝Web服務(wù)器的IIS。IIS是隨操作系統(tǒng)一起提供的，如果已經(jīng)安裝可以在控制面板的管理工具中找到它。如果沒(méi)有找到就需要安裝。只要安裝成功后，啟動(dòng)Windows系統(tǒng)，IIS就會(huì)自動(dòng)啟動(dòng)。這里不對(duì)其安裝及設(shè)置的具體過(guò)程做詳細(xì)介紹了。MDAC是一個(gè)用于使用用戶可以利用的ASP.NET與數(shù)據(jù)庫(kù)進(jìn)行通信并在頁(yè)面上顯示數(shù)據(jù)庫(kù)內(nèi)容的一套組件，在Windows2000中附帶了MDAC2.5。要得到更新的版本，可以到站點(diǎn)上免費(fèi)下載。.NETFramework是一個(gè)程序設(shè)計(jì)環(huán)境，它提供了具體的服務(wù)和技術(shù)，方便開(kāi)發(fā)人員建立相應(yīng)的應(yīng)用程序。它是.NET的核心，分為MS中間語(yǔ)言，CLR，.NETFramework類庫(kù)，.NET語(yǔ)言，ASP.NET和Web服務(wù)。這個(gè)軟件可以從Internet上下載到本地的服務(wù)其中進(jìn)行安裝。3.1.2硬件環(huán)境并不是每一臺(tái)計(jì)算機(jī)都可以制作網(wǎng)站的，一個(gè)網(wǎng)站的制作對(duì)計(jì)算機(jī)硬件也有相應(yīng)的要求。下面便是這次網(wǎng)站制作所需要的硬件環(huán)境?。?）CPU：IntelPentiumII-class300MHz(最好IntelPentiumIII-class600MHz)（2）內(nèi)存：96MB(最好128MB)（3）磁盤空間：250MB(完全安裝)155MB(快速安裝)（4）顯示：800x600，256colors（5）CD-ROM：Required3.2制作軟件購(gòu)物網(wǎng)站制作中運(yùn)用到了許多制作軟件來(lái)完善和美化網(wǎng)站。因?yàn)檫x用的網(wǎng)站制作語(yǔ)言是ASP.NETVB，所以主要的編輯環(huán)境為VisualStudio。利用DreamWeaver作為輔助工具對(duì)網(wǎng)站進(jìn)行制作開(kāi)發(fā)和美化。網(wǎng)站制作過(guò)程中運(yùn)用到的圖片處理是通過(guò)PhotoshopCS2來(lái)實(shí)現(xiàn)。為了增添網(wǎng)站的動(dòng)態(tài)性，還運(yùn)用Flash制作了一個(gè)小小的Flash。同時(shí)網(wǎng)站制作中大量使用了Html代碼與Css層疊樣式表單。下面將對(duì)這些軟件做一個(gè)簡(jiǎn)短的介紹。（1）VisualStudioVisualStudio是一套完整的開(kāi)發(fā)工具集，它向開(kāi)發(fā)的各個(gè)過(guò)程提供輔助工具。舉個(gè)例子，你學(xué)習(xí)英語(yǔ)，你當(dāng)然可以照著書本學(xué)，你也可以買一個(gè)學(xué)英語(yǔ)的數(shù)字助理（PDA或電子詞典），現(xiàn)在很多數(shù)字助理提供背單詞、朗讀課文、短句練習(xí)等功能，這里的數(shù)字助理就好比我們的VisualStudio，數(shù)字助理提供了一套學(xué)習(xí)英語(yǔ)的工具集，而我們的VisualStudio提供了開(kāi)發(fā)應(yīng)用程序的工具集。編寫.NET程序最簡(jiǎn)單的環(huán)境其實(shí)有一個(gè)記事本和一個(gè)編譯器就足夠了，之所以需要工具集或者IDE是因?yàn)楝F(xiàn)在企業(yè)需要你快速、高效地開(kāi)發(fā)出穩(wěn)定、實(shí)用的計(jì)算機(jī)應(yīng)用程序，而工具集的作用也在于幫助你快速、高效地開(kāi)發(fā)。對(duì)于運(yùn)用ASP.NETVB語(yǔ)言編輯網(wǎng)站，它具有很大的優(yōu)勢(shì)與方便。（2）FlashFlash雖然出現(xiàn)時(shí)間不長(zhǎng)，但已經(jīng)成為最首要的Web動(dòng)畫形式之一。Flash不僅比DHTML易學(xué)的多，而且有很多重要的動(dòng)畫特征，如關(guān)鍵幀補(bǔ)間、運(yùn)動(dòng)路徑、動(dòng)畫蒙版、形狀變形和洋蔥皮等。利用這個(gè)多才多藝的程序，不僅可以建立Flash電影，而且可以把動(dòng)畫輸出為QuickTime文件、GIF89a文件或其他許多不同的文件格式（PICT、JPEG、PNG等）。他是一個(gè)可視化的網(wǎng)頁(yè)設(shè)計(jì)和網(wǎng)站管理工具，支持最新的Web技術(shù)，包含HTML檢查、HTML格式控制、HTML格式化選項(xiàng)、HomeSite/BBEdit捆綁、可視化網(wǎng)頁(yè)設(shè)計(jì)、圖像編輯、全局查找替換、全FTP

功能、處理Flash和Shockwave等富媒體格式和動(dòng)態(tài)HTML、基于團(tuán)隊(duì)的Web創(chuàng)作。在編輯上你可以選擇可視化方式或者你喜歡的源碼編輯方式。（3）DreamweaverDreamweaver是一個(gè)很酷的網(wǎng)頁(yè)設(shè)計(jì)軟件，它包括可視化編輯、HTML代碼編輯的軟件包，并支持ActiveX、JavaScript、Java、Flash、Shockwave等特性，而且它還能通過(guò)拖拽從頭到尾制作動(dòng)態(tài)的HTML動(dòng)畫，支持動(dòng)態(tài)HTML(DynamicHTML)的設(shè)計(jì)，使得頁(yè)面沒(méi)有plug－in也能夠在Netscape和IE4.0瀏覽器中正確地顯示頁(yè)面的動(dòng)畫。同時(shí)它還提供了自動(dòng)更新頁(yè)面信息的功能。Dreamweaver還采用了RoundtripHTML技術(shù)。這項(xiàng)技術(shù)使得網(wǎng)頁(yè)在Dreamweaver和HTML代碼編輯器之間進(jìn)行自由轉(zhuǎn)換，HTML句法及結(jié)構(gòu)不變。這樣，專業(yè)設(shè)計(jì)者可以在不改變?cè)芯庉嬃?xí)慣的同時(shí)，充分享受到可視化編輯帶來(lái)的益處。Dreamweaver最具挑戰(zhàn)性和生命力的是它的開(kāi)放式設(shè)計(jì)，這項(xiàng)設(shè)計(jì)使任何人都可以輕易擴(kuò)展它的功能。（4）HTMLHTML（HyperTextMarkupLanguage超文本標(biāo)記語(yǔ)言）是一種用來(lái)制作超文本文檔的簡(jiǎn)單標(biāo)記語(yǔ)言。用HTML編寫的超文本文檔稱為HTML文檔，它能獨(dú)立于各種操作系統(tǒng)平臺(tái)（如UNIX，WINDOWS等）。自1990年以來(lái)HTML就一直被用作WorldWideWeb上的信息表示語(yǔ)言，用于描述Homepage的格式設(shè)計(jì)和它與WWW上其它Homepage的連結(jié)信息。HTML文檔（即Homepage的源文件）是一個(gè)放置了標(biāo)記的ASCII文本文件，通常它帶有.html或.htm的文件擴(kuò)展名。（5）CSSCSS（CascadingStyleSheet，可譯為“層疊樣式表”或“級(jí)聯(lián)樣式表”）是一組格式設(shè)置規(guī)則，用于控制Web頁(yè)面的外觀。通過(guò)使用CSS樣式設(shè)置頁(yè)面的格式，可將頁(yè)面的內(nèi)容與表現(xiàn)形式分離。頁(yè)面內(nèi)容存放在HTML文檔中，而用于定義表現(xiàn)形式的CSS規(guī)則則存放在另一個(gè)文件中或HTML文檔的某一部分，通常為文件頭部分。將內(nèi)容與表現(xiàn)形式分離，不僅可使維護(hù)站點(diǎn)的外觀更加容易，而且還可以使HTML文檔代碼更加簡(jiǎn)練，縮短瀏覽器的加載時(shí)間。（6）PhotoshopCS2PhotoshopCS2是對(duì)數(shù)字圖形編輯和創(chuàng)作專業(yè)工業(yè)標(biāo)準(zhǔn)的一次重要更新。它將作為獨(dú)立軟件程序或AdobeCreativeSuite2的一個(gè)關(guān)鍵構(gòu)件來(lái)發(fā)布。PhotoshopCS2引入強(qiáng)大和精確的新標(biāo)準(zhǔn)，提供數(shù)字化的圖形創(chuàng)作和控制體驗(yàn)。對(duì)于處理圖形它具有屬于自己的特點(diǎn)與優(yōu)勢(shì)，是網(wǎng)站制作中必不可少的一種圖形處理工具。也是廣泛流行的網(wǎng)站三劍客之一。第4章網(wǎng)站詳細(xì)設(shè)計(jì)4.1網(wǎng)站的主題定位網(wǎng)站給人第一影響就是主題突出，那么如何定位一個(gè)網(wǎng)站與主題的關(guān)系呢？是一站一個(gè)主題還是一站多個(gè)主題呢？（1）網(wǎng)站運(yùn)作的前期定位當(dāng)一個(gè)網(wǎng)站處于初始發(fā)展的階段，也就是主題形成的階段的時(shí)候，它可能是脆弱的，是幼稚的，在優(yōu)勝劣汰的網(wǎng)絡(luò)選擇中，成活下來(lái)的網(wǎng)站必定具有的是同類網(wǎng)站在某種環(huán)節(jié)中所缺乏的優(yōu)點(diǎn)。定位當(dāng)時(shí)就是這么形成的——找出成功網(wǎng)站之所以能成功的原因，形成自己的戰(zhàn)略的定位，再形成自己擴(kuò)張的資本。既然是幼稚的，也就無(wú)可厚非，因?yàn)樵谌魏谓ㄕ镜那捌?，所進(jìn)行的都是實(shí)在的充實(shí)內(nèi)容工作，任何工作都不能脫離這個(gè)主題和中心。任何的人來(lái)談定位，這都是不切實(shí)際的。在這個(gè)時(shí)候的定位是模糊的，也是幼稚的。從這點(diǎn)來(lái)說(shuō)，網(wǎng)站做垃圾站是沒(méi)有發(fā)展前途的。（2）網(wǎng)站運(yùn)作的戰(zhàn)略定位網(wǎng)絡(luò)信息時(shí)代，網(wǎng)站的初期很簡(jiǎn)單，當(dāng)網(wǎng)絡(luò)上有熱門內(nèi)容好做的時(shí)候，就做什么內(nèi)容，在僥幸的網(wǎng)絡(luò)運(yùn)作中，網(wǎng)站賺錢了，就開(kāi)始盲目的擴(kuò)張，這樣的例子不乏少見(jiàn)。也正是網(wǎng)站主們從不肯花心思靜下心來(lái)好好研究自己的定位戰(zhàn)略，研究自己該做什么，適合做什么，他們的理由是，寧可花時(shí)間去研究蜘蛛，研究收錄，再定什么內(nèi)容。當(dāng)然，搜索需要研究，收錄也需要研究，但并不是網(wǎng)絡(luò)需要什么，你就能做做什么的。在新的網(wǎng)絡(luò)競(jìng)爭(zhēng)中，應(yīng)該研究我適合或者我能做什么。而這是目前網(wǎng)站主大多都欠缺的，也是為什么現(xiàn)在的網(wǎng)絡(luò)潮流上，大多網(wǎng)站為什么只能存活三年到五年的原因。（3）滿載負(fù)荷的主題該歇歇腳了價(jià)值不會(huì)無(wú)限度的增長(zhǎng)，網(wǎng)站主題也應(yīng)該隨時(shí)調(diào)整。網(wǎng)站的柁在站長(zhǎng)手中，從網(wǎng)站之初到品牌成長(zhǎng)，到網(wǎng)站處于成熟期，說(shuō)的幼稚點(diǎn)，很多的網(wǎng)站在一成不變的堅(jiān)持自己的一個(gè)定位，一個(gè)主張，一個(gè)戰(zhàn)略，一個(gè)目標(biāo)。本次網(wǎng)站主題的為春暖花開(kāi)，希望走出學(xué)校的我們不論遇到什么困難都要相信面朝大海，春暖花開(kāi)！希望進(jìn)入社會(huì)的我們能夠克服所有的困難，用自己的力量去開(kāi)創(chuàng)屬于自己的天地！網(wǎng)站的色彩是樹(shù)立網(wǎng)站形象的關(guān)鍵之一，也是體現(xiàn)網(wǎng)頁(yè)美觀的重要元素。在網(wǎng)站制作中我選擇了代表希望的綠色！有了明確的目標(biāo)下面就要進(jìn)行下一步，收集材料了。4.2資料搜集收集素材是網(wǎng)頁(yè)制作過(guò)程中必要的準(zhǔn)備，也是在制作網(wǎng)站前的一個(gè)首要的工作，要想收集到合適的素材，就需要依據(jù)網(wǎng)站的主題以及整體的風(fēng)格進(jìn)行收集獲取。本次制作的網(wǎng)站只是一個(gè)小型的購(gòu)物網(wǎng)站，是一個(gè)購(gòu)物展示的平臺(tái)，許多材料都是關(guān)于購(gòu)物的信息，所以大多數(shù)資料都采用的是原創(chuàng)，采用的是主人平時(shí)購(gòu)物的收集，資料是屬于自己的風(fēng)格，自己思想的素材！當(dāng)然這個(gè)事事離不開(kāi)網(wǎng)絡(luò)的年代，網(wǎng)絡(luò)收集還是一個(gè)不可少的資料收集的途徑。設(shè)計(jì)過(guò)程中需要大量的圖片來(lái)美化頁(yè)面，這些圖片素材主要是從互聯(lián)網(wǎng)上搜索，下載挑選的；用于制作相冊(cè)的照片，是在風(fēng)和日麗的日子里到校園拍攝的或是在網(wǎng)上收集到的以前的照片；通過(guò)網(wǎng)絡(luò)搜集或是平日里收集的自己喜愛(ài)的圖片！作為網(wǎng)站，文字是相當(dāng)于主打歌的素材，特別網(wǎng)站中有瀏覽商品這個(gè)版面，需要大量的文字素材，除了在網(wǎng)上收集了一些素材外，其中大部分的素材是自己創(chuàng)作的！4.3結(jié)構(gòu)設(shè)計(jì)如今，我們都知道一個(gè)好的站點(diǎn)應(yīng)該有：非常好看的設(shè)計(jì)、友好的界面、毫無(wú)缺點(diǎn)的結(jié)構(gòu)、智能化的后臺(tái)處理以及非常優(yōu)秀的內(nèi)容。在網(wǎng)站制作過(guò)程中，結(jié)構(gòu)設(shè)計(jì)就像是一棵大樹(shù)的樹(shù)干，是整個(gè)網(wǎng)站制作過(guò)程的精髓。（1）欄目和板塊網(wǎng)站的結(jié)構(gòu)設(shè)計(jì)其實(shí)也就是合理的設(shè)計(jì)網(wǎng)站的欄目和板塊。首先應(yīng)突出主題；其次應(yīng)該有個(gè)網(wǎng)站指南或更新列表之類的欄目；接著要有一個(gè)與讀者交流的欄目；最后最好有個(gè)說(shuō)明性的欄目，以方便網(wǎng)友。本次網(wǎng)站設(shè)計(jì)欄目與板塊的結(jié)構(gòu)設(shè)計(jì)如圖：陽(yáng)光購(gòu)物網(wǎng)站陽(yáng)光購(gòu)物網(wǎng)站商品管理員購(gòu)物者商品管理員購(gòu)物者否否注冊(cè)注冊(cè)注冊(cè)注冊(cè)否是登陸瀏覽網(wǎng)站其它模塊否是登陸瀏覽網(wǎng)站其它模塊是否登陸是否登陸商品信息管理、訂單管理用戶管理等商品信息管理、訂單管理用戶管理等否否選擇商品否否選擇商品是是是在線支付購(gòu)買查看訂單更改商品數(shù)量購(gòu)物車是在線支付購(gòu)買查看訂單更改商品數(shù)量購(gòu)物車圖4.1板塊設(shè)計(jì)圖（2）目錄的結(jié)構(gòu)設(shè)計(jì)目錄的結(jié)構(gòu)設(shè)計(jì)要注意以下幾點(diǎn)：按欄目?jī)?nèi)容建立子目錄；在每個(gè)主目錄下都建立獨(dú)立的images目錄；目錄的層次不要太深；避免使用中文目錄；4.4詳細(xì)設(shè)計(jì)網(wǎng)站這個(gè)大樹(shù)現(xiàn)在已經(jīng)有了結(jié)構(gòu)設(shè)計(jì)也就有了粗壯的主干，那么下面我們要給它添加枝葉了！首先這第一條枝葉當(dāng)然要是導(dǎo)航欄了！4.4.1導(dǎo)航欄網(wǎng)站中存在大量的超級(jí)連接，雖然網(wǎng)頁(yè)上的超級(jí)鏈接能幫助訪問(wèn)者迅速地得到想要的信息，進(jìn)入需要的頁(yè)面，但同時(shí)也很容易使訪問(wèn)者在超級(jí)鏈接的海洋中迷失了自己，不知道自己的位置。因此，導(dǎo)航欄對(duì)于一個(gè)網(wǎng)站來(lái)說(shuō)是至關(guān)重要的，也是必不可少的，更是詳細(xì)制作網(wǎng)站的首要工作和必備工作！導(dǎo)航欄一般分為兩大類：縱深型和橫向型。本次個(gè)人網(wǎng)站設(shè)計(jì)我所采用的導(dǎo)航欄是橫向型。導(dǎo)航條包括六大部分：依次為L(zhǎng)ogo,用戶管理，購(gòu)物車，商品管理?？梢酝ㄟ^(guò)點(diǎn)擊這六個(gè)部分分別進(jìn)入不同的頁(yè)面，迅速的找到需要的信息，在這個(gè)網(wǎng)站的海洋中起到導(dǎo)航燈的作用！為了增添網(wǎng)站的整體美觀和體現(xiàn)網(wǎng)站的獨(dú)特的風(fēng)格，在導(dǎo)航欄中加入體現(xiàn)主題的圖片，整體以象征希望的綠色為主，綠綠的枝條上開(kāi)著點(diǎn)點(diǎn)小小的黃花，就像我們的青春充滿著朝氣，充滿著幻想，充滿著希望，要相信面朝大海，春暖花開(kāi)！圖片上的字也就是這個(gè)網(wǎng)站的主題：春暖花開(kāi)！在導(dǎo)航條和圖片中間加入了一個(gè)小小的特效，漂亮的七彩動(dòng)態(tài)線條。增添了頁(yè)面的動(dòng)感！同時(shí)也與網(wǎng)站的主題相呼應(yīng)！導(dǎo)航欄整體的設(shè)計(jì)效果如圖4.2所示圖4.1導(dǎo)航欄導(dǎo)航欄設(shè)計(jì)的部分代碼：<div><Html><bodybgcolor="#ffffff"><Formrunat="server"><imgsrc="image\logo.jpg"Width="20%"height="50"><imgsrc="image\nav_Blank.jpg"Width="45%"height="50"><asp:hyperlinkid="log"ImageUrl="image\nav_log.jpg"navigateUrl="Userlogin.aspx"target="main"runat="server"/><asp:hyperlinkid="cart"ImageUrl="image\nav_cart.jpg"navigateUrl="cart.aspx"target="main"runat="server"/><asp:hyperlinkid="mang"ImageUrl="image\nav_mng.jpg"navigateUrl="adminlog.aspx"target="main"runat="server"/></form></body></Html></div>4.4.2首頁(yè)設(shè)計(jì)首頁(yè)是網(wǎng)站設(shè)計(jì)的第一步。許多人也認(rèn)為網(wǎng)站設(shè)計(jì)就是首頁(yè)設(shè)計(jì)，首頁(yè)水平高低代表網(wǎng)站水平高低。在一定程度上確實(shí)如此，所以首頁(yè)的風(fēng)格樣式、色彩布局、欄目設(shè)計(jì)、文字表述等成為網(wǎng)站最容易產(chǎn)生爭(zhēng)議的地方。所謂仁者見(jiàn)仁，智者見(jiàn)智，這上面永遠(yuǎn)沒(méi)有大家一致滿意的意見(jiàn)，更多的是體現(xiàn)直接設(shè)計(jì)者的性情風(fēng)格。隨著對(duì)網(wǎng)站認(rèn)識(shí)的變換，主頁(yè)的樣式也經(jīng)常變換。但是，主頁(yè)應(yīng)該明白無(wú)誤地告訴用戶其目的，這一點(diǎn)是肯定的。首頁(yè)設(shè)計(jì)有兩種主要的趨勢(shì)：追求畫面美觀效果（靜態(tài)）和追求內(nèi)容豐富效果（動(dòng)態(tài)），前者適合內(nèi)容不多的企業(yè)網(wǎng)站，后者適合內(nèi)容豐富的綜合網(wǎng)站。而一些功能性網(wǎng)站，就常常把最主要功能突出在首頁(yè)中心，如搜索引擎和大型數(shù)據(jù)庫(kù)。作為購(gòu)物網(wǎng)站的首頁(yè)，它并不是大型的網(wǎng)站也不是什么內(nèi)容特別豐富的綜合網(wǎng)站，我所希望的是我的網(wǎng)站給大家一個(gè)很簡(jiǎn)單的頁(yè)面，希望在大家進(jìn)入的時(shí)候有一種簡(jiǎn)單明了的感覺(jué)。就像我所希望的生活簡(jiǎn)簡(jiǎn)單單，明明了了，不需要太多的色彩！所以網(wǎng)站的首頁(yè)我制作的很簡(jiǎn)單！頁(yè)面中除了必要的導(dǎo)航欄外主要分為兩部分。第一部分包括介紹商品簡(jiǎn)單的信息。背景為白色，用DataList數(shù)據(jù)服務(wù)控件。第二部分包括購(gòu)物車，背景為淺藍(lán)色，“繼續(xù)購(gòu)物”連接到首頁(yè)，更新購(gòu)物車?。ǜ纳唐窋?shù)量），主要以表格形式展現(xiàn)：刪除，商品名稱、單價(jià)、數(shù)量、總金額，當(dāng)選擇的商品放入購(gòu)物車，總金額直接計(jì)算出。下圖便是首頁(yè)的制作效果圖4.2首頁(yè)效果4.4.3用戶登陸頁(yè)面這是一個(gè)用戶開(kāi)始的頁(yè)面。！這個(gè)版面的設(shè)計(jì)主要是運(yùn)用輸入的內(nèi)容與數(shù)據(jù)庫(kù)的的里相對(duì)比較，如果是相同即登陸成功進(jìn)入首頁(yè)。下面是有關(guān)數(shù)據(jù)的相關(guān)代碼：<%@importnamespace="System.Data.OleDb"%><scriptlanguage=vbrunat=server> SubLogin(ByValsenderAsObject,ByValeAsEventArgs)DimUserNameAsString=txtUserName.TextDimPassWordAsString=txtPassWord.TextIfNotUserName=""AndNotPassword=""Thenmessage.Text=checkuser(UserName,PassWord)Ifmessage.Text="ok"ThenSession("UserName")=UserNameResponse.Redirect("default.aspx")EndIfElsemessage.Text="請(qǐng)輸入完整的用戶信息！否則<ahref=Userregister.aspx>返回用戶注冊(cè)</a>。"EndIfEndSubFunctioncheckuser(ByValnAsString,ByValpAsString)AsStringDimconnAsNewOleDbConnection("Provider=Microsoft.Jet.OLEDB.4.0;DataSource="&Server.MapPath("eshop.mdb"))DimstrSqlAsString="select*from用戶whereUserName='"+n+"'andPassWord='"+p+"'"conn.Open()DimcmdAsNewOleDbCommand(strSql,conn)DimdrAsOleDbDataReader=cmd.ExecuteReader()Ifdr.Read()ThenReturn"ok"ElseResponse.Redirect("Userlogin.aspx")EndIfconn.Close()EndFunctionSubregister(senderasobject,easeventargs)Response.Redirect("UserRegister.aspx")EndSub</script>下圖是用戶登陸面效果：圖4.3登陸頁(yè)面4.4.4瀏覽商品頁(yè)面瀏覽的商品詳細(xì)信息這個(gè)版面?？纯瓷唐返念愋?、數(shù)量、圖片、等。個(gè)版面除了前面提到的必要的導(dǎo)航欄以外，和購(gòu)物車版面同一的主題l你想看那個(gè)商品的詳細(xì)信息！在那個(gè)<詳細(xì)信息>點(diǎn)擊一下在其下面出現(xiàn)相應(yīng)的信息，同時(shí)還有圖片只要你單擊列表中你所喜歡音樂(lè)的名字，就可以調(diào)用系統(tǒng)默認(rèn)的播放軟件，播放你所選中的音樂(lè)，方便而又簡(jiǎn)單！頁(yè)面中還有三個(gè)Web服務(wù)器控件控件Linkbutton，Text值分別為“關(guān)閉”，恢復(fù)原來(lái)的局面。下面是調(diào)用系統(tǒng)默相關(guān)代碼：<SelectedItemTemplate><b><asp:Imagebuttonid="myimage"bgcolor="grey"borderwidth=6bordercolor="#ffffcc"ImageUrl='<%#DataBinder.Eval(Container.DataItem,"ProductImage")%>'runat=server/><p> <br><b>商品編號(hào)：<%#Container.DataItem("ProductID")%><br><b>商品數(shù)量</b>：<%#Container.DataItem("CategoryID")%><br><b>商品種類</b>：<%#Container.DataItem("Productkind")%> <br><b>商品名稱</b>：<%#Container.DataItem("ProductName")%> <br><b>商品價(jià)格</b>：<%#Container.DataItem("Price")%> <br><b>商品簡(jiǎn)介</b>：<%#Container.DataItem("Description")%> <br><b>商品生產(chǎn)商</b>：<%#Container.DataItem("MadeBy")%><br><b><Asp:LinkButtonId="button2"Text="<關(guān)閉>"CommandName="close"Runat="server"/> </SelectedItemTemplate>下圖是瀏覽商品的效果：圖4.4音樂(lè)頁(yè)面4.4.5管理員登陸頁(yè)面用戶登陸類似下圖是留言板界面的效果：圖4.5留言板頁(yè)面效果4.4.6商品管理員注冊(cè)頁(yè)面用戶登陸類似相冊(cè)頁(yè)面如下所示：圖4.6相冊(cè)頁(yè)面4.4.7商品管理頁(yè)面對(duì)商品管理的界面！誠(chéng)然動(dòng)態(tài)頁(yè)面具有顯著的優(yōu)勢(shì)，商品的信息變動(dòng)很大的，因?yàn)橘?gòu)物者無(wú)時(shí)無(wú)刻的進(jìn)行購(gòu)物，這需要管理員對(duì)數(shù)據(jù)庫(kù)的管理要認(rèn)真負(fù)責(zé)，常常檢查數(shù)據(jù)庫(kù)。個(gè)人資料的頁(yè)面效果入下圖所示：圖4.7個(gè)人資料4.4.8商品管理員頁(yè)面因?yàn)檫@是個(gè)購(gòu)物網(wǎng)站，是需要自己仿照正式網(wǎng)站制作的網(wǎng)站，主人界面也就是管理頁(yè)面。主要的功能就是數(shù)據(jù)管理和行使主人的權(quán)利，如上管理商品，寫注冊(cè)、登陸等等！這個(gè)版面也運(yùn)用到了框架結(jié)構(gòu)，其作用與相冊(cè)版面的框架幾乎一樣！這個(gè)版面分別對(duì)運(yùn)用到數(shù)據(jù)庫(kù)的動(dòng)態(tài)網(wǎng)頁(yè)進(jìn)行管理，其中包括用戶數(shù)據(jù)庫(kù)，商品數(shù)據(jù)庫(kù)，管理員數(shù)據(jù)庫(kù)。因?yàn)槠渲械拇篌w設(shè)計(jì)與功能相同，所以下面針對(duì)管理商品詳細(xì)信息數(shù)據(jù)庫(kù)的管理，做一下簡(jiǎn)單的介紹！日記頁(yè)面主要運(yùn)用DATALIST控件來(lái)顯示日記數(shù)據(jù)庫(kù)中的內(nèi)容，DATALIST控件是一個(gè)功能強(qiáng)大的控件，利用其的特點(diǎn)和屬性，在其中設(shè)置了各種操作！如果對(duì)某商品修改的話就點(diǎn)擊該商品重新輸入，系統(tǒng)就會(huì)自動(dòng)從數(shù)據(jù)庫(kù)中重新記載！單擊保存就可以自動(dòng)保留剛剛對(duì)文章所做的修改，頁(yè)面也自動(dòng)刷新成修改后的內(nèi)容！作為商品數(shù)據(jù)庫(kù)的管理，管理商品這個(gè)功能是必不可少，也是個(gè)、管理員的一個(gè)重要的權(quán)限！下面是數(shù)據(jù)庫(kù)管理頁(yè)面的設(shè)計(jì)效果：圖4.8某件商品詳細(xì)信息頁(yè)面4.5形象設(shè)計(jì)（1）網(wǎng)站的標(biāo)志：即設(shè)計(jì)網(wǎng)站的Logo，就如同網(wǎng)站的名片，它是一個(gè)網(wǎng)站形象的重要體現(xiàn)。我的網(wǎng)站Logo為陽(yáng)光購(gòu)物。（2）網(wǎng)站的標(biāo)準(zhǔn)色彩：整體色彩為綠色，一個(gè)欣欣向榮的顏色，希望給人一種豁然開(kāi)朗的感覺(jué)，就像網(wǎng)站的名稱那樣，春暖花開(kāi)的感覺(jué)！背景色彩為淡淡的綠，有一種清心的感覺(jué)，同時(shí)也符合主題。字體的顏色主要以黑色為主，其中會(huì)適當(dāng)?shù)募尤肫渌念伾。?）網(wǎng)站的標(biāo)準(zhǔn)字體：網(wǎng)站的字體主要以宋體為主，字號(hào)根據(jù)設(shè)計(jì)需要設(shè)置不同的大?。。?）網(wǎng)站命名規(guī)則：網(wǎng)站的首頁(yè)為Default.aspx，logo為Top.aspx,詳細(xì)信息為Products1.aspx，用戶登陸版面為Userlogin.aspx，用戶注冊(cè)版面為Userrigester.aspx，購(gòu)物車版面為Cart.aspx，管理者版面為adminLogin.aspx和adminrigester.aspx，希望能給大家一目了然的感覺(jué)！4.6數(shù)據(jù)庫(kù)設(shè)計(jì)動(dòng)態(tài)網(wǎng)頁(yè)需要使用動(dòng)態(tài)網(wǎng)頁(yè)與數(shù)據(jù)庫(kù)進(jìn)行交互工作，購(gòu)物網(wǎng)站設(shè)計(jì)中的用戶信息，商品信息，管理員信息都用到了數(shù)據(jù)庫(kù)！常用的創(chuàng)建與管理數(shù)據(jù)庫(kù)的應(yīng)用程序有很多，例如MicrosoftSQLServer、Oracle、MicrosoftAccess等。本網(wǎng)站使用的是MicrosoftAccess2003應(yīng)用程序創(chuàng)建數(shù)據(jù)庫(kù)！下面是以商品數(shù)據(jù)庫(kù)為例的創(chuàng)建數(shù)據(jù)庫(kù)的步驟：（1）創(chuàng)建空數(shù)據(jù)庫(kù)。打開(kāi)MicrosoftAccess程序，單擊工具欄中的“新建“按鈕，在打開(kāi)的“新建文件”窗格后，單擊“空數(shù)據(jù)庫(kù)”鏈接文本。打開(kāi)“新建數(shù)據(jù)庫(kù)”對(duì)話框，輸入數(shù)據(jù)庫(kù)文件名稱，最后單擊“創(chuàng)建”。（2）創(chuàng)建數(shù)據(jù)表。在數(shù)據(jù)庫(kù)浮動(dòng)窗格中選擇“表”對(duì)象，然后單擊“設(shè)計(jì)”按鈕，在“字段名稱”列輸入字段（ProductID，CategoryID,Productkind，ProductName,Price,Description,ProductImage,MadeBy），并在“數(shù)據(jù)類型”列設(shè)置數(shù)據(jù)類型，在這里選用的都是文本類型。（3）保存數(shù)據(jù)表。單擊“表”對(duì)話框中的“關(guān)閉”按鈕，打開(kāi)提示對(duì)話框后單擊“是”，打開(kāi)“另存為”對(duì)話框，設(shè)置表名稱為音樂(lè)并單擊“確定”（4）輸入數(shù)據(jù)。雙擊新建的數(shù)據(jù)表，然后輸入數(shù)據(jù)，最后單擊“關(guān)閉”按鈕即可。商品數(shù)據(jù)庫(kù)效果如圖所示：圖4.11音樂(lè)數(shù)據(jù)庫(kù)其他數(shù)據(jù)庫(kù)的創(chuàng)建過(guò)程都是大同小異，在這里不做更多的介紹了。在網(wǎng)站代碼中加入相應(yīng)的鏈接數(shù)據(jù)庫(kù)的語(yǔ)句，便可以使動(dòng)態(tài)網(wǎng)頁(yè)與數(shù)據(jù)庫(kù)交互工作，實(shí)現(xiàn)強(qiáng)大的功能。

第5章測(cè)試與發(fā)布5.1網(wǎng)站測(cè)試一個(gè)網(wǎng)站基本完工后，需要通過(guò)下面三步測(cè)試才可以正式上線發(fā)布。5.1.1測(cè)試范圍和方式（1）制作者測(cè)試。制作者測(cè)試包括美工測(cè)試頁(yè)面、程序員測(cè)試功能。在做完后第一時(shí)間內(nèi)有制作者本人進(jìn)行測(cè)試。頁(yè)面測(cè)試，包括首頁(yè)、二級(jí)頁(yè)面、三級(jí)頁(yè)面的頁(yè)面在各種常用分辨率下有無(wú)錯(cuò)位；圖片上有沒(méi)有錯(cuò)別字；各連接是否是死連接；各欄目圖片與內(nèi)容是否對(duì)應(yīng)等。功能測(cè)試，要求達(dá)到客戶要求；數(shù)據(jù)庫(kù)連接正確；各個(gè)動(dòng)態(tài)生成連接正確；傳遞參數(shù)格式、內(nèi)容正確；試填測(cè)試內(nèi)容沒(méi)有報(bào)錯(cuò)；頁(yè)面顯示正確。（2）全面測(cè)試。根據(jù)交工標(biāo)準(zhǔn)和客戶要求，由專人進(jìn)行全面測(cè)試。包括頁(yè)面和程序兩方面，而且要結(jié)合起來(lái)測(cè)，保證填充足夠的內(nèi)容后不會(huì)導(dǎo)致頁(yè)面變形。另外要檢查是否有錯(cuò)別字，文字內(nèi)容是否有常識(shí)錯(cuò)誤。（3）發(fā)布測(cè)試。網(wǎng)站發(fā)布到主服務(wù)器之后的測(cè)試，主要是防止環(huán)境不同導(dǎo)致的錯(cuò)誤。5.1.2功能測(cè)試對(duì)于網(wǎng)站的測(cè)試而言，每一個(gè)獨(dú)立的功能模塊需要單獨(dú)的測(cè)試用例的設(shè)計(jì)導(dǎo)出，主要依據(jù)為《需求規(guī)格說(shuō)明書》及《詳細(xì)設(shè)計(jì)說(shuō)明書》，對(duì)于應(yīng)用程序模塊需要設(shè)計(jì)者提供基本路徑測(cè)試法的測(cè)試用例。（1）鏈接測(cè)試鏈接是Web應(yīng)用系統(tǒng)的一個(gè)主要特征，它是在頁(yè)面之間切換和指導(dǎo)用戶去一些不知道地址的頁(yè)面的主要手段。鏈接測(cè)試可分為三個(gè)方面：1）測(cè)試所有鏈接是否按指示的那樣確實(shí)鏈接到了該鏈接的頁(yè)面；2）測(cè)試所鏈接的頁(yè)面是否存在；3）保證Web應(yīng)用系統(tǒng)上沒(méi)有孤立的頁(yè)面，所謂孤立頁(yè)面是指沒(méi)有鏈接指向該頁(yè)面，有知道正確的URL地址才能訪問(wèn)。鏈接測(cè)試可以自動(dòng)進(jìn)行，現(xiàn)在已經(jīng)有許多工具可以采用。鏈接測(cè)試必須在集成測(cè)試階段完成，也就是說(shuō)，在整個(gè)Web應(yīng)用系統(tǒng)的所有頁(yè)面開(kāi)發(fā)完成之后進(jìn)行鏈接測(cè)試Xenu主要測(cè)試鏈接的正確性的工具可惜的是對(duì)于動(dòng)態(tài)生成的頁(yè)面的測(cè)試會(huì)出現(xiàn)一些錯(cuò)誤。（2）表單測(cè)試當(dāng)用戶給Web應(yīng)用系統(tǒng)管理員提交信息時(shí)，就需要使用表單操作，例如用戶注冊(cè)、登陸、信息提交等。在這種情況下，我們必須測(cè)試提交操作的完整性，以校驗(yàn)提交給服務(wù)器的信息的正確性。例如：用戶填寫的出生日期與職業(yè)是否恰當(dāng)，填寫的所屬省份與所在城市是否匹配等。如果使用了默認(rèn)值，還要檢驗(yàn)?zāi)J(rèn)值的正確性。如果表單只能接受指定的某些值，則也要進(jìn)行測(cè)試。例如：只能接受某些字符，測(cè)試時(shí)可以跳過(guò)這些字符，看系統(tǒng)是否會(huì)報(bào)錯(cuò)。要測(cè)試這些程序，需要驗(yàn)證服務(wù)器能正確保存這些數(shù)據(jù)，而且后臺(tái)運(yùn)行的程序能正確解釋和使用這些信息。B/S結(jié)構(gòu)實(shí)現(xiàn)的功能可能主要的就在這里，提交數(shù)據(jù)，處理數(shù)據(jù)等如果有固定的操作流程可以考慮自動(dòng)化測(cè)試工具的錄制功能，編寫可重復(fù)使用的腳本代碼，可以在測(cè)試、回歸測(cè)試時(shí)運(yùn)行以便減輕測(cè)試人員工作量。我們對(duì)UM子系統(tǒng)中各個(gè)功能模塊中的各項(xiàng)功能進(jìn)行逐一的測(cè)試，主要測(cè)試方法為：邊界值測(cè)試、等價(jià)類測(cè)試，以及異常類測(cè)試。測(cè)試中要保證每種類型都有2個(gè)以上的典型數(shù)值的輸入，以確保測(cè)試輸入的全面性。5.2網(wǎng)站發(fā)布5.2.1一般文章發(fā)布

首先在Word窗口中把要發(fā)布的文章進(jìn)行編輯設(shè)置，一般有三項(xiàng)設(shè)置：字體為四號(hào)、段落行距為2倍行距、特殊格式選首行縮進(jìn)2字符。第一行建議為空白。完成編輯后全選、復(fù)制。

進(jìn)入管理后臺(tái)相應(yīng)欄目，打開(kāi)添加新文章窗口，在編輯窗口中點(diǎn)鼠標(biāo)右鍵，選“粘貼”，然后在彈出窗口選“允許訪問(wèn)”，然后在彈出窗口選“取消”，然后在彈出窗口選“允許訪問(wèn)”。提交完成！

5.2.2帶圖文章的發(fā)布

首先說(shuō)說(shuō)網(wǎng)頁(yè)圖片的格式要求，一般圖片寬度不宜超過(guò)640，超過(guò)了會(huì)導(dǎo)致整個(gè)網(wǎng)頁(yè)顯示失調(diào)。圖片的格式優(yōu)先選擇.jpg、.gif和.png這三種壓縮格式，.bmp雖然能夠顯示但是過(guò)大，受限于網(wǎng)絡(luò)速度，會(huì)造成外部訪問(wèn)過(guò)慢。一般數(shù)碼照片尺寸都較大，均需要縮放處理。另處，發(fā)布于網(wǎng)站的圖片命名最好采用英文或拼音字母命令，不要使用中文。

先按一般文章發(fā)布的方法把文本貼入發(fā)布窗口，然后選擇要插入圖片的位置回車選擇居中，點(diǎn)“插入/編輯圖像”按鈕，在彈出的窗口中選“上傳”，在上傳窗口選“瀏覽”，然后定位于你電腦上的圖片，選擇“發(fā)送到服務(wù)器上”，依次確定。預(yù)覽圖片時(shí)可以通過(guò)拖動(dòng)圖片四周的小方格再次調(diào)整圖片大小。

第6章結(jié)論與展望6.1結(jié)論通過(guò)本次畢業(yè)設(shè)計(jì)，我對(duì)網(wǎng)站設(shè)計(jì)方面的知識(shí)有了更深入的了解，更深刻的感受。以前對(duì)網(wǎng)站設(shè)計(jì)一直只停留在想象的階段，此次實(shí)踐，讓我掌握到了許多以前沒(méi)有接觸到的東西，了解到更多的事件知識(shí)，例如Dreamweaver的運(yùn)用。不僅提高了自身的能力，也增加了自己的信心。從最開(kāi)始的無(wú)從下手，到最后的順利完成，我在進(jìn)步著，也在提高著自己！讓我堅(jiān)信只要努力，只要不放棄，就會(huì)成功！同時(shí)我也深刻的意識(shí)到?jīng)]有最好只有更好！當(dāng)然，通過(guò)本次的畢業(yè)設(shè)計(jì)也使我強(qiáng)烈的感受到自己的不足，知識(shí)上的欠缺，實(shí)踐中的茫然，在以后的日子里，我一定會(huì)不斷的完善自己，改變自己，克服自己的缺點(diǎn)，用知識(shí)豐富自己！本次設(shè)計(jì)中由于自己的能力有限，使這個(gè)網(wǎng)站還存在許多的不足，頁(yè)面內(nèi)容不夠豐富，功能實(shí)現(xiàn)不夠全面，網(wǎng)站制作不夠?qū)I(yè)等等。雖然設(shè)計(jì)結(jié)束了，但我對(duì)網(wǎng)站制作的興趣才剛剛開(kāi)始，我對(duì)網(wǎng)站制作的執(zhí)著還要持續(xù)下去，我會(huì)不斷的完善網(wǎng)站，希望有一天它會(huì)成為一個(gè)專業(yè)的個(gè)人網(wǎng)站！6.2展望網(wǎng)頁(yè)設(shè)計(jì)作為一個(gè)起點(diǎn)高、門檻低的職業(yè)，在這個(gè)時(shí)候迎來(lái)了蓬勃發(fā)展的高潮期，略有一點(diǎn)美術(shù)基礎(chǔ)的人都能夠很快融入，而越來(lái)越傻瓜化的軟件也給了更多非專業(yè)人士嘗試的機(jī)會(huì)。所以有人說(shuō)，這是一個(gè)人人都是站長(zhǎng)的時(shí)代。但是目前的大學(xué)里一般都沒(méi)有網(wǎng)頁(yè)設(shè)計(jì)的專業(yè)，大多數(shù)設(shè)計(jì)者都是依靠自學(xué)，他們懂得做網(wǎng)站，卻不一定懂得為網(wǎng)民設(shè)計(jì)合理的布局和使用習(xí)慣。而一個(gè)優(yōu)秀的網(wǎng)頁(yè)設(shè)計(jì)者不應(yīng)該只懂得圖象和效果的頁(yè)面展示，還必須懂得怎樣才能使網(wǎng)民瀏覽起來(lái)更舒服、更容易讓人接受。網(wǎng)頁(yè)設(shè)計(jì)行業(yè)的現(xiàn)狀并不太好，人們要求設(shè)計(jì)者什么都懂，要比平面設(shè)計(jì)師多懂點(diǎn)代碼，比程序員多懂點(diǎn)設(shè)計(jì)，還能做點(diǎn)動(dòng)畫。但平面設(shè)計(jì)師覺(jué)得他們是在侮辱設(shè)計(jì)，程序員覺(jué)得他們?cè)谖耆杈幊?，?dòng)畫設(shè)計(jì)師覺(jué)得他們那兩下子完全是班門弄斧。于是，在經(jīng)歷了一個(gè)短暫的小高潮之后，網(wǎng)頁(yè)設(shè)計(jì)行業(yè)進(jìn)入了低潮。

而隨著網(wǎng)絡(luò)的快速發(fā)展，網(wǎng)頁(yè)設(shè)計(jì)開(kāi)始變得多樣化，暫時(shí)的低潮不代表它沒(méi)有未來(lái)。一般的行業(yè)發(fā)展過(guò)快，只能出現(xiàn)兩個(gè)情況：一個(gè)是完全自動(dòng)化的程序代替人力——比如越來(lái)越容易操作、每個(gè)人都能輕易學(xué)會(huì)的智能軟件，也許到那個(gè)時(shí)候就不再需要設(shè)計(jì)者了；一個(gè)是分工逐漸細(xì)化，花費(fèi)更多的人力來(lái)保證效率和質(zhì)量——所以，就出現(xiàn)了程序設(shè)計(jì)師、動(dòng)畫設(shè)計(jì)師、音效設(shè)計(jì)師、UI界面構(gòu)架師、整合工程師、編輯策劃師等細(xì)分的職業(yè)。網(wǎng)頁(yè)設(shè)計(jì)的未來(lái)將會(huì)更趨向于后者，因?yàn)榫W(wǎng)站本身雖然理性，一段代碼只控制一個(gè)效果，但設(shè)計(jì)卻是一個(gè)感性的事業(yè)，絕不是簡(jiǎn)單的美化，網(wǎng)站建設(shè)也不是單純的頁(yè)面排版，再智能的軟件也只能當(dāng)做輔助工具，最終使它成型并發(fā)揮作用的，還得靠人的頭腦。一個(gè)出色的網(wǎng)站需要依靠設(shè)計(jì)者的美術(shù)觀念、對(duì)色彩和布局的掌控、對(duì)網(wǎng)民心理的把握、結(jié)合自己的創(chuàng)意設(shè)計(jì)出來(lái)，這是軟件永遠(yuǎn)做不到的，尤其是企業(yè)網(wǎng)站，那是企業(yè)的另一張臉，必須擁有區(qū)別于其他網(wǎng)站的獨(dú)特性。

面對(duì)網(wǎng)頁(yè)設(shè)計(jì)行業(yè)這種兩極分化的趨勢(shì)，網(wǎng)頁(yè)設(shè)計(jì)者也只能選擇做樣樣全能的設(shè)計(jì)工程師，或者做在某一細(xì)分領(lǐng)域具有相當(dāng)技術(shù)的專一設(shè)計(jì)者，假如還像現(xiàn)在這樣什么都懂卻沒(méi)有一樣精通，就只能脫離設(shè)計(jì)去做幕后策劃或者網(wǎng)站的項(xiàng)目管理者了。而要成為全能設(shè)計(jì)師是非常困難的，網(wǎng)頁(yè)設(shè)計(jì)包括的內(nèi)容太多，每天都在不斷更新，代碼從最早的HTML發(fā)展到了.NET，格局從WEB1.0發(fā)展到了WEB3.0，形式在.GIF和FLASH之后又出現(xiàn)了流媒體，僅僅是編程的語(yǔ)言就好十幾種，全能設(shè)計(jì)師要求每一點(diǎn)都要涉及，是很不容易的。更大的可能是每個(gè)設(shè)計(jì)者都精通其中兩三類技術(shù)，然后依靠團(tuán)隊(duì)的合作完成設(shè)計(jì)任務(wù)，畢竟單一的技術(shù)容易掌握，也更容易發(fā)揮效果。

曾有人認(rèn)為，當(dāng)每個(gè)企業(yè)都有了自己的網(wǎng)站，網(wǎng)頁(yè)設(shè)計(jì)行業(yè)就將從飽和中走向消亡。這是錯(cuò)誤的。網(wǎng)絡(luò)更新發(fā)展之快、蘊(yùn)涵潛力之大、覆蓋之廣都是前所未有的，網(wǎng)絡(luò)的未來(lái)不可限量。這對(duì)網(wǎng)頁(yè)設(shè)計(jì)者也是一個(gè)極大的挑戰(zhàn)，他們必須時(shí)刻接受新的信息新的挑戰(zhàn)，挑戰(zhàn)在哪里，發(fā)展的方向就在那里。參考文獻(xiàn)[1]I.Foster,C.Lucy,J.M.Nick,andS.Tucked.ThePhysiologyoftheGrid：AnOpenGridServicesArchitectureforDistributedSystemsIntegration.Availableathttp：///research/papers/ogsa.pdf.[2]GridPhysicsNetwork.http：///.[3]A.S.TrishawandW.Awfuletal.TheLegionVisionofaWorldwideVirtualComputer.CommunicationsoftheACM,40(1)：39–45,January1997.[4]NinaProject.Nina：AGlob