第一篇:flash網(wǎng)頁設計畢業(yè)(論文)
遼寧警察學院畢業(yè)設計(論文)
Flash網(wǎng)頁設計
系: 高職計算機系 專業(yè): 計算機應用技術 學生: 陶帥帥 指導教師:楊 虹
完成日期:2017年4月3日
遼寧警察學院畢業(yè)設計(論文)
Flash網(wǎng)頁設計
總計 畢業(yè)設計(論文)表格 0表 插圖 24幅
頁
摘 要
本論文主要論述了本人所做畢業(yè)設計課題《Flash網(wǎng)頁設計》的技術背景、設計理念、概要設計、詳細設計以及最后效果展示等方面內(nèi)容,詳細的介紹了本人對于設計簡單Flash網(wǎng)頁的一整套設計過程和相關技術難點的解決方法。
Flash設計網(wǎng)頁成為越來越多動漫愛好者和非動漫愛好者獲得信息和交流的平臺,它滿足了廣大用戶隨時隨地進行交流和溝通的需要,為網(wǎng)上用戶提供交流場所,實現(xiàn)高效動態(tài)信息交換,而網(wǎng)頁恰恰是由一個個小小的網(wǎng)頁集結而成,沒有網(wǎng)頁就沒有強大的網(wǎng)頁?,F(xiàn)在雖然有很多動漫網(wǎng)頁,但版面千篇一律,缺乏個性化、前瞻性,頁面設計混亂,不利于用戶查看,網(wǎng)頁的交互性比較差,因此我針對以上問題為動漫網(wǎng)頁設計一個個性化的動漫網(wǎng)頁。關鍵詞:動漫網(wǎng)頁,F(xiàn)lash
I
Abstract This paper mainly discusses the graduation design which I do the Anime Web Design Theme of technical background, design concept design, detailed design, summary and display effect etc, detailed introduces himself to design a simple Flash web design process and related technical difficulties in solving methods.Animation design website become more and more anime fans and the anime fans access to information and communication platform, it can meet the the needs of the masses of users communicate and communication anytime and anywhere, provide communication place for online users, efficient dynamic information exchange, and site is composed of little web pages gathering, no web, no powerful web site.Although there are a lot of DongManWang stand now, but the layout of the same, the lack of personalized, prospective, page design, unfavorable to the user to see, website interactivity is poorer, so I have to solve above problems as DongManWang station design a personalized anime web pages.Key words: Web Design;Flash;Flash web design
II
目錄
前 言..............................................................................................................................1 第1章 概述..................................................................................................................2
1.1 Flash軟件的介紹.........................................................................................2 1.1.1Flash的歷史.......................................................................................4 1.2 Flash軟件的特點.........................................................................................4 1.2.1普通網(wǎng)頁設計的特點.........................................................................4 1.2.2Flash網(wǎng)頁...........................................................................................5 第2章 網(wǎng)頁設計的開發(fā)工具與開發(fā)語言..................................................................7
2.1 網(wǎng)頁使用的開發(fā)工具.....................................................................................7 2.1.1Macromedia Flash 8.0 Pro..............................................................7 2.1.2Adobe Photoshop CS2........................................................................7 2.2 網(wǎng)頁開發(fā)語言.................................................................................................7 第3章 Flash網(wǎng)頁設計中的各種技術解析................................................................9
3.1 主頁界面設計解析.........................................................................................9 3.1.1Flash網(wǎng)頁加載時的進度條設計..........................................................9 3.1.2網(wǎng)頁LOGO與站點設計...................................................................10 3.1.3網(wǎng)頁導航條的設計.............................................................................10 3.1.4進入主頁界面前動態(tài)效果設計.........................................................12 3.1.5進入主頁時的音效設置.....................................................................13 3.2 “賞漫軟件”Flash子頁面設計......................................................................14 3.2.1“賞漫軟件”目錄的制作..................................................................14 3.2.2賞漫軟件的圖片文字介紹部分制作.................................................15 3.3 “精品動漫”Flash子頁面設計......................................................................15 3.4 “酷站導航”Flash子頁面設計......................................................................17 3.5 “酷炫漫畫”Flash子頁面設計......................................................................18 3.6 “關于作品”Flash子頁面設計......................................................................19 結論..............................................................................................................................20 致謝..............................................................................................................................21 參考文獻......................................................................................................................22 III
遼寧警察學院高職計算機畢業(yè)設計(論文)
前 言
世界因Internet的出現(xiàn)而在逐步改變,網(wǎng)絡經(jīng)濟雛形因此而形成,由于Internet具有信息容量大、方便迅速、形態(tài)多樣、覆蓋全球等特點,直至今日已發(fā)展成為信息傳播的主要載體,所以幾乎全球的各個企業(yè)、機構紛紛建立自己的web站點。Internet信息資源龐大、圖文互動、高速高效的特點給傳統(tǒng)設計媒體帶來了巨大的沖擊,再加上網(wǎng)絡經(jīng)濟對設計行業(yè)的影響,由此而產(chǎn)生了一個新的設計領域--網(wǎng)頁設計。
Flash產(chǎn)業(yè)作為我國發(fā)展中的產(chǎn)業(yè),網(wǎng)頁設計技術的發(fā)展推動了該產(chǎn)業(yè)的傳播,使得各類Flash網(wǎng)頁紛紛崛起,為廣大Flash愛好者帶來了諸多便利。
本課題設計的是一個以Flash設計為主題的網(wǎng)頁設計,以信息發(fā)布、分享為主要的。通過發(fā)布一些關于Flash的信息、圖片和Flash等為有同樣喜好的人們提供一個分享的空間。同時訪客用戶可以在網(wǎng)頁中的劇情交流上發(fā)表自己的看法以及可供共享的信息,使人們在獲取信息的同時,還可以發(fā)表自己的感受。在如今網(wǎng)絡高速發(fā)展的時代,發(fā)布信息與分享興趣已成為大多網(wǎng)頁設計的主要目的。
Flash網(wǎng)頁設計
第1章 概述
Flash網(wǎng)頁設計是指用用Flash軟件制作的網(wǎng)頁,網(wǎng)頁內(nèi)容多數(shù)甚至全部是Flash。全Flash網(wǎng)頁基本以圖形和Flash為主,所以比較適合做那些文字內(nèi)容不太多,以平面、Flash效果為主的應用。如:企業(yè)品牌推廣、特定網(wǎng)上廣告、網(wǎng)絡游戲、個性網(wǎng)頁等。
在因特網(wǎng)飛速發(fā)展的今天,多姿多彩的網(wǎng)絡頁面總是讓我們目不暇接,創(chuàng)建富有個性的個人主頁更是每一個網(wǎng)絡愛好者的夢想。作為一個優(yōu)秀的多媒體網(wǎng)頁設計平臺,F(xiàn)lash從眾多的網(wǎng)頁設計軟件中脫穎而出,成為大多數(shù)網(wǎng)絡愛好者設計網(wǎng)頁的首選工具。能夠為大多數(shù)人所認同的東西總有它的獨特之處,F(xiàn)lash正是以其獨特的魅力征服了網(wǎng)絡發(fā)燒友。
首先,F(xiàn)lash的一個很重要的特點是創(chuàng)建的文件體積很小,F(xiàn)lash是完全基于矢量的Flash處理技術,而矢量圖形就是用少量的向量數(shù)據(jù)來描述一個復雜的對象,存儲時只占很小的空間,而且圖像的質(zhì)量也很高。想必許多網(wǎng)友們也曾對自己掛在網(wǎng)上的一些Flash作品的體積擔心,那么,用Flash來創(chuàng)建網(wǎng)絡Flash作品也正是我們的首選。
其次,F(xiàn)lash使用的是插件的工作方式,用戶只要安裝一次插件,以后就可以快速啟動并觀看Flash,而不必像Java那樣,每次都要花費大量的時間啟動虛擬機。
再次,F(xiàn)lash動漫采用的是“流式”的Flash播放技術,用戶不必等到Flash下載完全再去欣賞,而是一邊下載一邊欣賞。
最后,F(xiàn)lash簡單易學,盡管它不能像一門高級語言一樣進行編程,但功能還是很廣泛的。使用內(nèi)置的ActionScript語句結合JavaScript,也可以制作出互動性很強的主頁來
1.1 Flash軟件的介紹
Flash是美國Macromedia公司所設計的一種二維矢量動畫軟件(現(xiàn)Adobe公司產(chǎn)品),用于設計和編輯Flash文檔,最新版本為:Animate CC 2015.5。Flash通常也指Macromedia Flash Player(現(xiàn)Adobe Flash Player),用于播放Flash文檔。
遼寧警察學院高職計算機畢業(yè)設計(論文)
檔案格式:
圖1-1影片檔
“swf ”這是一個完整的影片檔,無法被編輯。有時會被念做“swiff”。Swf在發(fā)布時可以選擇保護功能,如果沒有選擇,很容易被別人輸入到他的原始檔中使用。然而保護功能依然阻擋不了為數(shù)眾多的破解軟件,有不少閃客專門以此來學習別人的程序代碼和設計方式。
圖1-2原始檔
“fla ”是Flash的原始檔,只能用Macromedia Flash打開編輯或Adobe Flash CS3及更高版本打開編輯
Actionscript是一種程序語言的簡單文本文件.FLA檔案能夠直接包含Actionscript, 但是也可以把它存成AS檔做為外部連結檔案(如定義ActionScript類則必須在寫在as文件里,再通過import加入類),以方便共同工作和更進階的程序修改。
Flash 是一種創(chuàng)作工具,設計人員和開發(fā)人員可使用它來創(chuàng)建演示文稿、應用程序和其它允許用戶交互的內(nèi)容。Flash 可以包含簡單的Flash、視頻內(nèi)容、復雜演示文稿和應用程序以及介于它們之間的任何內(nèi)容。通常,使用 Flash 創(chuàng)作的各個內(nèi)容單元稱為應用程序,即使它們可能只是很簡單的Flash。您也可以通過添加圖片、聲音、視頻和特殊效果,構建包含豐富媒體的 Flash 應用程序。
Flash 特別適用于創(chuàng)建通過 Internet 提供的內(nèi)容,因為它的文件非常小。Flash 是通過廣泛使用矢量圖形做到這一點的。與位圖圖形相比,矢量圖形需要的內(nèi)存和存儲空間小很多,因為它們是以數(shù)學公式而不是大型數(shù)據(jù)集來表示的。位圖圖形之所以更大,是因為圖像中的每個像素都需要一組單獨的數(shù)據(jù)來表示。
Flash網(wǎng)頁設計
1.1.1Flash的歷史
Flash是由macromedia公司推出的交互式矢量圖和 Web 動畫的標準,由Adobe公司收購。做Flash動畫的人被稱之為閃客。網(wǎng)頁設計者使用 Flash 創(chuàng)作出既漂亮又可改變尺寸的導航界面以及其他奇特的效果。Flash的前身是Future Wave公司的Future Splash,是世界上第一個商用的二維矢量動畫軟件,用于設計和編輯Flash文檔。1996年11月,美國Macromedia公司收購了Future Wave,并將其改名為Flash。后又于2005年12月3日被Adobe公司收購。Flash通常也指Macromedia Flash Player(現(xiàn)Adobe Flash Player)。2012年8月15日,F(xiàn)lash退出Android平臺,正式告別移動端。2015年12月1日,Adobe將動畫制作軟件Flash professional CC2015升級并改名為Animate CC 2015.5。
Flash的過去無疑是異常輝煌的,然而它的現(xiàn)在和將來卻飽受非議。在移動互聯(lián)網(wǎng)和Html5的強烈沖擊之下,F(xiàn)lash在網(wǎng)頁方面的應用逐漸衰退,如今已經(jīng)很難再看到純正的Flash整站了。有人因此斷言Flash已經(jīng)成為一種“過時”的、“應被拋棄”的技術,更有人提出“Flash將死”的預言。然而,換一種客觀的眼光來看現(xiàn)實情形,就會發(fā)現(xiàn)Flash并未完全衰退,在網(wǎng)頁游戲、互動設計、媒體應用、教育課件等領域,仍然能夠看到Flash異常活躍的身影。在動畫效果的流暢性、互動設計的便捷性、代碼開發(fā)的簡易性、程序應用的廣泛性等方面,目前還沒有任何一款軟件能夠與Flash相比擬。因此,也有許多開發(fā)者認為Flash還“大有可為”。無論Flash的未來何去何從,在當下,它仍然是一門值得所有人認真學習的技術。特別是對于有志成為網(wǎng)頁設計師的學習者而言,F(xiàn)lash更是一門必修課。
1.2 Flash軟件的特點
1.2.1普通網(wǎng)頁設計的特點
網(wǎng)頁設計要注意的兩個要點:整體風格和色彩搭配。
1、確定網(wǎng)頁的整體風格
網(wǎng)頁的整體風格及其創(chuàng)意設計是最難以學習的。難就難在沒有一個固定的模式可以參照和模仿。給你一個主題,任何兩人都不可能設計出完全一樣的網(wǎng)頁。
風格(style)是抽象的。是指站點的整體形象給瀏覽者的綜合感受。這個“整體形象”包括站點的CI(標志、色彩、字體、標語)、版面布局、瀏覽方式、4
遼寧警察學院高職計算機畢業(yè)設計(論文)
交互性、文字、語氣、內(nèi)容價值、存在意義、站點榮譽等等諸多因素。舉個例子:我們覺得網(wǎng)易是平易近人的,迪斯尼是生動活潑的,IBM是專業(yè)嚴肅的。這些都是網(wǎng)頁給人們留下的不同感受。
在這里,我提供給大家一些參考經(jīng)驗:
(1)將你的標志logo,盡可能的放在每個頁面上最突出的位置。(2)突出你的標準色彩。
(3)總結一句能反映貴站精髓的宣傳標語!
(4)相同類型的圖像采用相同效果,比如說標題字都采用陰影效果,那么在網(wǎng)頁中出現(xiàn)的所有標題字的陰影效果的設置應該是完全一致的!
2、網(wǎng)頁色彩的搭配
無論是平面設計,還是網(wǎng)頁設計,色彩永遠是最重要的一環(huán)。當我們距離顯示屏較遠的時候,我們看到的不是優(yōu)美的版式或美麗的圖片,而是網(wǎng)頁的色彩。
關于色彩的原理有許多,在此我們不可能一一闡述,大家可以看看相關設計書籍,有利于系統(tǒng)地理解。在此我們僅僅想告訴大家一些網(wǎng)頁配色時的小技巧。
(1)用一種色彩。這里是指先選定一種色彩,然后調(diào)整透明度或者飽和度,這樣的頁面看起來色彩統(tǒng)一,有層次感。
(2)用兩種色彩。先選定一種色彩,然后選擇它的對比色。
(3)用一個色系。簡單的說就是用一個感覺的色彩,例如淡藍,淡黃,淡綠;或者土黃,土灰,土藍。
3、在網(wǎng)頁配色中,還要切記一些誤區(qū):
(1)不要將所有顏色都用到,盡量控制在三至五種色彩以內(nèi)。
(2)背景和前文的對比盡量要大(絕對不要用花紋繁復的圖案作背景),以便突出主要文字內(nèi)容。
1.2.2Flash網(wǎng)頁
Flash網(wǎng)頁具有設計精美,擁有更多聲效、Flash、流媒體剪輯、美術效果及兼顧互動性等特征,非常適合公司作在線產(chǎn)品展示。Flash網(wǎng)頁基本以圖形和Flash為主,所以比較適合做那些文字內(nèi)容不太多,以平面、Flash效果為主的應用。如:企業(yè)品牌推廣、特定網(wǎng)上廣告、網(wǎng)絡游戲、個性網(wǎng)頁等。
制作全Flash網(wǎng)頁和制作Html網(wǎng)頁類似,事先應先在紙上畫出結構關系圖,包括:網(wǎng)頁的主題、要用什么樣的元素、哪些元素需要重復使用、元素之間的聯(lián)系、元素如何運動、用什么風格的音樂、整個網(wǎng)頁可以分成幾個邏輯塊、各個邏輯塊間的聯(lián)系如何、以及你是否打算用Flash建構全站或是只用其做網(wǎng)頁的前期
Flash網(wǎng)頁設計
部分等等,都應在考慮范圍之內(nèi)。
實現(xiàn)全Flash網(wǎng)頁效果多種多樣,但基本原理是相同的:將主場景作為一個“舞臺”,這個舞臺提供標準的長寬比例和整個的版面結構,“演員”就是網(wǎng)頁子欄目的具體內(nèi)容,根據(jù)子欄目的內(nèi)容結構可能會再派生出更多的子欄目。主場景作為“舞臺”基礎,基本保持自身的內(nèi)容不變,其它“演員”身份的子類、次子類內(nèi)容根據(jù)需要被導入到主場景內(nèi)。
遼寧警察學院高職計算機畢業(yè)設計(論文)
第2章 網(wǎng)頁設計的開發(fā)工具與開發(fā)語言
2.1 網(wǎng)頁使用的開發(fā)工具
2.1.1Macromedia Flash 8.0 Pro Macromedia Flash 8.0 Pro相對于Macromedia Flash MX 2004增強了為移動設備開發(fā)的功能,方便創(chuàng)建Flash Web增強的網(wǎng)絡視頻。雖然有更高的版本,但是Macromedia Flash 8.0 Pro仍是現(xiàn)在最主流的Flash制作軟件,配合其內(nèi)置的ActionScript 2.0能夠完美實現(xiàn)網(wǎng)站設計中所需要的各種動態(tài)效果和交互效果,而我此次所做的Flash網(wǎng)站就是在Macromedia Flash 8.0 Pro的環(huán)境下制作。
新版本的Flash 8中引入了幾種高級技術:實時渲染濾鏡、運行時位圖緩沖、FlashType字體渲染引擎、自定義淡入淡出功能、改進的視頻播放組件、增強的文本工具、增強的描邊屬性、高級漸變控制。其中一種非常棒的技術是,Macromedia減輕了Flash Player 8的渲染工作,在Flash文件中使用標簽,F(xiàn)lash Player 8現(xiàn)在可以在用戶與Flash文件交互時實時渲染濾鏡。這意味著Macromedia已經(jīng)能夠合并內(nèi)建的濾鏡效果,象陰影、模糊、內(nèi)外發(fā)光、倒角、漸變倒角、顏色調(diào)整,以獲得更豐富的用戶體驗。這些濾鏡或可視效果能夠被應用到影片剪輯(MovieClips)和文本域,當在網(wǎng)頁中運行時,通過播放器渲染并顯現(xiàn)出來。2.1.2Adobe Photoshop CS2 作為Adobe公司出品的最出色的圖形圖像處理軟件,Photoshop以其強大的功能向我們證明著它的名至實歸。在falsh網(wǎng)頁設計時一些圖片素材如背景圖片、按鈕、LOGO等在載入Flash庫前有必要用Photoshop做適當?shù)奶幚?2.2 網(wǎng)頁開發(fā)語言
Html(Hyper Text Markup Language)即超文本標記語言或超文本鏈接標示語言,它是一種計算機程序語言,是目前網(wǎng)絡上應用最為廣泛的語言,也是構成網(wǎng)頁文檔的主要內(nèi)容。
Html文件是用ASCLL代碼編寫成的,可以保存為最簡單的TXT文本文件,F(xiàn)lash網(wǎng)頁設計
這樣用任何一個文字處理軟件都可以進行編寫,這也是他能夠迅速迅速普及,并十分受歡迎的一個原因。
遼寧警察學院高職計算機畢業(yè)設計(論文)
第3章 Flash網(wǎng)頁設計中的各種技術解析
3.1 主頁界面設計解析
3.1.1Flash網(wǎng)頁加載時的進度條設計
(1)新建Flash文檔index.fla,設置舞臺的大小為550*550像素,設置背景的顏色為#786e28。
(2)建立進度條設計主要是幫助觀察Flash網(wǎng)頁載入的進度,建立進度條設計樣式如圖3-1,時間軸上各層設計如圖3-2。
圖3-1進度條
圖3-2進度條在時間軸上各層
Actions:幀1代碼: total = _root.getBytesTotal();loaded = _root.getBytesLoaded();baifenshu = int((loaded/total)*100);baifenbi = baifenshu+“%”;setProperty(“jindutiao”, _xscale, baifenshu);Actions:幀2代碼:
Flash網(wǎng)頁設計
if(baifenshu == 100){
gotoAndPlay(4);} else { gotoAndPlay(1);} 3.1.2網(wǎng)頁LOGO與站點設計
網(wǎng)頁LOGO設計:
(1)新建圖形元件“元件42”。
(2)利用矩形工具建立一個白色矩形,在矩形正中建立一稍小些的背景色矩形形成白色矩形框。
(3)利用任意變形工具將白色矩形框變形成為白色平行四邊形框。用線條工具進行分割裁剪,旋轉變換得到要設計的網(wǎng)頁LOGO。(如圖3-3)
圖3-3 logo展示圖
3.1.3網(wǎng)頁導航條的設計
(1)新建圖形元件“元件22”(如圖3-4),作為導航條背景。
圖3-4導航條背景
遼寧警察學院高職計算機畢業(yè)設計(論文)
(2)建立6個圖形元件分別在各元件中設計各導航按鈕文字,字體樣式雅黑,字號12,顏色黑色,分別載入各影片剪輯做出動態(tài)效果,對應每個影片剪輯做一個與影片剪輯等大的按鈕,按鈕與影片剪輯放于不同層疊加在一起均勻排列與導航條上(如圖3-5)。
圖3-5導航按鈕
(3)給每個按鈕附加動作。(如圖3-6)
圖3-6按鈕b1動作目錄
代碼如下: 圖層4:幀1: stop();元件11: on(rollOver){ } on(press){
} 元件11: on(rollOut){
gotoAndPlay(1);
tellTarget(“/”){
}
loadMovieNum(“index101.swf”, 100);
gotoAndPlay(2);11
Flash網(wǎng)頁設計
} on(press){
} 圖層4:幀9: Stop(); 元件11: on(rollOut){ } on(press){
} 3.1.4進入主頁界面前動態(tài)效果設計
(1)新建圖形元件“元件29”,創(chuàng)建長條圖行,作為三個小窗口推薦酷站、本站作品、站內(nèi)更新的上框(如圖3-7)。建立三個圖形元件分別制作各個小窗口的名稱(如圖3-8)。
圖3-7小窗口的上框 圖3-8小窗口的名稱
tellTarget(“/”){
}
loadMovieNum(“index101.swf”, 100);
gotoAndPlay(1);
tellTarget(“/”){
}
loadMovieNum(“index101.swf”, 100);
(2)新建圖像元件,在其上創(chuàng)建與小窗口等大的白色和背景色的矩形色塊,在不同圖層中各小窗口的上框和窗體依次在時間軸上載入并做形狀補間Flash(如圖3-9)。
遼寧警察學院高職計算機畢業(yè)設計(論文)
圖3-9小窗口動態(tài)載入效果時間軸設置
(3)導航條、網(wǎng)頁頭尾的圖片條以相同方式在時間軸上依次載入并做形狀補間效果(如圖3-10),就可以完全載入主頁界面獲得完整的主頁框架界面。
圖3-10導航條、網(wǎng)頁頭尾的圖片動態(tài)載入效果時間軸設置
3.1.5進入主頁時的音效設置
(1)挑選合適的音效載入庫中。
(2)選擇適當?shù)囊粜砑拥綍r間軸上的適當位置(如圖3-11),使動態(tài)效果更具表現(xiàn)力。
圖3-11在時間軸上添加聲音效果
主頁框架界面到現(xiàn)在已經(jīng)基本上設計完成了,主頁框架界面為一個獨立的Flash文檔,發(fā)布之后形成index.swf文件。此外,我們還要針對各個導航卡設計其對應的swf文件,各swf文件之間通過as代碼連接形成一個整體,則構成了本Flash網(wǎng)頁的主體結構,再通過as代碼連接一些必要的網(wǎng)頁就構成了一個完整
Flash網(wǎng)頁設計
Flash網(wǎng)頁。以下幾章我將對各個導航卡所對應的.swf文件及它們所鏈接的網(wǎng)頁頁面的制作做進一步的詳細說明。
3.2 “賞漫軟件”Flash子頁面設計
3.2.1“賞漫軟件”目錄的制作
“賞漫軟件”子頁面載入效果和“迷你游戲”子頁面相仿不再贅述。賞漫軟件目錄的制作大體上與游戲目錄相仿,所不同的是不需要轉換和滑動,也就比游戲目錄要好做多,同時目錄中軟件按鈕的制作也和游戲目錄中按鈕一樣,再此不在贅述目錄和按鈕的制作方法。我們來看一下做好的目錄的大概形狀樣式(如圖3-12),用以上做目錄的經(jīng)驗可以輕松做好。
按鈕附加動作代碼: on(press){
} unloadMovieNum(3);loadMovieNum(“此處最好填所連接swf文件的相對位置”, 2);
圖3-12軟件目錄樣式
遼寧警察學院高職計算機畢業(yè)設計(論文)
3.2.2賞漫軟件的圖片文字介紹部分制作
該部分是以一個小的swf文件單獨存在的,在點擊軟件按鈕時會載入相應的swf文件在界面的適當位置。
接下來我們來做一下這個小swf文件,就那ACDSee圖片瀏覽軟件所對應的swf文件來說明吧。
(1)新建空白fla文件,命名.fla。將通過Photoshop設計好ACDSee軟件的圖片素材,載入到s2庫中。并生成影片剪輯。以影片剪輯動態(tài)效果實現(xiàn)是通過逐幀F(xiàn)lash方式完成的(如圖3-13至3-14)
圖3-13本影片剪輯動態(tài)效果的時間軸設置
圖3-14本影片剪輯動態(tài)效果
3.3 “精品動漫”Flash子頁面設計
“精品動漫”Flash子頁面是一個與前幾個子頁面略有不同的子頁面,頁面的設計風格與前幾個頁面有些許差異,不規(guī)則的背景使得頁面整體顯得翹起生動。(如圖3-15)子頁面載入動態(tài)效果及顯示出動漫按鈕前的動態(tài)效果在前面都有涉及不在贅述。
Flash網(wǎng)頁設計
圖3-15“精品動漫”Flash子頁面
(1)新建空白fla文件,命名為index003。將通過Photoshop設計好Flash按鈕圖片素材,大小50*50像素,載入到index003庫中。
(2)新建圖形元件,將圖片載入圖形元件中并在圖片上面覆蓋一層多半透明的與圖片等大的色塊。(如圖3-16)
圖3-16圖像上覆蓋了透明色塊的圖形元件
(3)將圖像元件做成按鈕,按鈕元件第一幀是將該圖形元件透明度略調(diào)高一些(如圖3-17),在第二三幀恢復正常(如圖3-18)。
遼寧警察學院高職計算機畢業(yè)設計(論文)
圖3-17按鈕第一幀
圖3-18按鈕第二三幀
(4)給每個按鈕附加動作代碼以連接到要播放的swf文件。代碼如下: on(press){
} tellTarget(“/”){ } loadMovieNum(“xinFlash9.swf”, 2);3.4 “酷站導航”Flash子頁面設計
目錄的制作、按鈕的制作、子頁面載入動態(tài)效果及顯示目錄時的動態(tài)效果等在前面都有涉及不在贅述。這里僅提供該子網(wǎng)頁設計好后的最后效果。(如圖3-19)
Flash網(wǎng)頁設計
圖3-19“酷站導航”子網(wǎng)頁設計好后的效果
其中各個網(wǎng)頁按鈕附加動作的代碼為: on(press){ } 其中對網(wǎng)頁的圖片展示和介紹部分同“賞漫軟件”子頁面中的小swf文件制作方法一致,可仿照其制作不再贅述。loadMovieNum(“需要讀取的swf文件的相對url地址”, 2);3.5 “酷炫漫畫”Flash子頁面設計
絕大部分和“賞漫軟件”子頁面中的設計保持一致,只是按鈕需要重新制作,右側的圖片展示部分也沒太多的改變,完全可以仿照其設計制作不再贅述。再次提供該子網(wǎng)頁設計好后的最后效果。(如圖3-20)
遼寧警察學院高職計算機畢業(yè)設計(論文)
圖3-20“酷炫漫畫”子網(wǎng)頁設計好后的效果
3.6 “關于作品”Flash子頁面設計
本網(wǎng)頁就只有一個文字面板,文字面板的設計和其他頁面中目錄的設計比較相似,都是先在圖形元件中設計好其輪廓和背景,再在時間軸上通過形狀、亮度、透明度改變進行形狀補間最終獲得文字面板(如圖3-21)。再次提供該子網(wǎng)頁設計好后的最后效果。(如圖3-22)
圖3-21文字面板設計在時間軸上的設置
圖3-22“關于作品”子網(wǎng)頁設計好后的效果
Flash網(wǎng)頁設計
結論
Flash網(wǎng)頁具有設計精美,擁有更多聲效、Flash、流媒體剪輯、美術效果及兼顧互動性等特征,非常適合公司作在線產(chǎn)品展示。Flash網(wǎng)頁基本以圖形和Flash為主,所以比較適合做那些文字內(nèi)容不太多,以平面、Flash效果為主的應用。如:企業(yè)品牌推廣、特定網(wǎng)上廣告、網(wǎng)絡游戲、個性網(wǎng)頁等。
制作全Flash網(wǎng)頁和制作Html網(wǎng)頁類似,事先應先在紙上畫出結構關系圖,包括:網(wǎng)頁的主題、要用什么樣的元素、哪些元素需要重復使用、元素之間的聯(lián)系、元素如何運動、用什么風格的音樂、整個網(wǎng)頁可以分成幾個邏輯塊、各個邏輯塊間的聯(lián)系如何、以及你是否打算用Flash建構全站或是只用其做網(wǎng)頁的前期部分等等,都應在考慮范圍之內(nèi)。
因為本人水平有限,雖然已從很多方面進行闡述和講解,但終究是不能十全十美的,理論與實際永遠是有距離的。希望能在今后的學習和工作中能不斷完善、進步!
遼寧警察學院高職計算機畢業(yè)設計(論文)
致謝
畢業(yè)設計完成之際,我由衷地感謝楊虹老師的大力幫助和支持,感謝我的同學和朋友,在我遇到各種各樣復雜問題的時候,給予我鼓勵和幫助,使我分析問題和解決問題能力有了很大提高
本論文是在楊虹老師的悉心指導下完成的。楊虹老師淵博的專業(yè)知識,誨人不倦的高尚師德,嚴以律己、寬以待人的崇高風范,樸實無華、平易近人的人格魅力對我影響深遠。不僅使我樹立了遠大的學術目標,還使我明白了許多待人接物與為人處世的道理。所有這一切都將成為我受益終生的寶貴財富!本論文從選題到完成,每一步都是在導師的指導下完成的,傾注了導師大量的心血。在此,我向導師表示崇高的敬意和由衷的感謝!我在研究思想方法上得到了啟發(fā),并且在工作中采用他們的部分研究成果與資料。盡管與他們?yōu)槲腋冻龅囊磺邢啾?,所有的語言都顯得蒼白無力,但我仍要真誠地說聲:謝謝!感謝三年來各位老師和同學對我學習、生活的關心和幫助。在論文即將完成之際,我的心情久久無法平靜,從開始進入課題到論文的順利完成,有多少可敬的師長、同學、朋友給予了我無言的幫助,在這里請接受我誠摯的謝意!
最后感謝我的母?!|寧警察學院三年來對我的栽培。畢業(yè)設計完成之際,我由衷地感謝論文指導老師的大力幫助和支持,感謝熱心的同學與朋友,在我遇到種各樣復雜問題的時候,給予我鼓勵和幫助。
Flash網(wǎng)頁設計
參考文獻
[1]向玫玫,林強,馬杰,薛雅娟,王亞冰,范文南.Flash設計(21世紀全國普通高等院校美術藝術設計專業(yè)十二五精品課程規(guī)劃教材),遼寧美術出版社,2014.04.[2]李錫澤,王喆.《Flash動畫網(wǎng)頁設計》,武漢大學出版社,2015年.[3]劉歡.《Flash ActionScript 3.0交互設計200例》,人民郵電出版社,2015.05.[4]劉斌.基于Flash的課件制作與應用[J],科技廣場,2012(7).P102-P103.[5]莫仲心.淺談Flash動畫在網(wǎng)頁設計中的應用[J].信息通信.2012(1).P135-P136.22
第二篇:網(wǎng)頁設計畢業(yè)論文
目錄
一、課題來源.....................................................3
(一)設計思想.................................................3
(二)網(wǎng)站主題.................................................3
二、網(wǎng)站需求分析.................................................3
(一)搜集材料.................................................3
(二)需求分析與規(guī)劃...........................................3 三 軟件介紹.....................................................4
(一)Adobe Photoshop..........................................4
(二)Dreamweaver CS6..........................................4(三)軟件運行環(huán)境..............................................4
四、網(wǎng)站整體設計.................................................5
(一)網(wǎng)頁的規(guī)劃...............................................5
(二)系統(tǒng)框架.................................................6
五、主頁介紹與網(wǎng)頁截圖...........................................6
(一)主頁面介紹...............................................6
(二)子頁面介紹...............................................7
六、總結與感想...................................................9
(一)本網(wǎng)站實現(xiàn)了形式與內(nèi)容的統(tǒng)一.............................9
(二)本網(wǎng)站具有良好的互動性..................................10
(三)缺點與不足..............................................10 參考文獻........................................................11
/ 11
摘要
在網(wǎng)絡高速發(fā)展的今天,互聯(lián)網(wǎng)不僅深深的改變了人們的生活方式,更改變了人們的思維方式,雷軍用互聯(lián)網(wǎng)思維帶領小米科技走到了今天,馬云借助互聯(lián)網(wǎng)成就了他的商業(yè)帝國,而首屆世界互聯(lián)網(wǎng)大會在浙江烏鎮(zhèn)召開更加突出了互聯(lián)網(wǎng)的重要性。而網(wǎng)站作為互聯(lián)網(wǎng)的載體,只有優(yōu)秀的網(wǎng)站才能使互聯(lián)網(wǎng)更好的為我們服務?;谶@一理念,我設計了自己的網(wǎng)站——田園采摘網(wǎng)。我利用所學習的內(nèi)容自己動手設計本網(wǎng)站,制作過程中所使用的軟件是Macromedia 公司的Adobe Dreamweaver CS6 和photoshop。在整個網(wǎng)站的制作過程中,我盡力優(yōu)化網(wǎng)頁的布局和排版,合理選擇內(nèi)容,盡可能做到完美。
關鍵詞: Dreamweaver Photoshop 網(wǎng)站設計 田園采摘
/ 11
一、課題來源
(一)設計思想
用互聯(lián)網(wǎng)的思維思考問題、做事情,創(chuàng)建優(yōu)秀網(wǎng)站,精品網(wǎng)站。
(二)網(wǎng)站主題
結合自己的實際情況,選定田園采摘園作為本網(wǎng)站的設計主題,用互聯(lián)網(wǎng)的思維經(jīng)營采摘園。
二、網(wǎng)站需求分析
(一)搜集材料
明確了網(wǎng)頁的主題以后,就可以圍繞主題開始搜集材料了。材料既可以從圖書、報紙、光盤、多媒體上得來,也可以從互聯(lián)網(wǎng)上搜集,然后把搜集的材料去粗取精,去偽存真,作為自己制作網(wǎng)頁的素材。
(二)需求分析與規(guī)劃
一個完整的網(wǎng)頁是建立在各種各樣的需求上面的,這種需求往往來自于客戶的實際需求或者是出于公司自身發(fā)展的需要,其中客戶的實際需求也就是說這種交易性質(zhì)的需求占了絕大部分。
面對網(wǎng)頁設計擁有不同知識層面的客戶,設計的負責人對用戶需求的理解程度,在很大程度上決定了此類網(wǎng)頁規(guī)劃的成敗。因此如何更好地的了解、分析、明確用戶需求,并且能夠準確、清晰以文檔的形式表達給參與項目開發(fā)的每個成員,保證開發(fā)過程按照滿足用戶需求為目的正確項目開發(fā)方向進行,是每個網(wǎng)頁規(guī)劃和網(wǎng)頁制作管理者需要面對的問題。據(jù)我們調(diào)查,當今 3 / 11
互聯(lián)網(wǎng)已經(jīng)有成千上萬的采摘網(wǎng)。所以,這就要求我們的網(wǎng)站中要有突出和新穎的地方去吸引顧客,這樣我們才能在眾多的采摘園中占有一席之地并獲益。網(wǎng)頁設計中,運用photoshop等圖形圖像處理軟件,進行大量的圖片處理制作,給人以強烈的美感。并添加flash代碼等,給瀏覽者一種現(xiàn)代感。整個網(wǎng)頁由dreamweaver完成。
三 軟件介紹
(一)Adobe Photoshop Photoshop簡稱“PS”,是由Adobe Systems開發(fā)和發(fā)行的圖像處理軟件。Photoshop主要處理以像素所構成的數(shù)字圖像。使用其眾多的編修與繪圖工具,可以有效地進行圖片編輯工作。ps有很多功能,在圖像、圖形、文字、視頻、出版等各方面都有涉及。
(二)Dreamweaver CS6 dreamwraver軟件由美國著名的網(wǎng)站應用開發(fā)工具生產(chǎn)廠商Adobe Macromedia于2005年6月推出并正式投入市場以來,已經(jīng)發(fā)展得相當成熟。關于dreamwraver的技術介紹的相關書籍與網(wǎng)絡信息相當豐富。通過大學中軟件開發(fā)環(huán)境課程的學習,對dreamwraver有了比較深刻的認識,并比較輕松的掌握了dreamwraver的操作。因此,軟件技術可以完成任務的要求。
(三)軟件運行環(huán)境
Dreamweaver是一款簡體中文軟件,可以在Win2003/WinXP/Win7/Win8中安全運行,換句話說,它可以在任何家用微機中運行。
/ 11
圖1.Dreamweaver CS6
四、網(wǎng)站整體設計
(一)網(wǎng)頁的規(guī)劃
一個網(wǎng)頁設計得成功與否,很大程度上決定于設計者的規(guī)劃水平,規(guī)劃網(wǎng)頁就像設計師設計大樓一樣,圖紙設計好了,才能建成一座漂亮的樓房。網(wǎng)頁規(guī)劃包含的內(nèi)容很多,如網(wǎng)頁的結構、欄目的設置、網(wǎng)頁的風格、5 / 11
顏色搭配、版面布局、文字圖片的運用等,你只有在制作網(wǎng)頁之前把這些方面都考慮到了,才能在制作時駕輕就熟,胸有成竹。也只有如此制作出來的網(wǎng)頁才能有個性、有特色,具有吸引力。
(二)系統(tǒng)框架
采摘園首頁 采摘概況 最新動態(tài) 時令水果 活動影集 聯(lián)系我們 圖2.系統(tǒng)模塊框架圖
五、主頁介紹與網(wǎng)頁截圖
(一)主頁面介紹
首先是利用Dreamwear技術制作的網(wǎng)頁。上方框架是網(wǎng)站的圖片、網(wǎng)站名稱,點擊相關文字可以進入到相關的頁面上,下方包括五大個分類鏈接。
圖3.主頁
/ 11
(二)子頁面介紹
本網(wǎng)站總共包括五個子網(wǎng)頁,分別為:采摘概況、最新動態(tài)、時令水果、活動影集、在線聯(lián)系。
圖4.采摘概況
圖5.最新動態(tài)
/ 11
圖6.活動影集
圖7.時令水果
/ 11
圖8.聯(lián)系我們
六、總結與感想
(一)本網(wǎng)站實現(xiàn)了形式與內(nèi)容的統(tǒng)一
要將豐富的意義和多樣的形式組織成統(tǒng)一的頁面結構,形式語言必須符合頁面的內(nèi)容,體現(xiàn)內(nèi)容的豐富含義。運用對比與調(diào)和、對稱與平衡、節(jié)奏與韻律以及留白等手段,通過空間、文字、圖形之間的相互關系建立整體的均衡狀態(tài),產(chǎn)生和諧的美感。如對稱原則在頁面設計中,它的均衡有時會使頁面顯得呆板,但如果加入一些富有動感的文字、圖案,或采用夸張的手法來表現(xiàn)內(nèi)容往往會達到比較好的效果。點、線、面作為視覺語言中的基本元素,要使用點、線、面的互相穿插、互相襯托、互相補充構成最佳的頁面效果。網(wǎng)頁設計中點、線、面的運用并不是孤立的,很多時候都需要將它們結合起來,表達完美的設計意境。
/ 11
(二)本網(wǎng)站具有良好的互動性
對于銷售業(yè)務頁面要求運行的工作環(huán)境穩(wěn)定,易于操作,界面美觀大方,對于前臺展示界面要求系統(tǒng)便于維護,安全可靠,對于廣大客戶所要執(zhí)行的操作簡單易懂,遠程訪問速度較快,界面友好美觀,有基本的錯誤提醒功能,遠程操作數(shù)據(jù)庫正確,要求和客戶有一定的互動性,在主頁上直觀的就可以查看瀏覽者所想要了解的東西。
(三)缺點與不足
就我個人而言,對網(wǎng)頁制作還缺少很多的理論與實際操作知識,曾經(jīng)只是做一些簡單的個人主頁,僅此而已。對通過此次畢業(yè)設計,可以深入的學習,以提高自身的制作水平。下一步我將進一步完善和優(yōu)化本網(wǎng)站,同時將推出適合移動端應用的網(wǎng)站,這樣可以進一步優(yōu)化采摘網(wǎng)的布局。
/ 11
參考文獻
[1]鄧文淵.網(wǎng)頁制作高手[M].北京:人民郵電大學出版,2007,6 [2]李憲廣.網(wǎng)頁制作邊學邊用[M].北京:清華大學出版社,2009,3 [3]網(wǎng)頁設計入門[EB/OL].http://004km.cn/sale/view.asp?Article ID=288 [4]許凌云,柳勇良.網(wǎng)頁設計全方位學習[M].北京:清華大學出版社,2008,11 [5]陳琳.photoshop cs3 入門實戰(zhàn)與提高[M].北京:電子工業(yè)出版社,2008,11 [6]焦慧.網(wǎng)頁制作基礎與典型范例[M].北京:電子工業(yè)出版社,2008,7 [7]戎馬工作室.Dreamweaver 8與asp動態(tài)網(wǎng)站開發(fā)[M].北京:機械工業(yè)出版社,2006,5 [8]戴一波.Dreamweaver CS3網(wǎng)站制作炫例精講[M].北京:電子工業(yè)出版社,2008,1 [9]何秀芳.網(wǎng)頁制作與網(wǎng)站建設課堂實錄[M].北京:人民郵電出版社.2009,3 [10]孫連三.新編網(wǎng)頁制作與網(wǎng)站建設入門與提高[M].北京:人民郵電出版社.2008,9 [11]鄧文淵.網(wǎng)頁制作高手FLASH 8[M].北京:人民郵電出版社,2007,6 [12]胡崧.超夢幻勁爆網(wǎng)頁[M].中國青年出版社.2008,7 [13]Scot Johson etal.using Active Server Page[J].Que 2007 11 / 11
第三篇:網(wǎng)頁設計畢業(yè)論文
《網(wǎng)頁設計畢業(yè)論文》簡介:
前言隨著時代的發(fā)展,網(wǎng)站建設越來越接近于一門藝術而不僅僅是一項技術。網(wǎng)頁的藝術設計,日益被網(wǎng)站建設者 《網(wǎng)頁設計畢業(yè)論文》正文開始>> 前言
隨著時代的發(fā)展,網(wǎng)站建設越來越接近于一門藝術而不僅僅是一項技術。網(wǎng)頁的藝術設計,日益被網(wǎng)站建設者所注重。在目前國
內(nèi)對此領域研究甚少的情況下,作者將網(wǎng)頁藝術設計與其他藝術設計形式進行比較,嘗試從網(wǎng)頁藝術設計的內(nèi)容、原則和特點等
三個方面,對這個新的藝術設計領域進行初步的歸納總結和理論探討。作者認為網(wǎng)頁藝術設計是藝術與技術的高度統(tǒng)一,指出網(wǎng)
頁藝術設計包含視聽元素與版式設計兩項內(nèi)容;以主題鮮明、形式與內(nèi)容相統(tǒng)一、強調(diào)整體為設計原則;具有交互性與持續(xù)性、多維性、綜合性、版式的不可控性、藝術與技術結合的緊密性等五個特點。在明確了網(wǎng)頁藝術設計與網(wǎng)站主題的關系的基礎上,提出了“美”和“功能”都是為了更好地表達網(wǎng)站主題這一觀點。
網(wǎng)頁藝術設計是伴隨著計算機互聯(lián)網(wǎng)絡的產(chǎn)生而形成的視聽設計新課題,是網(wǎng)頁設計者以所處時代所能獲取的技術和藝術經(jīng)驗為
基礎,依照設計目的和要求自覺地對網(wǎng)頁的構成元素進行藝術規(guī)劃的創(chuàng)造性思維活動,必然要成為設計藝術的重要組成部分,并
隨著網(wǎng)絡技術的發(fā)展而發(fā)展。表面上看,它不過是關于網(wǎng)頁版式編排的技巧與方法,而實際上,它不僅是一種技能,更是藝術與 技術的高度統(tǒng)一。
目錄:
一、網(wǎng)頁藝術設計的內(nèi)容~~~~~~~~~~~~~~~~~~~~頁 1.視聽元素~~~~~~~~~~~~~~~~~~~~頁 2.版式設計~~~~~~~~~~~~~~~~~~~~頁
二、網(wǎng)頁藝術設計的原則 ~~~~~~~~~~~~~~~~~~頁 1.主題鮮明 ~~~~~~~~~~~~~~~~~~~~~~~~~~頁 2.形式與內(nèi)容統(tǒng)一~~~~~~~~~~~~~~~~~~~~~頁 3.強調(diào)整體
三、網(wǎng)頁藝術設計的特點~~~~~~~~~~~~~~~~~~~~~
1.交互性與持續(xù)性~~~~~~~~~~~~~~~~~~~~~~~ 2.多維性 ~~~~~~~~~~~~~~~~~~~~~~~~~~~ 3.多種媒體的綜合性 ~~~~~~~~~~~~~~~~~~~~ 4.版式的不可控性~~~~~~~~~~~~~~~~~~~~~~ 5.技術與藝術結合的緊密性~~~~~~~~~~~~~~~~~
四、結 束 語~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
一、網(wǎng)頁藝術設計的內(nèi)容
設計活動中包含著主觀和客觀兩方面的因素,在確立了網(wǎng)頁主題之后,首先要明確和熟悉設計的對象和構成的要素。網(wǎng)頁藝術設
計涉及的具體內(nèi)容很多,可以概括為視聽元素和版式設計兩個方面。
1.視聽元素
這里所說的視聽元素,主要包括:文本、背景、按鈕、圖標、圖像、表格、顏色、導航工具、背景音樂、動態(tài)影像等。無論是文
字、圖形、動畫,還是音頻、視頻,網(wǎng)頁設計者所要考慮的是如何以感人的形式把它們放進頁面這個“大畫布”里。多媒體技術 的運用大大豐富了網(wǎng)頁藝術設計的表現(xiàn)力。
以上各視聽元素大多數(shù)瀏覽器本身都可以顯示或收聽,無需任何外部程序或模塊支持。比如,大部分瀏覽器都可以顯示GIF、JPE G圖形和GIF89a動畫。還有些多媒體文件(如MP3音樂)需要先下載到本地硬盤上,然后啟動相應的外部程序來播放。另外,在瀏
覽器使用插件(Plug-in)可以播放更多格式的多媒體文件。微軟推出IE瀏覽器后,提供了基于OLE的ActiveX技術,用來在網(wǎng)頁
中播放多媒體。目前ActiveX已經(jīng)成為熱門技術。另一種播放多媒體的技術是JavaApplet。它是用Java語言編寫的應用于網(wǎng)頁之
中的小應用程序,相比于插件和ActiveX,JavaApplet具有更大的靈活性和良好的跨平臺能力,因此具有很好的發(fā)展前景??傊夹g的不斷發(fā)展使多媒體元素在網(wǎng)頁藝術設計中的綜合運用越來越廣泛,使瀏覽者可以享受到更加完美的視聽效果。這些新技 術的出現(xiàn),也對網(wǎng)頁的藝術設計提出了更高的要求。
2.版式設計
網(wǎng)頁的版式設計同報刊雜志等平面媒體的版式設計有很多共同之處,它在網(wǎng)頁的藝術設計中占據(jù)著重要的地位。所謂網(wǎng)頁的版式
設計,是在有限的屏幕空間上將視聽多媒體元素進行有機的排列組合,將理性思
維個性化的表現(xiàn)出來,是一種具有個人風格和藝
術特色的視聽傳達方式。它在傳達信息的同時,也產(chǎn)生感官上的美感和精神上的享受。
但網(wǎng)頁的排版與書籍雜志的排版又有很多差異。印刷品都有固定的規(guī)格尺寸,網(wǎng)頁則不然,它的尺寸是由讀者來控制的。這使網(wǎng)
頁設計者不能精確控制頁面上每個元素的尺寸和位置。而且,網(wǎng)頁的組織結構不像印刷品那樣為線性組合,這給網(wǎng)頁的版式設計 帶來了一定的難度。
二、網(wǎng)頁藝術設計的原則
網(wǎng)頁作為傳播信息的一種載體,同其他出版物如報紙、雜志等在設計上有許多共同之處,也要遵循一些設計的基本原則。但是,由于表現(xiàn)形式、運行方式和社會功能的不同,網(wǎng)頁設計又有其自身的特殊規(guī)律。網(wǎng)頁的藝術設計,是技術與藝術的結合,內(nèi)容與
形式的統(tǒng)一。它要求設計者必須掌握以下三個主要原則:
1.主題鮮明
視覺設計表達的是一定的意圖和要求,有明確的主題,并按照視覺心理規(guī)律和形式將主題主動地傳達給觀賞者。訴求的目的,是使主題在適當?shù)沫h(huán)境里被人們即時地理解和接受,以滿足人們的實用和需求,這就要求視覺設計不但要單純、簡練、清晰
和精確,而且在強調(diào)藝術性的同時,更應該注重通過獨特的風格和強烈的視覺沖擊力,來鮮明地突出設計主題。
根據(jù)認知心理學的理論,大多數(shù)人在短期記憶中只能同時把握4到7條分立的信息,而對多于7條的分立信息或者不分立的信息
容易產(chǎn)生記憶上的模糊或遺忘,概括起來就是:較小而分立的信息要比較長而不分立的信息更為有效和容易瀏覽。這個規(guī)律蘊含
在人們尋找信息和使用信息的實踐活動中,它要求視覺設計者的設計活動必須自覺地掌握和遵從。
作為視覺設計范疇一種的網(wǎng)頁藝術設計,其最終目的是達到最佳的主題訴求效果。這種效果的取得,一方面通過對網(wǎng)頁主題思想
運用邏輯規(guī)律進行條理性處理,使之符合瀏覽者獲取信息的心理需求和邏輯方式,讓瀏覽者快速地理解和吸收;另一方面通過對
網(wǎng)頁構成元素運用藝術的形式美法則進行條理性處理,更好地營造符合設計目的的視覺環(huán)境,突出主題,增強瀏覽者對網(wǎng)頁的注
意力,增進對網(wǎng)頁內(nèi)容的理解。只有兩個方面有機地統(tǒng)一,才能實現(xiàn)最佳的主題訴求效果。
優(yōu)秀的網(wǎng)頁設計必然服務于網(wǎng)站的主題,就是說,什么樣的網(wǎng)站,應該有什么樣的設計。例如,設計類的個人站點與商業(yè)站點性
質(zhì)不同,目的也不同,所以評論的標準也不同。網(wǎng)頁藝術設計與網(wǎng)站主題的關系應該是這樣:首先,設計是為主題服務的;其次,設計是藝術和技術結合的產(chǎn)物,就是說,即要“美”,又要實現(xiàn)“功能”;最后,“美”和“功能”都是為了更好地表達主題
。當然,有些情況下,“功能”即是“主題”,還有些情況下,“美”即是主題。例如,雅虎作為一個搜索引擎,首先要實現(xiàn)
“搜索”的“功能”。它的主題即是它的“功能”。而一個個人網(wǎng)站,可以只體現(xiàn)作者的設計思想,或者僅僅以設計出“美”的 網(wǎng)頁為目的。它的主題只有一個,就是——美。
只注重主題思想的條理性而忽視網(wǎng)頁構成元素空間關系的形式美組合,或者只重視網(wǎng)頁形式上的條理而淡化主題思想的邏輯,都
將削弱網(wǎng)頁主題的最佳訴求效果,難以吸引瀏覽者的注意力,出現(xiàn)平庸的網(wǎng)頁設計或使網(wǎng)頁設計以失敗而告終。
要使網(wǎng)頁從形式上獲得良好的誘導力,鮮明地突出訴求主題,具體可以通過對網(wǎng)頁的空間層次、主從關系、視覺秩序及彼此間的 邏輯性的把握運用來達到。
2.形式與內(nèi)容統(tǒng)一
任何設計都有一定的內(nèi)容和形式。內(nèi)容是構成設計的一切內(nèi)在要素的總和,是設計存在的基礎,被稱為“設計的靈魂”;形式
是構成內(nèi)容諸要素的內(nèi)部結構或內(nèi)容的外部表現(xiàn)方式。設計的內(nèi)容就是指它的主題、形象、題材等要素的總和,形式就是它的
結構、風格或設計語言等表現(xiàn)方式。內(nèi)容決定形式,形式反作用于內(nèi)容。一個優(yōu)秀的設計必定是形式對內(nèi)容的完美表現(xiàn)。正如
黑格爾所說:“工藝的美就不在于要求實用品的外部造型、色彩、紋樣去摹擬事物,再現(xiàn)現(xiàn)實,而在于使其外部形式傳達和表
現(xiàn)出一定的情緒、氣氛、格調(diào)、風尚、趣味,使物質(zhì)經(jīng)由象征變成相似于精神生活的有關環(huán)境?!保ê诟駹枴睹缹W》第三卷)
一方面,網(wǎng)頁設計所追求的形式美,必須適合主題的需要,這是網(wǎng)頁設計的前提。只講花哨的表現(xiàn)形式以及過于強調(diào)“獨特的
設計風格”而脫離內(nèi)容,或者只求內(nèi)容而缺乏藝術的表現(xiàn),網(wǎng)頁設計都會變的空洞而無力。設計者只有將二者有機地統(tǒng)一起來,深入領會主題的精髓,再融合自己的思想感情,找到一個完美的表現(xiàn)形式,才能體現(xiàn)出網(wǎng)頁設計獨具的分量和特有的價值。另
一方面,要確保網(wǎng)頁上的每一個元素都有存在的必要性,不要為了炫耀而使用冗余的技術。那樣得到的效果可能會適得其反。
只有通過認真設計和充分的考慮來實現(xiàn)全面的功能并體現(xiàn)美感才能實現(xiàn)形式與內(nèi)容的統(tǒng)一。
據(jù)有關資料所做的保守估計,目前在WWW上網(wǎng)頁數(shù)據(jù)傳輸平均以每秒1.5k的速度到達客戶端。假設某個網(wǎng)頁為了豐富其藝術性而
追趕時髦地大量使用圖像或其它多媒體元素等,雖然達到了其靜態(tài)形式美的效果,卻造成多達幾十K甚至更大的網(wǎng)頁數(shù)據(jù),使瀏
覽者必須等待很長時間才能看到“廬山真面目”,這樣的網(wǎng)頁就不是一個優(yōu)秀的網(wǎng)頁,因為它不符合網(wǎng)頁傳播信息的突出特性之
一——快捷性,使網(wǎng)頁內(nèi)容不能很快地到達訪問者,影響了訪問效果和質(zhì)量,損害了訪問者的情趣和積極性,這種技術要素影響 了傳達信息的效果,因而不是形式與內(nèi)容的完美統(tǒng)一。
網(wǎng)頁具有多屏、分頁、嵌套等特性,設計者可以對其進行形式上的適當變化以達到多變性處理效果,豐富整個網(wǎng)頁的形式美。這
就要求設計者在注意單個頁面形式與內(nèi)容統(tǒng)一的同時,更不能忽視同一主題下多個分頁面組成的整體網(wǎng)頁的形式與整體內(nèi)容的統(tǒng)一。
因此,在網(wǎng)頁設計中必須注意形式與內(nèi)容的高度統(tǒng)一。
3.強調(diào)整體
網(wǎng)頁的整體性包括內(nèi)容和形式上的整體性,這里主要討論設計形式上的整體性。
網(wǎng)頁是傳播信息的載體,它要表達的是一定的內(nèi)容、主題和意念,在適當?shù)臅r間和空間環(huán)境里為人們所理解和接受,它以滿足
人們的實用和需求為目標。設計時強調(diào)其整體性,可以使瀏覽者更快捷、更準確、更全面地認識它、掌握它,并給人一種內(nèi)部
有機聯(lián)系、外部和諧完整的美感。整體性也是體現(xiàn)一個站點獨特風格的重要手段之一。
網(wǎng)頁的結構形式是由各種視聽要素組成的。在設計網(wǎng)頁時,強調(diào)頁面各組成部分的共性因素或者使諸部分共同含有某種形式特
征,是求得整體的常用方法。這主要從版式、色彩、風格等方面入手。例如:在
版式上,將頁面中各視覺要素作通盤考慮,以
周密的組織和精確的定位來獲得頁面的秩序感,即使運用“散”的結構,也是經(jīng)過深思熟慮之后的決定;一個站點通常只使用
兩到三種標準色,并注意色彩搭配的和諧;對于分屏的長頁面,不可設計完第一屏再考慮下一屏。同樣,整個網(wǎng)頁內(nèi)部的頁面,都應統(tǒng)一規(guī)劃,統(tǒng)一風格,讓瀏覽者體會到設計者完整的設計思想。
從某種意義上講,強調(diào)網(wǎng)頁結構形式的視覺整體性必然會犧牲靈活的多變性,“物極必反”就是這個道理。因此,在強調(diào)網(wǎng)頁
整體性設計的同時必須注意:過于強調(diào)整體性可能會使網(wǎng)頁呆板、沉悶,以致影響訪問者的情趣和繼續(xù)瀏覽的欲望?!罢w” 是“多變”基礎上的整體。
三、網(wǎng)頁藝術設計的特點
1.交互性與持續(xù)性
網(wǎng)頁不同于傳統(tǒng)媒體之處,就在于信息的動態(tài)更新和即時交互性。即時的交互性是Web成為熱點的主要原因,也是網(wǎng)頁設計時
必須考慮的問題。傳統(tǒng)媒體(如廣播、電視節(jié)目、報刊雜志等)都以線性方式提供信息,即按照信息提供者的感覺、體驗和事
先確定的格式來傳播。而在Web環(huán)境下,人們不再是一個傳統(tǒng)媒體方式的被動接受者,而是以一個主動參與者的身份加入到信息 的加工處理和發(fā)布之中。這種持續(xù)的交互,使網(wǎng)頁藝術設計不像印刷品設計那樣,發(fā)表之后就意味著設計的結束。網(wǎng)頁設計人
員必須根據(jù)網(wǎng)站各個階段的經(jīng)營目標,配合網(wǎng)站不同時期的經(jīng)營策略,以及用戶的反饋信息,經(jīng)常地對網(wǎng)頁進行調(diào)整和修改。
例如,為了保持瀏覽者對網(wǎng)站的新鮮感,很多大型網(wǎng)站總是定期或不定期的進行改版,這就需要設計者在保持網(wǎng)站視覺形象一 貫性的基礎上,不斷創(chuàng)作出新的網(wǎng)頁設計作品。
2.多維性
多維性源于超級鏈接,主要體現(xiàn)在網(wǎng)頁設計中對導航的設計上。由于超級鏈接的出現(xiàn),網(wǎng)頁的組織結構更加豐富,瀏覽者可以
在各種主題之間自由跳轉,從而打破了以前人們接收信息的線性方式。例如,可將頁面的組織結構分為序列結構、層次結構、網(wǎng)狀結構、復合結構等。但頁面之間的關系過于復雜,不僅使瀏覽者檢索和查找信息增加了難度,也給設計者帶來了更大的困
難。為了讓瀏覽者在網(wǎng)頁上迅速找到所需的信息,設計者必須考慮快捷而完善的導航設計。
印刷品中導航問題不是那么突出,如果一個句子在頁尾突然終止,讀者會很自然地翻到下一頁查找剩余部分,為了幫助讀者找
到他們要找的信息,出版者提供了目錄、索引或腳注。如果文章從期刊中的一頁跳到后面的非順序頁時,讀者會看到類似于
“續(xù)68頁”這樣的指引語句。然而,作為一名網(wǎng)頁設計者,你以前所學的導航技術沒有一種完全適合于網(wǎng)頁導航。在替瀏覽者
考慮得很周到的網(wǎng)頁中,導航提供了足夠的、不同角度的鏈接,幫助讀者在網(wǎng)頁的各個部分之間跳轉,并告知瀏覽者現(xiàn)在所在 的位置、當前頁面和其他頁面之間的關系等。而且,每頁都有一個返回主頁的按鈕或鏈接,如果頁面是按層次結構組織的,通
常還有一個返回上級頁面的鏈接。對于網(wǎng)頁設計者來說,面對的不是按順序排列的印刷頁面,而是自由分散的網(wǎng)頁,因此必須
考慮更多的問題。如:怎樣構建合理的頁面組織結構,讓瀏覽者對你提供的巨量信息感到條理?怎樣建立包括站點索引、幫助
頁面、查詢功能在內(nèi)的導航系統(tǒng)?這一切從哪兒開始,到哪兒結束?
3.多種媒體的綜合性
目前網(wǎng)頁中使用的多媒體視聽元素主要有文字、圖像、聲音、視頻等,隨著網(wǎng)絡帶寬的增加、芯片處理速度的提高以及跨平
臺的多媒體文件格式的推廣,必將促使設計者綜合運用多種媒體元素來設計網(wǎng)頁,以滿足和豐富瀏覽者對網(wǎng)絡信息傳輸質(zhì)量
提出的更高要求。目前國內(nèi)網(wǎng)頁已經(jīng)出現(xiàn)了模擬三維的操作界面,在數(shù)據(jù)壓縮技術的改進和流(Stream)技術的推動下,Internet網(wǎng)上出現(xiàn)實時的音頻和視頻服務,典型的有在線音樂、在線廣播、網(wǎng)上電影、網(wǎng)上直播等。因此,多種媒體的綜合
運用是網(wǎng)頁藝術設計的特點之一,是未來的發(fā)展方向。
4.版式的不可控性
網(wǎng)頁版式設計與傳統(tǒng)印刷版式設計有著極大的差異:
(1)印刷品設計者可以指定使用的紙張和油墨,而網(wǎng)頁設計者卻不能要求瀏覽者使用什么樣的電腦或瀏覽器;
(2)網(wǎng)絡正處于不斷發(fā)展之中,不象印刷那樣基本具備了成熟的印刷標準;
(3)網(wǎng)頁設計過程中有關Web的每一件事都可能隨時發(fā)生變化。
這一切說明,網(wǎng)絡應用尚處在發(fā)展之中,關于網(wǎng)絡應用也很難在各個方面都制訂出統(tǒng)一的標準,這必然導致網(wǎng)頁版式設 計的不可控制性。其具體表現(xiàn)為:
(1)網(wǎng)頁頁面會根據(jù)當前瀏覽器窗口大小自動格式化輸出;
(2)網(wǎng)頁的瀏覽者可以控制網(wǎng)頁頁面在瀏覽器中的顯示方式;
(3)不同種類、版本的瀏覽器觀察同一個網(wǎng)頁頁面,效果會有所不同;
(4)用戶的瀏覽器工作環(huán)境不同,顯示效果也會有所不同。
把所有這些問題歸結為一點,即網(wǎng)頁設計者無法控制頁面在用戶端的最終顯示效果,但這也正是網(wǎng)頁設計的吸引人之處。
5.技術與藝術結合的緊密性
設計是主觀和客觀共同作用的結果,是在自由和不自由之間進行的,設計者不能超越自身已有經(jīng)驗和所處環(huán)境提供 的客觀條件限制,優(yōu)秀設計者正是在掌握客觀規(guī)律基礎上得到了完全的自由,一種想象和創(chuàng)造的自由。網(wǎng)絡技術主
要表現(xiàn)為客觀因素,藝術創(chuàng)意主要表現(xiàn)為主觀因素,網(wǎng)頁設計者應該積極主動地掌握現(xiàn)有的各種網(wǎng)絡技術規(guī)律,注
重技術和藝術緊密結合,這樣才能窮盡技術之長,實現(xiàn)藝術想象,滿足瀏覽者對網(wǎng)頁信息的高質(zhì)量需求。
例如,瀏覽者欣賞一段音樂或電影,以前必須先將這段音樂或電影下載回本地機器,然后使用相應的程序來播放,由于音頻或視頻文件都比較大,需要較長的下載時間。流(Stream)技術出現(xiàn)以后,網(wǎng)頁設計者充分、巧妙地應
用此技術,讓瀏覽者在下載過程中就可以欣賞這段音樂或電影,實現(xiàn)了實時的網(wǎng)上視頻直播服務和在線欣賞音樂
服務,無疑增強了頁面?zhèn)鞑バ畔⒌谋憩F(xiàn)力和感染力。
網(wǎng)絡技術與藝術創(chuàng)意的緊密結合,使網(wǎng)頁的藝術設計由平面設計擴展到立體設計,由純粹的視覺藝術擴展到空間
聽覺藝術,網(wǎng)頁效果不再近似于書籍或報刊雜志等印刷媒體,而更接近于電影或電視的觀賞效果。技術發(fā)展促進了
技術與藝術的緊密結合,把瀏覽者帶入一個真正現(xiàn)實中的虛擬世界。
四 結 束 語
網(wǎng)頁作為一種新的視覺表現(xiàn)形式,它的發(fā)展雖然沒有多長時間,它兼容了傳統(tǒng)平
面設計的特征,又具備其
所沒有的優(yōu)勢,成為今后信息交流的一個非常有影響的途徑。網(wǎng)頁設計是一種綜合性的設計,它所涉及的范圍非常的廣泛,包括消費者心理學、視覺設計美學、人機工程、哲學等諸多方面,當然也離不開一定的科學技術發(fā)展。在本文中只從視
覺傳達的角度進行了一些闡述與分析。好的網(wǎng)頁設計除首先應考慮其內(nèi)容上的精益求精外,其次就是對內(nèi)容合理有效的視
覺編排。美是任何網(wǎng)頁所必需具備的基本因素,網(wǎng)頁信息不僅是為了滿足使用者的需求,更重要的是創(chuàng)造一種愉悅的視覺
環(huán)境,技術與藝術的緊密結合在網(wǎng)頁藝術設計中體現(xiàn)得尤為突出。參 考 文 獻
(1)謝依君.電子報的新聞介面分析(D).臺北:臺灣國立政治大學新聞學系,1999.(2)唐良瑞,蔡安妮,孫景鰲.從認知心理及人機界面談網(wǎng)頁設計(J).工程圖學學報,2000,(2):31-36.(3)徐珂,苗彤,趙暉.網(wǎng)頁視覺與設計(M).北京:人民郵電出版社,2001.(4)李硯祖,蘆影.視覺傳達的歷史與美學(M).北京:中國人民大學出版社,2000.(5)何蘇六.網(wǎng)絡媒體的策劃與編輯(M).北京:北京廣播學院出版社,2001.
第四篇:計算機網(wǎng)頁設計畢業(yè)論文(范文)
計算機網(wǎng)頁設計畢業(yè)論文
計算機網(wǎng)頁設計畢業(yè)論文
asp技術在交互式網(wǎng)頁設計中的運用
一、asp技術簡介
asp技術 asp(active server pages動態(tài)網(wǎng)頁)是微軟公司推出的一種用以取代cgi(common gateway interface通用網(wǎng)關接口)的技術。目前,internet上的許多基于windows平臺的web站點已開始應用asp來替換cgi。簡單地講,asp是一個位于服務器端的腳本運行環(huán)境,通過這種環(huán)境,用戶可以創(chuàng)建和運行動態(tài)的交互式web服務器應用程序,如交互式動態(tài)網(wǎng)頁,包括使用html表單收集和處理信息,上傳與下載等等。通常情況下,用戶通過瀏覽器看到的網(wǎng)頁大多是靜態(tài)的,目前internet 上的許多站點,仍然提供'靜態(tài)'(static)的主頁內(nèi)容。所謂'靜態(tài)',指的就是站點的主頁內(nèi)容是'固定不變'的。當瀏覽器通過internet 的http(hypertext transport protocol)協(xié)議,向站點服務器(web server)要求提供主頁的內(nèi)容時,站點服務器收到要求后,就傳送原已設計好的靜態(tài)的html 的文件數(shù)據(jù)給瀏覽器。一個'靜態(tài)'的站點,若要更新主頁的內(nèi)容,必須手動的來更新其html的文件數(shù)據(jù)。而隨著web應用的發(fā)展,用戶希望能夠看到根據(jù)要求而動態(tài)生成的主頁,例如響應用戶查詢數(shù)據(jù)庫的要求、生成報表等。當在瀏覽器上填好表單(form)的輸入數(shù)據(jù),以提供http要求時,可以在站點服務器中執(zhí)行的應用程序,而不只是一個html 文件。
站點服務器收到要求執(zhí)行的應用程序,分析表單(form)的輸入數(shù)據(jù),將執(zhí)行的結果以html的格式傳送給瀏覽器。根據(jù)用戶請求生成動態(tài)主頁的傳統(tǒng)方法有cgi、isapi等。cgi是根據(jù)瀏覽器端的http請求激活響應進程,每一個請求對應一個進程。當同時有很多請求時,程序擠占系統(tǒng)資源,造成效率低下;isapi針對這一缺點進行改進,利用dll(動態(tài)鏈接庫)技術,以線程代替進程,提高了性能和速度,但要考慮線程的同步問題,而且開發(fā)步驟煩瑣。這兩種技術和另一普遍使用的開發(fā)動態(tài)網(wǎng)頁的技術java都還存在著另外一個問題,那就是開發(fā)困難,程序的開發(fā)和html寫作是兩個完全不同的過程,需要專門的程序員開發(fā)。而較簡單的開發(fā)技術如javascript和idc(internet database connector)等功能有限,不敷使用。
asp使用的activex技術基于開放設計環(huán)境,用戶可以自己定義和制作組件加入其中,使自己的動態(tài)網(wǎng)頁幾乎具有無限的擴充能力,這是傳統(tǒng)的cgi等程序所遠遠不及的地方。asp與常見的在client端實現(xiàn)動態(tài)主頁的技術如java applet、activex control、vbscript、javascript等不同,asp中的命令和script語句都是由服務器來解釋執(zhí)行的,執(zhí)行結果產(chǎn)生動態(tài)生成的web頁面并送到瀏覽器;而client端技術的script命令則是由瀏覽器來解釋執(zhí)行。由于asp是在服務器端解釋執(zhí)行,開發(fā)者可以不必考慮瀏覽器是否支持asp;同時由于它在服務器端執(zhí)行,開發(fā)者也不必擔心別人下載程序從而竊取編程邏輯。
asp通過后綴名為.asp的asp文件來實現(xiàn),一個.asp文件相當于一個可執(zhí)行文件,因此必須放在web服務器上有可執(zhí)行權限的目錄下。當用戶從瀏覽器輸入了.asp文件的地址后,瀏覽器就將這個url請求發(fā)給web server,如果web server上裝了asp,就調(diào)用asp。asp讀出相應.asp文件,解釋并執(zhí)行命令,動態(tài)生成一個html頁面回傳web server,然后web server再把結果發(fā)送給瀏覽器。asp文件的制作和html類似,且和html開發(fā)集成,可以在同一個過程完成,利用asp將可以執(zhí)行的腳本嵌入到html文件中(將html文件的后綴名改為.asp),這使得html文件的編寫與腳本的開發(fā)融合在一起。通過asp內(nèi)置的對象、服務器組件(server component)可以完成非常復雜的任務,而且用戶還可以自己開發(fā)或利用別人開發(fā)的服務器組件完成專門的任務。asp比較網(wǎng)關及服務器擴展模式有著以下優(yōu)點:
(1)完全與html文件融合在一起;
(2)容易創(chuàng)建,不需要其它編譯、鏈接程序;
(3)面向對象的并通過activex server對象可擴展。
二、電子商務數(shù)據(jù)訪問方式
電子商務是指通過電子方式,并在網(wǎng)絡基礎上實現(xiàn)物資、人員過程的協(xié)調(diào),以便商業(yè)交換的活動。在電子商務系統(tǒng)中,web提供了與客戶進行通信聯(lián)絡的有效手段,利用web技術,實現(xiàn)web服務器與數(shù)據(jù)庫系統(tǒng)的連接,完成對數(shù)據(jù)的處理與查詢,用戶可以通過操作簡單易學的瀏
覽器來查詢處理所需要的各種數(shù)據(jù)。實現(xiàn)web服務器與數(shù)據(jù)庫的連接一般有兩種方法:一種是利用中間件技術在兩者之間建立連接和通信,如cgi(通用網(wǎng)關接口)和api(應用程序編程接口)。
web服務器通過調(diào)用cgi程序實現(xiàn)與web瀏覽器的交互,即cgi程序接受瀏覽器發(fā)給web服務器的信息,進行處理后,將相應結果再送回給web服務器,通過web服務器將信息傳送給瀏覽器。但cgi程序在響應速度和資源利用等方面有較大局限性,客戶端每請求一個cgi程序,服務器端便打開一個進程,當請求的數(shù)量較大時容易引起瓶頸現(xiàn)象,開發(fā)人員常利用api編程來擴展服務器功能,api程序占系統(tǒng)資源少,運行效率較高,但它的編程較cgi程序更為復雜;另一種是由瀏覽器中的java小應用程序(java applet)通過瀏覽器訪問web服務器上的數(shù)據(jù)庫,利用了jdbc(java database connectivity)技術,它通過jdbc提供的api實現(xiàn)對web server的訪問。由于java applet本身的局限性,目前大多數(shù)的應用是基于中間件技術的。asp也是屬于中間件的一種模式,但在windows平臺上它比較網(wǎng)關及服務器擴展模式有著較大的優(yōu)點。網(wǎng)關的最大特點是它的平臺無關性,但網(wǎng)關程序通常較難編寫和改變。網(wǎng)關程序通常是一個獨立的程序,并不和html文件融合在一起,它需要用如c、c++、vb、perl等語言來編寫獨立的應用程序,而asp應用改變了這一點。使用asp不僅可以讀取access和 sql server的數(shù)據(jù)庫,而且還可以讀取其他odbc(open database connect 開放式數(shù)據(jù)庫互聯(lián))兼容的數(shù)據(jù)庫。
在asp中訪問數(shù)據(jù)庫是通過ado(activex database object活動數(shù)據(jù)對象)及事務處理語句來實現(xiàn)的。ado是一種操作microsoft所支持的數(shù)據(jù)庫的方法,是一項容易使用并且可擴展的將數(shù)據(jù)庫訪問添加到 web 頁的技術。ado對象的使用與dao(數(shù)據(jù)訪問對象)、rdo(遠程數(shù)據(jù)對象)的方式相似。在asp中,ado可以看作是一個服務器組件,更簡單點說,是一系列的對象,應用這些功能強大的對象,即可輕松完成對數(shù)據(jù)庫復雜的操作。
三、asp在電子商務中的應用
在電子商務中,對用戶而言,進行網(wǎng)上信息查詢的目的是尋找自己需要的產(chǎn)品或服務,而對于商品或服務提供者來說,其目的則是向用戶推銷自己的產(chǎn)品或服務。因此,讓用戶通過瀏覽器查詢服務器的后端數(shù)據(jù)庫是許多web服務提供者必需有的服務,asp通過內(nèi)置的adodb組件來實現(xiàn)這一功能??梢允褂胊do去編寫緊湊簡明的腳本以便連接到odbc 兼容的數(shù)據(jù)庫和 ole db 兼容的數(shù)據(jù)源。具體的操作步驟可以歸納為以下幾步:
① 創(chuàng)建數(shù)據(jù)庫源名(dsn)adodb通過odbc工作,因此要在odbc中設置dsn(數(shù)據(jù)源名)。打開windows的'控制面板',雙擊'odbc'的圖標,然后選擇'文件 dsn '的屬性頁,單擊<添加,選擇數(shù)據(jù)庫驅動程序,然后單擊'下一步',按照屏幕的指示鍵入數(shù)據(jù)源文件的名稱,然后單擊'下一步',再單擊'完成'創(chuàng)建數(shù)據(jù)源。
②創(chuàng)建數(shù)據(jù)庫鏈接 鏈接用以保持一些關于正在訪問的數(shù)據(jù)的動態(tài)信息,以及鏈接者信息。利用adodb的成員函數(shù)open和先前設定的dsn與數(shù)據(jù)庫連接,其語法如下:
setconnect=server.createobject('adodb.connection')’創(chuàng)建了鏈接對象connect。connect.open('dsn=dsnname;uid=userid;pwd=password')’打開鏈接。dsnname為數(shù)據(jù)源名;userid為用戶名;password為用戶口令。③創(chuàng)建數(shù)據(jù)對象 ado中的數(shù)據(jù)對象通常保存的是查詢結果。recordset 是ado中最復雜的對象,有許多屬性和方法,靈活運用,可以達到許多好的效果。其創(chuàng)建方法如下: set recordset =connect.execute(sqtstr)’創(chuàng)建并打開了對象recordset,sqtstr是一個串,代表一條標準的sql語句。例如: sqlstr='select*from b1' set recordset =connect.execute(sqlstr)這條語句執(zhí)行后,對象recordset中就保存了b1中的所有記錄。
④操作數(shù)據(jù)庫 可利用execute方便地執(zhí)行數(shù)據(jù)的插入、修改、刪除等操作。如執(zhí)行插入操作: sqlstr='insert into b1values(1,2)' connect.execute(sqlstr)⑤關閉數(shù)據(jù)對象和鏈接 在使用了ado對象之后,一定要關閉數(shù)據(jù)對象和鏈接。在asp中通過調(diào)用方法close實現(xiàn)關閉。關閉創(chuàng)建的數(shù)據(jù)對象:record set.close set record set=nothing 關閉創(chuàng)建的鏈接對象:connect.close set connect=nothing 完整的程序片段:
//產(chǎn)生組件實例
<%
setconnect=server.createobject('adodb.connection')//連接數(shù)據(jù)庫
connect.open('dsn=dsnname;uid=userid;pwd=password')//執(zhí)行查詢
sql=select*fromtablename setrs=connect.execute(sql)%
//顯示結果
<%dowhile not rs.eof%
<%=rs(fieldname)% <%
rs.movenext
loop %
上述是用asp訪問數(shù)據(jù)庫的全過程,由于應用面向對象思想,所有操作都比較簡單,用戶需要注意的僅是對數(shù)據(jù)結構的了解、當前所操作的對象及對象的屬性等等,只要對這些有了清晰的認識,再加上asp強大功能,在網(wǎng)絡上使用數(shù)據(jù)庫,實現(xiàn)用戶與頁面間交換信息,就再也不是什么難事了。
第五篇:網(wǎng)頁設計畢業(yè)論文1
網(wǎng)站的設計與制作
目 錄
第一章
前言 第二章
1.1課題來源
1.2 網(wǎng)站開發(fā)項目需求分析 1.3 軟件 1.4 軟件運行環(huán)境 第二章 網(wǎng)站制作 2.1做網(wǎng)頁的步驟 2.2做網(wǎng)頁的要素 2.3 系統(tǒng)各模塊功能實現(xiàn) 第三章 網(wǎng)站的設計 3.1 主頁的要求 3.2 子頁的要求 第四章 結束語 參考文獻
11頁 第1頁
摘 要
汽車網(wǎng)站是一個結合了汽車銷售等多功能瀏覽的汽車網(wǎng)站,我所使用的軟件是Macromedia 公司推出的一款用于網(wǎng)頁設計的軟件——dreamweaver8。在網(wǎng)頁的制作與鏈接中,我學到了很多。
關鍵詞: 超鏈接 外觀 性能
第一章
前言
1.1課題來源
隨著二十一世紀新興科技的飛速發(fā)展,如今的電子信息產(chǎn)業(yè)正在經(jīng)受著一個巨大的挑戰(zhàn),同時也面臨著一個重大的機遇。就目前的科技發(fā)展水平而言,電子信息產(chǎn)業(yè)的發(fā)展已經(jīng)不能夠滿足社會化大生產(chǎn)的要求,因此,各個國家集中人力、財力加大對信息技術產(chǎn)業(yè)的投入,以適應目前需要??上驳氖窃谶@幾十年的發(fā)展中我們有了互聯(lián)網(wǎng)?;ヂ?lián)網(wǎng)加大了我們了解世界的眼界,縮緊了人與人之間的距離,這就更容易的使我們走上信息化的道路。
以往,人們出行都以自行車居多,后來公交事業(yè)發(fā)展壯大,人們便乘坐公交汽車,現(xiàn)如今,隨著人們生活水平的提高,越來越多的家庭已經(jīng)擁有或者想擁有自己的私家車。
正是因為人們的這些需求,越來越多的汽車網(wǎng)站出現(xiàn)在網(wǎng)絡上,使人們可以隨時了解自己想知道的汽車方面的新聞,真正的做到足不出戶,便知天下事。把汽車銷售與網(wǎng)絡連接起來,是今
11頁 第2頁
后汽車銷售發(fā)展的必然方向之一。1.2 網(wǎng)站開發(fā)項目需求分析
一個網(wǎng)站項目的確立是建立在各種各樣的需求上面的,這種需求往往來自于客戶的實際需求或者是出于公司自身發(fā)展的需要,其中客戶的實際需求也就是說這種交易性質(zhì)的需求占了絕大部分。面對對網(wǎng)站開發(fā)擁有不同知識層面的客戶,項目的負責人對用戶需求的理解程度,在很大程度上決定了此類網(wǎng)站開發(fā)項目的成敗。因此如何更好地的了解、分析、明確用戶需求,并且能夠準確、清晰以文檔的形式表達給參與項目開發(fā)的每個成員,保證開發(fā)過程按照滿足用戶需求為目的正確項目開發(fā)方向進行,是每個網(wǎng)站開發(fā)項目管理者需要面對的問題。據(jù)專家預計,2009年我國汽車需求量將超過850萬輛。所以,做好汽車網(wǎng)站就是為了使廣大的消費者提供及時和有效的信息,為其選擇適合自己的產(chǎn)品提供良好的參考。
1.3 使用軟件
dreamwraver軟件由美國著名的網(wǎng)站應用開發(fā)工具生產(chǎn)廠商Adobe Macromedia于2005年6月推出并正式投入市場以來,已經(jīng)發(fā)展得相當成熟。關于dreamwraver的技術介紹的相關書籍與網(wǎng)絡信息相當豐富。通過大學中軟件開發(fā)環(huán)境課程的學習,對dreamwraver有了比較深刻的認識,并比較輕松的掌握了
11頁 第3頁
dreamwraver的操作。因此,軟件技術可以完成任務的要求。
1.4 軟件運行環(huán)境
Dreamweaver是一款簡體中文軟件,可以在Win2003/WinXP中安全運行
第三章 網(wǎng)站制作
2.1制作網(wǎng)頁的步驟
再做網(wǎng)頁之前,我確定了做網(wǎng)頁的五個步驟。
一、確定網(wǎng)站主題 :網(wǎng)站主題就是要建立的網(wǎng)站所要包含的主要內(nèi)容,一個網(wǎng)站必須要有一個明確的主題。
二、搜集材料 :明確了網(wǎng)站的主題以后,你就要圍繞主題開始搜集材料了。材料既可以從圖書、報紙、光盤、多媒體上得來,也可以從互聯(lián)網(wǎng)上搜集,然后把搜集的材料去粗取精,去偽存真,作為自己制作網(wǎng)頁的素材。
三、規(guī)劃網(wǎng)站 :一個網(wǎng)站設計得成功與否,很大程度上決定于設計者的規(guī)劃水平,規(guī)劃網(wǎng)站就像設計師設計大樓一樣,圖紙設計好了,才能建成一座漂亮的樓房。網(wǎng)站規(guī)劃包含的內(nèi)容很多,如網(wǎng)站的結構、欄目的設置、網(wǎng)站的風格、顏色搭配、版面布局、文字圖片的運用等,你只有在制作網(wǎng)頁之前把這些方面都考慮到了,才能在制作時駕輕就熟,胸有成竹。也只有如此制作出來的11頁 第4頁
網(wǎng)頁才能有個性、有特色,具有吸引力。
四、選擇合適的制作工具 :盡管選擇什么樣的工具并不會影響你設計網(wǎng)頁的好壞,但是一款功能強大、使用簡單的軟件往往可以起到事半功倍的效果。
五、制作網(wǎng)頁 :材料有了,工具也選好了,下面就需要按照規(guī)劃一步步地把自己的想法變成現(xiàn)實了,這是一個復雜而細致的過程,一定要按照先大后小、先簡單后復雜來進行制作。所謂先大后小,就是說在制作網(wǎng)頁時,先把大的結構設計好,然后再逐步完善小的結構設計。所謂先簡單后復雜,就是先設計出簡單的內(nèi)容,然后再設計復雜的內(nèi)容,以便出現(xiàn)問題時好修改。在制作網(wǎng)頁時要多靈活運用模板,這樣可以大大提高制作效率。
2.2制作網(wǎng)頁的要素
1、網(wǎng)頁的整體布局設計
網(wǎng)頁設計作為一種視覺語言,要講究編排和布局,雖然主頁的設計不等同于平面設計,但它們有許多相近之處,應充分加以利用和借鑒。版式設計通過文字圖形的空間組合,表達出和諧與美。一個優(yōu)秀的網(wǎng)頁設計者也應該知道哪一段文字圖形該落于何處,才能使整個網(wǎng)頁生輝。多頁面站點頁面的編排設計要求把頁面之間的有機聯(lián)系反映出來,特別要處理好頁面之間和頁面內(nèi)的秩序與內(nèi)容的關系。尤其是我們在利用網(wǎng)頁效果體現(xiàn)在線營銷的意圖時,更要注意為了達到最佳的視覺表現(xiàn)效果,而講究整體布
11頁 第5頁
局的合理性,比如一家生產(chǎn)型的企業(yè),它所提供產(chǎn)品的名稱、類別、型號、價格、功能介紹應怎樣編排才能使瀏覽者有一個流暢的視覺體驗,從而方便他對產(chǎn)品的了解,促成最后的購買。
2、網(wǎng)頁設計中色彩的運用
色彩是藝術表現(xiàn)的要素之一,在網(wǎng)頁設計中,根據(jù)和諧、均衡和重點突出的原則,將不同的色彩進行組合、搭配來構成美麗的頁面。根據(jù)色彩對人們心理的影響,合理地加以運用,按照色彩的記憶性原則,一般暖色較冷色的記憶性更強一些。色彩還具有聯(lián)想與象征的特質(zhì),如紅色象征血、太陽;藍色象征大海、天空和水面等。所以如果我們在對一家出售冷食的商店進行虛擬店面的頁面設計時,應使用淡雅而沉靜的顏色,使人心理上感覺涼爽一些,增強人們的購買心理,使得在線營銷得到很好的實踐效果。另要注意的是網(wǎng)頁的顏色應用雖沒有限制,但不能毫無節(jié)制地運用多種顏色,一般情況下,先根據(jù)總體風格的要求定出一至二種主色調(diào),在已經(jīng)有了完備的CIS(企業(yè)形象識別系統(tǒng))的企業(yè)進行網(wǎng)頁設計時,更應該按照其中的VI進行色彩運用。在色彩的運用過程中,還應注意的一個問題是:由于國家和種族、宗教和信仰的不同,以及生活的地理位置、文化修養(yǎng)的差異等,不同的人群對色彩的喜惡程度有著很大的差異。如:兒童喜歡對比強烈、個性鮮明的純顏色;生活在草原上的人喜歡紅色;生活在鬧市中的人喜歡淡雅的顏色;生活在“沙漠”中的人喜歡綠色。在設計中要考慮眾多因素。
11頁 第6頁
3、網(wǎng)頁形式與內(nèi)容相統(tǒng)一
要將豐富的意義和多樣的形式組織成統(tǒng)一的頁面結構,形式語言必須符合頁面的內(nèi)容,體現(xiàn)內(nèi)容的豐富含義。運用對比與調(diào)和、對稱與平衡、節(jié)奏與韻律以及留白等手段,通過空間、文字、圖形之間的相互關系建立整體的均衡狀態(tài),產(chǎn)生和諧的美感。如對稱原則在頁面設計中,它的均衡有時會使頁面顯得呆板,但如果加入一些富有動感的文字、圖案,或采用夸張的手法來表現(xiàn)內(nèi)容往往會達到比較好的效果。點、線、面作為視覺語言中的基本元素,要使用點、線、面的互相穿插、互相襯托、互相補充構成最佳的頁面效果。網(wǎng)頁設計中點、線、面的運用并不是孤立的,很多時候都需要將它們結合起來,表達完美的設計意境。
2.3 系統(tǒng)各模塊功能實現(xiàn)
1.系統(tǒng)登錄模塊
1)該功能模塊可以記錄客戶的郵箱地址,交易時還可以向客戶發(fā)送交易信息,到帳確認等等。
2)登陸后系統(tǒng)會調(diào)出客戶的記錄,按照交易量的不同客戶享受的折扣也不同,系統(tǒng)主界面
2.車輛展示模塊
1)該功能模塊主要實現(xiàn)對車輛的展示。
2)該功能模塊圖片、文字介紹,360度flash對各種車輛的展示。
11頁 第7頁
3.賬號管理模塊
1)掛失業(yè)務在正常工作中肯定會遇到掛失的業(yè)務,確定掛失后,數(shù)據(jù)庫會將該賬號掛起,等待客戶做進一步操作。
2)凍結業(yè)務,客戶對賬號有凍結的權利,在客戶沒有輸入解凍密碼之前,任何人都無法動用帳上的資金。
3)流水查詢客戶可以查詢曾經(jīng)交易過的記錄。
4)客戶可以自行對其賬號密碼進行修改,網(wǎng)站管理人員也可以添加或刪除賬號。
第三章 網(wǎng)站的設計
3.1 主頁的要求
對于銷售業(yè)務系統(tǒng)要求運行的工作環(huán)境穩(wěn)定,易于操作,界面美觀大方,對于前臺展示界面要求系統(tǒng)便于維護,安全可靠,對于廣大客戶所要執(zhí)行的操作簡單易懂,遠程訪問速度較快,界面友好美觀,有基本的錯誤提醒功能,遠程操作數(shù)據(jù)庫正確,要求和客戶有一定的互動性,在主頁上直觀的就可以查看瀏覽者所想要了解的東西。3.2子頁的要求
后面的工作就是子頁的選擇與鏈接,子頁應該豐富多彩,內(nèi)容充實,瀏覽性強,比如說,想要銷售一輛汽車,應該有它的全部資料,包括外觀、內(nèi)飾、性能指標、出產(chǎn)地、價格等諸多方面,鑒于以上方面,我開始了子頁的選擇與鏈接。
第四章 結束語
11頁 第8頁
在系統(tǒng)的需求分析過程中,由于不熟悉,產(chǎn)生了很大的困難,通過與指導老師的探討與溝通,我漸漸地對系統(tǒng)有了一個大體的認識。雖然說在系統(tǒng)需求分析過程中花費了很多時間,但是我認為這是必要的也是必須的。
致 謝
在整個畢業(yè)設計過程中,指導教師給了我極大的幫助,并給予我悉心的關懷與指導,在此表示衷心地感謝。老師認真負責的工作態(tài)度、嚴謹?shù)闹螌W風格,使我深受啟發(fā)。開發(fā)的同時,和同組同學們之間的相互探討也使我獲益匪淺,在開發(fā)工具的選擇上,她給了我不少的指導,在此也表示衷心地感謝。在此同時也給了我不少的指導工作,在此也表示衷心地感謝。
參考文獻
〈1〉《信息技術》江蘇科學技術出版社 〈2〉《網(wǎng)頁制作》人民郵電出版社
<3>《dreamweaver8參考手冊》2008年版。
11頁 第9頁