本站小編為你精心準備了中學(xué)官方網(wǎng)站設(shè)計對比研究參考范文，愿這些范文能點燃您思維的火花，激發(fā)您的寫作靈感。歡迎深入閱讀并收藏。

【摘要】文章對我國清華大學(xué)附屬中學(xué)和美國TheMastersSchool網(wǎng)頁設(shè)計進行對比，從中美教育事業(yè)與網(wǎng)頁設(shè)計大環(huán)境出發(fā)，分析其中的文字區(qū)別、文化差異、一級菜單選題、顏色運用、版式設(shè)計、后期維護與影響。同時，分析網(wǎng)站對中學(xué)生提高藝術(shù)修養(yǎng)的重要性，以及網(wǎng)頁對中學(xué)教育方針體系等宣傳起到的關(guān)鍵作用，并探究如何提高國內(nèi)中學(xué)網(wǎng)頁設(shè)計水平。

【關(guān)鍵詞】中學(xué)官方網(wǎng)站；網(wǎng)頁設(shè)計；文化差異

對于學(xué)生來說，每一次擇校對未來的道路和發(fā)展都是至關(guān)重要的，想要全面掌握各個學(xué)校的信息，官方網(wǎng)站是一個最直接的選擇。從學(xué)校的角度來說，在當(dāng)今的互聯(lián)網(wǎng)時代，人們可以從中了解更多內(nèi)容，甚至從整體的設(shè)計風(fēng)格就可以看出學(xué)校所倡導(dǎo)的教育理念、遵循的教育方針和未來的發(fā)展方向。在互聯(lián)網(wǎng)科技發(fā)展和新媒體崛起的當(dāng)下，人們對網(wǎng)頁內(nèi)容的要求已經(jīng)不局限在是否美觀、是否內(nèi)容全面，而是要求兩者更加契合、更加協(xié)調(diào)統(tǒng)一。由于文化、生活環(huán)境、歷史條件等原因，從排版布局到用戶體驗、從資料整合到信息設(shè)計，中美兩國中學(xué)對網(wǎng)頁設(shè)計的需求有所不同，當(dāng)然，這也與網(wǎng)站建設(shè)者和用戶人群有著密切的關(guān)系。

一、中美中學(xué)網(wǎng)頁設(shè)計現(xiàn)狀

一個精致的門面是吸引大眾的基礎(chǔ)，國內(nèi)中學(xué)網(wǎng)頁設(shè)計風(fēng)格大部分還處于類似報紙、雜志的排版。人們的審美與藝術(shù)需求從年齡段劃分上來看，老一輩人習(xí)慣瀏覽排版緊密且內(nèi)容充實的版面，注重頁面的功能性；現(xiàn)代年輕人生活節(jié)奏快，較能接受以少量圖片信息代替大量文字的表達方式，從而提高工作生活質(zhì)量。國內(nèi)一部分中學(xué)的網(wǎng)頁是沒有經(jīng)過設(shè)計師設(shè)計的，直接由工程師進行切圖，其中并沒有設(shè)計的元素，成品結(jié)果不盡人意。其實不是沒有追求美的想法，只是沒有發(fā)現(xiàn)美的眼睛。部分人只是墨守成規(guī)，不接受設(shè)計師的建議，不接受嶄新的設(shè)計風(fēng)格，一再影響設(shè)計師的設(shè)計理念，這也是許多設(shè)計師所苦惱的事情。對于整體的VI體系在網(wǎng)頁中的融合，有時會直接影響網(wǎng)頁最初的設(shè)計風(fēng)格。這時就需要設(shè)計師與客戶進行良好的溝通，從而完成優(yōu)秀的設(shè)計。美國的網(wǎng)頁設(shè)計相對于中國而言起步要早，美國中學(xué)網(wǎng)站的重視程度并不低于大學(xué)網(wǎng)站。而國內(nèi)并不是如此，這就嚴重制約了對外宣傳的良好渠道，無法向國外展示我國中學(xué)的文化和教育理念。

二、清華大學(xué)附屬中學(xué)和美國TheMastersSchool官網(wǎng)設(shè)計對比

（一）設(shè)計文字區(qū)別與文化差異美國中學(xué)網(wǎng)站的設(shè)計風(fēng)格深受西方極簡主義的影響，網(wǎng)站設(shè)計注重信息的動態(tài)更新以及用戶體驗，設(shè)計元素較為豐富。部分網(wǎng)頁會將一級菜單隱藏在一個按鈕中，營造出十分簡潔的界面。我國大部分用戶對學(xué)校網(wǎng)站還停留在閱讀層面，在文字的使用上，考慮到后臺程序在顯示上的問題，網(wǎng)頁一般會選用黑體等最基本的字體，清華大學(xué)附屬中學(xué)的網(wǎng)頁設(shè)計亦是如此。一些網(wǎng)頁設(shè)計會選擇用圖片代替文字，將帶有文字的圖片直接上傳至網(wǎng)站后臺，這樣字體既不會因電腦型號的不同而產(chǎn)生改變，還可以在排版上加以規(guī)劃。筆者認為，我國的中學(xué)網(wǎng)站設(shè)計中可以融入更多的動態(tài)媒體資料。區(qū)別于傳統(tǒng)媒體，網(wǎng)頁不僅僅是平面布局，它可以將信息設(shè)計融入其中，使版面更加自由化，從而生動直觀地展示出各個學(xué)校的文化和教育理念。同時，還可以將中國的傳統(tǒng)文化和日益發(fā)展的新媒體文化相結(jié)合，在以人為本的基礎(chǔ)上將創(chuàng)新融入其中。漢字作為世界上最古老的文字之一，承載著人類的文明。如何將這種富有歷史感的文字運用到現(xiàn)代設(shè)計中，是中國設(shè)計師一直探討的問題。與拉丁文字相比，使用漢字完成一個設(shè)計感強的作品是相對復(fù)雜的，尤其是學(xué)校官網(wǎng)這種需要大量文字表達的網(wǎng)站，這需要設(shè)計師對文字版式設(shè)計有著豐富的經(jīng)驗。而在美國的部分中學(xué)網(wǎng)站設(shè)計中，設(shè)計師將數(shù)據(jù)可視化設(shè)計與網(wǎng)頁設(shè)計相融合，有著極強的現(xiàn)代設(shè)計感。其中TheMastersSchool的文字選擇集中于現(xiàn)代感較強的無襯線字體，頁面輪廓較窄，深度融合西方的極簡主義風(fēng)格；同時，設(shè)計師也十分注重整體的框架與布局。

（二）一級菜單選題對比信息具有多向交互性，對于一級菜單的選擇可以直接反映學(xué)校的主要教育目標和教育理念。清華大學(xué)附屬中學(xué)的一級菜單有：學(xué)校概況、校園風(fēng)貌、教育科研、教育資源、情系母校、百年校慶、國際部、招生專欄、人才招聘、數(shù)字校園、空中學(xué)堂、奧森•將臺校區(qū)。TheMastersSchool的一級菜單有：Admission，About，Academics，Arts，Athletics，CampusLife，Boarding，Alumnae/I。從以上的排列順序可以看出，兩者的共通點有對學(xué)校、師資力量、教學(xué)資源的介紹，這也是在學(xué)校的網(wǎng)頁中必不可少的。由于教育環(huán)境和文化背景的不同，清華大學(xué)附屬中學(xué)比較重視學(xué)生的文化知識教育，而TheMastersSchool則是將藝術(shù)與體育放在一級菜單里。這也與教育目標有著必然的聯(lián)系，我國中學(xué)是倡導(dǎo)培養(yǎng)學(xué)生在德智體美全面發(fā)展的同時，以高考為第一目標；與國內(nèi)的應(yīng)試教育不同，美國的中學(xué)則是主要培養(yǎng)中學(xué)生的實踐能力，從實踐中找真知[1]。

（三）顏色的運用對比對于顏色的運用往往代表著一個網(wǎng)站帶給用戶的第一印象，也是加深用戶對該網(wǎng)站記憶度的一個體現(xiàn)。相對于文字和圖片，顏色有著更大的吸引力，可以體現(xiàn)一個學(xué)校的主題風(fēng)格和文化。這兩所學(xué)校的整體主色調(diào)都以紫色為主體，其中清華大學(xué)附屬中學(xué)的顏色種類運用多于TheMastersSchool，以紫色為主色調(diào)，其余顏色做輔助劃分板塊，使用戶能快速地找到自己想瀏覽的板塊，也起到用顏色加深用戶印象的作用。TheMastersSchool則是紫色搭配少部分的黃色作為整體板塊的劃分，不規(guī)則圖形的運用使網(wǎng)頁既簡潔又活潑，加強了視覺沖擊感。兩個網(wǎng)站在色彩的運用上方向不同，但都起到相對決定性的作用。

（四）版式設(shè)計對比從清華大學(xué)附屬中學(xué)的網(wǎng)站首頁來看，內(nèi)容龐大、信息量多、層次鮮明，科學(xué)的布局讓用戶可以一目了然地看到網(wǎng)站的主體信息。為了符合社會需求和國內(nèi)用戶瀏覽網(wǎng)頁的習(xí)慣，清華大學(xué)附屬中學(xué)增加了浮動彈窗和固定信息窗口，這也是許多學(xué)校網(wǎng)站都會出現(xiàn)的情況。這樣也許會凸顯領(lǐng)導(dǎo)層想表達的內(nèi)容，卻忽略了這會導(dǎo)致網(wǎng)頁信息碎片化。雖然在放大縮小網(wǎng)頁窗口的同時改變了一級菜單的交互方式，可以方便用戶瀏覽，但是從設(shè)計審美角度看則沒有突出視覺重心。美國TheMastersSchool官網(wǎng)首頁banner位置以視頻的方式進行展示，增加了網(wǎng)頁生動性。采用“I”字型框架，版面布局設(shè)計體現(xiàn)了設(shè)計者在前期設(shè)計時樹立了良好的全局意識，合理利用留白讓網(wǎng)頁中的文字、圖像深度融合。網(wǎng)站將banner與下面板塊以色塊分割，大部分以圖片為主體，文字部分較少。相對來說，清華大學(xué)附屬中學(xué)注重文字表達，而TheMastersSchool注重用圖片傳遞信息，文字內(nèi)容相對較少。各有其優(yōu)點，從用戶的角度出發(fā)，在屏幕顯示器分辨率較小或者網(wǎng)速受限的情況下，加入大量的圖片視頻可能會造成用戶無法準確瀏覽到自己想要的內(nèi)容。相較之下，傳統(tǒng)的文字說明可以更加直接、快速地表達內(nèi)容。但這也是其中的弊端，繁多的文字內(nèi)容會使用戶感到十分枯燥。綜上所述，在版式和文字的運用上，必須要考慮用戶群體的接受程度和文化底蘊[2]。

（五）后期維護與影響網(wǎng)頁的整體性保留和后期維護有著密不可分的關(guān)系。例如，在后臺程序規(guī)定好的尺寸上傳一個不同大小的圖片，會造成圖片的擠壓或變形。這是在大部分中小學(xué)網(wǎng)站上出現(xiàn)的問題，其原因就是后期維護者可能是一位并不了解設(shè)計的工作人員。國內(nèi)的中學(xué)官網(wǎng)往往會根據(jù)實時新聞或活動在頁面上層添加彈窗，這樣就導(dǎo)致頁面混亂，使用戶分不清主次。而美國大部分中學(xué)官網(wǎng)網(wǎng)頁設(shè)計界面較為簡潔，后期維護人員秉承著設(shè)計師最初的設(shè)計理念，給用戶營造一種簡潔清新的氛圍。對于媒體信息的選擇也是后期維護的重中之重，設(shè)計師在最初設(shè)計的時候為避免后期維護時會發(fā)生的問題，應(yīng)盡量減少后期需要修改的部分，加強整體的框架性；同時秉承規(guī)范性、嚴密性和可持續(xù)性，這樣才不會違背最初的設(shè)計理念[3]。

結(jié)語

綜上所述，筆者對這兩個具有代表性的中學(xué)網(wǎng)站進行對比的主要目的，是希望可以促進國內(nèi)中學(xué)網(wǎng)站進一步發(fā)展，將藝術(shù)教育融入學(xué)生的日常生活中并融入新時代的設(shè)計理念，滿足新一代的審美需求。每個領(lǐng)域的發(fā)展都是從事該領(lǐng)域的人群在實踐中不斷探索追求，并將其推上更高的臺階。推己及人，設(shè)計師需要想到用戶體驗與客戶需要，不斷思考如何提高網(wǎng)頁設(shè)計質(zhì)量，使網(wǎng)站頁面設(shè)計在不失其原有本質(zhì)的情況下更加美觀和諧，更具生命力、感染力。媒體設(shè)計的變化日新月異，設(shè)計師要積極汲取國外好的設(shè)計理念，把優(yōu)秀的藝術(shù)設(shè)計融入人們的生活中，從而推動國內(nèi)教育和新媒體藝術(shù)的進步。

參考文獻:

[1]田甜.網(wǎng)頁設(shè)計中版面布局設(shè)計及色彩搭配分析[J].明日風(fēng)尚，2018（18）.

[2]ZhyldyzMukaeva.東西方文化的視覺差異下中國網(wǎng)頁設(shè)計的感知度研究[D].重慶大學(xué)，2016.

[3]蔣昊朋.新媒體環(huán)境下網(wǎng)頁設(shè)計發(fā)展趨勢分析[J].赤峰學(xué)院學(xué)報（自然科學(xué)版），2017（2）.

作者：秦旭劍 錢前 單位：吉林藝術(shù)學(xué)院新媒體學(xué)院教授