曹紅英
【摘要】 不同的網(wǎng)站頁面樣式,具有不同 的特點,需要網(wǎng)站設(shè)計者根據(jù)網(wǎng)站設(shè)計要求靈活選擇和運用。設(shè)置“角色瀏覽”、“Banner圖示”和“適應(yīng)網(wǎng)頁設(shè)計”,是優(yōu)秀遠程教育網(wǎng)頁樣式的特色功能設(shè)計。
【關(guān)鍵詞】 頁面樣式設(shè)計 角色瀏覽 Banner圖示 適應(yīng)網(wǎng)頁設(shè)計
創(chuàng)建面向用戶的遠程教育門戶網(wǎng)站是高校遠程教育機構(gòu)進行信息化建設(shè)和大學(xué)文化建設(shè)的重要內(nèi)容。“遠程教育網(wǎng)站”通常被稱為遠程教育的網(wǎng)上“門面”。它既是服務(wù)師生的平臺,也是對外宣傳或展示自己辦學(xué)實力及服務(wù)能力的重要窗口,也是傳遞大學(xué)文化的有效載體。其中,網(wǎng)頁樣式設(shè)計起關(guān)鍵性作用。
一、綜述
遠程教育網(wǎng)站應(yīng)該盡量做到門戶結(jié)構(gòu)清晰,頁面精美,訪問快捷、功能實用。主要包含:整體布局要求和網(wǎng)站整體設(shè)計風(fēng)格統(tǒng)一;界面設(shè)計體現(xiàn)用戶相互之間交流互動的特色;網(wǎng)絡(luò)響應(yīng)速度應(yīng)該盡量快,更快的信息訪問速度、更加省時和智能化的用戶界面;更簡便、智能化程度更高的瀏覽查詢流程;后臺管理功能強大、錄入效率高;易于查看網(wǎng)民的建議和評論以及后臺信息。一個網(wǎng)站門戶的主頁面通常由Logo、導(dǎo)航、Banner、內(nèi)容、鏈接、版權(quán)這六部分元素組成。有研究認為,網(wǎng)頁布局包括傳統(tǒng)“T”型布局、上下對照式布局、“上中下”“三”字布局、左右對稱型布局、“回”字形布局、“同”字形布局、“國”字型布局、“川”字型布局、氛圍式布局、POP海報四、式布局、“雜物箱”布局、“人物風(fēng)格化”布局、封面型布局、簡約型布局、綜合型布局、瀑布流式布局等,這是基于對網(wǎng)頁結(jié)構(gòu)“形式”的劃分。每一類型的頁面樣式都具有統(tǒng)一的構(gòu)成元素,但彼此間又有自己獨特的布局特點,因而呈現(xiàn)出不同的網(wǎng)站視覺效果和網(wǎng)頁設(shè)計風(fēng)格。
二、頁面樣式的分類特征
1)“簡約式”。“簡約式”的特征是頁面主體“一屏顯示”、布局簡潔。在主流顯示分辨率下,網(wǎng)站瀏覽者不再需要上下、左右的拖動鼠標(biāo),即可實現(xiàn)頁面主要內(nèi)容的相對完整的瀏覽效果。2)“圖片動畫式”。“圖片動畫式”的特征是布局簡潔明晰、頁面圖片感強烈。一個精彩的網(wǎng)頁缺少不了圖片,如圖片按鈕、翻轉(zhuǎn)圖片、濾鏡、透明圖、導(dǎo)航圖等,圖片往往在網(wǎng)頁中起到畫龍點睛的作用。圖片傳達信息的直觀性與寓意性遠遠超過文字,大號圖片的應(yīng)用也是簡潔設(shè)計的一種體現(xiàn),可以明確的表達網(wǎng)站訴求。3)“完整式”。“完整式”的特征是布局規(guī)整秩序、信息直觀、“多屏顯示”、視覺感強。網(wǎng)站頁面組成元素之間,既錯落有致,又和諧統(tǒng)一,營造出的良好秩序感。一般按照分列樣式布局設(shè)計,以字體的大小對標(biāo)題文字與正文內(nèi)容加以區(qū)分,區(qū)別于以往欄目圖標(biāo)的復(fù)雜顯示效果,具有“扁平化”的設(shè)計特點。
三、頁面樣式的特色功能
1)“角色瀏覽”。“角色瀏覽”是指網(wǎng)站設(shè)計者主觀上假定網(wǎng)站瀏覽者為在讀學(xué)生、教職員工、考生、訪客等不同角色,按照瀏覽需求對網(wǎng)站綜合信息進行分類和聚合,滿足不同的訪問行為。。在實際應(yīng)用中,網(wǎng)站設(shè)計者運用CSS樣式,以達到利用CSS美化網(wǎng)頁,統(tǒng)一網(wǎng)站內(nèi)各個網(wǎng)頁風(fēng)格。CSS樣式定義可以用代碼編寫,也可以借助樣式生成器可視化生成,樣式可以定義在當(dāng)前網(wǎng)頁,也可以導(dǎo)入外部樣式表。優(yōu)點在于一是簡化了不同網(wǎng)頁重復(fù)的格式設(shè)置工作,二是將來只要更新了CSS樣式,所有引用該樣式的對象都會更新,便于網(wǎng)站的更新和維護。2)“Banner圖示”。“Banner圖示”是Banner在高校門戶網(wǎng)站中“廣告”效果的實現(xiàn)和擴展。《設(shè)計的法則》中提到:要增加人們的辨識力,讓人回想起重要信息,就可以利用“圖片優(yōu)勢效應(yīng)”。用圖片加文字,確認強調(diào)的是同一信息,以便達到最佳效果。有鑒于此,網(wǎng)站設(shè)計者將“Banner”作為一個專題欄目,充分利用其“圖示”功能,實現(xiàn)其突出視覺功能的同時,也發(fā)揮其強化信息傳達效果的作用。網(wǎng)站瀏覽者進行點選后可閱讀,Banner標(biāo)簽包含的圖文內(nèi)容,更新速率頻繁,瀏覽者可以根據(jù)時間進行自主選擇,又使它具有了“書簽”功能的展示效果。3)“適應(yīng)網(wǎng)頁設(shè)計(Responsive Web Design)”。如何將日新月異的網(wǎng)絡(luò)技術(shù)應(yīng)用于高校門戶網(wǎng)站,使網(wǎng)站瀏覽者在各類瀏覽器終端上,盡可能獲得良好的用戶體驗,是網(wǎng)站設(shè)計者思考和努力的方向。網(wǎng)絡(luò)使用環(huán)境復(fù)雜而多變,除去傳統(tǒng)意義上的臺式機和筆記本電腦,又有了智能手機、iPad、iTV等終端。鑒于智能手機和平板電腦等移動瀏覽器終端的普及,一些遠程教育門戶網(wǎng)站,利用先進網(wǎng)絡(luò)技術(shù),創(chuàng)新設(shè)計頁面樣式,來適應(yīng)和滿足各類移動終端的瀏覽需求。
四、結(jié)語
遠程教育網(wǎng)站是信息技術(shù)和大學(xué)文化在網(wǎng)絡(luò)媒介平臺的融合與呈現(xiàn),網(wǎng)站設(shè)計者要做到內(nèi)容為主,用戶至上,提高用戶滿意系數(shù)。設(shè)計者應(yīng)對網(wǎng)站設(shè)計進行調(diào)研分析,對其頁面樣式進行規(guī)律探析,形成更多系統(tǒng)化、理論化的設(shè)計經(jīng)驗和技巧,以此指導(dǎo)網(wǎng)頁樣式設(shè)計實踐活動。
參 考 文 獻
[1]祝曉銘,王艷平.高校門戶網(wǎng)站頁面樣式設(shè)計探析[J]. 電腦知識與技術(shù),2015(VOL.11)第2期:199-200.
[2]華磊,許長安.淺談網(wǎng)站設(shè)計分析與網(wǎng)頁制作[J].無線互聯(lián)科技,2014(08 ).
[3]威廉·立德威爾,克里蒂娜·霍頓,吉爾·巴特勒.設(shè)計的法則[M].李嬋,譯.沈陽:遼寧科學(xué)技術(shù)出版社,2010:152.
[4]董海斌,王麗梅,孫浩章.網(wǎng)頁界面設(shè)計中的平面視覺元素[J].包裝工程,2010(4):89-91.