基于Dreamweaver的剪紙文化網(wǎng)設(shè)計

吳立志

摘要：本設(shè)計以Dreamweaver作為開發(fā)工具，設(shè)計并制作一個關(guān)于剪紙文化的網(wǎng)站，以方便更多的人了解剪紙文化。該網(wǎng)站是集有關(guān)剪紙的文本、圖片、視頻、音頻等于一體的綜合網(wǎng)站，系統(tǒng)地介紹剪紙文化，以剪紙圖片鑒賞為重點，旨在利用現(xiàn)代網(wǎng)絡(luò)技術(shù)來更好的闡述傳統(tǒng)文化。

關(guān)鍵詞：Dreamweaver;剪紙文化;網(wǎng)頁設(shè)計

剪紙是民間藝術(shù)的一種，是以紙為加工對象，以剪刀（或刻刀）為工具進行創(chuàng)作的藝術(shù)，以鏤空藝術(shù)為主要的表現(xiàn)方式，在視覺上給人以透空的感覺和藝術(shù)享受。在古代裝飾紋樣上，曾牽動和影響著我國歷代民間工藝的裝飾風(fēng)格，同時又是我國民間圖案的基本造型手段。今天，Interne飛速發(fā)展，互聯(lián)網(wǎng)已成為人們快速獲取、發(fā)布和傳遞信息的重要渠道，它在人們的政治、經(jīng)濟、生活等各個方面發(fā)揮著重要的作用。傳統(tǒng)的文化也要隨著時代的步伐，煥發(fā)出新的活力。筆者所制作的剪紙文化網(wǎng)就是將傳統(tǒng)的剪紙藝術(shù)與現(xiàn)在的信息技術(shù)緊密聯(lián)系起來，通過現(xiàn)代網(wǎng)絡(luò)技術(shù)來更好的闡述傳統(tǒng)文化。剪紙文化網(wǎng)是一個系統(tǒng)介紹剪紙的網(wǎng)站，希望通過該網(wǎng)站，讓更多的人了解剪紙藝術(shù)，更好的了解中國的傳統(tǒng)文化。

1.剪紙文化網(wǎng)站的需求分析

剪紙作為中國的傳統(tǒng)文化，2006年5月20日，剪紙藝術(shù)經(jīng)國務(wù)院批準被列入《第一批國家級非物質(zhì)文化遺產(chǎn)名錄》。但是通過便捷的網(wǎng)絡(luò)，我們可以知道在豐富的網(wǎng)絡(luò)資源中，系統(tǒng)介紹剪紙的網(wǎng)站并不是很多，其中有中國剪紙網(wǎng)（http：//www.sxpaper-cut.cn/）和中國剪紙網(wǎng)（http：//www.paper-cut.net/）等。以中國剪紙網(wǎng)（http：//www.sxpaper-cut.cn/）為例，首先，該網(wǎng)站以紅色為主色調(diào)，其中也有相近色，如橘紅色，粉紅色等，筆者認為剪紙本就多為紅色，該網(wǎng)站在色彩搭配方面很值得借鑒;其次，該網(wǎng)站用表格來布局，有一點中規(guī)中矩的感覺，缺少應(yīng)有的活力;再次，由于該網(wǎng)站主要以商業(yè)為主，在展示剪紙作品的時候做的不夠好。因此，筆者在吸收其他相關(guān)網(wǎng)站的優(yōu)點的基礎(chǔ)上，以動態(tài)圖片的鑒賞為重點，建立該網(wǎng)站，更好的宣傳剪紙藝術(shù)。

2.剪紙文化網(wǎng)站的開發(fā)軟件介紹

Dream?weaver是個原本由Macromedia公司所開發(fā)的著名網(wǎng)站開發(fā)工具。它使用所見即所得的接口，亦有HTML編輯的功能。Dreamweaver可以用最快速的方式將Fireworks，或Photoshop等檔案移至網(wǎng)頁上，也可以使用網(wǎng)站地圖可以快速制作網(wǎng)站雛形、設(shè)計、更新和重組網(wǎng)頁，并且Dreamweaver是唯一提供Roundtrip?HTML、視覺化編輯與原始碼編輯同步的設(shè)計工具，它具有制作效率高，網(wǎng)站管理迅速以及控制能力強的優(yōu)點。如Dreamweaver可以用最快速的方式將Fireworks，F(xiàn)reeHand，或Photoshop等檔案移至網(wǎng)頁上。使用檢色吸管工具選擇熒幕上的顏色可設(shè)定最接近的網(wǎng)頁安全色。對于選單，快捷鍵與格式控制，都只要一個簡單步驟便可完成。Dreamweaver能與您喜愛的設(shè)計工具，如Playback?Flash，Shockwave和外掛模組等搭配，不需離開Dreamweaver便可完成，整體運用流程自然順暢。除此之外，只要單擊便可使Dreamweaver自動開啟Firework或Photoshop來進行編輯與設(shè)定圖檔的最佳化。

3.剪紙文化網(wǎng)頁設(shè)計與制作

3.1規(guī)劃結(jié)構(gòu)

網(wǎng)站規(guī)劃對網(wǎng)站建設(shè)起到計劃和指導(dǎo)的作用，對網(wǎng)站的內(nèi)容和維護起到定位作用。只有在制作網(wǎng)頁之前把這些都考慮到，才能制作出有個性、有特色、有吸引力的網(wǎng)頁。

規(guī)劃一個網(wǎng)站可以用樹狀結(jié)構(gòu)先把每個頁面的內(nèi)容大綱列出來。在剪紙文化網(wǎng)中，筆者設(shè)計了七大模塊，分別為首頁，簡介，歷史，鑒賞，教程，小游戲，留言板。其中，在簡介模塊中有介紹，剪紙?zhí)攸c，剪紙種類三部分;鑒賞模塊是我這個網(wǎng)站設(shè)計的重點，有花鳥，蝴蝶，魚和人物四組動態(tài)效果，來展示精美的剪紙圖片。

利用Dreamweaver制作網(wǎng)頁，首先要規(guī)劃和創(chuàng)建站點，然后利用站點對文件進行管理。所謂站點，可以看成是一系列文檔的組合，這些文檔通過各種鏈接建立邏輯關(guān)聯(lián)。用戶在建立網(wǎng)站首先要新建站點，然后在站點中對網(wǎng)頁文檔進行修改與管理。

網(wǎng)站的目錄結(jié)構(gòu)是網(wǎng)站組織和存放站內(nèi)所以文檔的目錄設(shè)置情況。目錄結(jié)構(gòu)的好壞，直接影響站點的管理、維護、擴充和移植。

3.2?LOGO與色彩

3.2.1設(shè)計網(wǎng)站LOGO

網(wǎng)站LOGO是網(wǎng)站的標是站點特色和內(nèi)涵的集中體現(xiàn)。這個LOGO和剪紙文化網(wǎng)所要表現(xiàn)的內(nèi)涵相聯(lián)系，賦予傳統(tǒng)文化現(xiàn)代活力。

3.2.2設(shè)計網(wǎng)站的標準色彩

標準色彩是指能體現(xiàn)網(wǎng)站形象和延伸內(nèi)涵的色彩。確定網(wǎng)站的標準色彩是相當(dāng)重要的一步，不同的色彩搭配會產(chǎn)生不同的效果，并可能影響到網(wǎng)頁瀏覽者的情緒。

3.3?布局

在剪紙文化網(wǎng)中，一般為左右布局，所用到的布局工具主要有表格和AP?Div，其中以CSS（Cascading?Style?Sheets，AP?Div疊樣式表單）+DIV（是用來為HTML文檔內(nèi)大塊（block-level）的內(nèi)容提供結(jié)構(gòu)和背景的元素）為主。3.4?動態(tài)效果

動態(tài)效果是剪紙網(wǎng)站設(shè)計的重點，主要由Flash按鈕，F(xiàn)lash文本，視頻，背景音樂以及AP?Div的行為組成，簡單的動態(tài)效果可以使網(wǎng)頁變的有聲有色，增強觀賞性。在剪紙文化網(wǎng)中，由于筆者大部分用的AP?Div來布局，可以方便的使用AP?Div添加行為。

3.5?交互

交互是參與活動的對象，可以相互交流，雙方面進行互動。對于一個網(wǎng)站來說，交互是至關(guān)重要的。若一個網(wǎng)站不能與使用者互動，不能及時了解瀏覽者的需求，則網(wǎng)站很難維持下去。在剪紙文化網(wǎng)中，筆者充分考慮了這個問題，不僅設(shè)計了電子郵件的交互，還能在線留言，并對網(wǎng)站的教程資源進行下載方便用戶的應(yīng)用。

3.6測試

3.6.1鏈接的測試

在剪紙文化網(wǎng)中，筆者用到的鏈接樣式有錨點鏈接，空鏈接，電子郵件鏈接等內(nèi)部鏈接，在測試的過程中，所有的鏈接都能正常運行。

3.6.2動態(tài)效果的測試

在剪紙文化網(wǎng)中，由于動態(tài)效果是筆者所要展示的重點，所以對動態(tài)效果進行測試是至關(guān)重要的環(huán)節(jié)。筆者大部分頁面是用AP?Div布局，因此大多的動態(tài)效果是AP?Div的行為特效，另外還有Flash以及時間軸動畫等，在對動態(tài)效果的測試過程中，有些效果和設(shè)計有所偏差，但經(jīng)過修改，已經(jīng)達到了讓人滿意的水平。

3.6.3留言板測試

對留言板的返回首頁，我要留言，查看留言，管理登陸四個選項依次進行了測試，除了上面提到的我要留言選項中輸入的必須是數(shù)字QQ號外，其他選項中的內(nèi)容也進行了細致的測試，如管理登陸時若密碼輸入錯誤，也會出現(xiàn)提醒等，對留言板的測試要在ISS環(huán)境下進行，不管是留言，還是查看或者管理等都可正常運行。