第一篇：網頁設計與應用畢業論文
目 錄
第一章 前言??????????????????????????????2 1.1 課題來源 ???????????????????????????? 2 1.2 網站開發項目需求分析??????????????????????? 2 1.3 軟件??????????????????????????????? 3 1.4 軟件運行環境第二章 網站制作????????????????????3 第二章網絡制作????????????????????????????3 2.1做網頁的步驟 ??????????????????????????? 3 2.2 做網頁的要素????????????????????????????4 2.2.1網頁的整體布局設計????????????????????????4 2.2.2 網頁設計中色彩的運用???????????????????????4 2.2.3 網頁形式與內容相統一 ?????????????????????? 4 2.3 系統各模塊功能實現?????????????????????????4 2.3.1 系統登錄模塊 ??????????????????????????4 2.3.2 車輛展示模塊 ?????????????????????????? 5 2.3.3 賬號管理模塊???????????????????????????5 第三章 網站的設計??????????????????????????? 5 3.1 主頁的要求?????????????????????????????5 3.2 子頁的要求?????????????????????????????5 3.3 網頁設計技巧????????????????????????????5 3.3.1 框架的使用????????????????????????????5 3.3.2 CSS 樣式的使用??????????????????????????6 第四章 網站的應用??????????????????????????? 6 4.1 網頁分為靜態網頁和動態網頁?????????????????????6 4.2 我的認識??????????????????????????????6 結束語 ???????????????????????????????? 7 參考文獻????????????????????????????????7
—1—
網頁設計與應用
摘 要 ：汽車網站是一個結合了汽車銷售等多功能瀏覽的汽車網站，我所使用的軟件是
Macromedia 公 司 推 出 的 一 款 用 于 網 頁 設 計 的 軟 件 — —
dreamweaver8。在網頁的制作與鏈接中，我學到了很多，然后補充一些比較熱門的技巧。網站具有快捷。無距離更新的特性，同時提供進入日常業務處理平臺的“入口”，具有較強的實用價值。這樣的網站被廣大消費者普遍使用，隨著現在網絡的普及和高效性的不斷提高，它的展示作用和實用性已經使它的應用地位越來越高，越來越廣泛。本文對網站設計作了介紹，進行了需求分析、模塊劃分、框架和 CSS 的介紹。由于制作經驗不足，作品和論文中存在問題之處，請老師指導完善。
關鍵詞： 超鏈接，外觀，性能，框架，CSS 目 錄
第一章 前言 1、1 課題來源
隨著二十一世紀新興科技的飛速發展，如今的電子信息產業正在經受著一個巨大的挑戰，同時也面臨著一個重大的機遇。就目前的科技發展水平而言，電子信息產業的發展已經不能夠滿足社會化大生產的要求，因此，各個國家集中人力、財力加大對信息技術產業的投入，以適應目前需要?？上驳氖窃谶@幾十年的發展中我們有了互聯網。互聯網加大了我們了解世界的眼界，縮緊了人與人之間的距離，這就更容易的使我們走上信息化的道路。以往，人們出行都以自行車居多，后來公交事業發展壯大，人們便乘坐公交汽車，現如今，隨著人們生活水平的提高，越來越多的家庭已經擁有或者想擁有自己的私家車。正是因為人們的這些需求，越來越多的汽車網站出現在網絡上，使人們可以隨時了解自己想知道的汽車方面的新聞，真正的做到足不出戶，便知天下事。把汽車銷售與網絡連接起來，是今后汽車銷售發展的必然方向之一。
1．2 網站開發項目需求分析
一個網站項目的確立是建立在各種各樣的需求上面的，這種需求往往來自于客戶的實際需求或者是出于公司自身發展的需要，其中客戶的實際需求也就是說這種交易性質的需求占了絕大部分。面對對網站開發擁有不同知識層面的客戶，項目的負責人對用戶需求的理解程度，在很大程度上決定了此類網站開發項目的成敗。因此如何更好地的了解、分析、明確用戶需求，并且能夠準確、清晰以文檔的形式表達給參與項目開發的每個成員，保證開發過程按照滿足用戶需求為目的正確項目開發方向進行，是每個網站開發項目管理者需要面對的問題。據專家預計，2009 年我國汽車需求量將超過 850 萬輛。所以，做好汽車 —2—
網站就是為了使廣大的消費者提供及時和有效的信息，為其選擇適合自己的產品提供良好的參考。
1．3 使用軟件
dreamwraver 軟 件 由 美 國 著 名 的 網 站 應 用 開 發 工 具 生 產 廠 商 AdobeMacromedia 于 2005 年 6 月推出并正式投入市場以來，已經發展得相當成熟⑴。關于dreamwraver 的技術介紹的相關書籍與網絡信息相當豐富。通過大學中軟件開發環境課程的學習，對 dreamwraver 有了比較深刻的認識，并比較輕松的掌握了dreamwraver 的操作。因此，軟件技術可以完成任務的要求。
1．4 軟件運行環境
Dreamweaver 是一款簡體中文軟件，可以在 Win2003/WinXP 中安全運行⑵
第二章 網站制作
2．1 制做網頁的步驟
在做網頁之前，我確定了做網頁的五個步驟。
一、確定網站主題 ：網站主題就是要建立的網站所要包含的主要內容，一個網站必須要有一個明確的主題。
二、搜集材料 ：明確了網站的主題以后，你就要圍繞主題開始搜集材料了。材料既可以從圖書、報紙、光盤、多媒體上得來，也可以從互聯網上搜集，然后把搜集的材料去粗取精，去偽存真，作為自己制作網頁的素材。
三、規劃網站 ：一個網站設計得成功與否，很大程度上決定于設計者的規劃水平，規劃網站就像設計師設計大樓一樣，圖紙設計好了，才能建成一座漂亮的樓房。網站規劃包含的內容很多，如網站的結構、欄目的設置、網站的風格、顏色搭配、版面布局、文字圖片的運用等，你只有在制作網頁之前把這些方面都考慮到了，才能在制作時駕輕就熟，胸有成竹。也只有如此制作出來的網頁才能有個性、有特色，具有吸引力。
四、選擇合適的制作工具 ：盡管選擇什么樣的工具并不會影響你設計網頁的好壞，但是一款功能強大、使用簡單的軟件往往可以起到事半功倍的效果。
五、制作網頁 ：材料有了，工具也選好了，下面就需要按照規劃一步步地把自己的想法變成現實了，這是一個復雜而細致的過程，一定要按照先大后小、先簡單后復雜來進行制作。所謂先大后小，就是說在制作網頁時，先把大的結構設計好，然后再逐步完善小的結構設計。所謂先簡單后復雜，就是先設計出簡單的內容，然后再設計復雜的內容，以便出
①知新文化.HTML 完全手冊與速查辭典[M].北京：科學出版社，第49頁，2007.② 楊選輝，網頁設計與制作教程[M].北京：清華大學出版社，第321頁，2009.—3—
現問題時好修改。在制作網頁時要多靈活運用模板，這樣可以大大提高制作效率。此外，整體設計完成后我們還要將網頁上傳測試，使其和其他版本瀏覽器能夠兼容，再者對網站推廣宣傳，及時的維護更新。
2.2 制作網頁的要素
2.2.1 網頁的整體布局設計
網頁設計作為一種視覺語言，要講究編排和布局，雖然主頁的設計不等同于平面設計，但它們有許多相近之處，應充分加以利用和借鑒。⑴版式設計通過文字圖形的空間組合，表達出和諧與美。一個優秀的網頁設計者也應該知道哪一段文字圖形該落于何處，才能使整個網頁生輝。多頁面站點頁面的編排設計要求把頁面之間的有機聯系反映出來，特別要處理好頁面之間和頁面內的秩序與內容的關系。尤其是我們在利用網頁效果體現在線營銷的意圖時，更要注意為了達到最佳的視覺表現效果，而講究整體布局的合理性，比如一家生產型的企業，它所提供產品的名稱、類別、型號、價格、功能介紹應怎樣編排才能使瀏覽者有一個流暢的視覺體驗，從而方便他對產品的了解，促成最后的購買。
2.2.2 網頁設計中色彩的運用
色彩是藝術表現的要素之一，在網頁設計中，根據和諧、均衡和重點突出的原則，將不同的色彩進行組合、搭配來構成美麗的頁面。⑵根據色彩對人們心理的影響，合理地加以運用，按照色彩的記憶性原則，一般暖色較冷色的記憶性更強一些。色彩還具有聯想與象征的特質，如紅色象征血、太陽；藍色象征大海、天空和水面等。所以如果我們在對一家出售冷食的商店進行虛擬店面的頁面設計時，應使用淡雅而沉靜的顏色，使人心理上感覺涼爽一些，增強人們的購買心理，使得在線營銷得到很好的實踐效果。另要注意的是網頁的顏色應用雖沒有限制，但不能毫無節制地運用多種顏色，一般情況下，先根據總體風格的要求定出一至二種主色調，在已經有了完備的 CIS（企業形象識別系統）的企業進行網頁設計時，更應該按照其中的 VI 進行色彩運用。在色彩的運用過程中，還應注意的一個問題是：由于國家和種族、宗教和信仰的不同，以及生活的地理位置、文化修養的差異等，不同的人群對色彩的喜惡程度有著很大的差異。如：兒童喜歡對比強烈、個性鮮明的純顏色；生活在草原上的人喜歡紅色；生活在鬧市中的人喜歡淡雅的顏色；生活在“沙漠”中的人喜歡綠色。⑶在設計中要考慮眾多因素。
2.2.3 網頁形式與內容相統一
要將豐富的意義和多樣的形式組織成統一的頁面結構，形式語言必須符合頁面的內容，體現內容的豐富含義。⑷運用對比與調和、對稱與平衡、節奏與韻律以及留白等手段，通過空間、文字、圖形之間的相互關系建立整體的均衡狀態，產生和諧的美感。如對稱原則在
①王誠君，劉振華，郭竑暉，《高中山.Dreamweaver 8 網頁設計應用教程[M]》.北京：清華大學出版社，第332頁，2007.②李光明，曹蕾，余輝.《中文Dreamweaver 8 網頁設計與實訓教程[M]》.北京：冶金工業出版社，第13頁，2006.③周德華，許銘霖.《新編網頁設計教程[M]》.北京：冶金工業出版社，第159頁，2006.—4—
頁面設計中，它的均衡有時會使頁面顯得呆板，但如果加入一些富有動感的文字、圖案，或采用夸張的手法來表現內容往往會達到比較好的效果。點、線、面作為視覺語言中的基本元素，要使用點、線、面的互相穿插、互相襯托、互相補充構成最佳的頁面效果。網頁設計中點、線、面的運用并不是孤立的，很多時候都需要將它們結合起來，表達完美的設計意境。
2．3 系統各模塊功能實現
2.3.1 系統登錄模塊
1、該功能模塊可以記錄客戶的郵箱地址，交易時還可以向客戶發送交易信息，到帳確認等等。
2、登陸后系統會調出客戶的記錄，按照交易量的不同客戶享受的折扣也不同，系統主界面
2.3.2 車輛展示模塊⑴
1、該功能模塊主要實現對車輛的展示。
2、該功能模塊圖片、文字介紹，360 度 flash 對各種車輛的展示。
2.3.3 賬號管理模塊⑵
1、掛失業務在正常工作中肯定會遇到掛失的業務，確定掛失后，數據庫會將該賬號掛起，等待客戶做進一步操作。
2、凍結業務，客戶對賬號有凍結的權利，在客戶沒有輸入解凍密碼之前，任何人都無法動用帳上的資金。
3、流水查詢客戶可以查詢曾經交易過的記錄。
4、客戶可以自行對其賬號密碼進行修改，網站管理人員也可以添加或刪除賬號。
第三章 網站的設計
3.1 主頁的要求
對于銷售業務系統要求運行的工作環境穩定，易于操作，界面美觀大方，對 于前臺展示界面要求系統便于維護，安全可靠，對于廣大客戶所要執行的操作 簡單易懂，遠程訪問速度較快，界面友好美觀，有基本的錯誤提醒功能，遠程 操作數據庫正確，要求和客戶有一定的互動性，在主頁上直觀的就可以查看瀏 覽者所想要了解的東西。
3.2 子頁的要求
后面的工作就是子頁的選擇與鏈接，子頁應該豐富多彩，內容充實，瀏覽 性強，比如說，想要銷售一輛汽車，應該有它的全部資料，包括外觀、內飾、性能指標、出產地、價
① 趙銘建，趙慧，喬孟麗，康梅娟.《網頁設計與制作[M].》東營：中國石油大學出版社，第66頁，2007.②趙祖蔭，王云翔，胡耀芳.《網頁設計與制作教程[M]》.北京：清華大學出版社，第187頁，2008.—5—
格等諸多方面，鑒于以上方面，我開始了子頁的選擇 與鏈接。3.3 網頁設計技巧
一張完美的主頁設計需要積累豐富的知識以及掌握大量的技巧。在這里從框架 和 CSS 樣式的運用兩方面來介紹網頁設計的技巧。⑴
3.3.1 框架的使用
FRAME（框架）是 Web 上經常會看到的頁面結構。框架的最常見用途就是導航⑵。一組框架通常包括一個含有導航條的框架和另一個要顯示主要內容頁面的框 架。使用框架具有以下優點：訪問者的瀏覽器不需要為每個頁面重新加載與導航相 關的圖形；每個框架都具有自己的滾動條如果內容太大，在窗口中顯示不下，因此訪問者可以獨立滾動這些框架。例如，當框架中的內容頁面較長時，如果 導航條位于不同的框架中，那么向下滾動到頁面底部的訪問者就不需要再滾動 回頂部來使用導航條。使用框架具有以下缺點：可能難以實現不同框架中各元素的精確圖形對齊；對 導航進行測試可能很耗時間。許多專業 Web 設計人員不喜歡使用框架，并且許多瀏覽 Web 的人也不喜歡框 架。在大多數情況下，這種反感是因為遇到了那些使用框架效果不佳或不必要 地使用框架的站點例如，每當訪問者單擊導航按鈕時就重新加載導航框架內 容的框架集。如果框架使用得法例如，在允許其他框架的內容發生更改的同 時，使一個框架中的導航控件保持靜態，則這些框架對于某些站點可能非常 有用。
3.3.2 CSS 樣式的使用
CSS 層疊 樣 式 表 是 一 種 制 作 網 頁 的 新 技 術 它 的 全 稱 是 級 聯 樣 式 表 即Cascading StyleSheets 的縮寫，又稱之為風格樣式表單。⑶CSS 是在網頁制作過程中普遍用到的技術。采用了 CSS 技術控制的網頁，設計者會更輕松、有效地對頁面的整體布局、顏色、字體、鏈接、背景以及同一頁面的不同部分、不同頁面的外觀和格式等效果實現更加精確地控制。
第四章 網頁的應用
4.1 網頁分為靜態網頁和動態網頁。
4.1.1 優點：
靜態網頁：1.靜態網頁的內容相對穩定，因此容易被搜索引擎檢索； 動態網頁：
1.動態網頁以數據庫技術為基礎，可以大大減少降低網站維護的工作量；
2.采用動態網頁技術的網站可以實現更多的功能，如用戶注冊、用戶登錄、在線調查、用戶管理、頂訂單管理等等
①]陳季.《 Flash 基礎與實例教程[M]》.北京：北京希望電子出版社，第88頁，2005.②丁海祥.《計算機平面設計實訓[M].》 北京：高等教育出版社，第54頁，2005.③曹雁青，楊聰.《 Photoshop 經典作品賞析[M].》北京：北京海洋智慧圖書有限公司，第35頁，2002.—6—
4.1.2 缺點： 靜態網頁：
1.靜態網頁沒有數據庫的支持，在網站能制作和維護方面工作量較大，因此 當網站信息量很大時完全依靠靜態網頁制作方式比較困難； 2.靜態網頁的交互性交叉，在功能方面有較大的限制。動態網頁：1.動態網頁中的“？”對搜索引擎檢索存在一定的問題，搜索引擎一般不可 能從一個網站的數據庫中訪問全部網頁，或者處于技術方面的考慮，搜索 蜘蛛不去抓取網址中“？”后面的內容，因此采用動態網頁的網站在進行 搜索引擎推廣時需要做一定的技術處理才能適應搜索引擎的要求。
4.2 我的認識
網頁應用很廣泛，當我們打開 IE 瀏覽器的時候，出現在屏幕上的就是一個網頁，隨著社會的進步，生活節奏地加快，各行各業都開始使用互聯網來宣傳自己的產品，或者進行其他的活動。網站設計離不開網頁，網頁像書中的章頁，由這些頁面構成了整個網站。不管是大企業還是小公司，都有自己的網站，當然網站是離不開網頁的。網頁中的信息可以給我們帶來很多幫助，可以用來學習或者做一些活動的參考。通過對這門課程的學習會收獲很多。
結束語
在系統的需求分析過程中，由于不熟悉，產生了很大的困難，通過與指導老師的探討與溝通，我漸漸地對系統有了一個大體的認識。雖然說在系統需求分析過程中花費了很多時間，但是我認為這是必要的也是必須的。這次畢業設計中我了解到了很多的知識，這對我今后的學習和生活都將會有很大的幫助。我明白了對于一個完整性的軟件設計流程的主要性，在整個網站設計過程中前期需求分析，可行性分析是非常重要的環節，可以說是軟件設計的核心，在過去我一直認為詳細設計編碼才是最重要的，因為再好的需求，編碼不成功，軟件就無法正常運行。鍛煉了自己發現問題，解決問題的能力。開發過程中遇到一些需求的變化，通過修改設計思路，避免在后期產生更大的錯誤。再詳細設計的每一步都有可能出錯，所以會進行非常多的調試工作，只要發現問題就調試解決，這樣不僅增強了信心，也很好的鍛煉了自己遇到問題不急不躁，耐心解決的能力。
參 考 文 獻
〈1〉《信息技術》江蘇科學技術出版社.〈2〉《網頁制作》人民郵電出版社.〈3〉 《dreamweaver8 參考手冊》2008 年版.，〈4〉柯林森、劉志忠，CSS 基礎教程，人民郵電出版社，2007.9.〈5〉蘇昱，樣式表中文手冊，幫助文檔。〈6〉韓國鋒、ASP 柯華坤，網站開發典型模塊與實例精講，電子工業出版社，2006.8.—7—
第二篇：網頁設計與應用
網頁設計與應用
專
業： 班
級： 學
號： 姓
名： 指導教師：
計算機網絡技術
20***031 蔡依婷 楊艷慈
邯鄲職業技術學院 2017年11月21日
摘要
網頁設計與應用
摘 要
本論文將對個人網頁設計與制作的方法、工具等展開研究和探討。在介紹網頁設計與制作語言的基礎上，著重使用JavaScript作為工具語言進行網頁設計與制作的實際操作，分別對基于對象的JavaScript語言、內部對象系統的使用及WEB頁面信息交互——窗口和框架進行詳細描述，并利用具體的實例進行驗證。
本論文主要章節如下，第一章：緒論，本章主要介紹網頁設計的相關知識。第二章：網頁設計語言概述，本章主要介紹網頁設計的語言——HTML，以及用于編輯HTML語言的軟件，為后續工作奠定基礎。第三章：基于對象的JavaScript語言，本章介紹了基于對象的JavaScript中常用內部對象屬性、方法的使用。第四章：內部對象系統的使用，本章主要介紹使用瀏覽器的內部對象系統，可實現與HTML文檔進行交互。第五章：WEB頁面信息的交互——窗體與框架，本章主要介紹實現網頁的動態交互，必須掌握有關窗體對象（Form）和框架對象（Frames）更為復雜的知識。
關鍵詞： 網頁制作；網頁設計；HTML；ASP
目 錄
1.1 網頁設計概述............................................................................................................................................4 1.2 網頁設計的要素........................................................................................................................................4 1.3 大作業目的和意義.....................................................................................................................................4
第二章 HTML網頁設計技術的應用...........................................6 2.1 HTML語言介紹........................................................................................................................................6 2.1.1 HTML語言的特點...............................................................................................................................6 2.1.2 HTML語言的編輯軟件.......................................................................................................................6
第三章 色彩在網頁中的應用..............................................7 3.1色彩在網頁中的應用...............................................................................................................................7 3.2主頁色彩的處理........................................................................................................................................7 3.3常用的配色方案........................................................................................................................................7
第四章 WEB頁面信息的交互——窗體與框架..................................8 4.1窗體基礎知識..............................................................................................................................................8 4.1.1窗體對象.................................................................................................................................................8 4.1.2 窗體對象的方法....................................................................................................................................9 4.2 窗體中的基本元素.....................................................................................................................................9 4.3窗體對象實例...........................................................................................................................................11 4.4 框架..........................................................................................................................................................13 4.5 框架的訪問...............................................................................................................................................14 4.6本章小結...................................................................................................................................................17 第五章 結 論...........................................................18 致 謝................................................................19 參考文獻................................................................20
緒論
第一章 緒論
隨著21世紀的到來，人們更深切地感受到計算機在生活和工作中的作用越來越重要，越來越來的職業需要具有計算機的應用技能。掌握計算機是職業的需要，更是事業發展的需要。網頁設計與制作是計算機能力的具體表現，本章主要介紹網頁設計的相關知識。
1.1 網頁設計概述
網站是企業向用戶和網民提供信息(包括產品和服務)的一種方式,是企業開展電子商務的基礎設施和信息平臺，離開網站（或者只是利用第三方網站）去談電子商務是不可能的。企業的網址被稱為“網絡商標”，也是企業無形資產的組成部分，而網站是INTERNET上宣傳和反映企業形象和文化的重要窗口。
1.2 網頁設計的要素
網頁設計的兩大要素是：整體風格和色彩搭配。
一、確定網站的整體風格
在這里，我提供給大家一些參考經驗：
1．將你的標志logo，盡可能的放在每個頁面上最突出的位置。2．突出你的標準色彩。
3．總結一句能反映貴站精髓的宣傳標語！
4．相同類型的圖像采用相同效果，比如說標題字都采用陰影效果，那么在網站中出現的所有標題字的陰影效果的設置應該是完全一致的！
二、網頁色彩的搭配
1．用一種色彩。這里是指先選定一種色彩，然后調整透明度或者飽和度，這樣的頁面看起來色彩統一，有層次感。
2．用兩種色彩。先選定一種色彩，然后選擇它的對比色。
3．用一個色系。簡單的說就是用一個感覺的色彩，例如淡藍，淡黃，淡綠；或者土黃，土灰，土藍。
1.3 大作業目的和意義
本大作業主要是對網頁設計與制作的語言基礎上進行探討，主要內容如下：通過已經做好的網頁，分析html網頁設計技術、XML技術、Java Applet技術和Javascript技術在網頁設計中的應用。
緒論 5
第二章
第二章 HTML網頁設計技術的應用
2.1 HTML語言介紹
HTML（HyperText Mark-up Language）即超文本標記語言或超文本鏈接標示語言，是目前網絡上應用最為廣泛的語言，也是構成網頁文檔的主要語言。
HTML文本是由HTML命令組成的描述性文本，HTML命令可以說明文字、圖形、動畫、聲音、表格、鏈接等。HTML的結構包括頭部（Head）、主體（Body）兩大部分，其中頭部描述瀏覽器所需的信息，而主體則包含所要說明的具體內容。
2.1.1 HTML語言的特點
HTML文檔制作不是很復雜，且功能強大，支持不同數據格式的文件鑲入，這也是WWW盛行的原因之一，HTML語言的特點如下：
1、簡易性，HTML版本升級采用超集方式，從而更加靈活方便。
2、可擴展性，HTML語言的廣泛應用帶來了加強功能，增加標識符等要求，HTML采取子類元素的方式，為系統擴展帶來保證。
3、平臺無關性。雖然PC機大行其道，但使用MAC等其他機器的大有人在，HTML可以使用在廣泛的平臺上，這也是WWW盛行的另一個原因。
2.1.2 HTML語言的編輯軟件
HTML的本質是文本，需要瀏覽器的解釋，HTML的編輯器大體可以分為三種：
1、基本編輯軟件，使用WINDOWS自帶的記事本或寫字版都可以編寫，當然，如果你用WPS來編寫，也可以。不過存盤時請使用.htm或.html作為擴展名，這樣瀏覽器就可以解釋執行了。
2、半所見即所得軟件，這種軟件能大大提高開發效率，它可以使你在很短的時間內做出Homepage，且可以學習HTML，這種類型的軟件主要有HOTDOG，還有國產的軟件網頁作坊。
3、所見即所得軟件，使用最廣泛的編輯器，完全可以一點不懂HTML的知識就可以做出網頁，這類軟件主要有Frontpage，DREAMWEAVER、Delphi、Eclipse、UltraEdit。
第三章 7 第三章 色彩在網頁中的應用
3.1色彩在網頁中的應用
色彩是藝術表現的要素之一。在網頁設計中，我們的設計師根據和諧、均衡和重點突出的原則，將不同的色彩進行組合．搭配來構成美麗的頁面。根據色彩對人們心理的影響，合理地加以運用。
先選定一種色彩，然后調整透明度或者飽和度，這樣的頁面看起來色彩統一，有層次感。簡單的說就是用一個感覺的色彩，例如淡藍，淡黃，淡綠；或者土黃，土灰，土藍。
在網頁配色中不要將所有顏色都用到，盡量控制在三至五種色彩以內。背景和前文的對比盡量要大以便突出主要文字內容。
3.2主頁色彩的處理
色彩是人的視覺最敏感的東西。主頁的色彩處理得好，可以錦上添花，達到事半功倍的效果。色彩總的應用原則應該是“總體協調，局部對比”，也就是：主頁的整體色彩效果應該是和諧的，只有局部的、小范圍的地方可以有一些強烈色彩的對比。在色彩的運用上，可以根據主頁內容的需要，分別采用不同的主色調。因為色彩具有象征性，例如：嫩綠色、翠綠色、金黃色、灰褐色就可以分別象征著春、夏、秋、冬。其次還有職業的標志色，例如：軍警的橄欖綠，醫療衛生的白色等。色彩還具有明顯的心理感覺，例如冷、暖的感覺，進、退的效果等。另外，色彩還有民族性，各個民族由于環境、文化、傳統等因素的影響，對于色彩的喜好也存在著較大的差異。充分運用色彩的這些特性，可以使我們的主頁具有深刻的藝術內涵，從而提升主頁的文化品位。
3.3常用的配色方案
1.暖色調。即紅色、橙色、黃色、赭色等色彩的搭配。這種色調的運用，可使主頁呈現溫馨、和煦、熱情的氛圍。
2.冷色調。即青色、綠色、紫色等色彩的搭配。這種色調的運用，可使主頁呈現寧靜、清涼、高雅的氛圍。
3.對比色調。即把色性完全相反的色彩搭配在同一個空間里。例如：紅與綠、黃與紫、橙與藍等。這種色彩的搭配，可以產生強烈的視覺效果，給人亮麗、鮮艷、喜慶的感覺。
第四章
最后，還要考慮主頁底色（背景色）的深、淺，這里借用攝影中的一個術語，就是“高調”和“低調”。底色淺的稱為高調；底色深的稱為低調。底色深，文字的顏色就要淺，以深色的背景襯托淺色的內容（文字或圖片）；反之，底色淡的，文字的顏色就要深些，以淺色的背景襯托深色的內容（文字或圖片）。這種深淺的變化在色彩學中稱為“明度變化”。當然，色彩的明度也不能變化太大，否則屏幕上的亮度反差太強，同樣也會使讀者的眼睛受不了。
第四章 WEB頁面信息的交互——窗體與框架
要實現網頁的動態交互，必須掌握有關窗體對象（Form）和框架對象（Frames）更為復雜的知識。
4.1窗體基礎知識
窗體對象可以使設計人員能用窗體中不同的元素與客戶機用戶相交互，而用不著在之前首先進行數據輸入，就可以實現動態改變Web文檔的行為。
4.1.1窗體對象
窗體（Form）：它構成了Web頁面的基本元素。通常一個Web頁面有一個窗體或幾個窗體，使用Forms[]數組來實現不同窗體的訪問。
在Forms[0]中共有三個基本元素，而Forms[1]中只有兩個元素。窗體對象最主要的功能就是能夠直接訪問HTML文檔中的窗體，它封裝了相關的HTML代碼：
4.1.2 窗體對象的方法窗體對象的方法只有一個--submit()方法，該方法主要功用就是實現窗體信息的提交。如提交Mytest窗體，則使用下列格式：
document.mytest.submit()4.2 窗體中的基本元素
窗體中的基本元素由按鈕、單選按鈕、復選按鈕、提交按鈕、重置按鈕、文本框等組成。
在JavaScript中要訪問這些基本元素，必須通過對應特定的窗體元素的數組下標或窗體元素名來實現。每一個元素主要是通過該元素的屬性或方法來引用。其引用的基本格式見下：
formName.elements[].methadName(窗體名.元素名或數組.方法)formName.elemaent[].propertyName(窗體名.元素名或數組.屬性)下面分別介紹：
（1）Text單行單列輸入元素
功能：對Text標識中的元素實施有效的控制?；緦傩裕?/p>
Name：設定提交信息時的信息名稱。對應于HTML文檔中的Name。Value：用以設定出現在窗口中對應HTML文檔中Value的信息。defaultvalue：包括Text元素的默認值 基本方法：
blur()：將當前焦點移到后臺。select()：加亮文字。主要事件：
onFocus：當Text獲得焦點時，產生該事件。OnBlur：從元素失去焦點時，產生該事件。Onselect：當文字被加亮顯示后，產生該文件。onchange：當Text元素值改變時，產生該文件。例：
...第四章
（2）textarea多行多列輸入元素
功能：實施對Textarea中的元素進行控制。基本屬性
name：設定提交信息時的信息名稱，對應HTML文檔Textarea的Name。Value：用以設定出現在窗口中對應HTML文檔中Value的信息。Default value：元素的默認值。方法：
blur()：將輸入焦點失去 select()：將文字加亮后 事件：
onBlur:當失去輸入焦點后產生該事件 onFocus:當輸入獲得焦點后，產生該文件 Onchange:當文字值改變時，產生該事件 Onselect:當文字加亮后，產生該文件（3）Select選擇元素
功能：實施對滾動選擇元素的控制。屬性：
name:設定提交信息時的信息名稱，對應文檔select中的name。Length:對應文檔select中的length options:組成多個選項的數組 selectIndex;該下標指明一個選項
select在中每一選項都含有以下屬性： Text:選項對應的文字
selected:指明當前選項是否被選中 Index:指明當前選項的位置 defaultselected:默認選項 事件：
OnBlur：當select選項失去焦點時，產生該文件。onFocas:當select獲得焦點時，產生該文件。Onchange:選項狀態改變后，產生該事件。（4）Button按鈕
功能：實施對Button按鈕的控制。屬性：
Name:設定提交信息時的信息名稱，對應文檔中button的Name。Value:用以設定出現在窗口中對應HTML文檔中Value的信息。方法：
click()該方法類似于一個按下的按鈕。事件：
onclick當單擊button按鈕時，產生該事件。例 ：
10第四章 11........4.3窗體對象實例
下面我們演示通過點擊一個按鈕（red）來改變窗口顏色，點擊“調用動態按鈕文檔”調用一個動態按鈕文檔。
test8_1.htm
調用動態按鈕文檔第三篇：網頁設計畢業論文
目錄
一、課題來源.....................................................3
（一）設計思想.................................................3
（二）網站主題.................................................3
二、網站需求分析.................................................3
（一）搜集材料.................................................3
（二）需求分析與規劃...........................................3 三 軟件介紹.....................................................4
（一）Adobe Photoshop..........................................4
（二）Dreamweaver CS6..........................................4(三)軟件運行環境..............................................4
四、網站整體設計.................................................5
（一）網頁的規劃...............................................5
（二）系統框架.................................................6
五、主頁介紹與網頁截圖...........................................6
（一）主頁面介紹...............................................6
（二）子頁面介紹...............................................7
六、總結與感想...................................................9
（一）本網站實現了形式與內容的統一.............................9
（二）本網站具有良好的互動性..................................10
（三）缺點與不足..............................................10 參考文獻........................................................11
/ 11
摘要
在網絡高速發展的今天，互聯網不僅深深的改變了人們的生活方式，更改變了人們的思維方式，雷軍用互聯網思維帶領小米科技走到了今天，馬云借助互聯網成就了他的商業帝國，而首屆世界互聯網大會在浙江烏鎮召開更加突出了互聯網的重要性。而網站作為互聯網的載體，只有優秀的網站才能使互聯網更好的為我們服務?；谶@一理念，我設計了自己的網站——田園采摘網。我利用所學習的內容自己動手設計本網站，制作過程中所使用的軟件是Macromedia 公司的Adobe Dreamweaver CS6 和photoshop。在整個網站的制作過程中，我盡力優化網頁的布局和排版，合理選擇內容，盡可能做到完美。
關鍵詞： Dreamweaver Photoshop 網站設計 田園采摘
/ 11
一、課題來源
（一）設計思想
用互聯網的思維思考問題、做事情，創建優秀網站，精品網站。
（二）網站主題
結合自己的實際情況，選定田園采摘園作為本網站的設計主題，用互聯網的思維經營采摘園。
二、網站需求分析
（一）搜集材料
明確了網頁的主題以后，就可以圍繞主題開始搜集材料了。材料既可以從圖書、報紙、光盤、多媒體上得來，也可以從互聯網上搜集，然后把搜集的材料去粗取精，去偽存真，作為自己制作網頁的素材。
（二）需求分析與規劃
一個完整的網頁是建立在各種各樣的需求上面的，這種需求往往來自于客戶的實際需求或者是出于公司自身發展的需要，其中客戶的實際需求也就是說這種交易性質的需求占了絕大部分。
面對網頁設計擁有不同知識層面的客戶，設計的負責人對用戶需求的理解程度，在很大程度上決定了此類網頁規劃的成敗。因此如何更好地的了解、分析、明確用戶需求，并且能夠準確、清晰以文檔的形式表達給參與項目開發的每個成員，保證開發過程按照滿足用戶需求為目的正確項目開發方向進行，是每個網頁規劃和網頁制作管理者需要面對的問題。據我們調查，當今 3 / 11
互聯網已經有成千上萬的采摘網。所以，這就要求我們的網站中要有突出和新穎的地方去吸引顧客，這樣我們才能在眾多的采摘園中占有一席之地并獲益。網頁設計中，運用photoshop等圖形圖像處理軟件，進行大量的圖片處理制作，給人以強烈的美感。并添加flash代碼等，給瀏覽者一種現代感。整個網頁由dreamweaver完成。
三 軟件介紹
（一）Adobe Photoshop Photoshop簡稱“PS”，是由Adobe Systems開發和發行的圖像處理軟件。Photoshop主要處理以像素所構成的數字圖像。使用其眾多的編修與繪圖工具，可以有效地進行圖片編輯工作。ps有很多功能，在圖像、圖形、文字、視頻、出版等各方面都有涉及。
（二）Dreamweaver CS6 dreamwraver軟件由美國著名的網站應用開發工具生產廠商Adobe Macromedia于2005年6月推出并正式投入市場以來，已經發展得相當成熟。關于dreamwraver的技術介紹的相關書籍與網絡信息相當豐富。通過大學中軟件開發環境課程的學習，對dreamwraver有了比較深刻的認識，并比較輕松的掌握了dreamwraver的操作。因此，軟件技術可以完成任務的要求。
(三)軟件運行環境
Dreamweaver是一款簡體中文軟件，可以在Win2003/WinXP/Win7/Win8中安全運行，換句話說，它可以在任何家用微機中運行。
/ 11
圖1.Dreamweaver CS6
四、網站整體設計
（一）網頁的規劃
一個網頁設計得成功與否，很大程度上決定于設計者的規劃水平，規劃網頁就像設計師設計大樓一樣，圖紙設計好了，才能建成一座漂亮的樓房。網頁規劃包含的內容很多，如網頁的結構、欄目的設置、網頁的風格、5 / 11
顏色搭配、版面布局、文字圖片的運用等，你只有在制作網頁之前把這些方面都考慮到了，才能在制作時駕輕就熟，胸有成竹。也只有如此制作出來的網頁才能有個性、有特色，具有吸引力。
（二）系統框架
采摘園首頁 采摘概況 最新動態 時令水果 活動影集 聯系我們 圖2.系統模塊框架圖
五、主頁介紹與網頁截圖
（一）主頁面介紹
首先是利用Dreamwear技術制作的網頁。上方框架是網站的圖片、網站名稱，點擊相關文字可以進入到相關的頁面上，下方包括五大個分類鏈接。
圖3.主頁
/ 11
（二）子頁面介紹
本網站總共包括五個子網頁，分別為：采摘概況、最新動態、時令水果、活動影集、在線聯系。
圖4.采摘概況
圖5.最新動態
/ 11
圖6.活動影集
圖7.時令水果
/ 11
圖8.聯系我們
六、總結與感想
（一）本網站實現了形式與內容的統一
要將豐富的意義和多樣的形式組織成統一的頁面結構，形式語言必須符合頁面的內容，體現內容的豐富含義。運用對比與調和、對稱與平衡、節奏與韻律以及留白等手段，通過空間、文字、圖形之間的相互關系建立整體的均衡狀態，產生和諧的美感。如對稱原則在頁面設計中，它的均衡有時會使頁面顯得呆板，但如果加入一些富有動感的文字、圖案，或采用夸張的手法來表現內容往往會達到比較好的效果。點、線、面作為視覺語言中的基本元素，要使用點、線、面的互相穿插、互相襯托、互相補充構成最佳的頁面效果。網頁設計中點、線、面的運用并不是孤立的，很多時候都需要將它們結合起來，表達完美的設計意境。
/ 11
（二）本網站具有良好的互動性
對于銷售業務頁面要求運行的工作環境穩定，易于操作，界面美觀大方，對于前臺展示界面要求系統便于維護，安全可靠，對于廣大客戶所要執行的操作簡單易懂，遠程訪問速度較快，界面友好美觀，有基本的錯誤提醒功能，遠程操作數據庫正確，要求和客戶有一定的互動性，在主頁上直觀的就可以查看瀏覽者所想要了解的東西。
（三）缺點與不足
就我個人而言，對網頁制作還缺少很多的理論與實際操作知識，曾經只是做一些簡單的個人主頁，僅此而已。對通過此次畢業設計，可以深入的學習，以提高自身的制作水平。下一步我將進一步完善和優化本網站，同時將推出適合移動端應用的網站，這樣可以進一步優化采摘網的布局。
/ 11
參考文獻
[1]鄧文淵.網頁制作高手[M].北京：人民郵電大學出版，2007，6 [2]李憲廣.網頁制作邊學邊用[M].北京：清華大學出版社，2009，3 [3]網頁設計入門[EB/OL].http://www.tmdps.cn/sale/view.asp?Article ID=288 [4]許凌云，柳勇良.網頁設計全方位學習[M].北京：清華大學出版社，2008，11 [5]陳琳.photoshop cs3 入門實戰與提高[M].北京：電子工業出版社，2008，11 [6]焦慧.網頁制作基礎與典型范例[M].北京：電子工業出版社，2008，7 [7]戎馬工作室.Dreamweaver 8與asp動態網站開發[M].北京：機械工業出版社，2006，5 [8]戴一波.Dreamweaver CS3網站制作炫例精講[M].北京：電子工業出版社，2008，1 [9]何秀芳.網頁制作與網站建設課堂實錄[M].北京：人民郵電出版社.2009，3 [10]孫連三.新編網頁制作與網站建設入門與提高[M].北京：人民郵電出版社.2008，9 [11]鄧文淵.網頁制作高手FLASH 8[M].北京：人民郵電出版社，2007，6 [12]胡崧.超夢幻勁爆網頁[M].中國青年出版社.2008，7 [13]Scot Johson etal.using Active Server Page[J].Que 2007 11 / 11
第四篇：網頁設計畢業論文
《網頁設計畢業論文》簡介：
前言隨著時代的發展，網站建設越來越接近于一門藝術而不僅僅是一項技術。網頁的藝術設計，日益被網站建設者 《網頁設計畢業論文》正文開始>> 前言
隨著時代的發展，網站建設越來越接近于一門藝術而不僅僅是一項技術。網頁的藝術設計，日益被網站建設者所注重。在目前國
內對此領域研究甚少的情況下，作者將網頁藝術設計與其他藝術設計形式進行比較，嘗試從網頁藝術設計的內容、原則和特點等
三個方面，對這個新的藝術設計領域進行初步的歸納總結和理論探討。作者認為網頁藝術設計是藝術與技術的高度統一，指出網
頁藝術設計包含視聽元素與版式設計兩項內容；以主題鮮明、形式與內容相統一、強調整體為設計原則；具有交互性與持續性、多維性、綜合性、版式的不可控性、藝術與技術結合的緊密性等五個特點。在明確了網頁藝術設計與網站主題的關系的基礎上，提出了“美”和“功能”都是為了更好地表達網站主題這一觀點。
網頁藝術設計是伴隨著計算機互聯網絡的產生而形成的視聽設計新課題，是網頁設計者以所處時代所能獲取的技術和藝術經驗為
基礎，依照設計目的和要求自覺地對網頁的構成元素進行藝術規劃的創造性思維活動，必然要成為設計藝術的重要組成部分，并
隨著網絡技術的發展而發展。表面上看，它不過是關于網頁版式編排的技巧與方法，而實際上，它不僅是一種技能，更是藝術與 技術的高度統一。
目錄：
一、網頁藝術設計的內容~~~~~~~~~~~~~~~~~~~~頁 1.視聽元素~~~~~~~~~~~~~~~~~~~~頁 2.版式設計~~~~~~~~~~~~~~~~~~~~頁
二、網頁藝術設計的原則 ~~~~~~~~~~~~~~~~~~頁 1.主題鮮明 ~~~~~~~~~~~~~~~~~~~~~~~~~~頁 2.形式與內容統一~~~~~~~~~~~~~~~~~~~~~頁 3.強調整體
三、網頁藝術設計的特點~~~~~~~~~~~~~~~~~~~~~
1.交互性與持續性~~~~~~~~~~~~~~~~~~~~~~~ 2.多維性 ~~~~~~~~~~~~~~~~~~~~~~~~~~~ 3.多種媒體的綜合性 ~~~~~~~~~~~~~~~~~~~~ 4.版式的不可控性~~~~~~~~~~~~~~~~~~~~~~ 5.技術與藝術結合的緊密性~~~~~~~~~~~~~~~~~
四、結 束 語~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
一、網頁藝術設計的內容
設計活動中包含著主觀和客觀兩方面的因素，在確立了網頁主題之后，首先要明確和熟悉設計的對象和構成的要素。網頁藝術設
計涉及的具體內容很多，可以概括為視聽元素和版式設計兩個方面。
1.視聽元素
這里所說的視聽元素，主要包括：文本、背景、按鈕、圖標、圖像、表格、顏色、導航工具、背景音樂、動態影像等。無論是文
字、圖形、動畫，還是音頻、視頻，網頁設計者所要考慮的是如何以感人的形式把它們放進頁面這個“大畫布”里。多媒體技術 的運用大大豐富了網頁藝術設計的表現力。
以上各視聽元素大多數瀏覽器本身都可以顯示或收聽，無需任何外部程序或模塊支持。比如，大部分瀏覽器都可以顯示GIF、JPE G圖形和GIF89a動畫。還有些多媒體文件（如MP3音樂）需要先下載到本地硬盤上，然后啟動相應的外部程序來播放。另外，在瀏
覽器使用插件（Plug-in）可以播放更多格式的多媒體文件。微軟推出IE瀏覽器后，提供了基于OLE的ActiveX技術，用來在網頁
中播放多媒體。目前ActiveX已經成為熱門技術。另一種播放多媒體的技術是JavaApplet。它是用Java語言編寫的應用于網頁之
中的小應用程序，相比于插件和ActiveX，JavaApplet具有更大的靈活性和良好的跨平臺能力，因此具有很好的發展前景?？傊夹g的不斷發展使多媒體元素在網頁藝術設計中的綜合運用越來越廣泛，使瀏覽者可以享受到更加完美的視聽效果。這些新技 術的出現，也對網頁的藝術設計提出了更高的要求。
2.版式設計
網頁的版式設計同報刊雜志等平面媒體的版式設計有很多共同之處，它在網頁的藝術設計中占據著重要的地位。所謂網頁的版式
設計，是在有限的屏幕空間上將視聽多媒體元素進行有機的排列組合，將理性思
維個性化的表現出來，是一種具有個人風格和藝
術特色的視聽傳達方式。它在傳達信息的同時，也產生感官上的美感和精神上的享受。
但網頁的排版與書籍雜志的排版又有很多差異。印刷品都有固定的規格尺寸，網頁則不然，它的尺寸是由讀者來控制的。這使網
頁設計者不能精確控制頁面上每個元素的尺寸和位置。而且，網頁的組織結構不像印刷品那樣為線性組合，這給網頁的版式設計 帶來了一定的難度。
二、網頁藝術設計的原則
網頁作為傳播信息的一種載體，同其他出版物如報紙、雜志等在設計上有許多共同之處，也要遵循一些設計的基本原則。但是，由于表現形式、運行方式和社會功能的不同，網頁設計又有其自身的特殊規律。網頁的藝術設計，是技術與藝術的結合，內容與
形式的統一。它要求設計者必須掌握以下三個主要原則：
1.主題鮮明
視覺設計表達的是一定的意圖和要求，有明確的主題，并按照視覺心理規律和形式將主題主動地傳達給觀賞者。訴求的目的，是使主題在適當的環境里被人們即時地理解和接受，以滿足人們的實用和需求，這就要求視覺設計不但要單純、簡練、清晰
和精確，而且在強調藝術性的同時，更應該注重通過獨特的風格和強烈的視覺沖擊力，來鮮明地突出設計主題。
根據認知心理學的理論，大多數人在短期記憶中只能同時把握４到７條分立的信息，而對多于７條的分立信息或者不分立的信息
容易產生記憶上的模糊或遺忘，概括起來就是：較小而分立的信息要比較長而不分立的信息更為有效和容易瀏覽。這個規律蘊含
在人們尋找信息和使用信息的實踐活動中，它要求視覺設計者的設計活動必須自覺地掌握和遵從。
作為視覺設計范疇一種的網頁藝術設計，其最終目的是達到最佳的主題訴求效果。這種效果的取得，一方面通過對網頁主題思想
運用邏輯規律進行條理性處理，使之符合瀏覽者獲取信息的心理需求和邏輯方式，讓瀏覽者快速地理解和吸收；另一方面通過對
網頁構成元素運用藝術的形式美法則進行條理性處理，更好地營造符合設計目的的視覺環境，突出主題，增強瀏覽者對網頁的注
意力，增進對網頁內容的理解。只有兩個方面有機地統一，才能實現最佳的主題訴求效果。
優秀的網頁設計必然服務于網站的主題，就是說，什么樣的網站，應該有什么樣的設計。例如，設計類的個人站點與商業站點性
質不同，目的也不同，所以評論的標準也不同。網頁藝術設計與網站主題的關系應該是這樣：首先，設計是為主題服務的；其次，設計是藝術和技術結合的產物，就是說，即要“美”，又要實現“功能”；最后，“美”和“功能”都是為了更好地表達主題
。當然，有些情況下，“功能”即是“主題”，還有些情況下，“美”即是主題。例如，雅虎作為一個搜索引擎，首先要實現
“搜索”的“功能”。它的主題即是它的“功能”。而一個個人網站，可以只體現作者的設計思想，或者僅僅以設計出“美”的 網頁為目的。它的主題只有一個，就是——美。
只注重主題思想的條理性而忽視網頁構成元素空間關系的形式美組合，或者只重視網頁形式上的條理而淡化主題思想的邏輯，都
將削弱網頁主題的最佳訴求效果，難以吸引瀏覽者的注意力，出現平庸的網頁設計或使網頁設計以失敗而告終。
要使網頁從形式上獲得良好的誘導力，鮮明地突出訴求主題，具體可以通過對網頁的空間層次、主從關系、視覺秩序及彼此間的 邏輯性的把握運用來達到。
2.形式與內容統一
任何設計都有一定的內容和形式。內容是構成設計的一切內在要素的總和，是設計存在的基礎，被稱為“設計的靈魂”；形式
是構成內容諸要素的內部結構或內容的外部表現方式。設計的內容就是指它的主題、形象、題材等要素的總和，形式就是它的
結構、風格或設計語言等表現方式。內容決定形式，形式反作用于內容。一個優秀的設計必定是形式對內容的完美表現。正如
黑格爾所說：“工藝的美就不在于要求實用品的外部造型、色彩、紋樣去摹擬事物，再現現實，而在于使其外部形式傳達和表
現出一定的情緒、氣氛、格調、風尚、趣味，使物質經由象征變成相似于精神生活的有關環境?！保ê诟駹枴睹缹W》第三卷）
一方面，網頁設計所追求的形式美，必須適合主題的需要，這是網頁設計的前提。只講花哨的表現形式以及過于強調“獨特的
設計風格”而脫離內容，或者只求內容而缺乏藝術的表現，網頁設計都會變的空洞而無力。設計者只有將二者有機地統一起來，深入領會主題的精髓，再融合自己的思想感情，找到一個完美的表現形式，才能體現出網頁設計獨具的分量和特有的價值。另
一方面，要確保網頁上的每一個元素都有存在的必要性，不要為了炫耀而使用冗余的技術。那樣得到的效果可能會適得其反。
只有通過認真設計和充分的考慮來實現全面的功能并體現美感才能實現形式與內容的統一。
據有關資料所做的保守估計，目前在WWW上網頁數據傳輸平均以每秒1.5k的速度到達客戶端。假設某個網頁為了豐富其藝術性而
追趕時髦地大量使用圖像或其它多媒體元素等，雖然達到了其靜態形式美的效果，卻造成多達幾十K甚至更大的網頁數據，使瀏
覽者必須等待很長時間才能看到“廬山真面目”，這樣的網頁就不是一個優秀的網頁，因為它不符合網頁傳播信息的突出特性之
一——快捷性，使網頁內容不能很快地到達訪問者，影響了訪問效果和質量，損害了訪問者的情趣和積極性，這種技術要素影響 了傳達信息的效果，因而不是形式與內容的完美統一。
網頁具有多屏、分頁、嵌套等特性，設計者可以對其進行形式上的適當變化以達到多變性處理效果，豐富整個網頁的形式美。這
就要求設計者在注意單個頁面形式與內容統一的同時，更不能忽視同一主題下多個分頁面組成的整體網頁的形式與整體內容的統一。
因此，在網頁設計中必須注意形式與內容的高度統一。
3.強調整體
網頁的整體性包括內容和形式上的整體性，這里主要討論設計形式上的整體性。
網頁是傳播信息的載體，它要表達的是一定的內容、主題和意念，在適當的時間和空間環境里為人們所理解和接受，它以滿足
人們的實用和需求為目標。設計時強調其整體性，可以使瀏覽者更快捷、更準確、更全面地認識它、掌握它，并給人一種內部
有機聯系、外部和諧完整的美感。整體性也是體現一個站點獨特風格的重要手段之一。
網頁的結構形式是由各種視聽要素組成的。在設計網頁時，強調頁面各組成部分的共性因素或者使諸部分共同含有某種形式特
征，是求得整體的常用方法。這主要從版式、色彩、風格等方面入手。例如：在
版式上，將頁面中各視覺要素作通盤考慮，以
周密的組織和精確的定位來獲得頁面的秩序感，即使運用“散”的結構，也是經過深思熟慮之后的決定；一個站點通常只使用
兩到三種標準色，并注意色彩搭配的和諧；對于分屏的長頁面，不可設計完第一屏再考慮下一屏。同樣，整個網頁內部的頁面，都應統一規劃，統一風格，讓瀏覽者體會到設計者完整的設計思想。
從某種意義上講，強調網頁結構形式的視覺整體性必然會犧牲靈活的多變性，“物極必反”就是這個道理。因此，在強調網頁
整體性設計的同時必須注意：過于強調整體性可能會使網頁呆板、沉悶，以致影響訪問者的情趣和繼續瀏覽的欲望。“整體” 是“多變”基礎上的整體。
三、網頁藝術設計的特點
1.交互性與持續性
網頁不同于傳統媒體之處，就在于信息的動態更新和即時交互性。即時的交互性是Web成為熱點的主要原因，也是網頁設計時
必須考慮的問題。傳統媒體（如廣播、電視節目、報刊雜志等）都以線性方式提供信息，即按照信息提供者的感覺、體驗和事
先確定的格式來傳播。而在Web環境下，人們不再是一個傳統媒體方式的被動接受者，而是以一個主動參與者的身份加入到信息 的加工處理和發布之中。這種持續的交互，使網頁藝術設計不像印刷品設計那樣，發表之后就意味著設計的結束。網頁設計人
員必須根據網站各個階段的經營目標，配合網站不同時期的經營策略，以及用戶的反饋信息，經常地對網頁進行調整和修改。
例如，為了保持瀏覽者對網站的新鮮感，很多大型網站總是定期或不定期的進行改版，這就需要設計者在保持網站視覺形象一 貫性的基礎上，不斷創作出新的網頁設計作品。
2.多維性
多維性源于超級鏈接，主要體現在網頁設計中對導航的設計上。由于超級鏈接的出現，網頁的組織結構更加豐富，瀏覽者可以
在各種主題之間自由跳轉，從而打破了以前人們接收信息的線性方式。例如，可將頁面的組織結構分為序列結構、層次結構、網狀結構、復合結構等。但頁面之間的關系過于復雜，不僅使瀏覽者檢索和查找信息增加了難度，也給設計者帶來了更大的困
難。為了讓瀏覽者在網頁上迅速找到所需的信息，設計者必須考慮快捷而完善的導航設計。
印刷品中導航問題不是那么突出，如果一個句子在頁尾突然終止，讀者會很自然地翻到下一頁查找剩余部分，為了幫助讀者找
到他們要找的信息，出版者提供了目錄、索引或腳注。如果文章從期刊中的一頁跳到后面的非順序頁時，讀者會看到類似于
“續68頁”這樣的指引語句。然而，作為一名網頁設計者，你以前所學的導航技術沒有一種完全適合于網頁導航。在替瀏覽者
考慮得很周到的網頁中，導航提供了足夠的、不同角度的鏈接，幫助讀者在網頁的各個部分之間跳轉，并告知瀏覽者現在所在 的位置、當前頁面和其他頁面之間的關系等。而且，每頁都有一個返回主頁的按鈕或鏈接，如果頁面是按層次結構組織的，通
常還有一個返回上級頁面的鏈接。對于網頁設計者來說，面對的不是按順序排列的印刷頁面，而是自由分散的網頁，因此必須
考慮更多的問題。如：怎樣構建合理的頁面組織結構，讓瀏覽者對你提供的巨量信息感到條理？怎樣建立包括站點索引、幫助
頁面、查詢功能在內的導航系統？這一切從哪兒開始，到哪兒結束？
3.多種媒體的綜合性
目前網頁中使用的多媒體視聽元素主要有文字、圖像、聲音、視頻等，隨著網絡帶寬的增加、芯片處理速度的提高以及跨平
臺的多媒體文件格式的推廣，必將促使設計者綜合運用多種媒體元素來設計網頁，以滿足和豐富瀏覽者對網絡信息傳輸質量
提出的更高要求。目前國內網頁已經出現了模擬三維的操作界面，在數據壓縮技術的改進和流（Stream）技術的推動下，Internet網上出現實時的音頻和視頻服務，典型的有在線音樂、在線廣播、網上電影、網上直播等。因此，多種媒體的綜合
運用是網頁藝術設計的特點之一，是未來的發展方向。
4.版式的不可控性
網頁版式設計與傳統印刷版式設計有著極大的差異：
(1)印刷品設計者可以指定使用的紙張和油墨，而網頁設計者卻不能要求瀏覽者使用什么樣的電腦或瀏覽器；
(2)網絡正處于不斷發展之中，不象印刷那樣基本具備了成熟的印刷標準；
(3)網頁設計過程中有關Web的每一件事都可能隨時發生變化。
這一切說明，網絡應用尚處在發展之中，關于網絡應用也很難在各個方面都制訂出統一的標準，這必然導致網頁版式設 計的不可控制性。其具體表現為：
(1)網頁頁面會根據當前瀏覽器窗口大小自動格式化輸出；
(2)網頁的瀏覽者可以控制網頁頁面在瀏覽器中的顯示方式；
(3)不同種類、版本的瀏覽器觀察同一個網頁頁面，效果會有所不同；
(4)用戶的瀏覽器工作環境不同，顯示效果也會有所不同。
把所有這些問題歸結為一點，即網頁設計者無法控制頁面在用戶端的最終顯示效果，但這也正是網頁設計的吸引人之處。
5.技術與藝術結合的緊密性
設計是主觀和客觀共同作用的結果，是在自由和不自由之間進行的，設計者不能超越自身已有經驗和所處環境提供 的客觀條件限制，優秀設計者正是在掌握客觀規律基礎上得到了完全的自由，一種想象和創造的自由。網絡技術主
要表現為客觀因素，藝術創意主要表現為主觀因素，網頁設計者應該積極主動地掌握現有的各種網絡技術規律，注
重技術和藝術緊密結合，這樣才能窮盡技術之長，實現藝術想象，滿足瀏覽者對網頁信息的高質量需求。
例如，瀏覽者欣賞一段音樂或電影，以前必須先將這段音樂或電影下載回本地機器，然后使用相應的程序來播放，由于音頻或視頻文件都比較大，需要較長的下載時間。流（Stream）技術出現以后，網頁設計者充分、巧妙地應
用此技術，讓瀏覽者在下載過程中就可以欣賞這段音樂或電影，實現了實時的網上視頻直播服務和在線欣賞音樂
服務，無疑增強了頁面傳播信息的表現力和感染力。
網絡技術與藝術創意的緊密結合，使網頁的藝術設計由平面設計擴展到立體設計，由純粹的視覺藝術擴展到空間
聽覺藝術，網頁效果不再近似于書籍或報刊雜志等印刷媒體，而更接近于電影或電視的觀賞效果。技術發展促進了
技術與藝術的緊密結合，把瀏覽者帶入一個真正現實中的虛擬世界。
四 結 束 語
網頁作為一種新的視覺表現形式，它的發展雖然沒有多長時間，它兼容了傳統平
面設計的特征，又具備其
所沒有的優勢，成為今后信息交流的一個非常有影響的途徑。網頁設計是一種綜合性的設計，它所涉及的范圍非常的廣泛，包括消費者心理學、視覺設計美學、人機工程、哲學等諸多方面，當然也離不開一定的科學技術發展。在本文中只從視
覺傳達的角度進行了一些闡述與分析。好的網頁設計除首先應考慮其內容上的精益求精外，其次就是對內容合理有效的視
覺編排。美是任何網頁所必需具備的基本因素，網頁信息不僅是為了滿足使用者的需求，更重要的是創造一種愉悅的視覺
環境，技術與藝術的緊密結合在網頁藝術設計中體現得尤為突出。參 考 文 獻
(1)謝依君.電子報的新聞介面分析(D).臺北：臺灣國立政治大學新聞學系，1999.(2)唐良瑞，蔡安妮，孫景鰲.從認知心理及人機界面談網頁設計(J).工程圖學學報，2000，(2)：31-36.(3)徐珂，苗彤，趙暉.網頁視覺與設計(M).北京：人民郵電出版社，2001.(4)李硯祖，蘆影.視覺傳達的歷史與美學(M).北京：中國人民大學出版社，2000.(5)何蘇六.網絡媒體的策劃與編輯(M).北京：北京廣播學院出版社，2001.
第五篇：靜態網頁設計與制作畢業論文
目 錄
摘 要……………………………………………………………………………………….0 第1章 緒論……………………………………………………………………………….1 1.1 INTERNET的歷史和發展…………………………………………………………….1 1.2 網頁概述................1
第2章 開發軟件簡介 6
2.1 Dreamweaver簡介 6
2.2 HTML語言的簡介 7
2.3 Flash 簡介 …………………………………………………………………… 8
2.4 Photoshop 簡介 ……………………………………………………………… 9 2.3 本章小結 14
第3章 網站需求分析 15
3.1相關術語及解釋 15
3.2個人網站的由來與發展 15
3.3我的個人網頁的設計與規劃 18
3.3.1 我的個人網頁的概貌……………………………………………………… 19
3.3.2 個人網頁的設計理念……………………………………………………… 20
3.4 本章小結 19
第4章 結論 20
致 謝 21
參考文獻 22
靜態網頁的設計與制作
摘 要
本文就網站的設計與制作，以軟件工程的方法對全過程進行了分析與研究，本文的主要工作集中在：
1.對web頁進行概述，主要是對internet的歷史和發展作了回顧，并對WEB頁的定義和特性進行闡述，并對網站設計過程中使用的工具和技術簡單的介紹.2.對網站建設中提及的術語進行簡單解釋，并對網站的由來和發展進行討論。
3.對自己設計的網站從設計理念到制作的過程進行詳細分析.4.使用Dreamweaver+Flash+photoshop 等軟件的設計方式進行解析
.5.就網站的設計與制作提出自己的觀點以及建議。
關鍵詞：網站 設計工具 設計方案 創意 風格
Static web design and production
Abstract
This website design and production, with the method of software engineering to process the analysis and research, this paper main work concentrates in:
1.The paper to web page is mainly to the Internet's history and development, and a review of the definition and characteristics of web pages is expounded, and the website design process using the tools and techniques of simple introduction.2.The website construction mentioned in terms of website, and simple explanation of the origin and development are discussed.3.For the design of your own website from design concept to making process were analyzed.4.Use Flash +Dreamweaver + photoshop software design methods are analyzed
5.Just website design and facture put forward its own views and Suggestions
第1章 緒論
隨著21世紀的到來，人們更深切地感受到計算機在生活和工作中的作用越來越重要，越來越多的職業需要具有計算機應用技能型人才。掌握計算機是職業的需要，更是事業發展的需要。網頁設計與制作是計算機能力的具體表現，本章主要介紹網頁設計的相關知識。
1.1Internet的歷史與發展
Internet最早來源于美國國防部高級研究計劃局DARPA(Defense advanced Research Projects Agency)的前身ARPA建立的ARPAnet，該網于1969年投入使用。從60年代開始，ARPA就開始向美國國內大學的計算機系和一些私人有限公司提供經費，以促進基于分組交換技術的計算機網絡的研究。1968年，ARPA為ARPAnet網絡項目立項，這個項目基于這樣一種主導思想：網絡必須能夠經受住故障 的考驗而維持正常工作，一旦發生戰爭，當網絡的某一部分因遭受攻擊而失去工作能力時，網絡的其它部分應當能夠維持正常通信。最初，ARPAnet主要用于 軍事研究目的，它有五大特點：
⑴支持資源共享；
⑵采用分布式控制技術；
⑶采用分組交換技術；
⑷使用通信控制處理機；
⑸采用分層的網絡通信協議。
點擊咨詢 