個人網(wǎng)站設計及實現(xiàn)畢業(yè)設計論文

1、<p><b>　　個人網(wǎng)站設計及實現(xiàn)</b></p><p><b>　　摘 要：</b></p><p>　　網(wǎng)絡發(fā)展到今天，建立網(wǎng)站已經(jīng)成為一個很普遍的問題了。對于企業(yè)家來說，建立好的網(wǎng)站可以搶占新世紀發(fā)展的戰(zhàn)略要點。建立新的企業(yè)形象，直接開拓國際市場。對于個人來說，建設好的個人網(wǎng)站可以更加方便的收集信息，開展更加直接的網(wǎng)絡

2、交流，使用自己構(gòu)造的平臺，可以為畢業(yè)后找工作做好充分的準備。在我的個人網(wǎng)站制作過程中，主要是針對我網(wǎng)站設計的方向和目的、網(wǎng)站設計的整個流程出發(fā)，然后通過自己設計的這個個人網(wǎng)站作品來說明并演示一個網(wǎng)站制作過程。這篇論文的主要內(nèi)容是個人網(wǎng)站的設計思想，整體規(guī)化及相關的基礎科知識。網(wǎng)站的規(guī)化又包括網(wǎng)頁的結(jié)構(gòu)、欄目的設置、網(wǎng)頁的風格、顏色的搭配、版面的布局、文字圖片的運用等。</p><p>　　關鍵詞：網(wǎng)站設計；網(wǎng)站規(guī)

3、化；網(wǎng)站主題</p><p>　　隨著經(jīng)濟的發(fā)展，計算機以被應用到社會生活的各個領域。這給人們的生活帶來很大的方便。如今，已成為人們?nèi)粘Ｉ钪胁豢苫蛉鄙俚牟糠帧Ｈ藗兛梢宰悴怀鰬羯暇W(wǎng)購物，隨時查詢股票信息，在自己的博客上盡情發(fā)表言論……以上這些都離不開最基本的網(wǎng)頁設計和制作[1]。</p><p>　　網(wǎng)站作為網(wǎng)絡信息主要的表現(xiàn)形式而且還是互聯(lián)網(wǎng)信息的主要承載者，在互聯(lián)網(wǎng)上表現(xiàn)出及其重要的地

4、位，并發(fā)揮著及其重要的作用，無論是在國內(nèi)還是國外都得以迅速的發(fā)展和壯大，并被人們重視和關注。網(wǎng)站的迷人之處在于綜合使用文本、圖像、聲音、動畫視頻信息和內(nèi)容，具有豐富的多媒體表現(xiàn)與互動特點。毋庸置疑，網(wǎng)站已成為最吸引人的也是最有效的信息傳遞的手段和方式。隨著網(wǎng)絡技術(shù)的發(fā)展，各類網(wǎng)站紛紛出現(xiàn)，個人網(wǎng)站也成為了一種時尚，越來越多的人希望擁有自己的網(wǎng)站，開辟網(wǎng)絡世界的一片天地，展示自己的才華和風格[2]。</p><p>

5、;　　個人網(wǎng)站是指個人因某種興趣、擁有某種專業(yè)技術(shù)，提供某種服務或把自己的作品、商品展示銷售而制作的具有獨立空間域名的網(wǎng)站。所謂個人網(wǎng)站，就是指網(wǎng)站內(nèi)容是介紹自己的或是以自己的信息為中心的網(wǎng)站[3]。</p><p><b>　　一 網(wǎng)站設計規(guī)化</b></p><p><b>　　1.1 什么是網(wǎng)站</b></p><p&g

6、t;　　網(wǎng)站是因特網(wǎng)上的一個信息集中點，可以通過域名進行訪問。網(wǎng)站要存儲在獨立服務器或者服務器的虛擬主機上才能接受訪問。網(wǎng)站是有獨立域名、獨立存放空間的內(nèi)容集合，這些內(nèi)容可能是網(wǎng)頁，也可能是程序或其他文件，不一定要有很多網(wǎng)頁，只要有獨立域名和空間，哪怕只有一個頁面也叫網(wǎng)站。</p><p>　　網(wǎng)站就是在互聯(lián)網(wǎng)上的一塊固定的面向全世界發(fā)布消息的地方，它由域名和網(wǎng)站空間構(gòu)成。衡量一個網(wǎng)站的性能通常從網(wǎng)站空間大小、網(wǎng)

7、站位置、網(wǎng)站連接速度、網(wǎng)站軟件配置、網(wǎng)站提供服務等幾方面考慮。</p><p>　　1.2 網(wǎng)站建設的目的</p><p>　　網(wǎng)站的建設不僅僅是制作主頁的問題，還需要考慮網(wǎng)站的定位、目標用戶、網(wǎng)站內(nèi)容、服務事項、空間方案、安全性、藝術(shù)設計等等。任何網(wǎng)站在建設之前都必須明確文向、用途和服務群體等一系列的問題，寫出詳細的建站計劃，可以說這是網(wǎng)站建設的根源和核心所在。這里我的個人網(wǎng)站主要是讓更

8、多的人認識到我，了解我。借助網(wǎng)絡的這個平臺來展示我自己，還有我希望能交到和我一樣懷著夢想起航的朋友。</p><p>　　1.3 本站的明確目的</p><p>　　不同的網(wǎng)站目的要求通過不同的方式來實現(xiàn)。一個展示個人能力的網(wǎng)站與一個以花卉種植為主題的網(wǎng)站，以及一個大型門戶網(wǎng)站和一個小型企業(yè)網(wǎng)站，其出發(fā)點和建站目的都有所不同。在整個網(wǎng)站的建設規(guī)化方面的要求也是肯定不一樣的。因此在規(guī)化我的網(wǎng)

9、站時，我選擇的是與我本人相關的內(nèi)容來作為主題的。</p><p>　　網(wǎng)站預計的用戶群體：對于網(wǎng)站的設計者和建設者來說，在設計規(guī)化網(wǎng)站時必須要明確自己網(wǎng)站的瀏覽都，也就是確定自己的用戶群體。在已經(jīng)確定了建設目的的前提下，應根據(jù)建站方向所會導致出現(xiàn)的不同用戶群體的需求來規(guī)化設計整個網(wǎng)站。我的這個網(wǎng)站就確定了以懷著夢想奮斗的人為用戶群體。</p><p><b>　　1.4 軟件準備

10、</b></p><p>　　在網(wǎng)頁的設計過程中，因人而宜，每個人使用的軟件也許不同。 Dreamweaver與Flash、 Fireworks這3者被用戶稱為“網(wǎng)頁設計三劍客”。Dreamweaver的優(yōu)勢在于它不僅是優(yōu)秀的所見即所得的編輯軟件，同時也兼顧了HTML源代碼，可以讓用戶很方便地在兩種模式之間的切換。</p><p>　　Dreamweaver采用“所見即所得”的

11、直觀設計模式，充分尊重設計人員的原始意識和想像力，它成功地將網(wǎng)頁設計功能中的技術(shù)實現(xiàn)部分和設計部分分開，還提供眾多的可視化設計工具、應用開發(fā)環(huán)境以及代碼編輯支持。如利用鼠標拖曳來添加表格、圖像等元素，在方檔中直接輸入文本，直接插入一些常用的特殊符號對象等。用戶在沒有輸入代碼的情況下完成了上述工作，Dreamweaver自動將結(jié)果轉(zhuǎn)換為HTML源代碼。用戶也可以隨時查看方檔的HTML源代碼，在代碼視圖中進行修改。</p>&

12、lt;p><b>　　二 網(wǎng)站的總體設計</b></p><p>　　2.1 確定網(wǎng)站主題</p><p>　　做網(wǎng)站，首先必須要解決的就是網(wǎng)站內(nèi)容問題，即確定網(wǎng)站的主題。如果自己在某些方面有興趣，或掌握的資料越多，也可以做一個自己感興趣的東西。你可以有自己的見解，做出自己的特色。對于內(nèi)容主題的選擇，要做到小而精，主題定位要小，內(nèi)容要精。不要去試圖制作一個包羅萬

13、象的站點，這往往會失去網(wǎng)站的特色，也會帶來高強度的勞動，給網(wǎng)站的及時更新帶來困難。我的網(wǎng)站主題是以我個人相關的資料來制作的。</p><p>　　2.2 確定網(wǎng)站形象</p><p>　　網(wǎng)站形象的設計可以從網(wǎng)站標志、網(wǎng)站色彩、網(wǎng)站字體網(wǎng)絡宣傳語等這些方面著手。</p><p>　　網(wǎng)站色彩，網(wǎng)站給人的第一印象來自視覺沖擊，不同的色彩搭配產(chǎn)生不同的效果，并可能影響到

14、訪問者的情緒?！皹藴噬省笔侵改荏w現(xiàn)網(wǎng)站形象和延伸內(nèi)涵的色彩，給人以整體統(tǒng)一的感覺。我個人網(wǎng)站的色彩是以粉色為主，淡粉色和冰粉色為輔，給人一種浪漫的感覺，仿佛生活在虛幻的世界里。</p><p>　　網(wǎng)站字體，和標準色彩一樣，標準字體是指用于標題、主菜單的特有字體。為了體現(xiàn)網(wǎng)站的特有風格，可以根據(jù)自已網(wǎng)站所表達的內(nèi)涵，選擇更貼切的字體。我的個人網(wǎng)站的標準字體是幼圓。給人一種沉穩(wěn)而不失俏皮的感覺。</p>

15、;<p>　　2.3 確定網(wǎng)站風格</p><p>　　風格是抽象的，是指網(wǎng)站的整體形象給瀏覽者的綜合感受。這個“整體形象”包括網(wǎng)站的標志、色彩、字體、標語等諸多因素。網(wǎng)站是可以平易近人、生動活潑的，也可以是專業(yè)嚴肅的。不管是色彩、技術(shù)、文字、布局、還是交互方式，只要你能由此讓瀏覽者明確的分辨出這是你網(wǎng)站獨所有的，這就形成了風格。</p><p>　　風格是有人性的，通過網(wǎng)站

16、的色彩、技術(shù)、文字、布局、交互方式可以概括出一個網(wǎng)站的個性；我的網(wǎng)站風格是以浪漫為主，給人一種夢幻的感覺。</p><p>　　2.4 確定網(wǎng)站內(nèi)容</p><p>　　我的個人網(wǎng)站大體上包括了一些內(nèi)容：首頁、網(wǎng)頁設計、動畫特效、網(wǎng)頁素材、相關軟件、作品展示、本站論壇、游客留言等網(wǎng)站常用內(nèi)容，方便大家瀏覽。</p><p><b>　　三 具體實現(xiàn)與分析&

17、lt;/b></p><p><b>　　3.1 首頁</b></p><p>　　一個網(wǎng)站的首頁是一個文檔，當一個網(wǎng)站服務器收到一臺電腦上網(wǎng)絡瀏覽器的訊息連結(jié)請求時，便會向這臺電腦發(fā)送這個文檔。當在瀏覽器的位址列輸入域名，而未指向特定目錄或檔案時，通常瀏覽器也會打開網(wǎng)站的首頁。 </p><p>　　網(wǎng)站首頁往往會被編輯得易于了解該網(wǎng)站

18、提供的資訊，并引導互聯(lián)網(wǎng)用戶瀏覽網(wǎng)站其他部分的內(nèi)容。這部分內(nèi)容一般被認為是一個目錄性質(zhì)的內(nèi)容，如圖1。</p><p><b>　　圖1</b></p><p>　　3.2 網(wǎng)頁設計模塊</p><p>　　為了滿足廣大網(wǎng)頁制作愛好者的學習需求，本網(wǎng)站推出新版的網(wǎng)頁制作教程，該教程使用Dreamweaver CS5作為開發(fā)工具，結(jié)合老師的網(wǎng)站開

19、發(fā)經(jīng)驗，為大家講解網(wǎng)頁制作的每個環(huán)節(jié)。希望通過本套課程的學習，大家能靈活運用Dreaweaver完成網(wǎng)站的開發(fā)，如圖2。</p><p><b>　　圖2</b></p><p>　　3.3 網(wǎng)頁特效模塊</p><p>　　提供包括鼠標類類、文字類、菜單類、背景類、圖形類、播放器等網(wǎng)頁特效代碼，力求做到收集最全網(wǎng)站。可能的關注這方面的最新發(fā)展

20、趨勢，不斷更新自己的網(wǎng)站，盡可能的收集最新的網(wǎng)頁特效代碼。如圖3</p><p><b>　　圖3</b></p><p>　　3.4 網(wǎng)頁素材模塊</p><p>　　提供各種新式素材包含圖片、動畫、flash、音樂等方便網(wǎng)頁及網(wǎng)站制作時參考即借鑒之用，如圖4。</p><p><b>　　圖4</b&

21、gt;</p><p>　　3.5 相關軟件下載模塊</p><p>　　提供網(wǎng)站及網(wǎng)頁制作所需的必要工具如Dreamweaver、Flash、 Fireworks等相關必備軟件下載，如圖5。</p><p><b>　　圖5</b></p><p>　　3.6 作品展示模塊</p><p>　　

22、提供多種多樣名人或企業(yè)個人網(wǎng)站供大家學習參考，豐富大家的知識，詳細內(nèi)容如圖6所示。</p><p><b>　　圖6</b></p><p>　　3.7 論壇及留言模塊</p><p>　　論壇又名網(wǎng)絡論壇BBS，全稱為Bulletin Board System（電子公告板）或者Bulletin Board Service（公告板服務）。是In

23、ternet上的一種電子信息服務系統(tǒng)。它提供一塊公共電子白板，每個用戶都可以在上面書寫，通過留言的方式可發(fā)布信息或提出看法。它是一種交互性強，內(nèi)容豐富而及時的Internet電子信息服務系統(tǒng)。用戶在BBS站點上可以獲得各種信息服務，發(fā)布信息，進行討論，聊天等等如圖7所示。</p><p><b>　　圖7</b></p><p><b>　　四 總結(jié)<

24、/b></p><p>　　經(jīng)過老師耐心細致的指導，及同學之間的相互交流，同時翻閱了大量的資料(包括網(wǎng)上資料、書本及學校的一些相關資料)，經(jīng)過近一段時間的努力，個人網(wǎng)站的設計制作告一段落?？偨Y(jié)這次“揚帆起航-個人網(wǎng)站”開發(fā)制作過程，我使用了目前因特網(wǎng)上比較流行的各種靜態(tài)制作方法及交互動態(tài)網(wǎng)站的制作設計手段，并對初步利用后臺程序完成了網(wǎng)站的動態(tài)響應與生成網(wǎng)頁的技術(shù)，同時也從中學習了對靜態(tài)網(wǎng)頁的處理風格，色彩搭

25、配，頁面導航方面有了一定的經(jīng)驗。</p><p>　　目前網(wǎng)站的制作技術(shù)與要求，都已經(jīng)告別了因特網(wǎng)初期網(wǎng)站制作的“幼稚”期，隨著各類網(wǎng)站的迅速增加與瀏覽者需求的提高，無不要求網(wǎng)站從立意、策劃、頁面設計到后臺程序的全面提高。無論是個人網(wǎng)站還是企業(yè)網(wǎng)站都必須被要求從瀏覽者角度出發(fā)，最大限度的滿足用戶的要求，這也是以后各類網(wǎng)站發(fā)展競爭的真正實質(zhì)所在。</p><p>　　本次設計由于設計時間比較

26、緊，且相關模塊比較多，加之設計經(jīng)驗的不足，在網(wǎng)站的整體設計及各模塊功能可能設計的不完全，有待于進一步的完善和改進。</p><p><b>　　參 考 文 獻</b></p><p>　　[4]李沖．Dreamweaver網(wǎng)頁設計[M]．清華大學出版社．2011．</p><p>　　[5]王寶軍．計算機網(wǎng)絡技術(shù)與應用[M]．中國勞動社會出版保

27、障出版社．2002．</p><p>　　[6]岳鴻．計算機應用基礎[M]．國防科技大學出版社．2006．</p><p>　　[7]宋虹．Photoshop圖形圖像處理[M]．湖南大學出版社．2011．</p><p>　　[8]姬付梓．創(chuàng)意設計[M]．大學出版社．2011．</p><p><b>　　Abstract</

28、b></p><p>　　the network development to today, to establish the website has become a very common problem. For the entrepreneur, build good website can seize strategic points of development in the new centu

29、ry. To establish a new corporate image, to open up international market directly. For an individual, build good personal website can be more convenient to collect information, carry out more direct communication, using t

30、he constructed their own platform, can find a job after graduation fully prepared.</p><p>　　In my personal website design process, is mainly based on our web site design, web site design purpose and directio

31、n of the entire process, and through their own design of this personal website works to explain and demonstrate a website production process. The main content of this thesis is a personal website design, overall planning

32、 and related basic knowledge. Site planning and webpage structure, section design, webpage style, color, layout of the layout, text and images using. There are the t</p><p>　　Keywords: website design； websit