【文章內(nèi)容簡(jiǎn)介】 第 2 章 關(guān)鍵技術(shù)介紹0第 2 章　關(guān)鍵技術(shù)介紹 CSS+Div 概述CSS 是一組格式設(shè)置規(guī)則，用于控制 Web 頁(yè)面的外觀。通過(guò)使用 CSS 樣式設(shè)置頁(yè)面的格式，可將頁(yè)面的內(nèi)容與表現(xiàn)形式分離。頁(yè)面內(nèi)容存放在 HTML 文檔中，而用于定義表現(xiàn)形式的 CSS 規(guī)則則存放在另一個(gè)文件中或 HTML 文檔的某一部分，通常為文件頭部分。將內(nèi)容與表現(xiàn)形式分離，不僅可使維護(hù)站點(diǎn)的外觀更加容易，而且還可以使 HTML 文檔代碼更加簡(jiǎn)練，縮短瀏覽器的加載時(shí)間。DIV 在編程中又叫做整除，即只得商的整數(shù)。DIV 元素是用來(lái)為 HTML 文檔內(nèi)大塊的內(nèi)容提供結(jié)構(gòu)和背景的元素。DIV 的起始標(biāo)簽和結(jié)束標(biāo)簽之間的所有內(nèi)容都是用來(lái)構(gòu)成這個(gè)塊的，其中所包含元素的特性由 DIV 標(biāo)簽的屬性來(lái)控制，或者是通過(guò)使用樣式表格式化這個(gè)塊來(lái)進(jìn)行控制。DIV+CSS 是網(wǎng)站標(biāo)準(zhǔn)中常用術(shù)語(yǔ)之一，通常為了說(shuō)明與 HTML 網(wǎng)頁(yè)設(shè)計(jì)語(yǔ)言中的表格（table）定位方式的區(qū)別，因?yàn)?XHTML 網(wǎng)站設(shè)計(jì)標(biāo)準(zhǔn)中，不再使用表格定位技術(shù)，而是采用 DIV+CSS 的方式實(shí)現(xiàn)各種定位。DIV+CSS 的優(yōu)勢(shì)（1）符合 W3C 標(biāo)準(zhǔn)。微軟等公司均為 W3C 支持者。這一點(diǎn)是最重要的，因?yàn)檫@保證您的網(wǎng)站不會(huì)因?yàn)閷?lái)網(wǎng)絡(luò)應(yīng)用的升級(jí)而被淘汰。 （2）支持瀏覽器的向后兼容，也就是無(wú)論未來(lái)的瀏覽器大戰(zhàn)，勝利的是 IE7 或者是火狐，您的網(wǎng)站都能很好的兼容。（3）搜索引擎更加友好。相對(duì)與傳統(tǒng)的 table：采用 DIV+CSS 技術(shù)的網(wǎng)頁(yè)，對(duì)于搜索引擎的收錄更加友好。 （4）樣式的調(diào)整更加方便。內(nèi)容和樣式的分離，使頁(yè)面和樣式的調(diào)整變得更加方便。 現(xiàn)在 YAHOO，MSN 等國(guó)際門戶網(wǎng)站，網(wǎng)易，新浪等國(guó)內(nèi)門戶網(wǎng)站，和主流的 網(wǎng)站，均采用 DIV+CSS 的框架模式，更加印證了 DIV+CSS 是大勢(shì)所趨。（5）CSS 的極大優(yōu)勢(shì)表現(xiàn)在簡(jiǎn)潔的代碼，對(duì)于一個(gè)大型網(wǎng)站來(lái)說(shuō)，可以節(jié)省大量帶寬，而且眾所周知，搜索引擎喜歡清潔的代碼。（6）表現(xiàn)和結(jié)構(gòu)分離，在團(tuán)隊(duì)開(kāi)發(fā)中更容易分工合作而減少相互關(guān)聯(lián)性。信息學(xué)院畢業(yè)設(shè)計(jì)（論文） 第 2 章 關(guān)鍵技術(shù)介紹0 Photoshop 概述Photoshop 是 Adobe 公司旗下最為出名的圖像處理軟件之一 Photoshop 可分為圖像編輯、圖像合成、校色調(diào)色及特效制作部分。圖像編輯是圖像處理的基礎(chǔ)，可以對(duì)圖像做各種變換如放大、縮小、旋轉(zhuǎn)、傾斜、鏡象、透視等。也可進(jìn)行復(fù)制、去除斑點(diǎn)、修補(bǔ)、修飾圖象的殘損等。這在婚紗攝影、人像處理制作中有非常大的用場(chǎng)，去除人像上不滿意的部分，進(jìn)行美化加工，得到讓人非常滿意的效果。圖象合成則是將幾幅圖象通過(guò)圖層操作、工具應(yīng)用合成完整的、傳達(dá)明確意義的圖象，這是美術(shù)設(shè)計(jì)的必經(jīng)之路。photoshop 提供的繪圖工具讓外來(lái)圖象與創(chuàng)意很好地融合，成為可能使圖象的合成無(wú)衣無(wú)縫。校色調(diào)色是 photoshop 中深具威力的功能之一，可方便快捷地對(duì)圖象的顏色進(jìn)行明暗、色編的調(diào)整和校正，也可在不同顏色進(jìn)行切換以滿足圖象在不同領(lǐng)域如網(wǎng)頁(yè)設(shè)計(jì)、印刷、多媒體等方面應(yīng)用。特效制作在 photoshop 中主要由濾鏡、通道及工具綜合應(yīng)用完成。包括圖象的特效創(chuàng)意和特效字的制作，如油畫、浮雕、石膏畫、素描等常用的傳統(tǒng)美術(shù)技巧都可藉由photoshop 特效完成。而各種特效字的制作更是很多美術(shù)設(shè)計(jì)師熱衷于 photoshop 的研究的原因。 Dreamweaver 介紹什么是 Dreamweaver？工欲善其事，必先利其器。Dreamweaver 在多媒體方面頗有建樹的 Macromedia 公司推出的可視化網(wǎng)頁(yè)制作工具，它與 Flash、Fireworks 合在一起被稱為網(wǎng)頁(yè)制作三劍客，這三個(gè)軟件相輔相承，是制作網(wǎng)頁(yè)的最佳選擇。其中，Dreamweaver 主要用來(lái)制作網(wǎng)頁(yè)文件，制作出來(lái)的網(wǎng)頁(yè)兼容性比較好，制作效率也很高。支持最新的 Web 技術(shù)，包含 HTML 檢查、 HTML 格式控制、HTML 格式化選項(xiàng)、HomeSite/BBEdit 捆綁、可視化網(wǎng)頁(yè)設(shè)計(jì)、圖像編輯、全局查找替換、全 FTP 功能、處理 Flash 和 Shockwave 等富媒體格式和動(dòng)態(tài) HTML、基于團(tuán)隊(duì)的 Web 創(chuàng)作。在編輯上你可以選擇可視化方式或者你喜歡的源碼編輯方式。Dreamweaver 有如下特性： （1）動(dòng)態(tài)跨瀏覽器驗(yàn)證：自動(dòng)檢測(cè)標(biāo)簽和 CSS 規(guī)則來(lái)適應(yīng)所有主流瀏覽器。 （2）更強(qiáng)大的 CSS 支持。信息學(xué)院畢業(yè)設(shè)計(jì)（論文） 第 2 章 關(guān)鍵技術(shù)介紹1（3）內(nèi)建的圖形編輯引擎：修剪，改變大小，尺寸，旋轉(zhuǎn)角度，調(diào)節(jié)明暗度都不離開(kāi) Dreamweaver 環(huán)境，因?yàn)樗旧砑闪?FW 的基本圖形編輯技術(shù)。（4）安全 FTP：完全加密傳輸保證文件和帳號(hào)信息的安全。（5）增強(qiáng)對(duì)當(dāng)今技術(shù)的支持：支持當(dāng)今主流的開(kāi)放環(huán)境：ColdFusion，J2EE，PHP，.NET，和其他主流的服務(wù)器技術(shù)。Dreamweaver 現(xiàn)在加入了XML 命名空間支持， 表單控件對(duì)象，新的參考書內(nèi)容和新的 PHP 服務(wù)器端行為。（6）無(wú)縫整合外部文件和代碼：直接將 Word 和 Excel 文檔復(fù)制和粘貼到Dreamweaver 中，會(huì)保留字體，顏色，CSS 樣式表信息。使用系統(tǒng)支持的編碼保存任何字體，包括雙字節(jié)字符集。（7）緊密整合 MM 的其他工具：加強(qiáng)了和 MM 其他幾款產(chǎn)品的協(xié)同工作能力，例如：你可以通過(guò) DW 直接設(shè)置 Flash 組件的參數(shù)。Flash 用來(lái)制作精美的網(wǎng)頁(yè)動(dòng)畫，而 Fireworks 用來(lái)處理網(wǎng)頁(yè)中的圖形。Dreamweaver 是現(xiàn)在非常流行的一種做網(wǎng)頁(yè)的軟件，它集合了很多技術(shù)，使我們網(wǎng)頁(yè)做起來(lái)更加得心應(yīng)手，更加快捷方便，在靜態(tài)網(wǎng)頁(yè)中是一個(gè)很好的軟件，它的使用可以讓我們做的更快更方便，而頁(yè)面的效果也會(huì)更好看。 Flash 介紹什么是 Flash? Flash 是美國(guó) Macromedia 公司出品的矢量圖形編輯和動(dòng)畫創(chuàng)作的軟件，是當(dāng)今Inter 上最流行動(dòng)畫作品(如網(wǎng)上各種動(dòng)感網(wǎng)頁(yè)、 LOGO、廣告、MTV、游戲和高質(zhì)量的課件等) 的制作工具，并成為實(shí)事上的交互式矢量動(dòng)畫標(biāo)準(zhǔn)，就連軟件巨頭微軟也不得不在其新版的 Inter Explorer 內(nèi)嵌 Flash 播放器。由于在 Flash 中采用了矢量作圖技術(shù)，各元素均為矢量，因此只用少量的數(shù)據(jù)就可以描述一個(gè)復(fù)雜的對(duì)象，從而大大減少動(dòng)畫文件的大小。而且矢量圖像還有一個(gè)優(yōu)點(diǎn)，就可以真正做到無(wú)極放大和縮小，你可以將一幅圖像任意地縮放，而不會(huì)有任何失真。它是全球流行的電腦動(dòng)畫設(shè)計(jì)軟件，它代表軟件制作的流行于網(wǎng)絡(luò)的動(dòng)畫作品。Flash 是一種交互式矢量多媒體技術(shù)，他的前身是 Futureplash，早期網(wǎng)上流行的矢量動(dòng)畫插件。后來(lái)由于 Macromedia 公司收購(gòu)了 Future Splash 以后便將其改名為 Flash2，到現(xiàn)在最新的 flash4?，F(xiàn)在網(wǎng)上已經(jīng)有成千上萬(wàn)個(gè) Flash 站點(diǎn)，著名的如 Macromedia 專門 ShockRave 站點(diǎn)，全部采用了信息學(xué)院畢業(yè)設(shè)計(jì)（論文） 第 2 章 關(guān)鍵技術(shù)介紹1Shockwave Flash 和 Director?？梢哉f(shuō) Flash 已經(jīng)漸漸成為交互式知量的標(biāo)準(zhǔn)，未來(lái)網(wǎng)頁(yè)的一大主流。Flash被稱為是“最為靈活的前臺(tái)” ，由于其獨(dú)特的時(shí)間片段分割（TimeLine）和重組（MC 嵌套）技術(shù)，結(jié)合 ActionScitp 的對(duì)象和流程控制，使得在靈活的界面設(shè)計(jì)和動(dòng)畫設(shè)計(jì)成為可能，同時(shí)它也是最為小巧的前臺(tái)。Flash 具有跨平臺(tái)的特性，所以無(wú)論你處于處于何種平臺(tái)，只要你安裝了支持的 Flash Player，就可以保證它們的最終顯示效果的一致，而不必像在以前的網(wǎng)頁(yè)設(shè)計(jì)中那樣為 IE 或 NetSpace 各設(shè)計(jì)一個(gè)版本。同Java 一樣，它有很強(qiáng)的可移植性。最新的 Flash 還具有的手機(jī)支持功能，可以讓用戶為自已的手機(jī)設(shè)計(jì)喜愛(ài)的功能。當(dāng)然首先必需要有支持 Flash 的手機(jī)，同時(shí)它還可以應(yīng)用于 Pocket PC。Flash 特別適用于創(chuàng)建通過(guò) Inter 提供的內(nèi)容，因?yàn)樗奈募浅Ｐ?。Flash 是通過(guò)廣泛使用矢量圖形做到這一點(diǎn)的。與位圖圖形相比，矢量圖形需要的內(nèi)存和存儲(chǔ)空間小很多，因?yàn)樗鼈兪且詳?shù)學(xué)公式而不是大型數(shù)據(jù)集來(lái)表示的。位圖圖形之所以更大，是因?yàn)閳D像中的每個(gè)像素都需要一組單獨(dú)的數(shù)據(jù)來(lái)表示。要在 Flash 中構(gòu)建應(yīng)用程序，可以使用 Flash 繪圖工具創(chuàng)建圖形，并將其它媒體元素導(dǎo)入 Flash 文檔。接下來(lái)，定義如何以及何時(shí)使用各個(gè)元素來(lái)創(chuàng)建設(shè)想中的應(yīng)用程序。時(shí)間軸用來(lái)通知 Flash 顯示圖形和其它項(xiàng)目元素的時(shí)間，也可以使用時(shí)間軸指定舞臺(tái)上各圖形的分層順序。位于較高圖層中的圖形顯示在較低圖層中的圖形的上方。庫(kù)面板是 Flash 顯示 Flash 文檔中的媒體元素列表的位置。ActionScript 代碼可用來(lái)向文檔中的媒體元素添加交互式內(nèi)容。例如，可以添加代碼以便用戶在單擊某按鈕時(shí)顯示一幅新圖像，還可以使用 ActionScript 向應(yīng)用程序添加邏輯。邏輯使應(yīng)用程序能夠根據(jù)用戶的操作和其它情況采取不同的工作方式。Flash 包括兩個(gè)版本的 ActionScript，可滿足創(chuàng)作者的不同具體需要。Flash 包含了許多種功能，如預(yù)置的拖放用戶界面組件，可以輕松地將 ActionScript 添加到文檔的內(nèi)置行為，以及可以添加到媒體對(duì)象的特殊效果。這些功能使 Flash 不僅功能強(qiáng)大，而且易于使用。完成 Flash 文檔的創(chuàng)作后，可以使用“文件”“發(fā)布”命令發(fā)布它。這會(huì)創(chuàng)建文件的一個(gè)壓縮版本，其擴(kuò)展名為 .swf (SWF)。然后，就可以使用 Flash Player 在 Web 瀏覽器中播放 SWF 文件，或者將其作為獨(dú)立的應(yīng)用程序進(jìn)行播放。信息學(xué)院畢業(yè)設(shè)計(jì)（論文） 第 3 章 網(wǎng)站分析與設(shè)計(jì)8第 3 章　網(wǎng)站分析與設(shè)計(jì) 網(wǎng)站頁(yè)面設(shè)計(jì)與分析 網(wǎng)站頁(yè)面設(shè)計(jì)結(jié)構(gòu)圖圖 網(wǎng)頁(yè)設(shè)計(jì)結(jié)構(gòu)圖（1）優(yōu)惠券分類版塊優(yōu)惠券導(dǎo)航板塊介紹了新的優(yōu)惠信息，優(yōu)惠券的分類，各種不同類型的優(yōu)惠券，把種類分開(kāi)，讓消費(fèi)者一目了然，知道各種優(yōu)惠信息和各種打折信息，讓消費(fèi)者得到優(yōu)惠的實(shí)惠，得到利益。方便消費(fèi)者找到他們感興趣的電子優(yōu)惠券。（2）商家信息板塊商家信息板塊提供了商家免費(fèi)使用的優(yōu)惠券，讓消費(fèi)者得到真正的實(shí)惠，從而吸引更多的人注意網(wǎng)站。商家公布一些自己店鋪的優(yōu)惠券信息，在讓更多的下載優(yōu)惠券的同時(shí)，其實(shí)也是一種宣傳手法，利用網(wǎng)絡(luò)優(yōu)惠券網(wǎng)站這個(gè)平臺(tái)，可以讓更多的人知道的商鋪，同時(shí)打印下載優(yōu)惠券，這樣既有宣傳，又有經(jīng)濟(jì)效益的提高，是一舉兩得，一箭雙雕的好事情。同時(shí)有商家排行信息。（3）消費(fèi)者社區(qū)板塊信息學(xué)院畢業(yè)設(shè)計(jì)（論文） 第 3 章 網(wǎng)站分析與設(shè)計(jì)8消費(fèi)者社區(qū)是讓消費(fèi)者可以進(jìn)行交流的地方，通過(guò)消費(fèi)者者之間的交流互動(dòng)，消費(fèi)者之間可以得到更多的信息資源，網(wǎng)站也可以了解消費(fèi)者的需求，以便更好完善網(wǎng)站的建設(shè)，吸引更多的消費(fèi)者來(lái)本網(wǎng)站。（4）會(huì)員注冊(cè)板塊消費(fèi)在在這一模塊可以完成會(huì)員的注冊(cè)，成為注冊(cè)會(huì)員。注冊(cè)時(shí)要填寫用戶名，密碼，手機(jī)號(hào)碼，Email ，等信息。網(wǎng)站可以根據(jù)會(huì)員的信息，收集數(shù)據(jù)，數(shù)據(jù)挖掘，根據(jù)消費(fèi)者的愛(ài)好進(jìn)行消費(fèi)券的推薦。而且通過(guò)在線時(shí)間長(zhǎng)短和下載量的多少對(duì)會(huì)員級(jí)別進(jìn)行升級(jí)。升級(jí)后可以等到更多的優(yōu)惠和更多的免費(fèi)體驗(yàn)機(jī)會(huì)。同時(shí)，還可以幫網(wǎng)站綁住一大批消費(fèi)者，為網(wǎng)站帶來(lái)更大的利益。會(huì)員制還可以積分，讓消費(fèi)者得到更大的實(shí)惠，在消費(fèi)的基礎(chǔ)上得到快樂(lè)和實(shí)惠。 網(wǎng)站的特點(diǎn) 網(wǎng)站的文化，為消費(fèi)者提供最省錢的信息和各種優(yōu)惠券的下載。通過(guò)網(wǎng)站的功能可以實(shí)現(xiàn)優(yōu)惠券的下載，和其它消費(fèi)者進(jìn)行交流。 技術(shù)可行性分析Dreamweaver 是集網(wǎng)頁(yè)制作和管理網(wǎng)站于一身的所見(jiàn)即所得網(wǎng)頁(yè)編輯器，它是第一套針對(duì)專業(yè)網(wǎng)頁(yè)設(shè)計(jì)師特別發(fā)展的視覺(jué)化網(wǎng)頁(yè)開(kāi)發(fā)工具，利用它可以輕