網(wǎng)頁設計畢業(yè)論文-2014

1、大連東軟信息學院畢業(yè)設計（論文）畢業(yè)設計（論文）系系 所：所： 專專 業(yè)：業(yè)： 學生姓名：學生姓名： 學生學號：學生學號： 指導教師：指導教師： 導師職稱：導師職稱： 蜂鳥攝影網(wǎng)的設計與制作蜂鳥攝影網(wǎng)的設計與制作完成日期：完成日期： 大連東軟信息學院Dalian Neusoft University of Information大連東軟信息學院畢業(yè)設計（論文） 摘要I蜂鳥攝影網(wǎng)的設計與制作摘 要隨著現(xiàn)代化互聯(lián)網(wǎng)的普及與發(fā)展，電子商務已經(jīng)越來越深入人們的生活。而在近些年，威客類網(wǎng)站越來越受到人們的關注，基于 HTML 技術(shù)和 CSS 技術(shù)，開發(fā)出為人們提供攝影服務的威客型網(wǎng)站。在本網(wǎng)站中，用戶可

2、以方便快捷的查詢本地城市的攝影服務機構(gòu)，最近的攝影活動以及查看本地的風景圖片，查看電子書信息的詳細資料，然后根據(jù)各人的不同需求選擇不同的電子書信息。通過對網(wǎng)頁技術(shù)的研究，對 HTML 技術(shù)的調(diào)研，以及對 CSS+DIV，Photoshop 的了解，綜合這幾項技術(shù)，從而產(chǎn)生了整體的網(wǎng)頁結(jié)構(gòu)。在主頁運用 CSS 技術(shù)，可以有效的對網(wǎng)頁的布局，字體，顏色，背景等做一些方便的改變，只要對相應的代碼做一些簡單的修改和操作，就可以改變整個工程中的不同部分，或者頁數(shù)不同的網(wǎng)頁的外觀和格式。并具有良好的可擴展性和可移植性信息平臺。關鍵詞：關鍵詞：電子書，網(wǎng)絡，HTML，CSS大連東軟信息學院畢業(yè)設計（論文）

3、AbstractIIDesign and Fabrication of a Hummingbird Photography NetAbstractAlong with the popularization and development of the modernization of the Internet, electronic commerce has been more and more important in peoples life. In recent years, Witkey websites, more and more peoples attention, HTML t

4、echnology and CSS technology based on the development of Witkey website, offering the service for the people. In this website, photography services users can easily query the local city, photographic activities recently and view the local landscape pictures, view detailed information on electronic i

5、nformation, and then choose a different book information according to the different needs of.Through the research on webpage technology, research on HTML technology, as well as the CSS+DIV, Photoshop know, this integrated several technology, resulting in the webpage of the whole structure. In the pa

6、ge using CSS technology, can effectively on the webpage layout, font, color, background, do some convenient change, as long as the corresponding code to do some simple modification and operation, can change the whole project in the different parts of, or pages of different webpage appearance and for

7、mat. And has good scalability and portability of the information platform.Key Words:E-book, network, HTML, CSS大連東軟信息學院畢業(yè)設計（論文） 目錄I目 錄摘 要.IABSTRACT.II第 1 章緒 論 .11.1 課題研究主要內(nèi)容 .11.2 課題研究的背景.11.3 課題的研究意義 .1第 2 章相關技術(shù)與工具介紹 .22.1 網(wǎng)站開發(fā)工具.22.2 CSS 技術(shù)介紹.3第 3 章網(wǎng)站總體規(guī)劃與設計 .43.1 網(wǎng)站主題與內(nèi)容設計.43.2 網(wǎng)頁色調(diào)選擇.43.3 網(wǎng)站功能結(jié)構(gòu)圖

8、.5第 4 章網(wǎng)站的制作與實施 .64.1 素材的準備與制作.64.1.1 網(wǎng)站首頁的框圖.64.1.2 二級網(wǎng)頁的框圖.74.1.3 三級網(wǎng)頁的框圖.74.2 LOGO的設計與實現(xiàn) .84.3 導航條的實現(xiàn) .94.4 左側(cè)邊欄的實現(xiàn).104.5 主體的實現(xiàn).114.6 編寫代碼.124.6.1 CSS 鏈接.12大連東軟信息學院畢業(yè)設計（論文） 目錄II4.6.2 CSS 整站控制代碼.124.6.3 使用的字體.134.6.4 首行縮進.134.6.5 高效實用的標簽.13第 5 章系統(tǒng)測試.145.1 網(wǎng)站測試需求.145.2 網(wǎng)站測試目的.145.3 網(wǎng)站性能測試.145.4 測試結(jié)

9、果.14第 6 章總結(jié).16參考文獻.17致 謝.18大連東軟信息學院畢業(yè)設計（論文） 目錄1第 1 章緒 論1.11.1 課題研究主要內(nèi)容課題研究主要內(nèi)容在大連蜂鳥攝影網(wǎng)站這一類威客型網(wǎng)站中，最重要的是大眾的使用體驗，在網(wǎng)站首頁一目了然的為大眾展示可為大眾提供服務的當?shù)叵嚓P商家機構(gòu)，相關活動和當?shù)氐娘L景。從版面設計來看,一個有特色的主頁,必須包含有四個要素：文字，圖片，排列方式和主色調(diào)，這四者相輔相成，缺一不可。 1.21.2 課題研究的背景課題研究的背景威客網(wǎng)站作為一種新型的互聯(lián)網(wǎng)應用，對于個人和社會都有著積極的意義。但是，目前威客網(wǎng)站在我國發(fā)展的還不成熟。隨著威客概念的普及，以及威客網(wǎng)站

10、模式的逐步成熟，威客網(wǎng)站的發(fā)展空間將最終被打開。威客類網(wǎng)站自年開始發(fā)展以來，受到人們廣泛關注，但近十年來，威客網(wǎng)站遇到越來越多的瓶頸，這里有著各種各樣的原因，例如：信用系統(tǒng)，支付系統(tǒng)，交易模式等等，此網(wǎng)站基于目前威客行業(yè)的瓶頸問題，提出新的解決方式。1.31.3 課題的研究意義課題的研究意義本課題的研究基于近年來威客類型網(wǎng)站的日益壯大，大量的威客型網(wǎng)站的建立說明了在電商的世界里，威客型網(wǎng)站所占比重會越來越大，我相信在不久的將來，威客型網(wǎng)站會突破種種瓶頸問題，獲得大眾的認可，得到更多的市場空間，會為大眾的生活帶來翻天覆地的改變。本課題的研究方向是為大眾提供攝影服務的一種威客型網(wǎng)站，在本課題中，首

11、次提出線上線下相結(jié)合的方式，大膽嘗試新型的運營模式。首先在網(wǎng)站中體現(xiàn)的不僅僅是服務項目，也為大眾提供與攝影相關的一些經(jīng)驗交流。旨在為大眾提供一個在攝影行業(yè)具有綜合影響力的新型網(wǎng)站。大連東軟信息學院畢業(yè)設計（論文）2第 2 章相關技術(shù)與工具介紹2.12.1 網(wǎng)站開發(fā)工具網(wǎng)站開發(fā)工具蜂鳥攝影網(wǎng)的開發(fā)工具用到了 Adobe Dreamweaver 和 Adobe Photoshop，下面詳細介紹一下這兩款軟件：Adobe Dreamweaver，簡稱“DW”，是美國 MACROMEDIA 公司開發(fā)的集網(wǎng)頁制作和管理網(wǎng)站于一身的所見即所得網(wǎng)頁編輯器，它是第一套針對專業(yè)網(wǎng)頁設計師特別發(fā)展的視覺化網(wǎng)頁開發(fā)

12、工具，利用它可以輕而易舉地制作出跨越平臺限制和跨越瀏覽器限制的充滿動感的網(wǎng)頁。Adobe Dreamweaver 使用所見即所得的接口，亦有HTML（標準通用標記語言下的一個應用）編輯的功能。它有 Mac 和 Windows 系統(tǒng)的版本。隨 Macromedia 被 Adobe 收購后，Adobe 也開始計劃開發(fā) Linux 版本的Dreamweaver 了。 Dreamweaver 自 MX 版本開始，使用了 Opera 的排版引擎Presto 作為網(wǎng)頁預覽。Adobe Photoshop，簡稱“PS”，是 Adobe 公司旗下最為出名的圖像處理軟件之一。從功能上看，Photoshop 可分

13、為圖像編輯、圖像合成、校色調(diào)色及特效制作部分。圖像編輯是圖像處理的基礎，可以對圖像做各種變換如放大、縮小、旋轉(zhuǎn)、傾斜、鏡象、透視等。也可進行復制、去除斑點、修補、修飾圖像的殘損等。這在婚紗攝影、人像處理制作中有非常大的用場，去除人像上不滿意的部分，進行美化加工，得到讓人非常滿意的效果。 圖像合成則是將幾幅圖像通過圖層操作、工具應用合成完整的、傳達明確意義的圖像，這是美術(shù)設計的必經(jīng)之路。Photoshop 提供的繪圖工具讓外來圖像與創(chuàng)意很好地融合，成為可能使圖像的合成天衣無縫。 校色調(diào)色是 Photoshop 中深具威力的功能之一，可方便快捷地對圖像的顏色進行明暗、色編的調(diào)整和校正，也可在不同顏

14、色進行切換以滿足圖像在不同領域如網(wǎng)頁設計、印刷、多媒體等方面應用。 特效制作在 Photoshop 中主要由濾鏡、通道及工具綜合應用完成。包括圖像的特效創(chuàng)意和特效字的制作，如油畫、浮雕、石膏畫、素描等常用的傳統(tǒng)美術(shù)技巧都可藉由Photoshop 特效完成。而各種特效字的制作更是很多美術(shù)設計師熱衷于 Photoshop 的研究的原因。大連東軟信息學院畢業(yè)設計（論文）32.2.2 2 CSSCSS 技術(shù)介紹技術(shù)介紹CSS 和 HTML 一樣，是一個非?；A性的規(guī)范，是任何一個 Web 站點設計過程中都離不開的“基礎技術(shù)” ，因此無論是作為設計師，還是開發(fā)人員，都離不開這項武器。CSS 的思想就是首

15、先指定對什么“對象”進行設置，然后指定該對對象的那個方面的屬性進行設置，最后給出該設置的“值” 。因此，概括的說.CSS 就是由“對象” 、“屬性”和“值”三部分組成。CSS 按其位置可以分成三種：(1)內(nèi)嵌樣式(Inline Style) (2)內(nèi)部樣式表 (Internal Style Sheet) (3)外部樣式表(Externa Style Sheet)大連東軟信息學院畢業(yè)設計（論文）4第 3 章網(wǎng)站總體規(guī)劃與設計3.13.1 網(wǎng)站主題與內(nèi)容設計網(wǎng)站主題與內(nèi)容設計本課題采用的技術(shù)是 DIV+CSS，DIV+CSS 具備以下優(yōu)點對各接口業(yè)務的進程，通過統(tǒng)一的命令形式進行控制。(1)DIV

16、+CSS 有利于搜索引擎爬蟲：一般而言相同網(wǎng)頁頁面 html 文件 table 布局字節(jié)大于 DIV+CSS 布局的字節(jié)，所以可以節(jié)約搜索引擎爬蟲爬行下載頁面內(nèi)容時間。 (2)重構(gòu)頁面修改方便（DIV+CSS 改版方便）：一般 DIV+CSS 頁面都是 html 和CSS 文件分開的也就是說一個網(wǎng)頁的內(nèi)容與表現(xiàn)形式的分離，一般修改小小部分的CSS 文件里 CSS 樣式屬性就可以修改真站的樣式版面，如背景顏色、字體顏色、網(wǎng)站寬度等具有 table 不具備的方便性。 (3)DIV+CSS 頁面增加網(wǎng)頁打開速度：這里是特性決定了他們的性能，因為DIV+CSS 頁面是 DIV 的 html 和 CSS

17、 文件分開的，而瀏覽器打開該網(wǎng)頁的時候是同時下載 html 和 CSS，所以可以提高網(wǎng)頁打開速度，而 table 還有個特性就是瀏覽器打開的時候必須是瀏覽器下載以開始，并結(jié)束后才顯示該塊的內(nèi)容，而 DIV的 html 是邊加載邊將內(nèi)容呈現(xiàn)到瀏覽器上，DIV+CSS 網(wǎng)站大大增強用戶體驗作用。大家都知道網(wǎng)頁多等 1 秒鐘都會降低瀏覽者等待時間。3.2 網(wǎng)頁色調(diào)選擇網(wǎng)頁色調(diào)選擇網(wǎng)站主色調(diào)為灰色，如圖 3.1 為網(wǎng)站所用色卡。圖 3.1 網(wǎng)站背景所用色卡大連東軟信息學院畢業(yè)設計（論文）5從頁面所展示出來的色調(diào)來看,整個頁面的色調(diào)都以淺灰色為主,其調(diào)子是比較的柔美，且十分的高雅。其主色調(diào)以及其背景的顏

18、色是比較的近似于明度中的白色，且又非常淺的灰調(diào)，而其輔色調(diào)又為灰調(diào)子，其在明度上比其主色調(diào)要稍微的深些?；疑珜儆谑且环N中性色，它介于黑色與白色之間，可以讓人感覺到中庸、平凡、溫和、謙讓、中立，以及高雅，因此它也被人稱作高級灰，是一種可以經(jīng)久不衰、同時也十分的耐看的顏色。不管是哪一種色彩，只有在其中加入灰色，此色彩都能顯得十分的含蓄且柔和。然而灰色在給我們以高品味、含蓄、精致，以及耐人尋味的同時，同樣也會給人以頹廢、蒼涼、消極、沮喪、沉悶的感覺，如果我們在設計的時候搭配不當，就容易使頁面顯得比較的灰暗。3.3 網(wǎng)站功能結(jié)構(gòu)圖網(wǎng)站功能結(jié)構(gòu)圖網(wǎng)站功能結(jié)構(gòu)圖，如圖 3.2 所示 圖 3.2 網(wǎng)站功能結(jié)

19、構(gòu)圖大連東軟信息學院畢業(yè)設計（論文）6第 4 章網(wǎng)站的制作與實施4.1 素材的準備與制作素材的準備與制作在頁面布局當中，要充分考慮頁面的排版，色彩搭配，以及需要的特點等。在整個站點中重復實現(xiàn)某些頁面設計風格。重復的成分可能是某種字體、標題 logo、導航菜單、頁面的空白邊設置、貫穿頁面的特定厚度的線條等。首先設計出網(wǎng)站首頁的框圖，二級頁面框圖，三級頁面框圖，之后設計代碼，實現(xiàn)框圖內(nèi)容，合理運用符合整體網(wǎng)站風格的色彩。4.1.1 網(wǎng)站首頁的框圖網(wǎng)站首頁的框圖首頁框圖包含了網(wǎng)站 Logo，Banner 設計，導航條，用戶登錄區(qū)域，圖片展示，本地會員攝影服務機構(gòu)，本地會員攝影師，本地會員攝影外拍活動

20、等，總體背景顏色以灰色為主。如圖 4.1 為網(wǎng)站首頁框圖。 如圖 4.1 為網(wǎng)站首頁框圖大連東軟信息學院畢業(yè)設計（論文）74.1.2 二級網(wǎng)頁的框圖二級網(wǎng)頁的框圖二級頁面的設計在大體上與首頁統(tǒng)一，包括網(wǎng)站的 Logo，色彩的運用等，這種設計風格是為了避免二級頁面和首頁的風格分離，使得整個網(wǎng)站看起來不協(xié)調(diào)。但是為了吸引瀏覽者的觀賞興趣，又不能完全與首頁的設計風格一致。如圖 4.2 為二級網(wǎng)頁的設局圖。 圖 4.2 二級網(wǎng)頁設計圖4.1.34.1.3 三級網(wǎng)頁的框圖三級網(wǎng)頁的框圖三級網(wǎng)頁也是最簡潔的網(wǎng)頁之一，除了網(wǎng)頁頭部和一級、二級頁面之外，大部分的風格并沒有改變，只是將中部的盒子變大，對本會員的

21、圖片進行了展示。如圖 4.3 為三級頁面設計圖。大連東軟信息學院畢業(yè)設計（論文）8 圖 4.3 三級頁面設計圖4.2 Logo 的設計與實現(xiàn)的設計與實現(xiàn)Logo 的設計很簡單，主要通過 Photoshop 軟件進行畫面大小設計，背景顏色設計，字體設計等。Logo 的背景為白色，所以此處為網(wǎng)站實際截圖，如圖 4.4 所示。 圖 4.4 為 Logo 設計圖大連東軟信息學院畢業(yè)設計（論文）94.3 導航條的實現(xiàn)導航條的實現(xiàn)導航條所用到的技術(shù)就是無序列表，通過 CSS 技術(shù)對其顏色等屬性進行更改即可展現(xiàn)出效果。如圖 4.5 為網(wǎng)頁導航條部分展示。圖 4.5 導航條展示其中導航條的部分 CSS 代碼為

22、：其中第一部分，在#box1 中設置了平鋪的背景圖像，第二部分#box1 ul 設置了的列表的樣式與定位；第三部分#box1 li 對列表的盒子、邊框和浮動進行了設置；第四部分為#box1 a 文字；第五部分設置了鼠標放在上面的效果顯示。大連東軟信息學院畢業(yè)設計（論文）104.4 左側(cè)邊欄的實現(xiàn)左側(cè)邊欄的實現(xiàn)接下來實現(xiàn)左邊欄的樣式設計，要點是一組圓角框的實現(xiàn)方法。首先在 Fireworks軟件中制作一個圓角框。如圖 4.6 所示圖 4.6 左側(cè)邊欄的實現(xiàn)其主要代碼為：上面的代碼就是網(wǎng)站左邊欄的 HTML 代碼。大連東軟信息學院畢業(yè)設計（論文）114.5 主體的實現(xiàn)主體的實現(xiàn)該網(wǎng)頁主題主要是對盒

23、子進行設置，主體部分涉及整體布局設計以及一些文字元素的設置。如圖 4.7 所示為網(wǎng)頁主體示意圖。 圖 4.7 網(wǎng)頁主體其主要代碼如圖 4.8 所示：圖 4.8 網(wǎng)站主題所用代碼大連東軟信息學院畢業(yè)設計（論文）12CSS 中的 center 代碼實現(xiàn)了活動圖片和活動內(nèi)容，采用了兩個盒子模型，左側(cè)顯示圖片，右側(cè)顯示活動內(nèi)容，并設置了 padding 值，可以使得模型變得整齊，好看。4.6 編寫代碼編寫代碼4.6.14.6.1 CSSCSS 鏈接鏈接在大連蜂鳥攝影網(wǎng)站的實現(xiàn)中，均采用單獨的外部 CSS 文件對整個網(wǎng)站進行整體控制，可以有效減少代碼容量，方便的對整站進行演示控制外部 CSS 的鏈接代碼

24、如圖 4.9 所示。圖 4.9 外部 CSS 鏈接代碼4.6.24.6.2 CSSCSS 整站控制代碼整站控制代碼我們在外部 CSS 中編寫代碼對整站進行控制。CSS 代碼如圖 4.10 所示。圖 4.10 所示為網(wǎng)站 banner，center，footer 的 CSS 代碼大連東軟信息學院畢業(yè)設計（論文）134.6.34.6.3 使用的字體使用的字體在瀏覽者對頁面進行瀏覽的時候，12px 的文字是最適合人們進行閱讀的文字大小，也是網(wǎng)站中看上去最漂亮的字體大小，如圖 4.11 所示圖 4.11 正文字體的大小4.6.44.6.4 首行縮進首行縮進對于我們中國人來說，自古以來的習慣就是在每一段

25、的開頭錯進兩個字，在 CSS代碼中也可以同樣的控制語句，在 CSS 代碼中的控制語句，如圖 4.12 所示。圖 4.12 首行縮進 2 字4.6.54.6.5 高效實用的標簽高效實用的標簽在自己制作整個網(wǎng)站的過程中，總結(jié)了很多經(jīng)驗，更多的是利用標簽來進行控制，大量減少了新命名的標簽，例如：在首頁的導航條，活動列表中用到的標簽，在首頁的右側(cè)本站會員 TOP 列表中均采用了 ul。在各個小盒子的文字中也得到充分應用，可以控制字體的大小，在 CSS 中可以單獨設置 h3 部分的文字屬性等。以上都是在網(wǎng)頁制作的過程中會經(jīng)常用到的代碼。大連東軟信息學院畢業(yè)設計（論文）14第 5 章系統(tǒng)測試5.1 網(wǎng)站測

26、試需求網(wǎng)站測試需求 并不是意味著網(wǎng)頁做完后就大功告成，往往在這時候會出現(xiàn)問題。所以就要在這個時刻對網(wǎng)頁進行測試。測試需要本地計算機在 Win7 的系統(tǒng)下進行測試操作。測試環(huán)境：Intel（R） Core(TM)2 Duo CPU T94002.0GHz 安裝內(nèi)存：2.00G測試系統(tǒng)：microsoft Windows 7測試瀏覽器： IE8.0 Firefox5.2 網(wǎng)站測試目的網(wǎng)站測試目的 測試目的無外乎考慮兩種情況。一是在瀏覽者的角度去看待這個網(wǎng)頁，身為瀏覽者，總是不希望在打開瀏覽器后發(fā)現(xiàn)該網(wǎng)頁的 logo 位置跑動，盒子出現(xiàn)重疊現(xiàn)象。也沒人希望看到一個網(wǎng)站打開之后什么也不見了，往頁面下面

27、一拖都縮成一團；對于電子書網(wǎng)站的制作人來說，一定希望這個網(wǎng)站可以以一個十分美好的形象呈現(xiàn)在大家的面前的。無論從哪個方向考慮，測試的目的就在于吧一個好的網(wǎng)站展現(xiàn)在大家的面前，沒有任何遺漏的失誤存在。如果在測試階段發(fā)現(xiàn)問題，要及時的去修改更新。5.3 網(wǎng)站性能測試網(wǎng)站性能測試通過運用 IE 瀏覽器來進行網(wǎng)站的測試，不同的瀏覽器會使網(wǎng)頁呈現(xiàn)的效果是不一樣的。蜂鳥攝影網(wǎng)使用的是 IE 瀏覽器和 Firefox 兩大瀏覽器共同來調(diào)試這個網(wǎng)站。首先是在 IE 瀏覽器中測試該網(wǎng)站，打開網(wǎng)頁后首先看是否有篡位，圖像位置更改等現(xiàn)象，之后用鼠標劃過導航條，看是否有顏色更改的效果。隨即點入二級頁面，看是否能正常連接

28、到二級網(wǎng)頁，如果正常，再一次順查上述的問題。當網(wǎng)頁順利三級頁面之后首先確定的是三級頁面中的圖片有沒有發(fā)生偏移或者走出網(wǎng)頁的顯現(xiàn)，隨后應該再次檢查導航條的運作是否正常，最后通過點擊導航條來進入每一個二級頁面，查看二級頁面的超鏈接是否會因為鼠標觸碰的情況下是否發(fā)生變化。還得注意當進入各個頁面時字體大小，字體顏色以及字體的行高有沒有發(fā)生變化。在 Firefox 中也需要這樣的測試，測試過程和 IE 中的過程相同。5.4 測試結(jié)果測試結(jié)果經(jīng)過了重重測試，可以說網(wǎng)站是做完了，在測試中未發(fā)現(xiàn)有任何錯位的情況發(fā)生，大連東軟信息學院畢業(yè)設計（論文）15也沒有字體等問題的發(fā)生，蜂鳥攝影網(wǎng)在 WINDOWS XP

29、 系統(tǒng)中，WINDOWS VISTA系統(tǒng)中，以及 WINSOWS 7 的系統(tǒng)下，在 IE8.0 與 Firefox 瀏覽器中均顯示正常，測試成功。大連東軟信息學院畢業(yè)設計（論文）16第 6 章總結(jié)本文主要研究的蜂鳥攝影網(wǎng)站的設計與實現(xiàn)。本次論文主要研究的內(nèi)容主要包括：（1）對此次畢業(yè)設計進行了詳盡的需求分析。（2）概要的設計了網(wǎng)站的功能模塊，分析了本網(wǎng)站的設計特點。（3）詳細的介紹了該平臺要實現(xiàn)的功能，構(gòu)建了電子書網(wǎng)站。通過本次網(wǎng)站的制作，在期間發(fā)現(xiàn)了不少問題。例如，網(wǎng)站 logo 的制作。需要重新熟悉 Photoshop 軟件的應用；本網(wǎng)站沒有用到 Flash 動畫的設計，只是做到了前臺的操

30、作，影響了網(wǎng)頁整體的美感；在對網(wǎng)站結(jié)構(gòu)劃分過程中出現(xiàn)了大量的更改最初計劃，浪費了不少時間。但在制作網(wǎng)站期間，同時也收獲了不少。鞏固了 Dreamweaver 軟件、Photoshop 軟件、CSS+DIV、HTML 等各項技術(shù)。增強了自己動手的能力，培養(yǎng)了創(chuàng)新能力和審美觀念。規(guī)劃一個網(wǎng)站的整體結(jié)構(gòu)并沒有想象的那么輕松。首先要考慮到網(wǎng)站整體分為幾個部分，為了是網(wǎng)站布局合理，特意參考了網(wǎng)上熱門的幾大網(wǎng)站。經(jīng)過深思熟慮后才確定了網(wǎng)站的基本輪廓。網(wǎng)站的布局確定下來后，再設計網(wǎng)頁的基本框架和顏色搭配。最初的想法是顏色鮮明對比，對瀏覽者有一定的視覺沖擊，但后來經(jīng)過考慮，把原來的方案改成了風格統(tǒng)一，顏色不超

31、過 5 種。因為顏色過多，會因為自己技術(shù)不過關對瀏覽者造成視覺疲勞、眼花繚亂。雖然制作這個網(wǎng)站運用了大量的時間，也遇到了很多的問題，不過通過這次畢業(yè)設計的制作，讓我收獲到了很多。不僅熟悉了各項技術(shù)，還鍛煉了我的耐心。我不會忘記自己艱苦奮斗的這段時間。雖然疲憊，但也總算沒有白費?？吹阶约旱某晒驳玫搅诵┰S的欣慰。大連東軟信息學院畢業(yè)設計（論文）17參考文獻1 袁磊, 陳偉衛(wèi).網(wǎng)頁設計與制作教程M，北京：清華大學出版社，2008.10. （參考了第 9 頁到第 40 頁，第 167 到 254 頁）2 曾順.精通 CSS+DIV 網(wǎng)頁樣式與布局M.北京: 人民郵政出版社,2007.（參考了第 80

32、 頁到第 123 頁） 3 李燁. 別具光芒 CSS+DIV 網(wǎng)頁布局與美化M.北京:機械工業(yè)出版社,2005.（參考了第 23 頁到第 56 頁）4 希亞,霍爾茨施萊格,陳黎夫CSS 禪意花園 The zen of CSS designM北京：人民郵電出版社，2002.3.（參考了第 5 頁到第 26 頁，第 60 到 129 頁）5 邁耶（美）.CSS 權(quán)威指南M.北京：中國電力出版社.2008.（參考了第 46 頁到第 52 頁）6 Elizabeth Castro （美）. HTML, XHTML, and CSS, Sixth Edition . Peachpit Press . 2

33、007.（參考了第 34 頁到第 69 頁）7 前沿科技曾順編著.精通 JavaScript + jQueryM北京:人民郵電出版社,2008.9.（參考了第 15 頁到第 98 頁）8 譚振林.超越 CSS：Web 設計藝術(shù)的精髓.北京：人民教育出版社,2008.1.（參考了第 78 頁到第 105 頁）9 胡崧.flash 中文版標準教程 CS4M.北京：中國青年出版社，2010.2.（參考了第 28 頁）10 李超編譯.CSS 網(wǎng)站布局實錄M.北京：北京科學出版社,2007.10（參考了第 35 頁到第 78 頁） 。大連東軟信息學院畢業(yè)設計（論文）18致 謝在整個畢業(yè)設計的各個階段我都得到了陳偉衛(wèi)老師、崔艷清老師的悉心指導和耐心幫助。導師具有淵博的專業(yè)知識、嚴謹?shù)闹螌W態(tài)度，精益求精的工作作風。很慶幸這三年來我遇到了如此多的良師益友，無論在學習上、生活上，還是工作上，都給予了我無私的幫助和熱心的照顧，讓我在一個充滿溫馨的高尚師德，嚴于律己、寬以待人的崇高風范中成長，樸實無華、平易近人的人格魅力對本人影響深遠。不僅使本人樹立了遠大的學習目標、掌握了基本的研究方法，還使本人明白了許多為人處事的道理。本次論文從選題到完成