數(shù)字多媒體與網(wǎng)絡(luò)工程-畢業(yè)論文.doc

更多論文/fanteral目 錄引言-3關(guān)鍵字-一、網(wǎng)站目的二、網(wǎng)站功能三、網(wǎng)站結(jié)構(gòu)描述5四、網(wǎng)站欄目介紹6五、網(wǎng)站形象設(shè)計9六、網(wǎng)站版面策劃10七、網(wǎng)站布局技術(shù)10八、網(wǎng)站中一些特效代碼說明12九、網(wǎng)站制作使用工具介紹12十、設(shè)計小結(jié)13附 錄十一、參考文獻(xiàn)13十二、謝辭13引言 互聯(lián)網(wǎng)對當(dāng)今世界的影響毋庸質(zhì)疑。隨著網(wǎng)絡(luò)的高速發(fā)展和“所見即所得”網(wǎng)頁編輯工具的出現(xiàn)，網(wǎng)頁設(shè)計已發(fā)展為一門新興的學(xué)科。網(wǎng)站設(shè)計不單純是計算機(jī)技術(shù)的運(yùn)用，也是平面設(shè)計在網(wǎng)絡(luò)世界的延伸。學(xué)校網(wǎng)站建設(shè)是學(xué)校教育信息化建設(shè)的重要方面，是適應(yīng)現(xiàn)代教育技術(shù)和信息技術(shù)的發(fā)展，加大學(xué)校對外交流與宣傳力度，提高教學(xué)、科研、管理效率的重要途徑；學(xué)校網(wǎng)站是學(xué)校對外宣傳的窗口，也是展示全校師生才能，加強(qiáng)對校外聯(lián)系，互相學(xué)習(xí)，共同發(fā)展的陣地，學(xué)校網(wǎng)站建設(shè)的目的是促進(jìn)師生與學(xué)校共同發(fā)展，因此，需要本系師生共同參與，同心合力把本系網(wǎng)站建設(shè)好.試論本系網(wǎng)站在本系管理中的作用一利用本系網(wǎng)站促進(jìn)本系管理我校數(shù)字媒體與網(wǎng)絡(luò)工程系是經(jīng)國家教育部批準(zhǔn)設(shè)立“數(shù)字媒體藝術(shù)”專業(yè)的七個高校院系之一，也是全國首家被國家高等教育自學(xué)考試指導(dǎo)委員會批準(zhǔn)開考“數(shù)字媒體藝術(shù)”專業(yè)的主考單位?，F(xiàn)有“數(shù)字媒體藝術(shù)”本科專業(yè)，“數(shù)字媒體藝術(shù)”專升本專業(yè)、“計算機(jī)圖像圖形技術(shù)”專科專業(yè)、“數(shù)字媒體藝術(shù)”自考專科專業(yè)等,現(xiàn)有在校生500多名。2005年數(shù)字媒體與網(wǎng)絡(luò)工程系學(xué)生新建了網(wǎng)站（）。 網(wǎng)站的建立標(biāo)志著本系建設(shè)上了一個新臺階，本系新聞、招生信息、學(xué)科建設(shè)、課程設(shè)置、作品展示、關(guān)于數(shù)媒、技術(shù)交流、友情鏈接、設(shè)計資訊、數(shù)媒論壇十多個欄目能做到每日更新，時時更新，交互性更強(qiáng)了。利用網(wǎng)站我們可以：通知、信息交流、教育交流、參與論壇、網(wǎng)絡(luò)留言等，使本系管理透明度更高，更高效快捷，系還可發(fā)布對教師的祝賀，對教師的每日提醒，對教師意見的第一時間反饋，人性化、民主化的管理方式在網(wǎng)絡(luò)的參與下如虎添翼了二利用本系網(wǎng)站促進(jìn)教師專業(yè)成長 “國家的希望在教育，教育的希望在教師”，教師在教育教學(xué)改革中的關(guān)鍵作用得到了人們更廣泛的認(rèn)同。教師專業(yè)化、教師的專業(yè)發(fā)展，無論在理論上還是實(shí)踐上都成為世界教師教育關(guān)注的焦點(diǎn)。 我們認(rèn)為，教師專業(yè)發(fā)展需要一種氛圍。而網(wǎng)絡(luò)交流給我們提供了很好的空間。校園網(wǎng)絡(luò)開通以來，對于教師專業(yè)成長的影響是巨大的。上網(wǎng)與反思，已經(jīng)逐步成為教師們的至愛。他們對教育的認(rèn)識，就在這樣的追尋中有了深刻的變化。因?yàn)榻處煹某砷L除了獨(dú)立奮斗之外，還需要合作，還需要與外界廣泛的交流，在碰撞與融合中發(fā)展，在寫作或參與各種討論的時候，激起了強(qiáng)烈的專業(yè)意識，從觀念到思想，從精神到行動，都進(jìn)入了一種專業(yè)的狀態(tài)。利用internet克服了傳統(tǒng)教育的局限性，它將形成一種主動的、協(xié)作的、開放的學(xué)習(xí)模式，并充分考慮雙向?qū)W習(xí)環(huán)境，采取有提問、有反饋、有交流的方法，既保留了傳統(tǒng)遠(yuǎn)教中的生動形象性和不受空間限制等優(yōu)點(diǎn)，又有相互訪問，雙向交流，學(xué)習(xí)資源、學(xué)習(xí)內(nèi)容廣泛等優(yōu)良特性。實(shí)踐證明，計算機(jī)，創(chuàng)造了一個美麗的神話；多媒體，展示了一個多彩的世界；互聯(lián)網(wǎng)，連接了一份夢想與光榮；如果我們“網(wǎng)住”了今天；那么明天我們就能做得更好！關(guān)鍵詞：福州大學(xué)、數(shù)字媒體、老師、學(xué)生、網(wǎng)頁正文一、 網(wǎng)站目的1.1學(xué)生方面：加強(qiáng)學(xué)生之間課余學(xué)習(xí)交流、溝通感情、促進(jìn)學(xué)生各方面知識全面發(fā)展；1.2老師方面：方便老師教學(xué)，達(dá)到課堂與網(wǎng)絡(luò)教學(xué)相結(jié)合；1.3公眾方面：樹立一個良好形象，增加一個公眾了解數(shù)字媒體與網(wǎng)絡(luò)工程系的窗口；1.4學(xué)校方面：提高數(shù)字媒體與網(wǎng)絡(luò)工程系知名度、及學(xué)校內(nèi)各部門效率；二、 網(wǎng)站功能2.1師生：為師生互動、學(xué)生之間交流提供一個平臺、方便“教”與“學(xué)”；2.2公眾：了解數(shù)字媒體各方面信息；2.3學(xué)校：在對外宣傳上發(fā)布更新信息、對內(nèi)管理上加強(qiáng)各部門協(xié)調(diào)溝通；三、網(wǎng)站結(jié)構(gòu)描述數(shù)字媒體與網(wǎng)絡(luò)工程系首 頁關(guān)于數(shù)媒學(xué)科建設(shè)教學(xué)教務(wù)作品展示聯(lián)系我們技術(shù)交流數(shù)字設(shè)備本系數(shù)媒數(shù)媒論壇作品展示學(xué)科建設(shè)關(guān)于數(shù)媒本系新聞友情鏈接數(shù)字媒體藝術(shù)本科方向數(shù)字媒體藝術(shù)本升本方向數(shù)字媒體藝術(shù)?？品较驁D形圖象制作?？品较蜃髌氛故井厴I(yè)設(shè)計展四、網(wǎng)站欄目介紹4.0首頁作用：提高學(xué)校各部門效率，使公眾了解學(xué)校最新動態(tài)，促進(jìn)學(xué)校發(fā)展；功能：發(fā)布本系最新新聞；包含子欄目：關(guān)于數(shù)媒、學(xué)科建設(shè)、教學(xué)教務(wù)、作品展示、招生信息、會員登錄、站內(nèi)搜索、課程設(shè)置、友情鏈接、聯(lián)系我們、留言板等功能模塊和軟件系統(tǒng)；（“作品展示”發(fā)布學(xué)生作品；“關(guān)于數(shù)媒”介紹數(shù)字媒體專業(yè)的信息；“學(xué)科建設(shè)”介紹各學(xué)科的信息；“招生信息”發(fā)布招生的最新信息；“友情鏈接”鏈接一些教育和設(shè)計方面網(wǎng)站；）4.1關(guān)于數(shù)媒作用：使公眾了解學(xué)本系概況，達(dá)到宣傳數(shù)字媒體與網(wǎng)絡(luò)工程系的目的；功能：發(fā)布本校信息及使用的教學(xué)設(shè)備；包含子欄目：本系數(shù)媒、數(shù)字設(shè)備（“本系數(shù)媒” 介紹數(shù)字媒體專業(yè)相關(guān)的的信息；“數(shù)字設(shè)備”介紹本系所擁有的教學(xué)設(shè)備和實(shí)驗(yàn)室等；）4.2學(xué)科建設(shè)作用：使公眾了解本系專業(yè)設(shè)置，方便師生“教”與“學(xué)”；功能：發(fā)布系、專業(yè)信息，提供在線教學(xué)；包含子欄目：數(shù)字媒體藝術(shù)本科方向、數(shù)字媒體藝術(shù)專升本方向、圖形圖象制作?？品较颉?shù)字媒體藝術(shù)?？品较颍唬ū究瓢ǜ鞅究葡祫e及系內(nèi)各專業(yè)詳細(xì)介紹；專科包括各?？葡祫e及系內(nèi)各專業(yè)詳細(xì)介紹；）4.3教學(xué)教務(wù)作用：了解數(shù)字媒體與網(wǎng)絡(luò)工程系領(lǐng)導(dǎo)以及教師的基本信息，如教師專業(yè)，成績、特長、4.4招生信息作用： 給群眾提供招生介紹，并介紹數(shù)字媒體與網(wǎng)絡(luò)工程系的主辦專業(yè)和推進(jìn)的方向；功能：發(fā)布招生相關(guān)信息、本系專業(yè)設(shè)置；職責(zé)范圍等；功能：數(shù)字媒體與網(wǎng)絡(luò)工程系領(lǐng)導(dǎo)及教師信息；4.5作品展示作用： 使學(xué)生在技術(shù)上進(jìn)一步提高；功能：發(fā)布最新作品展示；包含的子欄目：作品展示、畢業(yè)設(shè)計展（作品可放大觀看。）4.6聯(lián)系我們提供本系的聯(lián)系方式4.7數(shù)媒論壇作用：可以讓群眾提問問題，同時為了讓這網(wǎng)站更加完善，讓更多的人來參與建設(shè)； 功能：可以知道群眾的意見；五、 網(wǎng)站形象設(shè)計5.1標(biāo)志：白色字咖啡色描邊組成的“數(shù)字媒體與網(wǎng)絡(luò)工程系”為主體，與banner背景統(tǒng)一，（banner背景以數(shù)字01還有手拿鼠標(biāo)姿勢詮釋了數(shù)字媒體這一專業(yè)，并且有一道似曙光展現(xiàn)現(xiàn)在年輕人積極向上的精神），而子頁的“數(shù)字媒體與網(wǎng)絡(luò)工程系”則是藍(lán)色字投影，配上藍(lán)色不會顯得單調(diào)，視覺上清晰，明了5.2主色調(diào)與色彩：以“橙色”為主色調(diào)。橙色代表輝煌、激情、收獲，向上，而我們現(xiàn)在的大學(xué)生正需要這種激情、積極向上的精神，因此選用“橙色”為主色調(diào)；5.3標(biāo)準(zhǔn)字體：主頁導(dǎo)航欄背景顏色為橙色，字體為“黑體”白色12px；子頁導(dǎo)航欄背景為灰色，字體為“宋體”白色12px，正文字體為“宋體”12 px，顏色為#2f3e89；5.4裝飾圖案：網(wǎng)站采用部分學(xué)校風(fēng)景和設(shè)計圖片為裝飾圖案；5.5交互方式：靜態(tài)+asp網(wǎng)頁，方便交換；六、網(wǎng)站版面策劃：6.1首頁：首頁使用的是寬屏布局，打破了原來版本的國字型結(jié)構(gòu)布局，看起來大氣，成熟。最上面是網(wǎng)站的標(biāo)題+banner+主菜單,下半部分分為2個區(qū)域,下半部分的上半部分是主題內(nèi)容,最下面是網(wǎng)站的版權(quán)聲明。這種布局的優(yōu)點(diǎn)是能夠充分利用版面,信息量大;缺點(diǎn)是頁面擁擠，文字多,不夠靈活。6.2子頁：子頁的版面設(shè)計與主頁布局不同，多半是以類似國字型布局，又與國字型布局有些差異，因?yàn)橛心莻€flash按鈕，使得頁面看起來不會死板。主體內(nèi)容使用標(biāo)題正文型：這種類型即最上面是標(biāo)題或類似的一些東西，下面是正文；本站子頁大部分是這個結(jié)構(gòu)；6.3頁頭：頁頭又可稱之為頁眉，頁眉的作用是定義頁面的主題。比如一個站點(diǎn)的名字多數(shù)都顯示在頁眉里。這樣，訪問者能很快知道這個站點(diǎn)是什么內(nèi)容。頁頭是整個頁面設(shè)計的關(guān)鍵，它將牽涉到下面的更多設(shè)計和整個頁面的協(xié)調(diào)性。頁頭常放置站點(diǎn)名字的圖片和公司標(biāo)志以及旗幟廣告。本站頁頭先是一個土黃色與橙色矩形組成，下方是digital media&network engineering，banner即是以980x151以數(shù)字01還有手拿鼠標(biāo)姿勢詮釋了數(shù)字媒體這一專業(yè)，并且有一道似曙光展現(xiàn)現(xiàn)在年輕人積極向上的精神的學(xué)校風(fēng)景圖為底片，白色字咖啡色描邊組成的“數(shù)字媒體與網(wǎng)絡(luò)工程系”上面帶有透明flash一起構(gòu)成。（“digital media&network engineering”為microsoft sans serif 14px,灰色；）6.4頁腳：頁腳和頁頭相呼應(yīng)。頁頭是放置站點(diǎn)主題的地方，而頁腳是放置制作者或者公司信息的地方。你能看到，許多制作信息都是放置在頁腳的。本站頁腳如下：copyright 2007 by 數(shù)字媒體與網(wǎng)絡(luò)工程系 power by 05 multimediacopyright(c)2002-2003 all rights reserved bestviewed by 800600 ie5.5+ （頁腳字體為宋體，顏色為黑色）七、網(wǎng)站布局技術(shù)本站主要使用表格布局布局。7.1 層疊樣式表由于層疊樣式表(css)用得不熟，因此做這個網(wǎng)站過程中還是沒用到多少。不過倒是對其有了一定的了解。如果使用了css,那么可以在設(shè)置文本之前,就指定整個文本的屬性,比如顏色、字體大小等等,這樣,我們就能獲得統(tǒng)一的文本外觀了。7.2 表格布局在制作這個網(wǎng)站的過程中使用得最多的就是表格布局了。表格布局好像已經(jīng)成為一個標(biāo)準(zhǔn)，隨便瀏覽一個站點(diǎn)，它們一定是用表格布局的。表格布局的優(yōu)勢在于它能對不同對象加以處理，而又不用擔(dān)心不同對象之間的影響。而且表格在定位圖片和文本上比起用css更加方便。表格布局唯一的缺點(diǎn)是，當(dāng)我們用了過多表格時，頁面下載速度受到影響。7.3 框架布局一開始看到有些欄目的內(nèi)容可以用框架布局，但還是因?yàn)榧夹g(shù)有限，處理起來效果并不理想，因此就取消。但是有一些內(nèi)容比較長的就用代碼添加框架，有滾動條的。不知道什么原故，框架結(jié)構(gòu)的頁面開始被許多人不喜歡，可能是因?yàn)樗募嫒菪?。但從布局上考慮，框架結(jié)構(gòu)不失為一個好的布局方法。它如同表格布局一樣，把不同對象放置到不同頁面加以處理，因?yàn)榭蚣芸梢匀∠吙颍砸话銇碚f不影響整體美觀。7.4選擇表格布局原因本站主要使用表格布局布局。優(yōu)勢在于它可以對不同對象進(jìn)行處理，而不必?fù)?dān)心不同對象之間的互相影響，且在定位圖片和文本上比用css更方便，比框架布局更美觀，使用起來也會更順手。八、網(wǎng)站中使用的一些特效代碼說明8.1框架添加方法 （其中621為框架的寬度，538為框架的高度，1.htm為框架內(nèi)顯示內(nèi)容的文件名）8.2透明flash的應(yīng)用主要應(yīng)用于網(wǎng)頁頂部，代碼如下：classid=clsid:d27cdb6e-ae6d-11cf-96b8-444553540000 codebase=/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0 width=773 height=112 （其中：“773”為flash的寬度，“112”為flash的高度，“images/banner%5b1%5d.swf”為flash的存在路徑，“”是對flash背景進(jìn)行透明化。）8.3字體向上滾動效果 “實(shí)干闖未來”廣告創(chuàng)意設(shè)計大賽揭曉 (marquee文字移動的代碼, direction=up表示滾動的方向是上滾；onmouseout=this.start();表示鼠標(biāo)移開開始滾動；onmouseover=this.stop()“表示鼠標(biāo)移開停止?jié)L動）九、網(wǎng)站制作使用工具介紹9.1 dreamweaver mx 2004是macromedia公司最新推出的一款可視化的專業(yè)級html（超文本標(biāo)識語言）編輯器。它是一款構(gòu)建專業(yè)web站點(diǎn)和應(yīng)用程序的最佳選擇，它組合了功能強(qiáng)大的布局工具、應(yīng)用程序開發(fā)工具和代碼編輯支持。dreamweaver的設(shè)計和整合功能是以css為基礎(chǔ)的，強(qiáng)大而穩(wěn)定，可幫助設(shè)計人員和開發(fā)人員輕松創(chuàng)建和管理任何站點(diǎn).。9.2 photoshop是adobe公司推出的著名平面圖像設(shè)計和圖像處理軟件，它具有強(qiáng)大的圖像處理功能和操作易用性，受到廣大平面圖形設(shè)計人員及專業(yè)廣告設(shè)計師的青睞。它涉及圖像合成、色彩校正、圖層調(diào)板、通道使用、動作調(diào)板、路徑工具、濾鏡等圖像處理功能。可制作如按鈕制作、文字特效、材質(zhì)紋理、三維物體、影像特效及廣告創(chuàng)意設(shè)計等多種用途。是一門值得深入學(xué)習(xí)的一種好軟件。9.3 flash是macromedia公司的一個的網(wǎng)頁交互動畫制作工具。用flash制作出來的動化是矢量的，不管怎樣放大、縮小，它還是清晰可見。 用flash制作的文件很小，這樣便于在互聯(lián)網(wǎng)上傳輸，而且它采用了數(shù)據(jù)流技術(shù)，只要下載一部分，就能欣賞動畫，而且能一邊播放一邊傳輸數(shù)據(jù)。 交互性更是flash動畫的迷人之處，可以通過點(diǎn)擊按鈕、選擇菜單來控制動畫的播放。正是有了這些優(yōu)點(diǎn)，才使flash日益成為網(wǎng)絡(luò)多媒體的主流。十、設(shè)計小結(jié)畢業(yè)設(shè)計是大學(xué)生涯中最重要的一關(guān)，在大學(xué)中所學(xué)到的知識基本上會在這里體現(xiàn)出來。終于做完了畢業(yè)設(shè)計，感觸頗深，這其中的艱辛與歡樂只有自己最清楚。101收獲這次畢業(yè)設(shè)計的制作的過程中，無論是技術(shù)上的還是非技術(shù)上的，都是收獲頗多。首先，在做畢業(yè)設(shè)計之前對dreamweaver還算是比較生疏的，因?yàn)橹吧系恼n程不多，接觸的也不多。做了這個畢業(yè)設(shè)計過程中，遇到不懂的問題就上網(wǎng)查資料、到圖書館借書，或者向同學(xué)、老師討教。技術(shù)上的東西學(xué)的還是挺多的。其次，由于我是和同學(xué)合作去制作這個網(wǎng)站的，因此在這過程中會想法思路不一樣，會產(chǎn)生一些分歧，所以我們倆就會把效果做出來，演示給同學(xué)看，讓她們提出看法，最后再決定用誰的方案。因此，在這過程中我領(lǐng)悟到團(tuán)隊(duì)合作的重要性。102不足把做完的網(wǎng)頁從頭到尾瀏覽了幾遍，發(fā)現(xiàn)其中還存在很多的問題。后臺程序很多都不懂，一開始很努力的研究，查找一大堆的資料，去做會員登錄系統(tǒng)。該設(shè)置的設(shè)置完了，access數(shù)據(jù)庫也建好了，就是在鏈接過程中不知道哪里出了問題，一直沒做成功。到最后，所剩時間不多，只好套用了一個別人的