康理揚(yáng)+陳自根
摘要:近年來,恩施不斷推進(jìn)民族文化與民族經(jīng)濟(jì)的整合,加快民族文化產(chǎn)業(yè)的發(fā)展,然而為了更好地向外界宣傳恩施的土家特色文化,將恩施土家文化從衣食住行四個(gè)方面系統(tǒng)的、有條理地展示給大眾,因此設(shè)計(jì)與開發(fā)了恩施土家特色文化信息網(wǎng)。恩施土家特色文化信息網(wǎng)旨在向外界提供一個(gè)全面了解恩施的土家民族文化的平臺(tái),包括在恩施喜聞樂見的土家美食、歌舞、民居、民俗等方面。該網(wǎng)站是基于jsp的web應(yīng)用,利用dreamweaver8作為開發(fā)工具、MySq1作為數(shù)據(jù)庫,采用響應(yīng)式布局的文化宣傳網(wǎng)站。
關(guān)鍵詞:土家文化;設(shè)計(jì);漸變輪播;
1背景
隨著信息科技的日新月異,手機(jī)、平板、電腦作為世界三大上網(wǎng)終端,已經(jīng)成為人們不可或缺的娛樂與通信工具。作為一個(gè)信息平臺(tái)除了向人們提供海量信息之外,網(wǎng)站的風(fēng)格也是網(wǎng)站建設(shè)中需要考慮的重要因素,每一個(gè)網(wǎng)站都有其獨(dú)特的風(fēng)格,成千上萬的網(wǎng)站在web前端設(shè)計(jì)這一塊在技術(shù)上基本是大同小異,但是要想做到重點(diǎn)突出,吸引瀏覽者的眼球一直是眾多前端開發(fā)人員努力奮斗、苦苦追求的目標(biāo)。本站在建設(shè)過程中發(fā)現(xiàn)傳統(tǒng)的民族網(wǎng)站除了向大家傳輸一系列的分類信息之外,并沒有給用戶提供很好的視覺體驗(yàn),導(dǎo)致獲取信息的效率并不高,并且目前在動(dòng)態(tài)網(wǎng)站上頗為受觀眾喜愛的輪播圖一直也是以圖片為主體,漸變輪播,缺乏新意,因此本站想要打破常規(guī)給用戶新的輪播體驗(yàn),實(shí)現(xiàn)顏色與圖片雙重漸變輪播成為網(wǎng)站建設(shè)的主要技術(shù)難點(diǎn)。
2技術(shù)設(shè)計(jì)
由于該平臺(tái)是基于土家特色文化宣傳的網(wǎng)站,在內(nèi)容的安排上重點(diǎn)是將恩施最能反映當(dāng)?shù)孛褡逄厣男畔⒎旁诰W(wǎng)站的重要位置,經(jīng)過大量的調(diào)查發(fā)現(xiàn),用戶往往對(duì)網(wǎng)站出現(xiàn)的第一個(gè)話題或者內(nèi)容比較感興趣,所以在輪播圖的設(shè)計(jì)上將顏色的盒子寬度設(shè)置成屏幕的寬度,將圖片放在顏色盒子之上,圖片的邊框設(shè)計(jì)成菱形,給觀眾的視覺感受是斜向左下方,并朝向右邊,同時(shí)沒有圖片占據(jù)的顏色盒子為每一張圖片配上簡要的文字解說,給人一種此起彼伏的感覺,增加網(wǎng)站的趣味性,定時(shí)無線循環(huán)輪播,讓用戶體驗(yàn)更加別致視覺效果的同時(shí),集中注意力,對(duì)網(wǎng)站宣傳的土家文化信息有更加深刻的印象,從而達(dá)到提到信息獲取效率的目的。
3技術(shù)實(shí)現(xiàn)
顏色漸變輪播在技術(shù)上主要是依靠iavascript腳本和css3層疊樣式表單來完成的,在確定主色系之后,將所有與主色系相關(guān)的顏色都按照顏色漸變的順序依次排列,將顏色與圖片的數(shù)量確定之后,計(jì)算好一幀背景顏色輪播的時(shí)間,然后通過Ja-vascript控制所有顏色出現(xiàn)的順序、css3設(shè)計(jì)圖片邊框的形狀和位置,當(dāng)圖片出現(xiàn)之后顏色隨之發(fā)生改變,將圖片與附帶的文字信息渲染的更加的有趣,從而達(dá)到宣傳土家特色文化信息、增強(qiáng)網(wǎng)站趣味性的目的。
雙重漸變輪播原理圖如圖1所示:
4結(jié)束語
在網(wǎng)站的設(shè)計(jì)與開發(fā)過程中,網(wǎng)站的設(shè)計(jì)是網(wǎng)站建設(shè)的基礎(chǔ)性工作,越來越多的網(wǎng)絡(luò)平臺(tái)利用html5和jquery插件做開發(fā),輪播圖的展示已將屢見不鮮,利用色彩漸變雙重輪播的方式除了可以增強(qiáng)頁面的視覺效果,還能有效節(jié)省了輪播圖信息顯示的空間。