個(gè)人網(wǎng)頁制作畢業(yè)論文.doc

《個(gè)人網(wǎng)頁制作畢業(yè)論文.doc》由會(huì)員分享，可在線閱讀，更多相關(guān)《個(gè)人網(wǎng)頁制作畢業(yè)論文.doc（34頁珍藏版）》請(qǐng)?jiān)谘b配圖網(wǎng)上搜索。

1、個(gè)人網(wǎng)頁設(shè)計(jì)畢業(yè)論文山西工程職業(yè)技術(shù)學(xué)院個(gè)人網(wǎng)頁制作畢業(yè)論文 系別：計(jì)算機(jī)工程系 班級(jí)：網(wǎng)11班 姓名：xxx 學(xué)號(hào)：xxx指導(dǎo)老師：xxx 2013.5.22 目錄摘要：.3關(guān)鍵字：.4第1章 緒言: .4第1章 1.1 網(wǎng)頁簡介 .4第1章 1.2 網(wǎng)頁設(shè)計(jì) .5第一章 1.3 網(wǎng)頁設(shè)計(jì)現(xiàn)狀 .7第2章 文獻(xiàn)綜述 .8第2章 2.1 課題研究現(xiàn)狀分析 .8第2章 2.2 個(gè)人網(wǎng)站的研究工作 .9第2章 2.3 已經(jīng)取得的研究成果 .9第2章 2.4選題的目的及意義 .9第二章 2.5 課題研究的主要內(nèi)容 .10第三章 網(wǎng)站設(shè)計(jì)分析: .10第三章 3.1網(wǎng)站設(shè)計(jì)概述: .10第三章 3.2

2、 開發(fā)工具的選用及介紹: .11第三章 3.2.1 Dreamweaver8.0: .11第三章 3.2.2 Photoshop CS: .12第三章 3.2.3 網(wǎng)頁基本html代碼 .13第三章 3.2.4 明靜態(tài)網(wǎng)頁html以及div+css(舉例說) .14第三章 3.3 關(guān)系型數(shù)據(jù)庫的選擇:.16第三章 3.3.1 Microsoft Office Access簡介: .16第四章 網(wǎng)站地圖.17第四章 4.1為何要建立網(wǎng)站地圖 .17第四章 4.2 我的網(wǎng)站地圖 .18第五章 網(wǎng)站概述 .18第五章 5.1 網(wǎng)站定位: .18第五章 5.2 系統(tǒng)構(gòu)思: .18第五章 5.3 網(wǎng)站欄

3、目簡介: .19第六章 詳細(xì)設(shè)計(jì): .20第六章 6.1 網(wǎng)站制作過程: .20第六章 6.1.1 logo的制作過程: .20第六章 6.1.2 banner的制作過程: .20第六章 6.1.3 主頁制作過程: .20第六章 6.1.4 留言板的設(shè)計(jì):.21第六章 6.2 數(shù)據(jù)庫的設(shè)計(jì): .21第六章 6.3 系統(tǒng)實(shí)現(xiàn)代碼 :.21第六章 6.3.1 滾動(dòng)文字特效: .21第六章 6.3.2 圖片切換 : .22第六章 6.3.3 個(gè)人簡介設(shè)計(jì): .23第六章 6.3.4 英語flash動(dòng)畫代碼: .24第六章 6.3.5 建立布局 .25第六章 6.3.6 網(wǎng)頁中相關(guān)插入.26第六章 6

4、.3.7 設(shè)置導(dǎo)航條 .27第六章 6.3.8 設(shè)置交換圖像 .28第六章 6.3.9 文字背景圖像設(shè)置 .28第六章 6.3.10 制作彈出信息效果 .28第六章 6.3.11 設(shè)置滾動(dòng)圖片和文字 .29第六章 6.3.12 表單的制作 .29第六章 6.3.13 鏈接 .30第六章 6.3.14 制作flash圖像查看器 .31第7章 結(jié)束語: .31第8章 心得體會(huì) .32第九章 參考文獻(xiàn): .33第十章 致謝: .34 摘要：隨著經(jīng)濟(jì)社會(huì)的發(fā)展，計(jì)算機(jī)已被應(yīng)用到社會(huì)生活的各個(gè)領(lǐng)域。與此同時(shí)，互聯(lián)網(wǎng)作為信息技術(shù)的通信橋梁連接著全球的計(jì)算機(jī)，而網(wǎng)站作為網(wǎng)絡(luò)信息主要的表現(xiàn)形式而且還是互聯(lián)網(wǎng)信

5、息的主要承載者，在Internet上表現(xiàn)出其及其重要的地位，并發(fā)揮著其及其重要的作用。無論是在國內(nèi)還是國外都得以迅速的發(fā)展和壯大，并被人們重視和關(guān)注。互聯(lián)網(wǎng)已經(jīng)徹底的改變了世界，互聯(lián)網(wǎng)的世界里蘊(yùn)藏著無限的可能，在這種情況下，各行各業(yè)及其個(gè)人、單位、工廠、企事業(yè)等等在網(wǎng)上構(gòu)筑屬于自己的網(wǎng)絡(luò)信息平臺(tái)，保護(hù)自己的網(wǎng)絡(luò)資源并在互聯(lián)網(wǎng)上開辟自己的市場和消費(fèi)群體，以及構(gòu)造自己的數(shù)字化世界和加強(qiáng)全球范圍內(nèi)不同地域的人們聯(lián)系交流等等活動(dòng)也就顯的日益重要。于是各種各樣的網(wǎng)站便如雨后春筍般地出現(xiàn)魚龍混雜且良莠不齊。Internet的日益興起和以網(wǎng)頁為載體的網(wǎng)絡(luò)信息的廣泛傳播和應(yīng)用，使得網(wǎng)站的建設(shè)及網(wǎng)頁制作得到發(fā)展

6、的空間，大至大型企業(yè)的產(chǎn)品推銷、售后服務(wù)、解決方案，小至個(gè)人Web頁面開發(fā)，形形色色，五彩繽紛，網(wǎng)站建設(shè)和網(wǎng)頁制作也成為計(jì)算機(jī)網(wǎng)絡(luò)領(lǐng)域最熱門的話題。 本文就網(wǎng)站的主題內(nèi)容及網(wǎng)站的制作與設(shè)計(jì)這兩方面進(jìn)行描述與分析。 本網(wǎng)站的主題是個(gè)人快樂吧，整個(gè)網(wǎng)站是以我個(gè)人生活圈為主題，就像人們常用的QQ空間或微博，主要包括了首頁、新聞收藏、我的學(xué)習(xí)、我的旅游、收藏夾、英語天地、留言薄等欄目。在整個(gè)設(shè)計(jì)過程中主要是運(yùn)用Dreamweaver、ACCESS、photoshop等編寫的。通過本網(wǎng)站系統(tǒng)，可以清楚的讓人們了解自己的生活圈，互相了解，方便交流。 如今，在網(wǎng)絡(luò)技術(shù)的迅猛發(fā)展下，互聯(lián)網(wǎng)的不斷普及，讓人們都

7、感受到網(wǎng)絡(luò)的方便快捷，從而大家都喜歡選擇從互聯(lián)網(wǎng)上獲取信息，因此，互聯(lián)網(wǎng)逐漸成為一個(gè)寬廣的信息發(fā)布平臺(tái)和獲取信息的平臺(tái)。本網(wǎng)站也需要通過Internet來對(duì)外宣傳、普及，從而讓世界的人們知道了你的獨(dú)一無二。 本網(wǎng)站主要是以建立Dreamweaver、ACCESS、photoshop等技術(shù)的靜態(tài)網(wǎng)站管理系統(tǒng)的前臺(tái)表現(xiàn)模塊，使用了Dreamweaver技術(shù)的靜態(tài)網(wǎng)頁技術(shù)，加上ACCESS作為后臺(tái)數(shù)據(jù)庫，制作了一個(gè)簡單的個(gè)人生活交流圈網(wǎng)頁，實(shí)現(xiàn)了生活的方便交流，例如可以在自己的小網(wǎng)站里直接查看自己喜歡的新聞啊，學(xué)習(xí)啊，還有旅游等等，也可以讓朋友們了解自己的圈圈。 關(guān)鍵字：個(gè)人網(wǎng)站 photoshop

8、 Dreamweaver 自己的小天地 快樂吧第一章 緒言： 二十世紀(jì)進(jìn)入信息發(fā)展高速路，數(shù)碼化革命給所有領(lǐng)域帶來新的改變。隨著電腦辦公自動(dòng)化的普及，電子商務(wù)應(yīng)運(yùn)而生，一切都?xì)w功于internet的巨大貢獻(xiàn)，互聯(lián)網(wǎng)的世界里蘊(yùn)藏?zé)o限生機(jī)，這里只有想不到的、沒有做不到的。由于國際互聯(lián)網(wǎng)是一個(gè)不受時(shí)空限制的信息交換系統(tǒng)，所以它是目前最直接、最豐富和最快捷的聯(lián)系方式，信息溝通的高效率為企業(yè)帶來了最大的方便。個(gè)人網(wǎng)站是一個(gè)可以發(fā)布個(gè)人信息及相關(guān)內(nèi)容。通俗理解個(gè)人網(wǎng)站：就是指網(wǎng)站內(nèi)容是介紹自己的或是以自己的信息為中心的網(wǎng)站，不一定是自己做的網(wǎng)站，但強(qiáng)調(diào)的是以個(gè)人信息為中心。個(gè)人網(wǎng)站是指個(gè)人或團(tuán)體因某種興趣

9、、擁有某種專業(yè)技術(shù)、提供某種服務(wù)或把自己的作品、商品展示銷售而制作的具有獨(dú)立空間域名的網(wǎng)站。同時(shí)隨著互聯(lián)網(wǎng)的快速發(fā)展和不斷普及，網(wǎng)站成了傳播信息最有效的平臺(tái)。所以我制作了一個(gè)專門針對(duì)我自己的網(wǎng)站，把我自己介紹給社會(huì)， 社會(huì)在發(fā)展，人們的思想觀念，生活方式也在發(fā)展，通過網(wǎng)站這種方式與企業(yè)或者他人交流已經(jīng)趨向普及。 1.1 網(wǎng)頁簡介 網(wǎng)頁是構(gòu)成網(wǎng)站的基本元素，是承載各種網(wǎng)站應(yīng)用的平臺(tái)。通俗的說，您的網(wǎng)站就是由網(wǎng)頁組成的。如果您只有域名和虛擬主機(jī)而沒有制作任何網(wǎng)頁的話，您的客戶仍舊無法訪問您的網(wǎng)站。 網(wǎng)頁（Web page）是一個(gè)文件，他存放在世界某個(gè)角落的某一部計(jì)算機(jī)中，而這部計(jì)算機(jī)必須是與互聯(lián)網(wǎng)

10、相連的。網(wǎng)頁經(jīng)由網(wǎng)址（URL）來識(shí)別與存取,當(dāng)我們?cè)跒g覽器輸入網(wǎng)址后，經(jīng)過一段復(fù)雜而又快速的程序，網(wǎng)頁文件會(huì)被傳送到你的計(jì)算機(jī)，然后再通過瀏覽器解釋網(wǎng)頁的內(nèi)容，再展示到你的眼前。是萬維網(wǎng)中的一“頁”，通常是HTML格式（文件擴(kuò)展名為.html或.htm）。網(wǎng)頁通常用圖像檔來提供圖畫。網(wǎng)頁要透過網(wǎng)頁瀏覽器來閱讀。 1.2 網(wǎng)頁設(shè)計(jì)網(wǎng)頁設(shè)計(jì)-網(wǎng)站是企業(yè)向用戶和網(wǎng)民提供信息(包括產(chǎn)品和服務(wù))的一種方式,是企業(yè)開展電子商務(wù)的基礎(chǔ)設(shè)施和信息平臺(tái)，離開網(wǎng)站（或者只是利用第三方網(wǎng)站）去談電子商務(wù)是不可能的。企業(yè)的網(wǎng)址被稱為“網(wǎng)絡(luò)商標(biāo)”，也是企業(yè)無形資產(chǎn)的組成部分，而網(wǎng)站是INTERNET上宣傳和反映企業(yè)形象

11、和文化的重要窗口。企業(yè)網(wǎng)站設(shè)計(jì)顯得極為重要，下面是一些網(wǎng)站設(shè)計(jì)中應(yīng)注意的原則。 1)、明確建立網(wǎng)站的目標(biāo)和用戶需求 Web站點(diǎn)的設(shè)計(jì)是展現(xiàn)企業(yè)形象、介紹產(chǎn)品和服務(wù)、體現(xiàn)企業(yè)發(fā)展戰(zhàn)略的重要途徑，因此我們必須明確設(shè)計(jì)站點(diǎn)的目的和用戶需求，從而做出切實(shí)可行的設(shè)計(jì)計(jì)劃。我們會(huì)根據(jù)消費(fèi)者的需求、市場的狀況、企業(yè)自身的情況等進(jìn)行綜合分析，以“消費(fèi)者（customer)”為中心，而不是以“美術(shù)”為中心進(jìn)行設(shè)計(jì)規(guī)劃。 在設(shè)計(jì)規(guī)劃時(shí)我們會(huì)考慮： 建設(shè)網(wǎng)站的目的是什么？ 為誰提供服務(wù)和產(chǎn)品？ 企業(yè)能提供什么樣的產(chǎn)品和服務(wù)？ 網(wǎng)站的目的消費(fèi)者和受眾的特點(diǎn)是什么？ 企業(yè)產(chǎn)品和服務(wù)適合什么樣的表現(xiàn)方式（風(fēng)格）？ 2)、

12、網(wǎng)頁設(shè)計(jì)總體方案主題鮮明 在目標(biāo)明確的基礎(chǔ)上，完成網(wǎng)站的構(gòu)思創(chuàng)意即總體設(shè)計(jì)方案。對(duì)網(wǎng)站的整體風(fēng)格和特色作出定位，規(guī)劃網(wǎng)站的組織結(jié)構(gòu)。Web站點(diǎn)應(yīng)針對(duì)所服務(wù)對(duì)象（機(jī)構(gòu)或人）的不同而具有不同的形式。有些站點(diǎn)只提供簡潔文本信息；有些則采用多媒體表現(xiàn)手法，提供華麗的圖像、閃爍的燈光、復(fù)雜的頁 面布置，甚至可以下載聲音和錄像片段。好的Web站點(diǎn)把圖形表現(xiàn)手法和有效的組織與通信結(jié)合起來。為了做到主題鮮明突出，要點(diǎn)明確，我們將按照客戶的要求，以簡單明確的語言和畫面體現(xiàn)站點(diǎn)的主題；調(diào)動(dòng)一切手段充分表現(xiàn)網(wǎng)站點(diǎn)的個(gè)性和情趣，辦出網(wǎng)站的特點(diǎn)。 建立網(wǎng)站的要點(diǎn)網(wǎng)頁設(shè)計(jì)的兩大要點(diǎn)是：整體風(fēng)格和色彩搭配。 a、確定網(wǎng)站的

13、整體風(fēng)格 網(wǎng)站的整體風(fēng)格及其創(chuàng)意設(shè)計(jì)是最難以學(xué)習(xí)的。難就難在沒有一個(gè)固定的模式可以參照和模仿。給你一個(gè)主題，任何兩人都不可能設(shè)計(jì)出完全一樣的網(wǎng)站。 風(fēng)格(style)是抽象的。是指站點(diǎn)的整體形象給瀏覽者的綜合感受。這個(gè)“整體形象”包括站點(diǎn)的CI（標(biāo)志、色彩、字體、標(biāo)語）、版面布局、瀏覽方式、交互性、文字、語氣、內(nèi)容價(jià)值、存在意義、站點(diǎn)榮譽(yù)等等諸多因素。舉個(gè)例子：我們覺得網(wǎng)易是平易近人的，迪斯尼是生動(dòng)活潑的，IBM是專業(yè)嚴(yán)肅的。這些都是網(wǎng)站給人們留下的不同感受。 在這里，我提供給大家一些參考經(jīng)驗(yàn)： 1將你的標(biāo)志logo，盡可能的放在每個(gè)頁面上最突出的位置。 2突出你的標(biāo)準(zhǔn)色彩。 3總結(jié)一句能反映

14、貴站精髓的宣傳標(biāo)語！ 4相同類型的圖像采用相同效果，比如說標(biāo)題字都采用陰影效果，那么在網(wǎng)站中出現(xiàn)的所有標(biāo)題字的陰影效果的設(shè)置應(yīng)該是完全一致的！ b、網(wǎng)頁色彩的搭配 無論是平面設(shè)計(jì)，還是網(wǎng)頁設(shè)計(jì)，色彩永遠(yuǎn)是最重要的一環(huán)。當(dāng)我們距離顯示屏較遠(yuǎn)的時(shí)候，我們看到的不是優(yōu)美的版式或者是美麗的圖片，而是網(wǎng)頁的色彩。 關(guān)于色彩的原理有許多，在此我們不可能一一闡述，大家可以看看相關(guān)設(shè)計(jì)書籍，有利于系統(tǒng)地理解。在此我們僅僅想告訴大家一些網(wǎng)頁配色時(shí)的小技巧。 1用一種色彩。這里是指先選定一種色彩，然后調(diào)整透明度或者飽和度，這樣的頁面看起來色彩統(tǒng)一，有層次感。 2用兩種色彩。先選定一種色彩，然后選擇它的對(duì)比色。 3

15、用一個(gè)色系。簡單的說就是用一個(gè)感覺的色彩，例如淡藍(lán)，淡黃，淡綠；或者土黃，土灰，土藍(lán)。 在網(wǎng)頁配色中，還要切記一些誤區(qū)： 1不要將所有顏色都用到，盡量控制在三至五種色彩以內(nèi)。 2背景和前文的對(duì)比盡量要大(絕對(duì)不要用花紋繁復(fù)的圖案作背景)，以便突出主要文字內(nèi)容。 制作網(wǎng)頁的常見工具1、dreamweaver,用與編輯HTML、ASP、JSP、PHP時(shí)的輔助工具2、Frontpage 跟dreamweaver一樣，不過個(gè)人感覺還是dreamweaver好。 3、FLASH 網(wǎng)頁需要畫面流動(dòng)時(shí)的首選擇 4、PS圖象處理軟件，一般網(wǎng)頁都需要有圖片的相搭配，PS是款很強(qiáng)大的工具。 5、FW跟PS一樣都是

16、圖象處理軟件，但FW偏向與對(duì)網(wǎng)頁的處理。我一般用PS 6、Fireworks跟PS很象的一種處理軟件，主要用于制做動(dòng)態(tài)圖片格式。1.3 網(wǎng)頁設(shè)計(jì)現(xiàn)狀（一）垃圾還是經(jīng)典 網(wǎng)頁技術(shù)更新很快，一個(gè)網(wǎng)站的界面設(shè)計(jì)壽命僅僅2-3年而已。不管是垃圾還是精品，都沒有所謂的經(jīng)典。經(jīng)典只存在于是哪個(gè)首次成功創(chuàng)新性的應(yīng)用。一個(gè)閉門造車者做出的東西，是遠(yuǎn)遠(yuǎn)趕不上綜合借鑒者的。網(wǎng)頁設(shè)計(jì)不同于其他藝術(shù)，在模仿加創(chuàng)新的網(wǎng)頁設(shè)計(jì)領(lǐng)域當(dāng)中，即便是完全自己設(shè)計(jì)的，也是沿用了人們已經(jīng)認(rèn)同的大部分用戶習(xí)慣，而且這種沿襲的痕跡是非常的明顯！還有哪個(gè)設(shè)計(jì)者敢腆著臉說，這都是我自己的原創(chuàng)設(shè)計(jì)？對(duì)于業(yè)界來說，經(jīng)典只是個(gè)理念和象征！ （二）

17、國內(nèi)網(wǎng)頁設(shè)計(jì)環(huán)境 不可否認(rèn)，國內(nèi)網(wǎng)頁設(shè)計(jì)環(huán)境目前還停留在初級(jí)的認(rèn)知階段，也就是說，絕大多數(shù)人不知道網(wǎng)絡(luò)的真正的可用之處，你去做一個(gè)業(yè)務(wù)的時(shí)候，不得不去做大量的說服教育工作。以乙方的身份去說服甲方，以專業(yè)角度去教育非專業(yè)認(rèn)識(shí)，結(jié)果是可想而知的。也正是這種全體社會(huì)普遍的低認(rèn)知水平，導(dǎo)致了大量網(wǎng)絡(luò)垃圾的產(chǎn)生。 （三）什么是好的網(wǎng)頁設(shè)計(jì) （1）內(nèi)容和功能決定表現(xiàn)形式和界面設(shè)計(jì) 常常拿到的任務(wù)是一張小紙條，上面兩句話，叫你去做一個(gè)網(wǎng)站設(shè)計(jì)。有的人看看紙條就去設(shè)計(jì)頁面了，憑兩句話，你就可以為客戶做一個(gè)頁面設(shè)計(jì)，以別人一些資深專家7、8年的設(shè)計(jì)經(jīng)驗(yàn)，都不敢去做，真是偶像啊！做網(wǎng)頁設(shè)計(jì)，需要了解客戶的東西很多

18、： 1、建站目的 2、欄目規(guī)劃及每個(gè)欄目的表現(xiàn)形式及功能要求 3、主色、客戶性別喜好、聯(lián)系方式、舊版網(wǎng)址、偏好網(wǎng)址 4、根據(jù)行業(yè)和客戶要求，那些要著重表現(xiàn) 5、是否分期建設(shè)、考慮后期的兼容性 6、客戶是否有強(qiáng)烈的建站欲望 7、你是否能在精神意識(shí)上控制住客戶 8、面對(duì)你未接觸的技術(shù)知識(shí)，你有底嗎？ 9. 網(wǎng)站類型 等等. 當(dāng)把這些內(nèi)容都了解清楚了時(shí)候，你的大腦中就已經(jīng)給這個(gè)網(wǎng)站有個(gè)全面而形象的定位了，這時(shí)才是有的放矢去做界面設(shè)計(jì)的時(shí)候了。 （2）界面弱化 一個(gè)好的界面設(shè)計(jì)它的界面是弱化的，它突出的是功能，著重體現(xiàn)的是網(wǎng)站業(yè)提供給使用者主要是什么。這就涉及到瀏覽順序、功能分區(qū)等等。 要讓訪客在0.

19、5秒內(nèi)就能把握網(wǎng)站的行業(yè)性質(zhì)，1秒內(nèi)就知道該從哪個(gè)地方開始使用這個(gè)網(wǎng)站，能點(diǎn)一次的，絕不點(diǎn)第二次。當(dāng)然上面說的是大多數(shù)功能性網(wǎng)站，對(duì)于宣傳展示性網(wǎng)站，諸如加特效的或Flash網(wǎng)站，可能就不得不花哨一些，但不能太過分。網(wǎng)站不是動(dòng)畫片，在效率越來越高，社會(huì)心理越來越浮躁的中國，人們的耐心越來越小，心理承受能力越來越低。效果可以體現(xiàn)意境，點(diǎn)到為止。 （3）模塊化和可修改性強(qiáng) 模塊化不僅可以提高重用性，也能統(tǒng)一網(wǎng)站風(fēng)格，還可以降低程序開發(fā)的強(qiáng)度。這里就涉及一些尺寸、模數(shù)、寬容度、命名規(guī)范等等知識(shí)了，不再冗述。 無論是架構(gòu)還是模塊或圖片，都要考慮可修改性強(qiáng)。舉個(gè)簡單的例子，logo、按鈕等，很多人喜歡制

20、作圖片，N個(gè)按鈕就是N張圖片。如果只做3-5類按鈕的背景圖片，然后用在網(wǎng)頁代碼里打上文字，那么修改起來就簡單了，讓程序員自己改字就可以了。然而網(wǎng)頁顯示的字體是帶有鋸齒的，一般既能清晰又保證美觀的字體字號(hào)有幾類： 宋體12px | 宋體 12px 粗體 | 宋體 14px | 宋體 14px 粗體 | 黑體 20px | verdana 9px | Arial Black 12px+ | （4）創(chuàng)意是可恥的，分析能力遠(yuǎn)比創(chuàng)意來的重要 設(shè)計(jì)界動(dòng)輒就大談什么“創(chuàng)意”，我要說的是，還沒有搞清目的意義內(nèi)容，還沒在技術(shù)制作上臻于完善的基礎(chǔ)上，用創(chuàng)意和特效來迷惑客戶和訪客是可恥的。一個(gè)網(wǎng)頁設(shè)計(jì)者的分析能力遠(yuǎn)

21、比創(chuàng)意來的重要。第2章 文獻(xiàn)綜述 2.1 課題研究現(xiàn)狀分析 伴隨著社會(huì)的發(fā)展和科學(xué)的進(jìn)步，上網(wǎng)成為越來越多人們的選擇。隨著互聯(lián)網(wǎng)的飛速發(fā)展，有關(guān)網(wǎng)絡(luò)的技術(shù)也層出不窮。如今互聯(lián)網(wǎng)上的個(gè)人網(wǎng)站如雨后春筍般蓬勃發(fā)展，絢麗多彩的主頁比比皆是。每個(gè)人都有發(fā)揮個(gè)人才能，揮灑自己個(gè)性的網(wǎng)上伊甸園。在hao123神話以后，網(wǎng)站大全類網(wǎng)站又再一次達(dá)到頂峰。然而這個(gè)模式拷貝成功的網(wǎng)站卻寥寥無幾。而對(duì)于技術(shù)薄弱的個(gè)人網(wǎng)站來說，似乎網(wǎng)址類網(wǎng)站應(yīng)該是一個(gè)很好的切入點(diǎn)。但是由于搜索的異軍突起，網(wǎng)址類網(wǎng)站似乎變得可有可無。網(wǎng)頁實(shí)際是一個(gè)文件，他存放在世界某個(gè)角落的某一臺(tái)計(jì)算機(jī)中而這臺(tái)計(jì)算機(jī)必須是與互聯(lián)網(wǎng)相連的。網(wǎng)頁經(jīng)由網(wǎng)址

22、（URL）來識(shí)別與存取，當(dāng)我們?cè)跒g覽器輸入網(wǎng)址后，經(jīng)過一段復(fù)雜而又快速的程序，網(wǎng)頁文件會(huì)被傳送到你的計(jì)算機(jī)，然后再通過瀏覽器解釋網(wǎng)頁的內(nèi)容，再展示到你的眼前。文字與圖片是構(gòu)成一個(gè)網(wǎng)頁的兩個(gè)最基本的元素?？梢院唵蔚睦斫鉃椋何淖?，就是網(wǎng)頁的內(nèi)容，圖片，就是網(wǎng)頁的美觀。除此之外，網(wǎng)頁的元素還包括動(dòng)畫、音樂、程序等等。網(wǎng)頁實(shí)際上只是一個(gè)純文本文件，它通過各式各樣的標(biāo)記對(duì)頁面上的文字、圖片、表格、聲音等元素進(jìn)行描述（例如字體、顏色、大?。?，而瀏纜器則對(duì)這些標(biāo)記進(jìn)行解釋并生成頁面。2.2 個(gè)人網(wǎng)站的研究工作1理論研究基礎(chǔ)：個(gè)人網(wǎng)站是由個(gè)別提供的一套集博客、文章、相冊(cè)、日程、通訊錄、鏈接、調(diào)查、留言板等諸多

23、功能于一體的網(wǎng)絡(luò)平臺(tái)。個(gè)人網(wǎng)站的自由、開放精神，并使之更容易操作，更具個(gè)性需求，而不需要高深的技術(shù)。它可以幫助個(gè)人進(jìn)行全面的信息化，以多種形式達(dá)到對(duì)信息獲取、組織、思考、表達(dá)、共享和交流的目的。以個(gè)人為中心，建立一個(gè)完全屬于自己的可定制的個(gè)性化網(wǎng)絡(luò)平臺(tái)。來自文章的評(píng)論，留言板都可以很好的進(jìn)行交流，傾聽別人的聲音。2技術(shù)層面的支持：隨著互聯(lián)網(wǎng)的進(jìn)一步發(fā)展與成熟，網(wǎng)絡(luò)的帶寬進(jìn)一步加闊，網(wǎng)絡(luò)應(yīng)用也越來越廣泛。網(wǎng)頁制作更是日新月異，層出不窮。涌現(xiàn)了很多琳瑯滿目的網(wǎng)站，使得整個(gè)互聯(lián)網(wǎng)多姿多彩。2.3 已經(jīng)取得的研究成果中國互聯(lián)網(wǎng)在近幾年發(fā)展迅猛。一方面，產(chǎn)生了一批依賴技術(shù)領(lǐng)先的互聯(lián)網(wǎng)公司，取得了成功；另

24、一方面，互聯(lián)網(wǎng)技術(shù)逐漸走向普及，使得行業(yè)進(jìn)入門檻正在降低。目前中國網(wǎng)站總數(shù)已經(jīng)近百萬。在這里面出現(xiàn)了大量的個(gè)人網(wǎng)站。并且個(gè)人網(wǎng)站存在著巨大的商業(yè)價(jià)值。如果能以強(qiáng)大的號(hào)召力，把互補(bǔ)的個(gè)人網(wǎng)站聯(lián)合起來，不知道可以成立多少個(gè)門戶網(wǎng)站。我們有理由相信，個(gè)人網(wǎng)站還極具潛力。2.4選題的目的及意義隨著Internet的迅速普及，我們已經(jīng)不再滿足于僅僅瀏覽網(wǎng)頁，而是希望更深入地參預(yù)到網(wǎng)絡(luò)中去，Internet的開放性使個(gè)人建立自己的網(wǎng)站成為可能，擁有自己的網(wǎng)站也越來越成為一種時(shí)尚，同時(shí)創(chuàng)建一個(gè)能充分體現(xiàn)自我風(fēng)格和特色的個(gè)人網(wǎng)站已經(jīng)成為互聯(lián)網(wǎng)用戶的新追求。我們更需要交流，相信交流能夠促進(jìn)我們不斷的進(jìn)步，并融合

25、別人的長處；讓我們多一些渠道傾聽來自不同立場的聲音；設(shè)想我們的網(wǎng)絡(luò)，當(dāng)每個(gè)人都擁有個(gè)人網(wǎng)頁，不管是否在線，我們都可以跨越時(shí)間、空間進(jìn)行交流，因?yàn)檫@個(gè)網(wǎng)頁中擁有我所有的一切，生活，見解，知識(shí)，思想；理想的狀態(tài)是個(gè)人門戶就是每個(gè)人的影子，他為每個(gè)人打點(diǎn)網(wǎng)絡(luò)上的一切，很多志同道合的朋友會(huì)在這里和你相識(shí)相知。2.5 課題研究的主要內(nèi)容互聯(lián)網(wǎng)是社會(huì)發(fā)展的必然趨勢(shì)，很多人已經(jīng)意識(shí)到網(wǎng)絡(luò)的強(qiáng)大生命力和它在未來將處于的重要地位。他們鉆研并且努力進(jìn)入到這一個(gè)新的空間，新的領(lǐng)域。其中包括你和我。在我們的工作、日常生活中，能夠擁有一個(gè)自己的網(wǎng)站，一個(gè)已經(jīng)成為不少人的希望和驕傲。就這個(gè)課題的研究，因?yàn)槭莻€(gè)人網(wǎng)站，所以

26、我只是選擇了自己擅長和喜愛的內(nèi)容，在突出自己的風(fēng)格和特點(diǎn)的同時(shí)，還應(yīng)用了現(xiàn)在流行的網(wǎng)站設(shè)計(jì)技術(shù)和數(shù)據(jù)庫技術(shù)。第三章網(wǎng)站設(shè)計(jì)分析在Internet飛速發(fā)展的今天，互聯(lián)網(wǎng)成為人們快速獲取、發(fā)布和傳遞信息的重要渠道，它在人們政治、經(jīng)濟(jì)、生活等各個(gè)方面發(fā)揮著重要的作用。因此網(wǎng)站建設(shè)在Internet應(yīng)用上的地位顯而易見，它已成為個(gè)人、政府、企事業(yè)單位信息化建設(shè)中的重要組成部分，從而倍受人們的重視。越來越多的人希望能真正參預(yù)到互聯(lián)網(wǎng)上，這就出現(xiàn)了越來越多的個(gè)人網(wǎng)站的設(shè)計(jì)以及推廣的工作和任務(wù)。就我個(gè)人而言，之所以在畢業(yè)設(shè)計(jì)的時(shí)候選擇這個(gè)課題是因?yàn)槲乙蚕霌碛凶约旱膫€(gè)人網(wǎng)站，在互聯(lián)網(wǎng)上擁有自己的一席之地，從而

27、真正的參與到網(wǎng)絡(luò)中去，做網(wǎng)絡(luò)新時(shí)代的主人，同時(shí)也希望自己喜歡和收藏的一些東西能夠和網(wǎng)絡(luò)一起分享，和互聯(lián)網(wǎng)上的你一起分享。網(wǎng)站的設(shè)計(jì)與制作需要用到網(wǎng)頁三劍客（Dreamweaver、fireworks、flash），IIS，photoshop等工具。所以首先我們要了解這些工具的功能與用處，然后要能夠熟練得掌握這些工具用法，只有你能熟練使用這些工具，你才能在設(shè)計(jì)過程中盡量避免技術(shù)上的問題，提高效率，做到“事半功倍”。 3.1網(wǎng)站設(shè)計(jì)概述: 網(wǎng)站首頁可以說是網(wǎng)站的門面，大家瀏覽你的網(wǎng)站首先看到的就是網(wǎng)站首頁，所以首頁不僅要做得美觀，引人瀏覽，還要有豐富的內(nèi)容。所以我們?cè)谑醉摼褪醉摼奂舜罅康男畔?，?/p>

28、了最基本個(gè)人信息，愛好，興趣等外，我還要將美麗的旅游景點(diǎn)和美妙的動(dòng)畫放進(jìn)去，這樣靜中有“動(dòng)”的效果可以抓住人的眼球，吸引人去點(diǎn)擊。子頁面的框架基本上是符合整個(gè)網(wǎng)站的整體風(fēng)格的，banner，導(dǎo)航等都是和首頁一樣的，不一樣的只是正文的內(nèi)容，這個(gè)可以通過模板來實(shí)現(xiàn)。出于排除對(duì)模板可編輯區(qū)域排版的復(fù)雜性起見，我這里沒有運(yùn)用模板，而是用另存為的方式實(shí)現(xiàn)網(wǎng)頁風(fēng)格“統(tǒng)一化”的。在網(wǎng)站的各頁面制作好后，我在Dreamweaver中與Access數(shù)據(jù)庫建立連接，通過在Dreamweaver的一系列操作實(shí)現(xiàn)注冊(cè)登錄的功能，而留言薄功能我是通過一張空白的寫有后臺(tái)代碼的頁面轉(zhuǎn)接過去的，名為handle.asp，用戶

29、可以通過“在線留言”在網(wǎng)站上發(fā)表自己的見解或疑問，達(dá)到互動(dòng)的效果。 3.2 開發(fā)工具的選用及介紹: 3.2.1 Dreamweaver8.0: Dreamweaver是個(gè)原本由Macromedia公司所開發(fā)的著名網(wǎng)站開發(fā)工具。它使用所見即所得的接口，亦有HTML編輯的功能。它現(xiàn)在有Mac和Windows系統(tǒng)的版本。隨Macromedia被Adobe收購后，Adobe也開始計(jì)劃開發(fā)Linux版本的Dreamweaver了。Dreamweaver自MX版本開始，使用了Opera的排版引擎 Presto 作為網(wǎng)頁預(yù)覽。要想學(xué)習(xí)制作網(wǎng)頁，就要從軟件Dreamweaver學(xué)起，下面我們來了解一下Drea

30、mweaver的基礎(chǔ)只是已經(jīng)相關(guān)技術(shù) Dreamweaver的優(yōu)點(diǎn)就是其制作效率。Dreamweaver可以用最快速的方式將Fireworks，F(xiàn)reeHand，或Photoshop等檔案移至網(wǎng)頁上。使用檢色吸管工具選擇熒幕上的顏色可設(shè)定最接近的網(wǎng)頁安全色。對(duì)于選單，快捷鍵與格式控制，都只要一個(gè)簡單步驟便可完成。Dreamweaver能與您喜愛的設(shè)計(jì)工具，如Playback Flash,Shockwave和外掛模組等搭配，不需離開Dreamweaver便可完成，整體運(yùn)用流程自然順暢。除此之外，只要單擊便可使Dreamweaver自動(dòng)開啟Firework或Photoshop來進(jìn)行編輯與設(shè)定圖檔的

31、最佳化。 另外Dreamweaver是唯一提供Roundtrip HTML、視覺化編輯與原始碼編輯同步的設(shè)計(jì)工具。它包含HomeSite和BBEdit等主流文字編輯器。幀(frames)和表格的制作速度快的令您無法想像。進(jìn)階表格編輯功能使您簡單的選擇單格、行、欄或作未連續(xù)之選取。甚至可以排序或格式化表格群組，Dreamweaver 支援精準(zhǔn)定位，利用可輕易轉(zhuǎn)換成表格的圖層以拖拉置放的方式進(jìn)行版面配置。所見即所得 Dreamweaver成功整合動(dòng)態(tài)式出版視覺編輯及電子商務(wù)功能，提供超強(qiáng)的支援能力給Third-party廠商，包含ASP， Apache，BroadVision， Cold Fusi

32、on，iCAT， Tango與自行發(fā)展的應(yīng)用軟體。當(dāng)您正使用Dreamweaver在設(shè)計(jì)動(dòng)態(tài)網(wǎng)頁時(shí)，所見即所得的功能，讓您不需要透過瀏覽器就能預(yù)覽網(wǎng)頁。夢(mèng)幻樣版和XML Dreamweaver將內(nèi)容與設(shè)計(jì)分開，應(yīng)用于快速網(wǎng)頁更新和團(tuán)隊(duì)合作網(wǎng)頁編輯。建立網(wǎng)頁外觀的樣版，指定可編輯或不可編輯的部份，內(nèi)容提供者可直接編輯以樣式為主的內(nèi)容卻不會(huì)不小心改變既定之樣式。您也可以使用樣版正確地輸入或輸出XML內(nèi)容。 全方位的呈現(xiàn)利用Dreamweaver設(shè)計(jì)的網(wǎng)頁，可以全方位的呈現(xiàn)在任何平臺(tái)的熱門瀏覽器上。對(duì)于cascading style sheets的動(dòng)態(tài)HTML支援和鼠標(biāo)換圖效果，聲音和動(dòng)畫的DHTM

33、L效果資料庫可在Netscape和Microsoft瀏覽器上執(zhí)行。使用不同瀏覽器檢示功能，Dreamweaver可以告知您在不同瀏覽器上執(zhí)行的成效如何。當(dāng)有新的瀏覽器上市時(shí)，只要從Dreamweaver的網(wǎng)站在下載它的描述檔，便可得知詳盡的成效報(bào)告。 Dreamweaver是創(chuàng)建和管理網(wǎng)頁的專業(yè)化可視編輯器，在網(wǎng)頁設(shè)計(jì)與制作領(lǐng)域中用戶最多、應(yīng)用最廣、功能最強(qiáng)大的軟件，隨著Dreamweaver 8的發(fā)布，更堅(jiān)定Dreamweaver在該領(lǐng)域的地位。它集網(wǎng)頁設(shè)計(jì)、網(wǎng)站開發(fā)和站點(diǎn)管理功能于一身，具有可視化、支持多平臺(tái)和跨瀏覽器的特性，是目前網(wǎng)站設(shè)計(jì)、開發(fā)、制作的首選工具。 它的特點(diǎn)主要有1）、靈活

34、的編寫方式 ： Dreamweaver具有靈活編寫網(wǎng)頁的特點(diǎn)，不但將世界一流水平的“設(shè)計(jì)”和“代碼”編輯器合二為一，而且在設(shè)計(jì)窗口中還精化了源代碼，能幫助用戶按工作需要定制自己的用戶界面。2）、可視化編輯界面：Dreamweaver是一種所見即所得的HTML編輯器，可實(shí)現(xiàn)頁面元素的插入和生成?；蛞暬庉嫮h(huán)境大量減少了代碼的編寫，同時(shí)亦保證了其專業(yè)性和兼容性，并且可以對(duì)內(nèi)部的HTML編輯器和任何第三方的HTML編輯器進(jìn)行實(shí)時(shí)的訪問。無論用戶習(xí)慣手工輸入HTML源代碼還是使用可視化的編輯界面，Dreamweaver都能提供便捷的方式使用戶設(shè)計(jì)網(wǎng)頁和管理網(wǎng)站變得更容易。3）、功能更多的CSS支持CS

35、S可視化設(shè)計(jì)、CSS檢查工具。 4）、動(dòng)態(tài)跨瀏覽器驗(yàn)證：當(dāng)保存時(shí)系統(tǒng)自動(dòng)檢查當(dāng)前文檔的跨瀏覽器有效性，可以指定何種瀏覽器為測試用瀏覽器，同時(shí)系統(tǒng)自動(dòng)檢驗(yàn)以確定頁面有沒有目標(biāo)瀏覽器不支持的tags或CSS結(jié)構(gòu)。動(dòng)態(tài)跨瀏覽器有效性檢查功能可以自動(dòng)核對(duì)tags和CSS規(guī)則是否適應(yīng)目前的主瀏覽器。 5）、強(qiáng)大的WEB站點(diǎn)管理功能 6）、內(nèi)建的圖形編輯引擎 7）、Dreamweaver的集成特性 Dreamweaver 8繼承了Fireworks、Flash和Shockwave的集成特性，可以在這些Web創(chuàng)作工具之間自由地切換，輕松地創(chuàng)建美觀實(shí)用的網(wǎng)頁。 8）、豐富的媒體支持能力：可以方便地加入Java

36、、Flash、Shockwave、ActiveX以及其他媒體。Dreamweaver具有強(qiáng)大的多媒體處理功能，在設(shè)計(jì)DHTML和CSS方面表現(xiàn)得極為出色，它利用JavaScript和DHTML語言代碼輕松地實(shí)現(xiàn)網(wǎng)頁元素的動(dòng)作和交互操作。Dreamweaver還提供行為和時(shí)間線兩種控件來產(chǎn)生交互式響應(yīng)和進(jìn)行動(dòng)畫處理。 9）、超強(qiáng)的擴(kuò)展能力：Dreamweaver還支持第三方插件，任何人都可以根據(jù)自己的需要擴(kuò)展Dreamweaver的功能，并且可以發(fā)布這些插件。 3.2.2 Photoshop CS: PS是電腦上的圖像處理軟件Photoshop 的縮寫。對(duì)于廣大Photoshop愛好者而言，PS

37、亦用來形容通過Photoshop等圖形處理軟件處理過的圖片，即非原始、非未處理的圖片。photoshop是Adobe公司旗下最為出名的圖像處理軟件之一。多數(shù)人對(duì)于PHOTOSHOP的了解僅限于“一個(gè)很好的圖像編輯軟件”，并不知道它的諸多應(yīng)用方面，實(shí)際上，PHOTOSHOP的應(yīng)用領(lǐng)域很廣泛，在圖像、圖形、文字、視頻、出版各方面都有涉及。網(wǎng)絡(luò)的普及是促使更多人需要掌握PHOTOSHOP的一個(gè)重要原因。因?yàn)樵谥谱骶W(wǎng)頁時(shí)PHOTOSHOP是必不可少的網(wǎng)頁圖像處理軟件。如模版PSD等等(圖為Photoshop主界面 它是一款圖形、圖像編輯軟件，在網(wǎng)頁設(shè)計(jì)領(lǐng)域被廣泛得應(yīng)用。以下是其10大最新功能： 1、改

38、進(jìn)的文件瀏覽器 使用功能強(qiáng)大文件瀏覽器的可以快速預(yù)覽、標(biāo)注和排序圖片；搜索或編輯圖像的數(shù)據(jù)元或關(guān)鍵詞；并且可以自動(dòng)批量共享文件。2、匹配顏色命令 可以迅速從一張圖片的顏色校正另外一張圖像的顏色。 3、直方圖調(diào)色板 隨時(shí)根據(jù)對(duì)圖像的調(diào)整更新直方圖調(diào)色板(Histogram Palette)。4、陰影/加亮區(qū)修正 使用“陰影/加亮區(qū)修正(hadow/Highlight correction)”可以快速調(diào)整照片中曝光過渡或欠缺的區(qū)域。 5、沿路徑放置文本 可以像在Illustrator中一樣把文本沿著路徑放置，并且你還可以在Illustrator直接編輯文本。 6、支持?jǐn)?shù)碼相機(jī)的raw模式 支持多款

39、數(shù)碼相機(jī)得raw模式，讓用戶可以得到更真實(shí)的圖像輸入。 7、全面支持16位圖像 可以在主要功能、層、比刷、文字、圖形等中精確的編輯、潤飾16位的圖像。 8、Layer Comps 可以在一個(gè)文件中保存不同層的合并效果，以便對(duì)各種效果進(jìn)行快速察看。 9、輸入Flash文件 使用ImageReady可以創(chuàng)建flash矢量文件。 10、自定義快捷鍵 用戶可以按照自己的習(xí)慣定義Photoshop的快捷鍵。 3.2.3 網(wǎng)頁基本html代碼 網(wǎng)頁html代碼很多很多,主要是用于網(wǎng)站的建設(shè)、功能設(shè)計(jì)、美化等的一系列代碼,下面舉例一些常用的代碼:1) 貼圖：2)加入連接：寫上你想寫的字3)在新窗口打開連接：

40、寫上要寫的字消除連接的下劃線在新窗口打開連接：寫上你想寫的字4)移動(dòng)字體(走馬燈)：寫上你想寫的字5)字體加粗：寫上你想寫的字6)字體斜體：寫上你想寫的字7)字體下劃線: 寫上你想寫的字8)字體刪除線: 寫上你想寫的字9)字體加大: 寫上你想寫的字10)字體控制大?。簩懮夏阆雽懙淖?(其中字體大小可從h1-h5,h1最大，h5最小)11)更改字體顏色：寫上你想寫的字(其中value值在000000與ffffff(16位進(jìn)制)之間12)消除連接的下劃線：寫上你想寫的字13)貼音樂：14)貼flash: 15)貼影視文件：16)換行：17)段落：段落18)原始文字樣式：正文19)換帖子背景：20)

41、固定帖子背景不隨滾動(dòng)條滾動(dòng)：21)定制帖子背景顏色：(value值見10)22)帖子背景音樂：23)貼網(wǎng)頁： 3.2.4 明靜態(tài)網(wǎng)頁html以及div+css(舉例說) 網(wǎng)頁一般可以分為兩大類：靜態(tài)網(wǎng)頁和動(dòng)態(tài)網(wǎng)頁。 靜態(tài)網(wǎng)頁是指在動(dòng)態(tài)網(wǎng)頁技術(shù)產(chǎn)生之前，用純HTML代碼來編寫的網(wǎng)業(yè)，并保存為*html或*htm的文件形式。這種用純HTML代碼編寫的網(wǎng)頁在制作完成后，任何人在任何時(shí)候采用任何方式瀏覽該頁面，所看到的瀏覽結(jié)果都相同。因此，這種網(wǎng)頁的內(nèi)容更新較為繁瑣，必須在設(shè)計(jì)制作好，然后用專門的軟件上傳到服務(wù)器上才能更新。例如網(wǎng)站的欄目有些是長時(shí)間不變的，像這樣的頁面宜采用靜態(tài)網(wǎng)頁來實(shí)現(xiàn)，且瀏覽的速

42、度比較快。靜態(tài)網(wǎng)頁適合于一些產(chǎn)品規(guī)格恒定不輕易變更的小規(guī)模公司，其作用主要是用于配合傳統(tǒng)媒體作廣告宣傳?？傊?，靜態(tài)網(wǎng)頁適合于用來發(fā)布無需用戶參與、無需定期更新的靜態(tài)文本內(nèi)容。 隨著網(wǎng)頁技術(shù)應(yīng)用的普及，人們對(duì)網(wǎng)頁信息的及時(shí)更新提出了更高的要求。隨著數(shù)據(jù)庫和腳本技術(shù)(如ASP、PHP和JSP)的發(fā)展，越來越多的站點(diǎn)都開始采取動(dòng)態(tài)的頁面發(fā)布手段。比如，我們?cè)贕oogle上搜索信息時(shí)，將得到的一個(gè)搜索結(jié)果的頁面文件，其實(shí)這個(gè)頁面文件在Google服務(wù)器上并不存在，而是動(dòng)態(tài)生成的。 在Web服務(wù)器應(yīng)用范圍擴(kuò)展以后，特別是一些新技術(shù)如CGI、ASP、PHP、JSP等的廣泛應(yīng)用，使Web服務(wù)器可以與用戶進(jìn)行

43、交互，按照用戶的需要來動(dòng)態(tài)地、即時(shí)地構(gòu)造頁面，這些動(dòng)態(tài)構(gòu)造的頁面就稱為“動(dòng)態(tài)網(wǎng)頁”。一般動(dòng)態(tài)網(wǎng)頁都需要配合數(shù)據(jù)庫，以實(shí)現(xiàn)非常強(qiáng)大的功能，動(dòng)態(tài)網(wǎng)頁較常見的表現(xiàn)形式有；留言板、論壇、聊天室、計(jì)數(shù)器、校友錄、網(wǎng)上購物等。 相應(yīng)的網(wǎng)頁開發(fā)技術(shù)大體上也可以分為兩大類：靜態(tài)網(wǎng)頁技術(shù)和動(dòng)態(tài)網(wǎng)頁技術(shù)。 制作靜態(tài)網(wǎng)頁主要使用HTML(超文本標(biāo)記語言)，如果配合客戶端腳本語言JavaScript，也能產(chǎn)生豐富的動(dòng)態(tài)效果，從而可以滿足大多數(shù)個(gè)人網(wǎng)站的需要。 動(dòng)態(tài)網(wǎng)頁技術(shù)根據(jù)程序運(yùn)行地點(diǎn)的不同，又可分為客戶端動(dòng)態(tài)網(wǎng)頁技術(shù)和服務(wù)器端動(dòng)態(tài)網(wǎng)頁技術(shù)。 客戶端動(dòng)態(tài)網(wǎng)頁技術(shù)(又叫瀏覽器端動(dòng)態(tài)網(wǎng)頁技術(shù))不需要與服務(wù)器進(jìn)行交互，實(shí)

44、現(xiàn)動(dòng)態(tài)功能的代碼往往來用腳本語言的形式直接嵌入到網(wǎng)頁中。服務(wù)器把網(wǎng)頁發(fā)送到客戶端以后，網(wǎng)頁上的腳本程序可以在客戶端瀏覽器中直接響應(yīng)用戶的動(dòng)作，有些應(yīng)用還需要瀏覽器安裝組件支持。 常見的客戶端動(dòng)態(tài)技術(shù)包括：JavaScript、VBScript、Java Applet、Flash、DHTML、ActiveX、VRML等。 服務(wù)器端動(dòng)態(tài)網(wǎng)頁技術(shù)需要服務(wù)器和客戶端的共同參與。用戶通過瀏覽器發(fā)出頁面請(qǐng)求后，服務(wù)器根據(jù)URL攜帶的參數(shù)運(yùn)行服務(wù)器端程序，產(chǎn)生結(jié)果頁面，再將它返回給客戶端。一般涉及數(shù)據(jù)庫操作的網(wǎng)頁，如注冊(cè)、登錄、查詢、購物等應(yīng)用，都需要設(shè)計(jì)強(qiáng)大的服務(wù)器端動(dòng)態(tài)程序，并考慮各種可能出現(xiàn)的出錯(cuò)情況

45、，以保證網(wǎng)站的交互性和安全性。 典型的服務(wù)器端動(dòng)態(tài)技術(shù)包括：CGI、ASP、PHP、JSP等。關(guān)于DIV+CSSDIV+CSS是網(wǎng)站標(biāo)準(zhǔn)（或稱“WEB標(biāo)準(zhǔn)”）中常用術(shù)語之一，div+css 是一種網(wǎng)頁的布局方法，這一種網(wǎng)頁布局方法有別于傳統(tǒng)的HTML網(wǎng)頁設(shè)計(jì)語言中的表格（table）定位方式，可實(shí)現(xiàn)網(wǎng)頁頁面內(nèi)容與表現(xiàn)相分離。XHTML是The Extensible HyperText Markup Language（可擴(kuò)展超文本標(biāo)識(shí)語言）的縮寫。XHTML基于可擴(kuò)展標(biāo)記語言（XML），是一種在HTML 基礎(chǔ)上優(yōu)化和改進(jìn)的的新語言，目的是基于XML應(yīng)用與強(qiáng)大的數(shù)據(jù)轉(zhuǎn)換能力，適應(yīng)未來網(wǎng)絡(luò)應(yīng)用更多的

46、需求。在XHTML網(wǎng)站設(shè)計(jì)標(biāo)準(zhǔn)中，不再使用表格定位技術(shù)，而是采用DIV+CSS的方式實(shí)現(xiàn)各種定位。產(chǎn)生背景: HTML語言自HTML4.01以來，不再發(fā)布新版本，原因就在于HTML語言正變得越來越復(fù)雜化、專用化。即標(biāo)記越來越多，甚至各個(gè)瀏覽器生產(chǎn)商也開發(fā)出只適合于其特定瀏覽器的HTML標(biāo)記，這顯然有礙于HTML網(wǎng)頁的兼容性。于是W3C組織進(jìn)而重新從SGML中獲取營養(yǎng)，隨后發(fā)布了XML。 XML是一種比HTML更加嚴(yán)格的標(biāo)記語言，全稱是可擴(kuò)展標(biāo)記語言（EXtensible Markup Language）。但是XML過于復(fù)雜，且當(dāng)前的大部分瀏覽器都不完全支持XML。于是XHTML這種語言就派上了

47、用場，用XHTML語言重寫后的HTML頁面可以應(yīng)用許多XML應(yīng)用技術(shù)。使得網(wǎng)頁更加容易擴(kuò)展，適合自動(dòng)數(shù)據(jù)交換，并且更加規(guī)整。 而CSS關(guān)鍵就在于其與腳本語言（如Javascript）及XML技術(shù)的融合，即CSS+Javascript+XML（實(shí)際上有一種更好的融合：XML+XSL+Javascript）但XSL，即可擴(kuò)展樣式表語言相較于CSS過于復(fù)雜，不太容易上手。自從CSS出現(xiàn)之后，HTML終于擺脫了雜亂無章的惡夢(mèng)，開始將頁面內(nèi)容與樣式分離。但鑒于我學(xué)習(xí)的是表格布局,本次的設(shè)計(jì)只運(yùn)用了簡單的CSS樣式 3.3 關(guān)系型數(shù)據(jù)庫的選擇: 3.3.1 Microsoft Office Access簡

48、介: Access基于Windows操作系統(tǒng)下的集成開發(fā)環(huán)境，該Microsoft Office Access是由微軟發(fā)布的關(guān)聯(lián)式數(shù)據(jù)庫管理系統(tǒng),是集成在microsoft公司開發(fā)的產(chǎn)品更新?lián)Q代office系統(tǒng)中的集成軟件。它之所以被集成到Office中而不是Visual Studio中，是因?yàn)樗c其它的數(shù)據(jù)庫管理系統(tǒng)（如Visual FoxPro）相比更加簡單易學(xué)，一個(gè)普通的計(jì)算機(jī)用戶即可掌握并使用它。而且最重要的一點(diǎn)是Access的功能足夠強(qiáng)大，足以應(yīng)付一般的數(shù)據(jù)管理及處理需要。 Assess能夠存取 Access/Jet、Microsoft SQL Server、Oracle，或者任何

49、ODBC 兼容數(shù)據(jù)庫內(nèi)的資料。ODBC（Open Database Connectivity開放式數(shù)據(jù)庫互聯(lián)）是微軟推出的一種工業(yè)標(biāo)準(zhǔn)，一種開放的獨(dú)立于廠商的API應(yīng)用程序接口，可以跨平臺(tái)訪問各種個(gè)人計(jì)算機(jī)、小型機(jī)以及主機(jī)系統(tǒng)。ODBC作為一個(gè)工業(yè)標(biāo)準(zhǔn)，絕大多數(shù)數(shù)據(jù)庫廠商、大多數(shù)應(yīng)用軟件和工具軟件廠商都為自己的產(chǎn)品提供了ODBC接口或提供了ODBC支持，這其中就包括常用的SQL SERVER、ORACAL、INFORMIX等，當(dāng)然也包括了Access。 在ASP中可以通過三種方式訪問數(shù)據(jù)庫：1、IDC（Internet Database Connector）方式；2、ADO（ActiveX D

50、ata Objects）方式；3、RDS（Remote Data Service）方式。這三種訪問方式對(duì)數(shù)據(jù)庫的訪問都是由Internet Information Server完成的。通過Web瀏覽器用HTTP協(xié)議向IIS（Internet信息服務(wù)器）發(fā)送請(qǐng)求，IIS執(zhí)行對(duì)數(shù)據(jù)庫的訪問，并返回一個(gè)HTML格式的文檔響應(yīng)。以下是Access的優(yōu)點(diǎn)： 1存儲(chǔ)方式單一 Access管理的對(duì)象有表、查詢、窗體、報(bào)表、頁、宏和模塊，以上對(duì)象都存放在后綴為（.mdb）的數(shù)據(jù)庫文件種，便于用戶的操作和管理。 2面向?qū)ο?Access是一個(gè)面向?qū)ο蟮拈_發(fā)工具，利用面向?qū)ο蟮姆绞綄?shù)據(jù)庫系統(tǒng)中的各種功能對(duì)象化，

51、將數(shù)據(jù)庫管理的各種功能封裝在各類對(duì)象中。它將一個(gè)應(yīng)用系統(tǒng)當(dāng)作是由一系列對(duì)象組成的，對(duì)每個(gè)對(duì)象它都定義一組方法和屬性，以定義該對(duì)象的行為和外國，用戶還可以按需要給對(duì)象擴(kuò)展方法和屬性。通過對(duì)象的方法、屬性完成數(shù)據(jù)庫的操作和管理，極大地簡化了用戶的開發(fā)工作。同時(shí)，這種基于面向?qū)ο蟮拈_發(fā)方式，使得開發(fā)應(yīng)用程序更為簡便。 3界面友好、易操作 Access是一個(gè)可視化工具，是風(fēng)格與Windows完全一樣，用戶想要生成對(duì)象并應(yīng)用，只要使用鼠標(biāo)進(jìn)行拖放即可，非常直觀方便。系統(tǒng)還提供了表生成器、查詢生成器、報(bào)表設(shè)計(jì)器以及數(shù)據(jù)庫向?qū)?、表向?qū)?、查詢向?qū)?、窗體向?qū)?、?bào)表向?qū)У裙ぞ?，使得操作簡便，容易使用和掌握?4集

52、成環(huán)境、處理多種數(shù)據(jù)信息環(huán)境集成了各種向?qū)Ш蜕善鞴ぞ?，極大地提高了開發(fā)人員的工作效率，使得建立數(shù)據(jù)庫、創(chuàng)建表、設(shè)計(jì)用戶界面、設(shè)計(jì)數(shù)據(jù)查詢、報(bào)表打印等可以方便有序地進(jìn)行。 5Access支持ODBC（開發(fā)數(shù)據(jù)庫互連，Open Data Base Connectivity）。利用Access強(qiáng)大的DDE（動(dòng)態(tài)數(shù)據(jù)交換）和OLE（對(duì)象的聯(lián)接和嵌入）特性，可以在一個(gè)數(shù)據(jù)表中嵌入位圖、聲音、Excel表格、Word文檔，還可以建立動(dòng)態(tài)的數(shù)據(jù)庫報(bào)表和窗體等。Access還可以將程序應(yīng)用于網(wǎng)絡(luò)，并與網(wǎng)絡(luò)上的動(dòng)態(tài)數(shù)據(jù)相聯(lián)接。利用數(shù)據(jù)庫訪問頁對(duì)象生成HTML文件，輕松構(gòu)建Internet/Intranet的應(yīng)

53、用。第四章 網(wǎng)站地圖 網(wǎng)站地圖，又稱站點(diǎn)地圖，它就是一個(gè)頁面，上面放置了網(wǎng)站上所有頁面的鏈接。大多數(shù)人在網(wǎng)站上找不到自己所需要的信息時(shí)，可能會(huì)將網(wǎng)站地圖作為一種補(bǔ)救措施。搜索引擎蜘蛛非常喜歡網(wǎng)站地圖。 4.1為何要建立網(wǎng)站地圖網(wǎng)站地圖是一個(gè)網(wǎng)站所有鏈接的容器。網(wǎng)站地圖就是根據(jù)網(wǎng)站的結(jié)構(gòu)、框架、內(nèi)容，生成的導(dǎo)航網(wǎng)頁文件。大多數(shù)人都知道網(wǎng)站地圖對(duì)于提高用戶體驗(yàn)有好處：它們?yōu)榫W(wǎng)站訪問者指明方向，并幫助迷失的訪問者找到他們想看的頁面。對(duì)于SEO，網(wǎng)站地圖的好處就更多了： 1為搜索引擎蜘蛛提供可以瀏覽整個(gè)網(wǎng)站的鏈接； 2為搜索引擎蜘蛛提供一些鏈接，指向動(dòng)態(tài)頁面或者采用其他方法比較難以到達(dá)的頁面； 3作為

54、一種潛在的著陸頁面，可以為搜索流量進(jìn)行優(yōu)化； 4如果訪問者試圖訪問網(wǎng)站所在域內(nèi)并不存在的URL，那么這個(gè)訪問者就會(huì)被轉(zhuǎn)到“無法找到文件”的錯(cuò)誤頁面，而網(wǎng)站地圖可以作為該頁面的“準(zhǔn)”內(nèi)容。4.2 我的網(wǎng)站地圖首頁 網(wǎng)站首頁新聞收藏 娛樂新聞 政治新聞我的學(xué)習(xí) 調(diào)查報(bào)告 實(shí)習(xí)工作我的旅游 圖片收藏 旅游日志英語天地 語法收藏 英語flash動(dòng)畫收藏夾 日志 優(yōu)美文章集留言薄 第五章 網(wǎng)站概述 5.1 網(wǎng)站定位 1網(wǎng)站主題 本網(wǎng)站的主題是個(gè)人網(wǎng)站，主在描述個(gè)人的興趣愛好，生活方式，學(xué)習(xí)情況等。 2網(wǎng)站名稱 該網(wǎng)站名為“快樂吧”，快樂吧快樂吧，顧名思義就是在這個(gè)網(wǎng)站內(nèi)可以讓自己愉快，高興，我這個(gè)網(wǎng)站是針對(duì)個(gè)人設(shè)計(jì)的，是我自己的快樂吧，有我愛的旅游