傳統(tǒng)文化網(wǎng)站設(shè)計(jì) 設(shè)計(jì)課程：?WEB前端開(kāi)發(fā)技術(shù) 系 別： 專 業(yè)：?軟件工程 班 級(jí)： 姓 名： 學(xué) 號(hào)： 設(shè)計(jì)時(shí)間：?2020年6月 摘要 中國(guó)傳統(tǒng)文化(traditional culture of China)是中華文明演化而匯集成的一種反映民族特質(zhì)和風(fēng)貌的民族文化，是民族歷史上各種思想文化、觀念形態(tài)的總體表征，是指居住在中國(guó)地域內(nèi)的中華民族及其祖先所創(chuàng)造的、為中華民族世世代代所繼承發(fā)展的、具有鮮明民族特色的、歷史悠久、內(nèi)涵博大精深、傳統(tǒng)優(yōu)良的文化。在

全球化浪潮

中，保傳統(tǒng)文化對(duì)維護(hù)世界文化的多樣性具有十分重要的意義。世界上任何民族，如果拋棄民族文化傳統(tǒng)，沒(méi)有任何特色，就會(huì)在世界民族之林中失去地位，同時(shí)也在國(guó)際政治中失去影響力?，F(xiàn)今，我國(guó)少數(shù)民族優(yōu)秀傳統(tǒng)文化正在流失，許多文化遺產(chǎn)處于瀕危狀態(tài)?；ヂ?lián)網(wǎng)作為信息技術(shù)的通信橋梁連接著全球的計(jì)算機(jī)，無(wú)論是在國(guó)內(nèi)還是國(guó)外網(wǎng)站都得以迅速的發(fā)展和壯大，并被人們重視和關(guān)注，對(duì)于全球范圍內(nèi)不同地域的人們聯(lián)系交流等等活動(dòng)也日益重要。中華傳統(tǒng)文化網(wǎng)以傳統(tǒng)文化為載體，為的就是讓更多中華兒女了解傳統(tǒng)文化、重視傳統(tǒng)文化、保護(hù)傳統(tǒng)文化、傳承傳統(tǒng)文化。本次開(kāi)發(fā)主要以HTML5+CSS3+JavaScript等技術(shù)構(gòu)建此網(wǎng)站。 關(guān)鍵詞：中華民族、中華傳統(tǒng)文化、傳承 目錄 href="

https://

zhuanlan.zhihu.com/writ

e#_Toc104734112

">第一章 前言

1.1 傳統(tǒng)文化價(jià)值

1.2 傳統(tǒng)文化傳播情況

"

https://

zhuanlan.zhihu.com/writ

e#_Toc104734115

">1.3 設(shè)計(jì)目的 href="

https://

zhuanlan.zhihu.com/writ

e#_Toc104734116

">第二章 設(shè)計(jì)思路 "

https://

zhuanlan.zhihu.com/writ

e#_Toc104734117

">2.1 風(fēng)格定位 "

https://

zhuanlan.zhihu.com/writ

e#_Toc104734118

">2.2 網(wǎng)站結(jié)構(gòu) "

https://

zhuanlan.zhihu.com/writ

e#_Toc104734119

">2.3 主要功能 href="

https://

zhuanlan.zhihu.com/writ

e#_Toc104734120

">第三章 設(shè)計(jì)效果 f="

https://

zhuanlan.zhihu.com/writ

e#_Toc104734121

">3.1 首頁(yè) ="

https://

zhuanlan.zhihu.com/writ

e#_Toc104734122

">3.2二級(jí)頁(yè)面

3.2.1 歷史頁(yè)

3.2.2 地域頁(yè)

3.2.3 民族頁(yè)

3.2.4 風(fēng)俗頁(yè)

3.2.5 建筑頁(yè)

3.2.6 藝術(shù)頁(yè)

3.2.7 美食頁(yè)

3.2.8其他和關(guān)于頁(yè)

href="

https://

zhuanlan.zhihu.com/writ

e#_Toc104734131

">第四章 總結(jié)與展望 第一章?前言 1.1 傳統(tǒng)文化價(jià)值 中華民族優(yōu)秀傳統(tǒng)文化是中華民族生存和發(fā)展所依賴的精神支撐，是中華民族自尊心和自信心所根植的土壤，是國(guó)家走向富強(qiáng)的軟實(shí)力資源。傳承和弘揚(yáng)中華優(yōu)秀傳統(tǒng)文化，就是形成中華優(yōu)秀傳統(tǒng)文化現(xiàn)代意識(shí)的認(rèn)同感，喚起復(fù)興中華優(yōu)秀傳統(tǒng)文化的使命感，發(fā)揚(yáng)光大中華優(yōu)秀傳統(tǒng)文化的人文精神，激活中華優(yōu)秀傳統(tǒng)文化的強(qiáng)大基因。 中華傳統(tǒng)文化包括了皮影戲、京劇、國(guó)畫(huà)、書(shū) 法、文字、語(yǔ)言、六藝、音樂(lè)、武術(shù)、曲藝、棋類、節(jié)日、 民俗等方面的內(nèi)容，尤其在皮影戲、京劇、國(guó)畫(huà)、書(shū)法方面，具備較強(qiáng)的文學(xué)性與藝術(shù)性，并蘊(yùn)含較為深刻的思想內(nèi)涵。其中，中華優(yōu)秀傳統(tǒng)文化中所蘊(yùn)含的思想能夠突顯出社會(huì)主義核心價(jià)值。對(duì)于社會(huì)主義核心價(jià)值而言，其屬于國(guó)家與民族的主流價(jià)值觀，更是促進(jìn)全國(guó)人民團(tuán)結(jié)統(tǒng)一的重要思想與文化基礎(chǔ)。其思想基礎(chǔ)主要內(nèi)容包括三個(gè)層面，第一層面為：富強(qiáng)、民主、文明、和諧。在儒家文化中，存在較為豐富的和思想，例如，“君子周而不比，小人比而不周?！钡诙€(gè)層面為：自由、平等、公正、法治，在孔子提出的“有教無(wú)類”中，顯示的就是人人平等。第三個(gè)層面為：愛(ài)國(guó)、 敬業(yè)、誠(chéng)信、友善，例如，儒家文化中的“躬自厚而薄責(zé)于人”等思想，從中可以看出，中華傳統(tǒng)文化中蘊(yùn)含著較多與社會(huì)主義核心價(jià)值相符合的內(nèi)容。其次，為民族發(fā)展提供精神動(dòng)力。在中華傳統(tǒng)文化中，存在豐富的精神食糧，還涵蓋著較許多中華民族更深層次的精神追求，在不斷發(fā)展中，已 經(jīng)成為大家共同奮斗的主要紐帶。由此可見(jiàn)，中華傳統(tǒng)文化 中的思想能量能夠?yàn)槊褡灏l(fā)展提供良好的精神動(dòng)力，實(shí)現(xiàn)我 國(guó)的不斷發(fā)展，為解決時(shí)代難題提供重要啟示。中華傳統(tǒng)文 化中存在較多的治國(guó)理政以及為人處世思想，并且強(qiáng)調(diào)實(shí)事 求是，從生活實(shí)踐中探尋真理。并且，在為人處世方面，存 在較多的經(jīng)典語(yǔ)錄，在這些文化中蘊(yùn)含的種種思想，對(duì)于當(dāng) 前國(guó)家與社會(huì)發(fā)展仍存在極為重要的意義，能夠?yàn)榻鉀Q時(shí)代 難題提供重要啟示，其中存在的治國(guó)經(jīng)驗(yàn)以及政治智慧等， 能夠使治國(guó)理政能力得到進(jìn)一步提升[1-3]。 本網(wǎng)站通過(guò)對(duì)不同類別中國(guó)傳統(tǒng)文化的展示，以促進(jìn)國(guó)民對(duì)中國(guó)傳統(tǒng)文化進(jìn)行全面的認(rèn)識(shí)，進(jìn)而促進(jìn)文化交，形成了解傳統(tǒng)文化、重視傳統(tǒng)文化、保護(hù)傳統(tǒng)文化、傳承傳統(tǒng)文化現(xiàn)象。 1.2 傳統(tǒng)文化傳播情況 在傳統(tǒng)文化的傳播上，主要以紙質(zhì)記載和書(shū)籍為主，這種傳播模式下，受眾只有在固定的文化傳播場(chǎng)所才能接收到傳統(tǒng)的文化知識(shí)，而具備文化傳播功能的固定產(chǎn)所也較為有限，包括圖書(shū)館、歷史展覽館以及博物館等，這些場(chǎng)所也需要受眾花費(fèi)相應(yīng)的成本及時(shí)間。這種傳統(tǒng)文化傳播媒介，已經(jīng)無(wú)法很好地適應(yīng)現(xiàn)今文化發(fā)展需求，主動(dòng)到固定場(chǎng)所接受文化傳播的受眾也在逐漸較少。其次，覆蓋時(shí)間有限。由于在傳統(tǒng)文化的傳播上，主要是在固定的場(chǎng)所中進(jìn)行，場(chǎng)所會(huì)在一定程度上限制傳播的時(shí)間段。在互聯(lián)網(wǎng)環(huán)境下，時(shí)間逐漸呈現(xiàn)出零散化以及碎片化特征。這種需要花費(fèi)受眾大量時(shí)間的傳播方式，在傳播效率上低于碎片化的傳播方式。最后，方式創(chuàng)新不足。在我國(guó)傳統(tǒng)文化中， 存在較多的經(jīng)典故事與傳統(tǒng)美德，可以幫助年輕人樹(shù)立正確 的價(jià)值觀以及人生觀。但是年輕人基本上是在學(xué)?；蚱渌麍?chǎng)所獲得傳統(tǒng)文化知識(shí)，在知識(shí)的獲取上存在較大的被動(dòng)性， 并沒(méi)有對(duì)傳統(tǒng)文化有自己獨(dú)特的認(rèn)識(shí)，未能形成良好共鳴， 這種情況下，無(wú)法將其中的內(nèi)涵與精髓吸收，提升自身。因 此，在中華傳統(tǒng)文化傳播上，需要對(duì)傳播方式進(jìn)行不斷創(chuàng) 新，在多樣化的傳播方式下，提升年輕人對(duì)于傳統(tǒng)文化的興 趣，達(dá)到良好的傳播效果。針對(duì)于當(dāng)前傳統(tǒng)文化傳播情況， 需要積極探索全媒體下的創(chuàng)新傳播途徑來(lái)更好地傳播中華傳統(tǒng)文化，以保證中華傳統(tǒng)文化功能的良好發(fā)揮。 現(xiàn)階段，“互聯(lián)網(wǎng) +”環(huán)境下，各種先進(jìn)技術(shù)也得以快速 發(fā)展，較多行業(yè)紛紛引進(jìn)了“互聯(lián)網(wǎng) +”發(fā)展模式，而中華 傳統(tǒng)文化傳播過(guò)程中，也應(yīng)積極利用互聯(lián)網(wǎng)優(yōu)勢(shì)及巨大的潛 力，創(chuàng)建出新的發(fā)展空間。在內(nèi)容形式上，可以選擇新型的編譯方式，通過(guò)全新的 視角，積極利用極具渲染力的方式，例如，圖片、視頻以及 音樂(lè)等，向人們呈現(xiàn)相應(yīng)內(nèi)容，更好地對(duì)中華傳統(tǒng)文化進(jìn)行推廣傳承。而在互聯(lián)網(wǎng)技術(shù)下，融媒體能夠有效打破時(shí)空 限制，在線上探尋傳統(tǒng)文化傳播途徑，能夠有效突破傳統(tǒng)文化在空間上的限制，基于多種感官消化帶來(lái)更好的傳播效果[4-6]。 1.3 設(shè)計(jì)目的 現(xiàn)今，我國(guó)少數(shù)民族優(yōu)秀傳統(tǒng)文化正在流失，許多文化遺產(chǎn)處于瀕危狀態(tài)?；ヂ?lián)網(wǎng)作為信息技術(shù)的通信橋梁連接著全球的計(jì)算機(jī)，無(wú)論是在國(guó)內(nèi)還是國(guó)外網(wǎng)站都得以迅速的發(fā)展和壯大，并被人們重視和關(guān)注，對(duì)于全球范圍內(nèi)不同地域的人們聯(lián)系交流等等活動(dòng)也日益重要。中華傳統(tǒng)文化網(wǎng)以傳統(tǒng)文化為載體，為的就是讓更多中華兒女了解傳統(tǒng)文化、重視傳統(tǒng)文化、保護(hù)傳統(tǒng)文化、傳承傳統(tǒng)文化。更有效地傳承中弘揚(yáng)中華優(yōu)秀傳統(tǒng)文化，在廣泛弘揚(yáng)中更好地傳承中華優(yōu)秀傳統(tǒng)文化，在世界和國(guó)際社會(huì)中贏得應(yīng)有的文化認(rèn)同和文化尊重。 第二章?設(shè)計(jì)思路 2.1 風(fēng)格定位 為了更簡(jiǎn)單明了的突出主體，提供更舒適的感官感受，本網(wǎng)站采用全屏網(wǎng)頁(yè)設(shè)計(jì)，通過(guò)合理的頁(yè)面布局，視覺(jué)沖擊力大可很好的吸引觀者注意。頁(yè)面內(nèi)的文字內(nèi)容不是特別多，主要以圖片展示為主。頁(yè)面色彩除主頁(yè)采取以紅為主色調(diào)，其他頁(yè)面主頁(yè)以白底色為主色調(diào)。 2.2 網(wǎng)站結(jié)構(gòu)

網(wǎng)站的目錄結(jié)構(gòu)如下： css ------存放CSS文件 image------存放圖片文件 js -------存放js文件 index.html ---------首頁(yè) history.html -------歷史頁(yè)面 local.html ---------地域頁(yè)面 nation.html---------民族頁(yè)面 habit.html---------風(fēng)俗頁(yè)面 building.html-------建筑頁(yè)面 art.html---------藝術(shù)頁(yè)面 food.html---------美食頁(yè)面 other.html---------其他頁(yè)面 about.html---------關(guān)于頁(yè)面 2.3?主要功能 （1）三類輪播圖 （2）圖片自動(dòng)放大圖 （2）鼠標(biāo)移動(dòng)上圖片放大 （2）文字顯示與隱藏 （2）四類圖片組 第三章?設(shè)計(jì)效果 3.1?首頁(yè) 頭部：包括input搜索框、logo和導(dǎo)航欄、輪播圖片，如圖1所示：

圖1 首頁(yè)頭部效果圖a 中間：

圖2 首頁(yè)內(nèi)容效果圖 尾部：設(shè)計(jì)者信息、網(wǎng)頁(yè)設(shè)計(jì)日期、友情鏈接

圖3 首頁(yè)尾部效果圖 3.2二級(jí)頁(yè)面 二級(jí)頁(yè)面的頭部和尾部均采用統(tǒng)一的模板，具體設(shè)計(jì)效果如下：

圖4 二級(jí)頁(yè)面頭部和尾部效果圖 二級(jí)頁(yè)面的內(nèi)容根據(jù)不同的主題靈活選取不同的布局，下面展示具體的設(shè)計(jì)效果。 3.2.1 歷史頁(yè) 歷史頁(yè)包含一個(gè)縱向的輪播圖，分別展示歷史戰(zhàn)爭(zhēng)、歷史交流、歷史美談、歷史人物輪播圖

圖5 歷史頁(yè)縱向輪播圖 縱向輪播圖html代碼：

• 歷史戰(zhàn)爭(zhēng)
• 歷史交流
• 歷史美談
• 歷史人物