E時代電子優(yōu)惠券網(wǎng)站的設(shè)計與制作—畢業(yè)設(shè)計

1、-i- 畢業(yè)設(shè)計（論文）任務(wù)書畢業(yè)設(shè)計（論文）任務(wù)書畢業(yè)設(shè)計（論文）題目：畢業(yè)設(shè)計（論文）題目：e 時代電子優(yōu)惠券網(wǎng)站的設(shè)計與制作設(shè)計（論文）的基本內(nèi)容：設(shè)計（論文）的基本內(nèi)容： 本課題主要利用“dreamweaver” 、 “flash” 、photoshop 等技術(shù)和工具設(shè)計并實現(xiàn)電子優(yōu)惠券推介網(wǎng)站，采用靜態(tài)網(wǎng)頁完成網(wǎng)站的設(shè)計，網(wǎng)站將包括網(wǎng)站 logo、flash 動畫，個性素材，并且網(wǎng)站將保持統(tǒng)一風(fēng)格，利用外部 css 描述頁面顯示樣式，頁面布局采用 div 方法。本網(wǎng)站實現(xiàn)四個主要模塊：會員注冊、優(yōu)惠券分類、商家信息、消費(fèi)者社區(qū)。畢業(yè)設(shè)計（論文）專題部分：畢業(yè)設(shè)計（論文）專題部分：題目

2、：題目：設(shè)計或論文專題的基本內(nèi)容：設(shè)計或論文專題的基本內(nèi)容： 學(xué)生接受畢業(yè)設(shè)計（論文）題目日期學(xué)生接受畢業(yè)設(shè)計（論文）題目日期第第 1 周周-ii-指導(dǎo)教師簽字：指導(dǎo)教師簽字：2009 年年 12 月月 1 日日東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 摘要-iii-e 時代電子優(yōu)惠券網(wǎng)站的設(shè)計與制作摘 要隨著信息技術(shù)日益滲透到社會經(jīng)濟(jì)和生活的方方面面，沒有人可以否認(rèn) internet 帶來的巨大變化和革命性的影響。21 世紀(jì)人類生活模式和商業(yè)模式等將全面發(fā)生轉(zhuǎn)型并表現(xiàn)為網(wǎng)絡(luò)模式，即生活網(wǎng)絡(luò)話和商業(yè)網(wǎng)絡(luò)話。internet 是目前世界上最大的計算機(jī)互聯(lián)網(wǎng)絡(luò)，它遍布全球，將世界各地各種規(guī)模的網(wǎng)絡(luò)連接

3、成一個整體。作為 internet 上一種先進(jìn)的，易于被人們所接受的信息檢索手段，world wide web(簡稱 www)發(fā)展十分迅速，成為目前世界上最大的信息資源寶庫。 ，一種真正能發(fā)揮 internet 效能的電子商務(wù)技術(shù)正在向我們走來。電子商務(wù)的發(fā)展非常迅速，電子貿(mào)易額劇增。電子優(yōu)惠券是隨著 internet 技術(shù)的迅速發(fā)展和普及應(yīng)用順應(yīng)網(wǎng)絡(luò)迅猛發(fā)展的潮流，實行的網(wǎng)上在線的電子優(yōu)惠打折券，網(wǎng)友只需要從網(wǎng)上下載打印電子優(yōu)惠券，在消費(fèi)時向商家出示即可享受商家的優(yōu)惠打折承諾。電子優(yōu)惠券既省去了商家的印刷和發(fā)送傳統(tǒng)印刷優(yōu)惠券的成本，又方便了消費(fèi)者的使用。本文從網(wǎng)站的需求分析，簡要設(shè)計，詳細(xì)布

4、局，網(wǎng)站的實現(xiàn)等方面入手，經(jīng)過仔細(xì)分析，采用 div+css 網(wǎng)頁開發(fā)技術(shù)，設(shè)計并實現(xiàn)了一個信息較為完善的 e 時代電子優(yōu)惠券網(wǎng)站。經(jīng)過了細(xì)致的分析，基本滿足用戶的需求。dreamweaver 靜態(tài)網(wǎng)頁的制作可以使頁面更美觀和更實用清楚。并且運(yùn)用了 photoshop，flash 等工具軟件對網(wǎng)站進(jìn)行了美化和加工。e 時代電子優(yōu)惠券網(wǎng)站主要實現(xiàn)了，優(yōu)惠券的分類，商家信息，消費(fèi)者社區(qū)與會員注冊功能。會員注冊可以讓消費(fèi)者積分等優(yōu)惠政策更加的省錢。在優(yōu)惠券分類專區(qū)可以快捷的到達(dá)想要瀏覽的網(wǎng)頁，更加直觀。在消費(fèi)者社區(qū)可以發(fā)布消息和回復(fù)帖子和更多的網(wǎng)友進(jìn)行互動，分享消費(fèi)心得。商家信息的介紹，讓消費(fèi)者了解

5、優(yōu)惠券的商家，更加直觀和做到了良好的宣傳。關(guān)鍵詞：關(guān)鍵詞：電子商務(wù)，電子優(yōu)惠券，div+css，dreamweaver東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） abstract-e age of electronic coupon website design and productionabstractwith the increasing penetration of information technology into all aspects of the socio-economic and life, no one can deny that internet has brought

6、great changes and revolutionary impact. in the 21st century, mode of human life and mode of business will change into mode of network, that is life and business relying on network. internet is the worlds largest computer network, it is all over the world, of all sizes around the world as a whole net

7、work connection.as a means of information retrieval on internet, advanced, easy to be accepted by the people, the world wide web (abbreviated www) has developed very quickly become the worlds largest treasure trove of information resources. an e-commerce technology that can really raise performance

8、of internet is coming to us now. e-commerce development is very rapid, e-trade also increases.e-coupons, with the rapid development of internet technology and wider application conform to the trend of rapid development of network and implement an electronic discount online discount coupons, users on

9、ly need to print from the internet to download e-coupons, the consumer can produce, to the business commitment to enjoy preferential discounts. e-coupon avoid the cost of both print and eliminating for merchants, but also convenient for consumers to use. finally, in the consumer community modules co

10、nsumers can interact and share consumer experiences.this article with the website of the needs analysis, outline design, detailed design, system implementation and other aspects, using div + css web development technology, design and implementation of a more comprehensive information on e-coupon web

11、 site e of the times. after a detailed analysis, basically meet the needs of users. e times coupon site mainly achieved, the registration and login function of the consumer to complete a log of consumption in the navigation module.key words: e-commerce; electronic coupon; div + css; dreamweaver; 東北大

12、學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 目錄-1-目 錄任務(wù)書i摘 要iiabstractiii第 1 章緒 論11.1 課題背景.11.2 國內(nèi)外現(xiàn)狀.21.3 預(yù)期實現(xiàn)的功能與目標(biāo).3第 2 章關(guān)鍵技術(shù)介紹42.1 css+div 概述.42.2 photoshop 概述.52.3 dreamweaver 概述.52.4 flash 介紹.6第 3 章網(wǎng)站分析與設(shè)計83.1 網(wǎng)站頁面設(shè)計與分析.83.1.1 網(wǎng)站頁面設(shè)計結(jié)構(gòu)圖.83.2 系統(tǒng)開發(fā)環(huán)境.93.3 技術(shù)可行性分析.93.4 頁面布局設(shè)計與分析.93.4.1 網(wǎng)站目錄圖.93.4.2 一級頁面布局設(shè)計分析.103.4.3 二級頁面布局設(shè)

13、計分析.123.4.4 三級頁面布局設(shè)計分析.123.5 網(wǎng)站各級頁面設(shè)計.13東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 目錄-2-3.5.1 首頁設(shè)計.133.5.2 二級頁面設(shè)計.143.5.3 三級頁面設(shè)計.15第 4 章 網(wǎng)站實現(xiàn)164.1 首頁布局和滾動圖片的實現(xiàn).164.2 導(dǎo)航條實現(xiàn).184.3 會員注冊模塊的實現(xiàn).194.4 優(yōu)惠券詳細(xì)畫面實現(xiàn).204.5 圖像實現(xiàn).204.5.1 素材圖片制作.204.5.2 logo 設(shè)計.224.5.3 flash 的制作.234.5.4 css 外部的實現(xiàn).24第 5 章 網(wǎng)站測試265.1 網(wǎng)站測試目的.265.2 測試中遇到的問題與解決

14、辦法.265.3 測試結(jié)果.27第 6 章結(jié)論28參考文獻(xiàn)29致 謝30東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 第 1 章 緒論-1-第第 1 章章緒緒 論論1.1 課題背景課題背景伴隨著網(wǎng)絡(luò)的興起及網(wǎng)絡(luò)技術(shù)的發(fā)展，電子商務(wù)隨之興起而得到發(fā)展。電子商務(wù)，是指實現(xiàn)整個貿(mào)易活動的電子化。從涵蓋范圍方面可以定義為：交易各方以電子交易方式而不是通過當(dāng)面交換或直接面談方式進(jìn)行的任何形式的商業(yè)交易；從技術(shù)方面可以定義為：電子商務(wù)是一種多技術(shù)的集合體，包括交換數(shù)據(jù)、獲得數(shù)據(jù)以及自動捕獲數(shù)據(jù)等。電子商務(wù)從狹義的角度講，是以互聯(lián)網(wǎng)為主題，以信息流、物流和資金流為支撐的先進(jìn)的商務(wù)模式；廣義的角度講是基于電子信息網(wǎng)絡(luò)

15、的生產(chǎn)、流通和消費(fèi)的全新的社會經(jīng)濟(jì)活動。電子商務(wù)的涵蓋范圍在不斷擴(kuò)展，電子信息網(wǎng)絡(luò)不僅僅是互聯(lián)網(wǎng)，還包括電信網(wǎng)、電視網(wǎng)和其他的電子信息網(wǎng)絡(luò)，這個網(wǎng)絡(luò)是廣泛的。國家現(xiàn)在強(qiáng)調(diào)重視電子商務(wù)，發(fā)展電子商務(wù)。發(fā)展電子商務(wù)目的就是將交易電子化從而降低交易成本，提高效率，獲得更大的利益。時下，電子優(yōu)惠券已經(jīng)成為都市消費(fèi)者購物新潮流，它做為一種新型的營銷載體，為商家提供細(xì)分消費(fèi)者服務(wù)，以最低的資源成本找到最有價值的目標(biāo)消費(fèi)者，用最低的營銷成本來為消費(fèi)者提供精準(zhǔn)產(chǎn)品與服務(wù)，而不是為大眾的消費(fèi)者提供產(chǎn)品與服務(wù)。同時優(yōu)惠券的電子化也為消費(fèi)者帶來了方便實用的利益，更加有目的、更加主動地搜索優(yōu)惠信息，滿足不斷變化的個性

16、化需求。電子優(yōu)惠券伴隨著網(wǎng)絡(luò)發(fā)展和普及，才逐漸進(jìn)入人們的生活，當(dāng)這種消費(fèi)理念、消費(fèi)方式能讓更多的人接受時，它的發(fā)展將勢不可擋。隨著 3g 浪潮的洶涌襲來，應(yīng)運(yùn)而生的電子優(yōu)惠券已經(jīng)成為時下都市消費(fèi)新潮流，作為國內(nèi)優(yōu)秀的一級電信內(nèi)容提供商，新一代手機(jī)電子優(yōu)惠券，憑借其更為方便、快捷的使用方式，享受消費(fèi)優(yōu)惠的特權(quán)，給我國消費(fèi)者帶來了一種全新的消費(fèi)模式和理財觀念。其同時兼具無線傳輸和為商家特設(shè)的數(shù)據(jù)統(tǒng)計、分析等功能以及先贏利，后付費(fèi)的先進(jìn)營銷手法廣受商家好評。更難能可貴的是其低投入、高回報的投資收益令運(yùn)營商競相追捧。曾幾何時，為了買一臺可以打折的空調(diào)，還要等商家舉行“空調(diào)節(jié)”這樣的活；或者為了獲取一張

17、建材家居商場的優(yōu)惠卡，還非要苦苦等待消費(fèi)累計多少才能得到?，F(xiàn)在，這種現(xiàn)象將逐漸淡出消費(fèi)者的視線，商家已逐漸意識到圍繞消費(fèi)者需求進(jìn)行更東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 第 1 章 緒論-1-人性化，更靈活的促銷的重要性，也開始借助很多創(chuàng)新的手段來吸引消費(fèi)者。近日，家電銷售和家居建材領(lǐng)域的兩大巨頭永樂生活電器、東方家園先后與提供電子優(yōu)惠券解決方案的酷鵬網(wǎng)展開合作。前者是提供注冊會員專享的 95 折優(yōu)惠，后者則是推出“東方家園會員卡” ，即消費(fèi)者在酷鵬網(wǎng)注冊會員后，憑券可以換取相應(yīng)的折扣卡，可在其的連鎖店消費(fèi)時享受折扣優(yōu)惠。據(jù)酷鵬網(wǎng)的監(jiān)測數(shù)據(jù)顯示，目前在北京、上海、廣州等國內(nèi)互聯(lián)網(wǎng)應(yīng)用較為發(fā)達(dá)的

18、城市，使用電子優(yōu)惠券享受這種主、便捷且真正帶來實惠的消費(fèi)者人數(shù)，正在以幾何級的速度迅速增多。而這種時尚的消費(fèi)新潮流的背后則是商家與酷鵬網(wǎng)這樣專注于電子優(yōu)惠券服務(wù)的公司在積極進(jìn)行合作，擴(kuò)大電子優(yōu)惠券使用范圍和應(yīng)用領(lǐng)域。同樣是來自酷鵬網(wǎng)提供的數(shù)據(jù)，目前該網(wǎng)站合作的商家已經(jīng)突破了 2 萬家，幾乎覆蓋所有消費(fèi)領(lǐng)域，其最熱門的就是餐飲娛樂和百貨購物，而該網(wǎng)站每月目前更新超過 1 萬張電子優(yōu)惠券，而且這些優(yōu)惠券的信息真實性、可靠性都得到酷鵬網(wǎng)的驗證。因此，有不少對互聯(lián)網(wǎng)敏感的人士驚呼，電子優(yōu)惠券的時代已然來臨，永樂生活電器和東方家園這兩個率先吃“電子優(yōu)惠券”這只螃蟹的商家只是兩個縮影罷了。1.2 國內(nèi)外現(xiàn)

19、狀國內(nèi)外現(xiàn)狀優(yōu)惠券作為一種銷售促進(jìn)的手段，從現(xiàn)代市場營銷理論和實踐的誕生初期，就已經(jīng)為商家所熟知并運(yùn)用，電子優(yōu)惠券不過是其在數(shù)字新媒體技術(shù)條件下的發(fā)展?，F(xiàn)代商業(yè)和營銷最為發(fā)達(dá)的美國，無論在傳統(tǒng)優(yōu)惠券的實踐、推廣、理論研究還是電子優(yōu)惠券的探索方面，都有很多值得我們借鑒的地方。大型企業(yè)主導(dǎo)的 b2b 成為其全球競爭力的重要組成。美國 b2b 電子商務(wù)發(fā)展的特點(diǎn)是：以大型企業(yè)為主導(dǎo)，以集成供應(yīng)鏈管理為起點(diǎn)，以降低成本為主要目標(biāo)。其主要表現(xiàn)形式為：大型企業(yè)首先利用 ict 信息平臺，在整合企業(yè)內(nèi)部流程和信息資源基礎(chǔ)上，進(jìn)一步向上游的供應(yīng)商和下游的客戶擴(kuò)展，打通與上下游的信息流、資金流和物流，從而改善溝

20、通效率和服務(wù)質(zhì)量，大幅度降低交易成本、庫存成本、生產(chǎn)成本和采購成本，通過全球化資源配置提高競爭優(yōu)勢，這構(gòu)成了美國 b2b 電子商務(wù)發(fā)展的主流模式。國內(nèi)中小企業(yè)電子商務(wù)應(yīng)用呈現(xiàn)“多渠道、立體化、主動性加強(qiáng)”特征 中小企業(yè)電子商務(wù)應(yīng)用在開拓市場、擴(kuò)大銷售、降低成本等方面取得了明顯成效：約 50%的企業(yè)從更大的地域范圍進(jìn)行采購和銷售，49%的企業(yè)增加了客戶，41%企業(yè)降低了營銷成東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 第 1 章 緒論-2-本， 44%的企業(yè)提升了網(wǎng)上零售與購物迅猛發(fā)展就網(wǎng)上零售市場的增速而言，2008 年典型網(wǎng)上零售市場美國和韓國的數(shù)字分別是 4.16%（從 2001 年到 2007

21、 年，美國網(wǎng)上零售環(huán)比增速均在20%左右，2008 年因經(jīng)濟(jì)危機(jī)原因下滑到 4.16%）和 15.65%，中國增長率為137.18%，2009 年中國網(wǎng)絡(luò)購物市場交易規(guī)模達(dá) 2483.5 億元同比增長 93.7%，增速遠(yuǎn)超韓美。1.3 預(yù)期實現(xiàn)的功能與目標(biāo)預(yù)期實現(xiàn)的功能與目標(biāo)在網(wǎng)站中，素材全由 phtotshop 制作，加工。網(wǎng)站利用外部 css 描述頁面顯示樣式，頁面布局采用 div 方法，使得網(wǎng)站風(fēng)格統(tǒng)一，布局合理、清晰。在網(wǎng)站頁面中含有大量電子優(yōu)惠券下載和各種功能，讓消費(fèi)享受更多優(yōu)惠的特權(quán)，給我國消費(fèi)者帶來了一種全新的消費(fèi)模式和理財觀念。本網(wǎng)站將實現(xiàn) 5 部分內(nèi)容：首頁優(yōu)惠券導(dǎo)航：優(yōu)惠券

22、的分類，各種不同類型的優(yōu)惠券，把種類分開，讓消費(fèi)者一目了然，知道各種優(yōu)惠信息和各種打折信息，讓消費(fèi)者得到優(yōu)惠的實惠，得到利益。目的是更加快捷，更加方便。會員注冊：讓消費(fèi)者可以注冊，成為 vip，成為注冊會員，每個人都有自己的資料和可以根據(jù)自己的愛好得到消費(fèi)券的推薦。通過在線的時間長短和下載量的多少得到升級，升級之后可以得到一些優(yōu)惠政策，比如享受打折優(yōu)惠，和一些免費(fèi)試用的東西。有自己的會員信息，還可以申請 e 時代網(wǎng)站的會員卡，這樣可以更加的便宜，還可以攢積分。商家信息：提供一些商家優(yōu)惠券的信息，讓消費(fèi)者得到真正的好處，從而吸引更多的人關(guān)注自己的網(wǎng)站，讓得到試用的人寫下自己的心得體會，從而增加消

23、費(fèi)者的興趣和購物的信心。消費(fèi)者社區(qū)：讓消費(fèi)者可以進(jìn)行交流的地方，通過消費(fèi)者之間的互動，讓大家得到交流與更多的信息資源，有了更好的互動環(huán)節(jié)，對網(wǎng)站的可持續(xù)性也得到了更打的提高。優(yōu)惠券分類：現(xiàn)在肯德基，麥當(dāng)勞各種洋快餐盛行，各種服飾，各種化妝品各種行業(yè)細(xì)分的很清楚，把優(yōu)惠券歸類，讓消費(fèi)者可以更快更清楚的找到優(yōu)惠政策，和各行各業(yè)的優(yōu)惠信息，這樣對網(wǎng)站的發(fā)展也是有好處的，消費(fèi)者更愿意上可以更快更方東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 第 1 章 緒論-3-便找到信息的網(wǎng)站。 東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 第 2 章 關(guān)鍵技術(shù)介紹-4-第第 2 章章關(guān)鍵技術(shù)介紹關(guān)鍵技術(shù)介紹2.1 css+div

24、 概述概述css 是一組格式設(shè)置規(guī)則，用于控制 web 頁面的外觀。通過使用 css 樣式設(shè)置頁面的格式，可將頁面的內(nèi)容與表現(xiàn)形式分離。頁面內(nèi)容存放在 html 文檔中，而用于定義表現(xiàn)形式的 css 規(guī)則則存放在另一個文件中或 html 文檔的某一部分，通常為文件頭部分。將內(nèi)容與表現(xiàn)形式分離，不僅可使維護(hù)站點(diǎn)的外觀更加容易，而且還可以使 html 文檔代碼更加簡練，縮短瀏覽器的加載時間。div 在編程中又叫做整除，即只得商的整數(shù)。div 元素是用來為 html 文檔內(nèi)大塊的內(nèi)容提供結(jié)構(gòu)和背景的元素。div 的起始標(biāo)簽和結(jié)束標(biāo)簽之間的所有內(nèi)容都是用來構(gòu)成這個塊的，其中所包含元素的特性由 div

25、標(biāo)簽的屬性來控制，或者是通過使用樣式表格式化這個塊來進(jìn)行控制。div+css 是網(wǎng)站標(biāo)準(zhǔn)中常用術(shù)語之一，通常為了說明與 html 網(wǎng)頁設(shè)計語言中的表格（table）定位方式的區(qū)別，因為 xhtml 網(wǎng)站設(shè)計標(biāo)準(zhǔn)中，不再使用表格定位技術(shù)，而是采用 div+css 的方式實現(xiàn)各種定位。div+css 的優(yōu)勢（1）符合 w3c 標(biāo)準(zhǔn)。微軟等公司均為 w3c 支持者。這一點(diǎn)是最重要的，因為這保證您的網(wǎng)站不會因為將來網(wǎng)絡(luò)應(yīng)用的升級而被淘汰。 （2）支持瀏覽器的向后兼容，也就是無論未來的瀏覽器大戰(zhàn)，勝利的是 ie7 或者是火狐，您的網(wǎng)站都能很好的兼容。（3）搜索引擎更加友好。相對與傳統(tǒng)的 table：采用

26、 div+css 技術(shù)的網(wǎng)頁，對于搜索引擎的收錄更加友好。 （4）樣式的調(diào)整更加方便。內(nèi)容和樣式的分離，使頁面和樣式的調(diào)整變得更加方便。 現(xiàn)在 yahoo，msn 等國際門戶網(wǎng)站，網(wǎng)易，新浪等國內(nèi)門戶網(wǎng)站，和主流的web2.0 網(wǎng)站，均采用 div+css 的框架模式，更加印證了 div+css 是大勢所趨。（5）css 的極大優(yōu)勢表現(xiàn)在簡潔的代碼，對于一個大型網(wǎng)站來說，可以節(jié)省大量帶寬，而且眾所周知，搜索引擎喜歡清潔的代碼。（6）表現(xiàn)和結(jié)構(gòu)分離，在團(tuán)隊開發(fā)中更容易分工合作而減少相互關(guān)聯(lián)性。東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 第 2 章 關(guān)鍵技術(shù)介紹-5-2.2 photoshop 概述概述

27、photoshop 是 adobe 公司旗下最為出名的圖像處理軟件之一 photoshop 可分為圖像編輯、圖像合成、校色調(diào)色及特效制作部分。圖像編輯是圖像處理的基礎(chǔ)，可以對圖像做各種變換如放大、縮小、旋轉(zhuǎn)、傾斜、鏡象、透視等。也可進(jìn)行復(fù)制、去除斑點(diǎn)、修補(bǔ)、修飾圖象的殘損等。這在婚紗攝影、人像處理制作中有非常大的用場，去除人像上不滿意的部分，進(jìn)行美化加工，得到讓人非常滿意的效果。圖象合成則是將幾幅圖象通過圖層操作、工具應(yīng)用合成完整的、傳達(dá)明確意義的圖象，這是美術(shù)設(shè)計的必經(jīng)之路。photoshop 提供的繪圖工具讓外來圖象與創(chuàng)意很好地融合，成為可能使圖象的合成無衣無縫。校色調(diào)色是 photosh

28、op 中深具威力的功能之一，可方便快捷地對圖象的顏色進(jìn)行明暗、色編的調(diào)整和校正，也可在不同顏色進(jìn)行切換以滿足圖象在不同領(lǐng)域如網(wǎng)頁設(shè)計、印刷、多媒體等方面應(yīng)用。特效制作在 photoshop 中主要由濾鏡、通道及工具綜合應(yīng)用完成。包括圖象的特效創(chuàng)意和特效字的制作，如油畫、浮雕、石膏畫、素描等常用的傳統(tǒng)美術(shù)技巧都可藉由photoshop 特效完成。而各種特效字的制作更是很多美術(shù)設(shè)計師熱衷于 photoshop 的研究的原因。2.3 dreamweaver 介紹介紹什么是 dreamweaver？工欲善其事，必先利其器。dreamweaver 在多媒體方面頗有建樹的 macromedia 公司推出的

29、可視化網(wǎng)頁制作工具，它與 flash、fireworks 合在一起被稱為網(wǎng)頁制作三劍客，這三個軟件相輔相承，是制作網(wǎng)頁的最佳選擇。其中，dreamweaver 主要用來制作網(wǎng)頁文件，制作出來的網(wǎng)頁兼容性比較好，制作效率也很高。支持最新的 web 技術(shù)，包含 html 檢查、html 格式控制、html 格式化選項、homesite/bbedit 捆綁、可視化網(wǎng)頁設(shè)計、圖像編輯、全局查找替換、全 ftp 功能、處理 flash 和 shockwave 等富媒體格式和動態(tài) html、基于團(tuán)隊的 web 創(chuàng)作。在編輯上你可以選擇可視化方式或者你喜歡的源碼編輯方式。dreamweaver 有如下特性：

30、 （1）動態(tài)跨瀏覽器驗證：自動檢測標(biāo)簽和 css 規(guī)則來適應(yīng)所有主流瀏覽器。 （2）更強(qiáng)大的 css 支持。東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 第 2 章 關(guān)鍵技術(shù)介紹-6-（3）內(nèi)建的圖形編輯引擎：修剪，改變大小，尺寸，旋轉(zhuǎn)角度，調(diào)節(jié)明暗度都不離開 dreamweaver 環(huán)境，因為它本身集成了 fw 的基本圖形編輯技術(shù)。（4）安全 ftp：完全加密傳輸保證文件和帳號信息的安全。（5）增強(qiáng)對當(dāng)今技術(shù)的支持：支持當(dāng)今主流的開放環(huán)境：coldfusion，j2ee，php，.net，和其他主流的服務(wù)器技術(shù)。dreamweaver 現(xiàn)在加入了xml 命名空間支持，asp.net 表單控件對象，新

31、的參考書內(nèi)容和新的 php 服務(wù)器端行為。（6）無縫整合外部文件和代碼：直接將 word 和 excel 文檔復(fù)制和粘貼到dreamweaver 中，會保留字體，顏色，css 樣式表信息。使用系統(tǒng)支持的編碼保存任何字體，包括雙字節(jié)字符集。（7）緊密整合 mm 的其他工具：加強(qiáng)了和 mm 其他幾款產(chǎn)品的協(xié)同工作能力，例如：你可以通過 dw 直接設(shè)置 flash 組件的參數(shù)。flash 用來制作精美的網(wǎng)頁動畫，而 fireworks 用來處理網(wǎng)頁中的圖形。dreamweaver 是現(xiàn)在非常流行的一種做網(wǎng)頁的軟件，它集合了很多技術(shù)，使我們網(wǎng)頁做起來更加得心應(yīng)手，更加快捷方便，在靜態(tài)網(wǎng)頁中是一個很好的

32、軟件，它的使用可以讓我們做的更快更方便，而頁面的效果也會更好看。2.4 flash 介紹介紹什么是 flash? flash 是美國 macromedia 公司出品的矢量圖形編輯和動畫創(chuàng)作的軟件，是當(dāng)今internet 上最流行動畫作品(如網(wǎng)上各種動感網(wǎng)頁、logo、廣告、mtv、游戲和高質(zhì)量的課件等)的制作工具，并成為實事上的交互式矢量動畫標(biāo)準(zhǔn)，就連軟件巨頭微軟也不得不在其新版的 internet explorer 內(nèi)嵌 flash 播放器。由于在 flash 中采用了矢量作圖技術(shù)，各元素均為矢量，因此只用少量的數(shù)據(jù)就可以描述一個復(fù)雜的對象，從而大大減少動畫文件的大小。而且矢量圖像還有一個優(yōu)

33、點(diǎn)，就可以真正做到無極放大和縮小，你可以將一幅圖像任意地縮放，而不會有任何失真。它是全球流行的電腦動畫設(shè)計軟件，它代表軟件制作的流行于網(wǎng)絡(luò)的動畫作品。flash 是一種交互式矢量多媒體技術(shù)，他的前身是 futureplash，早期網(wǎng)上流行的矢量動畫插件。后來由于 macromedia 公司收購了 future splash 以后便將其改名為 flash2，到現(xiàn)在最新的 flash4。現(xiàn)在網(wǎng)上已經(jīng)有成千上萬個 flash 站點(diǎn)，著名的如 macromedia 專門 shockrave 站點(diǎn)，全部采用了東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 第 2 章 關(guān)鍵技術(shù)介紹-7-shockwave flas

34、h 和 director?？梢哉f flash 已經(jīng)漸漸成為交互式知量的標(biāo)準(zhǔn)，未來網(wǎng)頁的一大主流。flash被稱為是“最為靈活的前臺” ，由于其獨(dú)特的時間片段分割（timeline）和重組（mc 嵌套）技術(shù)，結(jié)合 actionscitp 的對象和流程控制，使得在靈活的界面設(shè)計和動畫設(shè)計成為可能，同時它也是最為小巧的前臺。flash 具有跨平臺的特性，所以無論你處于處于何種平臺，只要你安裝了支持的 flash player，就可以保證它們的最終顯示效果的一致，而不必像在以前的網(wǎng)頁設(shè)計中那樣為 ie 或 netspace 各設(shè)計一個版本。同java 一樣，它有很強(qiáng)的可移植性。最新的 flash 還具

35、有的手機(jī)支持功能，可以讓用戶為自已的手機(jī)設(shè)計喜愛的功能。當(dāng)然首先必需要有支持 flash 的手機(jī)，同時它還可以應(yīng)用于 pocket pc。flash 特別適用于創(chuàng)建通過 internet 提供的內(nèi)容，因為它的文件非常小。flash 是通過廣泛使用矢量圖形做到這一點(diǎn)的。與位圖圖形相比，矢量圖形需要的內(nèi)存和存儲空間小很多，因為它們是以數(shù)學(xué)公式而不是大型數(shù)據(jù)集來表示的。位圖圖形之所以更大，是因為圖像中的每個像素都需要一組單獨(dú)的數(shù)據(jù)來表示。要在 flash 中構(gòu)建應(yīng)用程序，可以使用 flash 繪圖工具創(chuàng)建圖形，并將其它媒體元素導(dǎo)入 flash 文檔。接下來，定義如何以及何時使用各個元素來創(chuàng)建設(shè)想中的

36、應(yīng)用程序。時間軸用來通知 flash 顯示圖形和其它項目元素的時間，也可以使用時間軸指定舞臺上各圖形的分層順序。位于較高圖層中的圖形顯示在較低圖層中的圖形的上方。庫面板是 flash 顯示 flash 文檔中的媒體元素列表的位置。actionscript 代碼可用來向文檔中的媒體元素添加交互式內(nèi)容。例如，可以添加代碼以便用戶在單擊某按鈕時顯示一幅新圖像，還可以使用 actionscript 向應(yīng)用程序添加邏輯。邏輯使應(yīng)用程序能夠根據(jù)用戶的操作和其它情況采取不同的工作方式。flash 包括兩個版本的 actionscript，可滿足創(chuàng)作者的不同具體需要。flash 包含了許多種功能，如預(yù)置的拖放

37、用戶界面組件，可以輕松地將 actionscript 添加到文檔的內(nèi)置行為，以及可以添加到媒體對象的特殊效果。這些功能使 flash 不僅功能強(qiáng)大，而且易于使用。完成 flash 文檔的創(chuàng)作后，可以使用“文件”“發(fā)布”命令發(fā)布它。這會創(chuàng)建文件的一個壓縮版本，其擴(kuò)展名為 .swf (swf)。然后，就可以使用 flash player 在 web 瀏覽器中播放 swf 文件，或者將其作為獨(dú)立的應(yīng)用程序進(jìn)行播放。東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 第 3 章 網(wǎng)站分析與設(shè)計-8-第第 3 章章網(wǎng)站分析與設(shè)計網(wǎng)站分析與設(shè)計3.1 網(wǎng)站頁面設(shè)計與分析網(wǎng)站頁面設(shè)計與分析3.1.1 網(wǎng)站頁面網(wǎng)站頁面設(shè)計

38、結(jié)構(gòu)圖設(shè)計結(jié)構(gòu)圖圖 3.1 網(wǎng)頁設(shè)計結(jié)構(gòu)圖（1）優(yōu)惠券分類版塊優(yōu)惠券導(dǎo)航板塊介紹了新的優(yōu)惠信息，優(yōu)惠券的分類，各種不同類型的優(yōu)惠券，把種類分開，讓消費(fèi)者一目了然，知道各種優(yōu)惠信息和各種打折信息，讓消費(fèi)者得到優(yōu)惠的實惠，得到利益。方便消費(fèi)者找到他們感興趣的電子優(yōu)惠券。（2）商家信息板塊商家信息板塊提供了商家免費(fèi)使用的優(yōu)惠券，讓消費(fèi)者得到真正的實惠，從而吸引更多的人注意網(wǎng)站。商家公布一些自己店鋪的優(yōu)惠券信息，在讓更多的下載優(yōu)惠券的同時，其實也是一種宣傳手法，利用網(wǎng)絡(luò)優(yōu)惠券網(wǎng)站這個平臺，可以讓更多的人知道的商鋪，同時打印下載優(yōu)惠券，這樣既有宣傳，又有經(jīng)濟(jì)效益的提高，是一舉兩得，一箭雙雕的好事情。同時

39、有商家排行信息。（3）消費(fèi)者社區(qū)板塊東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 第 3 章 網(wǎng)站分析與設(shè)計-8-消費(fèi)者社區(qū)是讓消費(fèi)者可以進(jìn)行交流的地方，通過消費(fèi)者者之間的交流互動，消費(fèi)者之間可以得到更多的信息資源，網(wǎng)站也可以了解消費(fèi)者的需求，以便更好完善網(wǎng)站的建設(shè)，吸引更多的消費(fèi)者來本網(wǎng)站。（4）會員注冊板塊消費(fèi)在在這一模塊可以完成會員的注冊，成為注冊會員。注冊時要填寫用戶名，密碼，手機(jī)號碼，e-mail，等信息。網(wǎng)站可以根據(jù)會員的信息，收集數(shù)據(jù)，數(shù)據(jù)挖掘，根據(jù)消費(fèi)者的愛好進(jìn)行消費(fèi)券的推薦。而且通過在線時間長短和下載量的多少對會員級別進(jìn)行升級。升級后可以等到更多的優(yōu)惠和更多的免費(fèi)體驗機(jī)會。同時，還可

40、以幫網(wǎng)站綁住一大批消費(fèi)者，為網(wǎng)站帶來更大的利益。會員制還可以積分，讓消費(fèi)者得到更大的實惠，在消費(fèi)的基礎(chǔ)上得到快樂和實惠。3.2 網(wǎng)站網(wǎng)站的特點(diǎn)的特點(diǎn) 網(wǎng)站的文化，為消費(fèi)者提供最省錢的信息和各種優(yōu)惠券的下載。通過網(wǎng)站的功能可以實現(xiàn)優(yōu)惠券的下載，和其它消費(fèi)者進(jìn)行交流。3.3 技術(shù)可行性分析技術(shù)可行性分析dreamweaver 是集網(wǎng)頁制作和管理網(wǎng)站于一身的所見即所得網(wǎng)頁編輯器，它是第一套針對專業(yè)網(wǎng)頁設(shè)計師特別發(fā)展的視覺化網(wǎng)頁開發(fā)工具，利用它可以輕而易舉地制作出跨越平臺限制和跨越瀏覽器限制的充滿動感的網(wǎng)頁。采用 div+css 進(jìn)行設(shè)計，div+css 是網(wǎng)站標(biāo)準(zhǔn)（或稱“web 標(biāo)準(zhǔn)” ）中常用的術(shù)

41、語之一，通常為了說明與 html 網(wǎng)頁設(shè)計語言中的表格（table）定位方式的區(qū)別，因為 xhtml 網(wǎng)站設(shè)計標(biāo)準(zhǔn)中，不再使用表格定位技術(shù)，而是采用 div+css 的方式實現(xiàn)各種定位。flash 是一種多媒體制作的軟件，可以制作動態(tài)圖片，小動畫，讓網(wǎng)站整體看來更加動態(tài)，更加美觀和大方，使人們?yōu)g覽的同時得到視覺享受，使網(wǎng)站更加美觀。photoshop 更是現(xiàn)時非常流行的圖片處理軟件，現(xiàn)代人十分熱衷于修改自己的照片，讓圖片看起來更美觀和更有特殊的效果。它可以更改圖片的各種效果，制作圖片，修改圖片。3.4 頁面布局設(shè)計與分析頁面布局設(shè)計與分析東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 第 3 章 網(wǎng)站分

42、析與設(shè)計-10-3.4.1 網(wǎng)站目錄圖網(wǎng)站目錄圖建立站點(diǎn)，打開 dreamweaver 菜單欄，新建站點(diǎn)，給站點(diǎn)起名并打上域名，單擊“下一步” ，選擇“否，我不想使用服務(wù)器技術(shù)”點(diǎn)擊“下一步” ，選擇本地文件夾，不連接到遠(yuǎn)程， “下一步” ，單擊完成。服務(wù)器各個目錄如下圖 3.2 所示。圖 3.2 網(wǎng)站站點(diǎn)和目錄圖images 目錄：images 文件內(nèi)存放網(wǎng)站所需的圖像文件。css 目錄：css 文件存放網(wǎng)站所需的 css 樣式文件。html 目錄：html 文件存放一級頁面，二級頁面和三級頁面。index.html： 首頁。3.4.2 一級頁面布局一級頁面布局設(shè)計分析設(shè)計分析首頁是一個網(wǎng)站

43、的大門。進(jìn)入網(wǎng)站，首先看到的就是網(wǎng)站的首頁。所以首頁必須做的經(jīng)典。首頁的功效也要鮮明，各個功能的分類和各個模塊都要清楚。logo 的設(shè)計也是很重要的，好的 logo 可以讓更多的瀏覽者印象深刻，從而對網(wǎng)站的推廣起到的良好的作用，網(wǎng)站得到了推廣，就會有更多的人來瀏覽網(wǎng)站，知名度就得到了提高，有了良好的口碑。首頁讓瀏覽者第一眼就能記住。本網(wǎng)站的首頁的布局如圖 3.3 所示。東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 第 3 章 網(wǎng)站分析與設(shè)計-11-圖 3.3 首頁布局圖banner：banner 是一種網(wǎng)絡(luò)廣告形式。本網(wǎng)站在 banner 位置采用 flash 設(shè)計。畫面更新穎，更具動感。這樣目的是為

44、了給瀏覽者深刻印象，讓瀏覽的人能容易的記住本網(wǎng)站。導(dǎo)航條：分為首頁，關(guān)于我們，優(yōu)惠券分類，商家信息，消費(fèi)者社區(qū)，會員注冊。這些都是為了游客了解網(wǎng)站中頁面的設(shè)置以及分類，方便消費(fèi)者尋找所需的頁面。logo 設(shè)計：logo 的設(shè)計是網(wǎng)站品牌的體現(xiàn)，由于它的出現(xiàn)，可以讓消費(fèi)者記住網(wǎng)站的名稱及網(wǎng)站的信息，方便得到推廣和宣傳。優(yōu)惠信息：提供最新下載信息和下載排行量的體現(xiàn)讓消費(fèi)者知道現(xiàn)在流行資訊，方便下載，并提供品牌優(yōu)惠券的下載，更加方便。關(guān)于我們：以文字的形式向瀏覽者介紹我們服務(wù)的產(chǎn)品，我們的目標(biāo)，我們的實力，我們宗旨。商家圖片展示：把商家的圖片以滾動的形式放在這個欄目，可以更清晰更直觀的東北大學(xué)東軟信

45、息學(xué)院畢業(yè)設(shè)計（論文） 第 3 章 網(wǎng)站分析與設(shè)計-12-看到各種商家店鋪信息，方便對比優(yōu)惠券上面的信息。友情鏈接：把和網(wǎng)站有關(guān)系的網(wǎng)站放在這個欄目，讓消費(fèi)者可以去別的網(wǎng)站瀏覽。 3.4.3 二級頁面布局設(shè)計分析二級頁面布局設(shè)計分析在本頁面中，用優(yōu)惠分類，論壇信息等形式推廣網(wǎng)站，來向消費(fèi)者推介電子優(yōu)惠券。讓消費(fèi)者更清晰明了。消費(fèi)者社區(qū)頁面布局如下圖 3.4 所示。圖 3.4 消費(fèi)者社區(qū)二級頁面布局圖3.4.4 三級頁面布局設(shè)計分析三級頁面布局設(shè)計分析優(yōu)惠券分類詳細(xì)信息，消費(fèi)者社區(qū)詳細(xì)頁面是對本網(wǎng)站具體功能的完善和詳細(xì)介紹。三級頁面是優(yōu)惠券的詳細(xì)分析和具體實施的頁面。在消費(fèi)者論壇里可以有具體發(fā)帖

46、子的使用，讓消費(fèi)者可以暢所欲言。讓消費(fèi)者具體實施操作，得到更多的優(yōu)惠政策和更多的實惠。消費(fèi)者社區(qū)詳細(xì)內(nèi)容布局如圖 3.5 所示。東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 第 3 章 網(wǎng)站分析與設(shè)計-13-圖 3.5 消費(fèi)者社區(qū)三級頁面詳細(xì)布局圖3.5 網(wǎng)站各級頁面設(shè)計網(wǎng)站各級頁面設(shè)計3.5.1 首頁設(shè)計首頁設(shè)計首頁作為網(wǎng)站的“臉面” ，是整個網(wǎng)站建設(shè)的“龍頭工程”,其直接關(guān)系到網(wǎng)站的形象，要想從當(dāng)今社會鋪天蓋地的網(wǎng)絡(luò)信息中脫穎而出，首先得有一個特別的首頁，來體現(xiàn)整個網(wǎng)站的風(fēng)格和形象。如何在信息傳播形態(tài)上辦出特色，提供網(wǎng)絡(luò)多種服務(wù)功能，在網(wǎng)絡(luò)空間擴(kuò)展自己的影響力, 直接關(guān)系到它是否能吸引更多網(wǎng)民進(jìn)入

47、站內(nèi)瀏覽.對于網(wǎng)絡(luò)媒體而言，人們對于網(wǎng)絡(luò)信息的接收首先是通過其首頁的“形”來把握的，可以說,網(wǎng)絡(luò)首頁首先是一種“形”的表達(dá)，信息可能以任何方式傳播，其真正的價值在于內(nèi)容，但若其形式不能引起人們的關(guān)注，其內(nèi)容的價值也無法得到真正的體現(xiàn)。具體設(shè)計如圖 3.6 所示首頁圖設(shè)計。東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 第 3 章 網(wǎng)站分析與設(shè)計-14-圖 3.6 首頁設(shè)計圖3.5.2 二級頁面設(shè)計二級頁面設(shè)計二級頁面把信息歸類，為消費(fèi)者提供了各個方面的信息，可以更快的找到需要的信息和優(yōu)惠券。具體設(shè)計如圖 3.7 所示 二級頁面設(shè)計圖。東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 第 3 章 網(wǎng)站分析與設(shè)計-15

48、-圖 3.7 二級頁面設(shè)計圖3.5.3 三級頁面設(shè)計三級頁面設(shè)計三級頁面是優(yōu)惠券，商家，論壇的詳細(xì)信息，消費(fèi)者進(jìn)入后可以下載優(yōu)惠券，清晰的看到各類詳細(xì)信息，如圖 3.8 所示。圖 3.8 三級頁面設(shè)計圖東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 第 4 章 網(wǎng)站實現(xiàn)-16-第第 4 章章網(wǎng)站實現(xiàn)網(wǎng)站實現(xiàn)4.1 首頁布局首頁布局和滾動圖片的實現(xiàn)和滾動圖片的實現(xiàn)在我們剛學(xué)習(xí)網(wǎng)頁制作時，總是習(xí)慣先考慮外觀，考慮圖片、字體、顏色以及布局等所有表現(xiàn)在頁面上的內(nèi)容。但是外觀并不是最重要的，相反最終用戶在訪問網(wǎng)頁時的體驗應(yīng)該是優(yōu)先要考慮的。一個由 div+css 布局且結(jié)構(gòu)良好的頁面可以通過調(diào)整css 的定義，在

49、任何地方、任何網(wǎng)絡(luò)設(shè)備上以任何外觀表現(xiàn)出來，而且利用 div+css布局方式構(gòu)建的網(wǎng)頁能夠簡化網(wǎng)頁代碼、加快網(wǎng)頁顯示速度，因此 div+css 已經(jīng)成為目前流行的網(wǎng)頁布局方式，也是網(wǎng)頁設(shè)計和制作人員必需掌握的技能之一。本論文選用 div+css 方式對頁面布局。background-color 屬性是定義背景顏色。font 屬性是定義字體。padding 屬性是定義內(nèi)邊距。margin 屬性是定義外邊距。color 屬性是定義顏色。text-align 屬性對齊元素中的文本。line-height 屬性設(shè)置行間的距離。（1）首頁實現(xiàn)如下如圖 4.1 所示。圖 4.1 網(wǎng)站首頁東北大學(xué)東軟信息學(xué)

50、院畢業(yè)設(shè)計（論文） 第 4 章 網(wǎng)站實現(xiàn)-17-（2）首頁滾動圖片的實現(xiàn)，利用滾動的圖片讓瀏覽網(wǎng)頁的消費(fèi)者可以更直觀清楚的看到商家的信息和店鋪的樣子，更可以隨自己的心意去選擇自己喜歡店鋪的優(yōu)惠券去下載，更方便，更有利于消費(fèi)者的選擇。如圖 4.2 所示。圖 4.2 商家滾動圖片滾動代碼如下： 4.2 導(dǎo)航條實現(xiàn)導(dǎo)航條實現(xiàn)導(dǎo)航條是指通過一定的技術(shù)手段，為網(wǎng)站的瀏覽者提供一定的途徑，使其可以方便地訪問到所需的內(nèi)容，是人們?yōu)g覽網(wǎng)站時可以快速從一個頁面轉(zhuǎn)到另一個頁面的快速通道。利用導(dǎo)航條，游客就可以快速找到想要瀏覽的頁面，同時消費(fèi)者在瀏覽網(wǎng)站東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 第 4 章 網(wǎng)站實現(xiàn)-1

51、8-過程中方便快捷。在本網(wǎng)站中，以淺灰色的背景配以黑色的字體，凸現(xiàn)導(dǎo)航條。這樣是為了讓瀏覽者感到導(dǎo)航條在整個網(wǎng)站中清晰明了，脫穎而出的效果。 首頁 關(guān)于我們 優(yōu)惠券分類 商家信息 消費(fèi)者社區(qū) 會員注冊 4.3 會員注冊模塊的實現(xiàn)會員注冊模塊的實現(xiàn)如果用戶對我們網(wǎng)站有什么好的建議和意見，或者用戶對于某些方面的問題想要咨詢，可以直接在網(wǎng)站上進(jìn)行注冊，用戶點(diǎn)擊導(dǎo)航條上的“會員注冊” ，系統(tǒng)將自動跳轉(zhuǎn)到會員注冊界面，界面顯示如下圖 4.3 所示。東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 第 4 章 網(wǎng)站實現(xiàn)-19-圖 4.3 會員注冊頁面用戶在這個界面上可以看到具體的聯(lián)系方式，如果想直接用電話和我們聯(lián)系，

52、可以直接撥打網(wǎng)頁上留下的電話號碼。如果用戶想通過電子郵件與我們?nèi)〉寐?lián)系，可以在“姓名”一欄中輸入自己的姓名，在 email 一欄里寫下自己的郵箱，然后再留言中寫下意見、建議或者是問題等。確認(rèn)無誤后可以點(diǎn)擊“發(fā)送”按鈕，系統(tǒng)會自動將郵件發(fā)到指定的郵箱，待我們查看郵件后，會按照用戶提供的郵箱地址進(jìn)行信息的反饋。這個模塊起到了鏈接用戶和網(wǎng)站管理者的作用，是溝通快捷方便。4.4 優(yōu)惠券詳細(xì)畫面實現(xiàn)優(yōu)惠券詳細(xì)畫面實現(xiàn)優(yōu)惠券詳細(xì)設(shè)計畫面是對消費(fèi)者選定的電子優(yōu)惠券進(jìn)行詳細(xì)的介紹。方便消費(fèi)者對電子優(yōu)惠券進(jìn)一步了解，包括使用方式和有效時間等。更方便消費(fèi)者的選擇。優(yōu)惠券的下載打印是具體實施的步驟，它要提供下載打印

53、的功能，是具體操作的階段，打印張數(shù)，打印方法都要有實施。優(yōu)惠券詳細(xì)畫面具體實現(xiàn)如圖 4.4 所示。東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 第 4 章 網(wǎng)站實現(xiàn)-20-圖 4.4 優(yōu)惠券詳細(xì)頁面4.5 圖像實現(xiàn)圖像實現(xiàn)4.5.1 素材圖片素材圖片制作制作photoshop 是圖像處理軟件之一。本網(wǎng)站制作運(yùn)用到了 photoshop 中圖像編輯、圖像合成、校色調(diào)色的功能。photoshop 幫助本網(wǎng)站制作了很多精美的圖象。為本網(wǎng)站制作提供了大量有用的素材。圖像編輯是圖像處理的基礎(chǔ)，可以對圖像做各種變換如放大、縮小、旋轉(zhuǎn)、傾斜、鏡象、透視等。也可進(jìn)行復(fù)制、去除斑點(diǎn)、修補(bǔ)、修飾圖像的殘損等。photos

54、hop 幫助本網(wǎng)站對一些不滿意的圖片進(jìn)行加工，美化。圖像合成則是將幾幅圖像通過圖層操作、工具應(yīng)用合成完整的、傳達(dá)明確意義的圖像，這是美術(shù)設(shè)計的必經(jīng)之路。photoshop 提供的繪圖工具讓外來圖像與創(chuàng)意很好地融合，成為可能使圖像的合成天衣無縫。 本網(wǎng)站將一些圖象中對網(wǎng)站有用的部分取出來，整合成單獨(dú)的圖象。校色調(diào)色是 photoshop 中深具威力的功能之一，可方便快捷地對圖像的顏色進(jìn)行明暗、色編的調(diào)整和校正，也可在不同顏色進(jìn)行切換以滿足圖像在網(wǎng)頁設(shè)方面應(yīng)用。 本網(wǎng)站對一些圖像的色彩進(jìn)行調(diào)整，使得圖像更搭配網(wǎng)站色彩。東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 第 4 章 網(wǎng)站實現(xiàn)-21-（1）新建一個

55、背景，在新建一個圖層 1，利用投影效果和填充顏色，制作出左面的橙色梯形。在橙色部分加入文本框，改變字體。在右上角在加入文本框，輸入“e 時代”網(wǎng)站的網(wǎng)址信息。在分別在中間部分插入 2 個文本框，分別輸入打折信息 4.5 折和商鋪的地址聯(lián)系信息等。如圖 4.5 所示。圖 4.5 未完成素材圖片（2）在左下角加入圖片 logo：先打開 logo 然后利用套索動能，截取出需要的圓形部分。然后在插入左下角，和背景重疊在一起。右下角插入文本框，輸入網(wǎng)站手機(jī)版網(wǎng)址，改變字體和顏色。如圖 4.6 所示。東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 第 4 章 網(wǎng)站實現(xiàn)-22-圖 4.6 完成的素材圖片4.5.2 l

56、ogo 設(shè)計設(shè)計（1）在 logo 的設(shè)計上突出體現(xiàn)色彩性，用 4 個圖層建立 4 個浮雕效果的圓，體現(xiàn)網(wǎng)站的網(wǎng)址和網(wǎng)站的性質(zhì)。e 時代網(wǎng)站，專業(yè)電子優(yōu)惠券網(wǎng)站。如圖 4.7 所示。圖 4.7 logo 設(shè)計東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 第 4 章 網(wǎng)站實現(xiàn)-23-（2）把制作好的 logo 復(fù)制到新的頁面，插入“e 時代，最省錢”文本，調(diào)整字體大小，在利用字體的條幅方向，制作字體的方向，右側(cè)在插入圖片。利用濾鏡庫。如圖4.8。圖 4.8 網(wǎng)站圖片設(shè)計4.5.3 flash 的制作的制作在網(wǎng)頁中插入 flash 對象能給網(wǎng)頁增添不少動感。利用 flash 里的關(guān)鍵幀技術(shù)，制作一個動態(tài)的

57、 flash 如圖 4.9 所示。東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 第 4 章 網(wǎng)站實現(xiàn)-24-圖 4.9 flash 制作4.5.4 css 外部的實現(xiàn)外部的實現(xiàn)網(wǎng)站采用外部 css 描述顯示樣式約束網(wǎng)頁 div 框架。css 樣式對 div 進(jìn)行約束樣例代碼，例如網(wǎng)站右側(cè)處的 div+css，代碼如下。.center_contentwidth:900px;padding:0px 0 0 0;background:url(images/center_bg.gif) no-repeat center top;.left_contentwidth:490px;float:left;paddi

58、ng:20px 0 20px 20px;.left_content h1 font-size:14px; color:#000; float:left; width:490px.wy_list width:280px; float:left; margin:0 0 0 30px; float:left;.wy_list li line-height:22px; text-align:left; width:280px; list-style-type:none; float:left.right_contentwidth:370px;float:left;東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文）

59、第 4 章 網(wǎng)站實現(xiàn)-25-padding:20px 0 20px 20px;.titlecolor:#993a4e;padding:0px;float:left;font-size:19px;margin:10px 0 10px 0;span.title_iconfloat:left;padding:0 5px 0 0;.prod_titlecolor:#993a4e;padding:5px 0 0 15px;font-size:13px;a.morefont-style:italic;color:#993a4e;float:right;text-decoration:none;font-s

60、ize:11px;padding:0px 15px 0 0 ;.aboutwidth:337px;clear:both;background:url(images/border.gif) no-repeat bottom center;padding:0 0 50px 0;img.rightfloat:right;東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 第 4 章 網(wǎng)站實現(xiàn)-26-padding:0 0 0 30px;.right_boxwidth:170px;float:left;padding:10px 0 0 0;東北大學(xué)東軟信息學(xué)院畢業(yè)設(shè)計（論文） 第 5 章 網(wǎng)站測試-27-第第 5