《個人網頁制作畢業(yè)論文.doc》由會員分享，可在線閱讀，更多相關《個人網頁制作畢業(yè)論文.doc（34頁珍藏版）》請在裝配圖網上搜索。

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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