前言:一篇好文章的誕生,需要你不斷地搜集資料、整理思路,本站小編為你收集了豐富的網(wǎng)頁設(shè)計特點主題范文,僅供參考,歡迎閱讀并收藏。
網(wǎng)頁設(shè)計能夠綜合文字、圖片以及色彩等視覺元素將信息進(jìn)行有效傳遞,在滿足瀏覽者要求的同時能夠創(chuàng)造出比較和諧的視覺效果,也可說視覺元素在網(wǎng)頁設(shè)計中的運(yùn)用具有非常重要的作用。本文分析了網(wǎng)頁設(shè)計中視覺元素的作用并進(jìn)一步研究了網(wǎng)頁設(shè)計中視覺元素的運(yùn)用策略。
關(guān)鍵詞:
網(wǎng)頁設(shè)計中;視覺元素;運(yùn)用
隨著近些年來互聯(lián)網(wǎng)信息科技的發(fā)展,人們?yōu)g覽網(wǎng)頁的需求不斷增加,而且對網(wǎng)頁的要求也逐漸加大,為了改變?nèi)藗兊氖褂眯枨?,網(wǎng)頁在實際設(shè)計中需要逐步改變原有的風(fēng)格,從而使網(wǎng)頁在視覺表達(dá)效果上出現(xiàn)多樣化特點。尤其是圖像、文字以及色彩等視覺元素在網(wǎng)頁設(shè)計中的運(yùn)用,為網(wǎng)頁注入了新的活力,使網(wǎng)頁具有更加鮮明的特色,更加吸引人們的眼球,也使信息的傳播更加快捷,成為信息傳播的重要途徑。但是在當(dāng)前的網(wǎng)頁設(shè)計中出現(xiàn)了網(wǎng)頁質(zhì)量參差不齊的情況,除了一些大型網(wǎng)站在社就上比較考究外,小型網(wǎng)站在設(shè)計上并不考究,甚至出現(xiàn)了視覺沖擊,無法充分展現(xiàn)出網(wǎng)頁的優(yōu)勢,而要優(yōu)化網(wǎng)頁設(shè)計離不開視覺元素,視覺元素不僅可以使網(wǎng)頁設(shè)計更鉀豐富多彩,而且使人們更加快捷的接收信息。因此也可以說視覺元素在網(wǎng)頁設(shè)計中的運(yùn)用具有非常重要的作用。
一、網(wǎng)頁設(shè)計中視覺元素的作用
網(wǎng)頁設(shè)計中的視覺元素主要包括圖片、色彩以及文字等三大部分,主要是因為這三種元素都是人的眼睛能夠直接接收到的元素,也正是由于視覺元素在網(wǎng)頁設(shè)計中的融入,使網(wǎng)頁設(shè)計更加的豐富多彩。視覺元素在網(wǎng)頁設(shè)計中發(fā)揮著非常關(guān)鍵的作用,主要有以下幾個方面:
1、視覺元素能夠技法人們?yōu)g覽網(wǎng)頁的欲望
網(wǎng)頁設(shè)計的詩視覺元素具有注視性等特點,這種特點的優(yōu)勢就是能夠使網(wǎng)頁設(shè)計更加受人們關(guān)注,這也是視覺元素中的基本特點,在網(wǎng)頁設(shè)計中融入視覺元素就能夠使人能更加快捷的獲取與了解信息,使信息的更加明了,并使網(wǎng)頁的內(nèi)容更加豐富多彩,引起人們對網(wǎng)頁的關(guān)注,激發(fā)人們想要去了解網(wǎng)頁以及瀏覽網(wǎng)頁的興趣與欲望,從而實現(xiàn)網(wǎng)頁設(shè)計的根本目的。
2、更好的適應(yīng)外部環(huán)境的變化
網(wǎng)頁設(shè)計中的視覺元素具有適應(yīng)性特點,這也是網(wǎng)頁設(shè)計中視覺元素的特色所在,正是由于視覺元素具有適應(yīng)性,從而使網(wǎng)頁更好的適應(yīng)時展的特征,隨著數(shù)字信息技術(shù)的改革與發(fā)展,給網(wǎng)頁設(shè)計的環(huán)境帶來了很大的改變,但是網(wǎng)頁視覺元素是隨著外界環(huán)境的變化而不斷升級變化的,也只有在隨和時展不斷增加新的資料以及元素,才能夠是網(wǎng)頁更加的適應(yīng)時代的發(fā)展,才能夠獲得更多的瀏覽量。
3、加深人們對網(wǎng)頁的記憶
加深人們對網(wǎng)頁的記憶主要是由于視覺元素中的注視性以及適應(yīng)性共同作用形成的。視覺元素能夠刺激人們的眼球,吸引人們?nèi)ラ喿x網(wǎng)頁中的內(nèi)容,在閱讀瀏覽過程中就會使人們對這些視覺元素加強(qiáng)記憶,同時視覺元素隨著時代的不斷變化發(fā)展又會有新的元素融入到視覺元素中,更進(jìn)一步引起人們的關(guān)注,在這兩種特點的共同作用下形成了視覺元素的記憶性特色,加深人們對網(wǎng)頁的記憶。
二、網(wǎng)頁設(shè)計中視覺元素的運(yùn)用策略
1、文字的運(yùn)用
文字是網(wǎng)頁設(shè)計視覺元素中的基本元素,尤其是漢字是我國獨特的視覺元素符號,可以表達(dá)出獨特的信息,漢字在網(wǎng)頁設(shè)計中占據(jù)很大部分比例,也使網(wǎng)頁設(shè)計中的視覺質(zhì)量有了很大程度的提升。在網(wǎng)頁設(shè)計中為了增強(qiáng)漢字在網(wǎng)頁中的有效性,在對漢字的運(yùn)用中要去掉不必要的裝飾,更加方便人們閱讀,從而使網(wǎng)頁的整體效果得到提升。文字在運(yùn)用設(shè)計的過程中,要根據(jù)網(wǎng)站信息的內(nèi)容以及特點出發(fā)考慮對文字進(jìn)行設(shè)計,文字的設(shè)計風(fēng)格要與實際的網(wǎng)站內(nèi)容相符合不能夠出現(xiàn)對立或者是脫節(jié)的情況,比如說:政府網(wǎng)站具有嚴(yán)肅大氣的特點,這就需要在文字設(shè)計時利用文字的簡潔大氣的特征,而教育類網(wǎng)站在文字的使用中具有需要具有清新典雅的特點,商業(yè)網(wǎng)站中的文字就要根據(jù)商品特點等進(jìn)行設(shè)計,從而利用文字特有的個性特征,以增強(qiáng)人們的的視覺沖擊效果,給人們留下深刻的印象。因為文字的特點較多,比如說:有字體、字形等,給網(wǎng)頁設(shè)計者帶來很大的選擇空間,在設(shè)計者進(jìn)行網(wǎng)頁設(shè)計時就要精心的編排與設(shè)計,利用文字的特點去增強(qiáng)網(wǎng)頁的視覺美感,給人們留下比較深刻的印象。
2、圖片的運(yùn)用
圖片作為重要的視覺元素在網(wǎng)頁設(shè)計中扮演者非常重要的角色,網(wǎng)頁在設(shè)計中對圖片的運(yùn)用也是非常重要的,圖片與文字相比較,圖片所激發(fā)的詩視覺效果要比文字的視覺效果更加強(qiáng)烈,而且圖片所產(chǎn)生的視覺效果是立桿見影的,會給人們留下較為深刻的印象,在設(shè)計者在選擇圖片過程中要盡量使字節(jié)數(shù)較小的圖片,主要是由于圖片的大小會影響圖片的傳輸效果,如果圖片字節(jié)數(shù)少就會極大的縮短下載的時間,從而使瀏覽者能夠在打開網(wǎng)頁的過程中就能夠看到圖片,提升瀏覽者的滿意度,另外在圖片的編排位置、數(shù)量以及形式等方面也要引起設(shè)計者的重視,從而增強(qiáng)網(wǎng)頁的整體視覺效果。圖片能夠提升網(wǎng)頁的視覺效果,在網(wǎng)頁中發(fā)揮著非常關(guān)鍵的作用,但是圖片也具有一定的劣勢,圖片不能夠準(zhǔn)確的表達(dá)出信息內(nèi)容,需要文字的輔助才能夠發(fā)揮出更好的效果。
3、色彩的應(yīng)用
色彩也是一種重要的視覺元素,在網(wǎng)頁設(shè)計中也發(fā)揮著無可替代的作用,色彩這種視覺元素本身就具有非常獨特的性質(zhì),充分的利用色彩能夠增強(qiáng)網(wǎng)頁視覺整體效果,在色彩的運(yùn)用中設(shè)計者要注意以下兩點內(nèi)容:首先是色彩的主色調(diào)要根據(jù)網(wǎng)頁整體主題思想來定位,再配上與主色形成對比的彩色字體,讓人們在瀏覽網(wǎng)頁的過程中感覺到清晰順暢,這樣也能更好的突出文字信息,圖片在色彩的選擇上也要以同色系的色彩為主,以更好的增強(qiáng)網(wǎng)頁的整體效果。其次,在背景色的選擇上,最好要與主色性相同或者是對比度較低的顏色,從而更加便于圖片與文字的搭配,更好的識別文字。
總之,文字、圖片以及顏色在網(wǎng)頁設(shè)計中的運(yùn)用,不僅提升了網(wǎng)頁的質(zhì)量,而且是網(wǎng)頁設(shè)計更加的豐富多彩,更符合現(xiàn)代人的需求,但是視覺元素在網(wǎng)頁設(shè)計中運(yùn)用是一項非常復(fù)雜的藝術(shù),對設(shè)計者的審美以及技能有較高的要求,因此,這就需要設(shè)計者在實際設(shè)計中不斷對視覺元素進(jìn)行改革創(chuàng)新以提升網(wǎng)頁的整體效果。
作者:張濤 吳倩 展慶召 單位:石家莊信息工程職業(yè)學(xué)院
網(wǎng)頁設(shè)計項目實踐現(xiàn)狀改革措施近年來,隨著互聯(lián)網(wǎng)的普及,上網(wǎng)人數(shù)與日俱增,網(wǎng)頁又是互聯(lián)網(wǎng)信息傳播的主要載體,因此《網(wǎng)頁設(shè)計與制作》課程就成為我國高校許多專業(yè)開設(shè)的基礎(chǔ)課程之一。同時,《網(wǎng)頁設(shè)計與制作》是一門極具創(chuàng)造性的實踐課程,學(xué)習(xí)過程的枯燥和設(shè)計精美且具有創(chuàng)意的網(wǎng)頁作品,這就使得大多同學(xué)對這門課既喜歡又無從下手。為此,希望通過對高校《網(wǎng)頁設(shè)計與制作》現(xiàn)行教學(xué)過程的改革與探索,使該課程的教學(xué)過程變得既能引發(fā)學(xué)生的學(xué)習(xí)興趣,又能充分調(diào)動學(xué)生的學(xué)習(xí)積極性和創(chuàng)造性,提高學(xué)生的實際動手操作能力,最終使學(xué)生能夠運(yùn)用上課所學(xué)知識進(jìn)行具體的網(wǎng)頁設(shè)計與制作工作。
一、《網(wǎng)頁設(shè)計與制作》課程的特點
高等學(xué)校開設(shè)《網(wǎng)頁設(shè)計與制作》的目的,是通過學(xué)生對本門課程的學(xué)習(xí),培養(yǎng)學(xué)生的實際動手操作能力,最終使學(xué)生能夠運(yùn)用上課所學(xué)知識進(jìn)行具體的網(wǎng)頁設(shè)計工作。
《網(wǎng)頁設(shè)計與制作》是一門邊緣學(xué)科,同時也是一門實踐性和應(yīng)用性很強(qiáng)的學(xué)科,課程本身就能極大的激發(fā)學(xué)生的參與性,因此在教學(xué)當(dāng)中一定要重視理論與實踐相結(jié)合,理論教學(xué)服務(wù)于實踐教學(xué),因為實踐是整個網(wǎng)頁設(shè)計課程教學(xué)的重點,也是《網(wǎng)頁設(shè)計與制作》這門課程的特點。
二、網(wǎng)頁設(shè)計教學(xué)過程中存在的問題與現(xiàn)狀
1.《網(wǎng)頁設(shè)計與制作》課程的教學(xué)現(xiàn)狀
目前,我國絕大多數(shù)高?!毒W(wǎng)頁設(shè)計與制作》課程的講授雖然相對以往的滿堂灌的教學(xué)模式已經(jīng)有大的轉(zhuǎn)變,能夠?qū)嶒灲虒W(xué)、多媒體演示等現(xiàn)代化的教學(xué)手段融入教學(xué)當(dāng)中,但仍然存在理論教學(xué)與實踐嚴(yán)重脫離,設(shè)計內(nèi)容與市場需求相脫離等問題,同時學(xué)生的實際動手能力偏低,這直接影響了學(xué)生的學(xué)習(xí)積極性與主動性,距離網(wǎng)頁設(shè)計與制作的社會崗位要求甚遠(yuǎn),無法勝任普通企業(yè)崗位等問題,這充分說明了傳統(tǒng)教學(xué)模式已經(jīng)完全不能適應(yīng)現(xiàn)代社會的需求,我們的教學(xué)模式還存在很大不足,需要進(jìn)一步改革。
2.具體教學(xué)中所存在的問題
《網(wǎng)頁設(shè)計與制作》教學(xué)過程中存在的問題主要包括以下幾個方面:
(1)教師教學(xué)水平有待提高
《網(wǎng)頁設(shè)計與制作》課程教學(xué),要求教師能夠非常了解當(dāng)前全國市場對網(wǎng)頁人才的需求與要求,同時日益更新的網(wǎng)頁設(shè)計理論知識和對計算機(jī)操作實踐能力的更高要求,這對高校教師的授課無形中提出了進(jìn)一步的要求,并且在網(wǎng)頁設(shè)計的項目教學(xué)中,確定項目任務(wù)的是以不同行業(yè)的設(shè)計要求為前提,這就要求教師對各行業(yè)的行業(yè)特點及具體要求都有比較深入的了解與掌握,才能游刃有余地及時處理學(xué)生學(xué)習(xí)實踐中的具體問題,而以上方面卻是授課教師平時工作中最需提升的地方。
(2)課程教學(xué)目標(biāo)不明確
《網(wǎng)頁設(shè)計與制作》的教學(xué)應(yīng)從社會對人才的基本需求點出發(fā),圍繞培養(yǎng)適應(yīng)社會需求的應(yīng)用型人才為目標(biāo)開展教學(xué)。教學(xué)目標(biāo)是整個課堂教學(xué)的出發(fā)點和落腳點。《網(wǎng)頁設(shè)計與制作》是一門以操作為主的實踐性課程,在具體教學(xué)中,教師必須明確告之學(xué)生每次教學(xué)的目標(biāo)與要求,課堂涉及的重點與難點,這樣才能引領(lǐng)學(xué)生進(jìn)行具體的實踐性操作并做到有的放矢,讓學(xué)生真正學(xué)到有用知識。
(3)教學(xué)方法與手段滯后
高校學(xué)生基本都來自全國五湖四海,有的同學(xué)接觸過計算機(jī)課程,也有從來沒接觸過計算機(jī)的課的同學(xué)。在本門課程教學(xué)中,應(yīng)根據(jù)學(xué)科及學(xué)生自身的特點與要求來確定教學(xué)方法、模式與組織課堂形式。傳統(tǒng)的單一且重復(fù)性較大的填鴨式教學(xué)方法與僅僅依靠多媒體講授軟件命令的落后的教學(xué)手段已經(jīng)不能適應(yīng)新時期的《網(wǎng)頁設(shè)計與制作》課程的教學(xué)需要了,教學(xué)方法與教學(xué)手段的改進(jìn)已到了刻不容緩的地步。
(4)項目教學(xué)在整個課程中的重視度偏低
本課程項目教學(xué)的關(guān)鍵是在已制定項目任務(wù)的前提下如何督促每位學(xué)生最終順利完成該項目。而且現(xiàn)行課本實訓(xùn)部分的內(nèi)容不僅課時分配較少而且只是一個簡單的單機(jī)版的書本實訓(xùn)案例,嚴(yán)重脫離社會需求,只適合學(xué)生按部就班完成一個課堂作業(yè),并沒有實現(xiàn)真正意義上的項目創(chuàng)新設(shè)計與分工合作。
(5)考核方式不到位
《網(wǎng)頁設(shè)計與制作》課程的考核通常主要是筆試或做一張簡單的網(wǎng)頁效果圖,誰帶課誰出題,學(xué)生出勤與項目任務(wù)的完成與社會已采納項目的評分所占比例較低,對于網(wǎng)頁設(shè)計這類操作性與實踐性很強(qiáng)的課程,以上考核方法已完全不能適合該門課程的教學(xué)需要了。
三、網(wǎng)頁設(shè)計課程教學(xué)改革方案
1.有計劃提升高校教師的整體素質(zhì)和業(yè)務(wù)水平
在網(wǎng)頁設(shè)計課程教學(xué)中,教師的綜合素質(zhì)和業(yè)務(wù)水平都將直接影響到學(xué)生學(xué)習(xí)質(zhì)量的高低,所以建設(shè)一支高素質(zhì)的師資隊伍是提高課改質(zhì)量和效率、提高學(xué)生實踐能力和專業(yè)水平的重要手段。社會需要學(xué)校培養(yǎng)出能適應(yīng)市場經(jīng)濟(jì)需求的設(shè)計人才來,這對授課教師的知識結(jié)構(gòu)和實踐技能水平的要求更高,因此學(xué)校應(yīng)積極鼓勵教師不斷更新、拓展和提高專業(yè)知識結(jié)構(gòu),同時學(xué)校應(yīng)多方面支持專業(yè)教師定期或不定期的參加各種設(shè)計競賽及科研項目及各類數(shù)字藝術(shù)交流培訓(xùn)活動,增加教師的進(jìn)修和學(xué)習(xí)機(jī)會,加大師資素質(zhì)培訓(xùn),并創(chuàng)造利用校企聯(lián)合的機(jī)會參與到企業(yè)或公司具體的設(shè)計項目中去,只有這樣才能提高教師的整體素質(zhì)和業(yè)務(wù)水平。
體現(xiàn)風(fēng)格,突出主題一個網(wǎng)站的特點與風(fēng)格要得到展示,除了要使頁面內(nèi)容與形式之間有機(jī)結(jié)合,還要使不同色彩有機(jī)結(jié)合。每一種顏色都有它所特有的個性,設(shè)計人員可以借助色彩心理學(xué)表達(dá)色彩的情感效果,以便更好地突出主題。網(wǎng)頁區(qū)域劃分應(yīng)有統(tǒng)一的風(fēng)格網(wǎng)站內(nèi)容豐富,信息量大,設(shè)計師要對網(wǎng)頁界面進(jìn)行視覺區(qū)域劃分。網(wǎng)頁信息的分類布局,可以使用不同的色彩劃分內(nèi)容主次,規(guī)劃視覺流程,統(tǒng)一網(wǎng)頁的整體風(fēng)格,給瀏覽者以完整的、易讀的、富有導(dǎo)向性的視覺印象。引起人們的關(guān)注,加深印象網(wǎng)頁設(shè)計或優(yōu)雅含蓄,或動感強(qiáng)烈,或時尚新穎,或簡單搶眼,能吸引觀眾的注意,是設(shè)計人員充分利用色彩的魅力來優(yōu)化頁面的成果,這種頁面的色彩設(shè)計極大地提高了網(wǎng)頁的藝術(shù)性,是提高訪問率和網(wǎng)站知名度的關(guān)鍵。
網(wǎng)頁設(shè)計中色彩搭配的原則
平面設(shè)計和網(wǎng)頁設(shè)計最重要是色彩的搭配。當(dāng)人們離屏幕較遠(yuǎn)時,第一眼看到的是頁面顏色,而不是具體的圖片與文字排版。因此,設(shè)計者在網(wǎng)頁設(shè)計中除了要考慮突出網(wǎng)頁內(nèi)容的理性要求,也要遵循感性的藝術(shù)規(guī)律,從而設(shè)計出性格獨特的網(wǎng)頁。
1.特色鮮明一個網(wǎng)頁必須有自己獨特的色彩風(fēng)格,以使看起來個性鮮明,給觀眾留下深刻的印象。
2.合理搭配一種色彩的應(yīng)用:將選擇的顏色調(diào)整透明度或飽和度,產(chǎn)生新的顏色。這種色彩的運(yùn)用使頁面看起來更統(tǒng)一,主次更分明。兩種色彩的應(yīng)用:在選擇一種色彩后,然后選擇其對比色。一個色系的應(yīng)用:將一個感覺的色彩放在一起使用,如淺藍(lán)、淺黃、淺綠,或者土黃、土灰、土藍(lán),等等。
3.藝術(shù)性網(wǎng)頁設(shè)計含有藝術(shù)的成分,是一種藝術(shù)活動,有其藝術(shù)規(guī)律需要遵循,而網(wǎng)頁設(shè)計師在考慮內(nèi)容的同時,也要根據(jù)藝術(shù)的形式、特點、原則進(jìn)行大膽的藝術(shù)創(chuàng)新,在符合網(wǎng)站要求的同時讓網(wǎng)頁各有特點。
色彩搭配要注意的問題
Flas是一種藝術(shù)與技術(shù)緊密結(jié)合、學(xué)科優(yōu)勢廣泛的綜合藝術(shù)表現(xiàn)形式,它常以多種與體驗者互動的形式出現(xiàn)在網(wǎng)絡(luò)和影視媒體中,如網(wǎng)頁上的片頭、廣告動畫等。一部Flas作品的設(shè)計與創(chuàng)作是將多種藝術(shù)門類和科學(xué)技術(shù)結(jié)合的綜合過程。Flas應(yīng)用領(lǐng)域十分廣泛,如教育教學(xué)、網(wǎng)頁設(shè)計、交互游戲開發(fā)、廣告設(shè)計、短片表現(xiàn)等。Flas最重要的特點是畫面中極易實現(xiàn)的交互效果。Flash作品良好的交互效果具有很高的藝術(shù)價值和實用價值,我們大致可將Flash作品的交互小姑分成三類,如劇情交互型、純粹形式探索型、游戲交互型。
2網(wǎng)頁設(shè)計中交互體驗的重要性
網(wǎng)頁設(shè)計中的交互性是人與頁面間的交流,通過頁面設(shè)計為受眾提供一個平等的交流平臺,開放性和不確定性是這個平臺的特點。網(wǎng)頁設(shè)計中的交互體驗不單單會影響在計算機(jī)上的互動,還將對社會文化及現(xiàn)代傳媒系統(tǒng)產(chǎn)生深遠(yuǎn)的影響。網(wǎng)頁設(shè)計的終極目標(biāo)是給受眾提供更多信息和功能,讓受眾能輕松地找到所需信息。在網(wǎng)絡(luò)大發(fā)展的背景下,人們獲取信息多源于網(wǎng)絡(luò),每當(dāng)人們獲取信息、購物、在線聊天時都得面對頁面,即頁面設(shè)計的體驗優(yōu)劣成為人們駐足頁面停留時間的重要決定因素。當(dāng)下企業(yè)、文化行業(yè)、新聞行業(yè)、時尚業(yè)、體育行業(yè)等都開發(fā)了自己的網(wǎng)站,并將其作為與受眾交流的平臺,每個網(wǎng)站都有自己的獨特風(fēng)格,都有吸引訪問者的特點。眼下交互體驗設(shè)計成為新的吸引訪問者的重要因素。這就需要我們不僅要對網(wǎng)站進(jìn)行精心的創(chuàng)新設(shè)計,還要在設(shè)計中加入交互體驗內(nèi)容,不僅要清晰的表達(dá)頁面內(nèi)容,還要讓受眾能夠參與進(jìn)來,在具有交互性的環(huán)境中訪問網(wǎng)站。Flash恰好能夠通過它的“交互性”來連接受眾與網(wǎng)站。
3網(wǎng)頁設(shè)計中Flash交互功能的應(yīng)用
在網(wǎng)站的商業(yè)推廣中,F(xiàn)lash的交互體驗發(fā)揮了很重要的作用。Flash交互應(yīng)用優(yōu)勢主要體現(xiàn)在簡單的流動式互動體驗和復(fù)雜的互動式動畫體驗中。網(wǎng)頁設(shè)計中融入了Flash互動體驗?zāi)軌蛟龃缶W(wǎng)站的活力,進(jìn)而吸引受眾的注意力。Flash強(qiáng)大的交互性很大程度上來源于它的腳本語言,它是一種專門的程序語言,采用統(tǒng)一的編程思想。若想得到最佳效果的網(wǎng)頁設(shè)計,恰當(dāng)合理的引導(dǎo)是重點,每個引導(dǎo)過程都要有明確清晰的軌跡。恰當(dāng)?shù)膽?yīng)用Flash交互功能不僅能吸引受眾的興趣,同時它的交互性又能讓受眾很好去體驗信息交互帶來的興奮。在瀏覽網(wǎng)頁的體驗中,交互功能是人們各種感官集合的延伸。在融入flash交互體驗思維的網(wǎng)頁設(shè)計中,受眾可以隨時通過互聯(lián)網(wǎng)來查看自己的作品,并與作品進(jìn)行交互體驗,使作品在網(wǎng)絡(luò)中大范圍的傳播。網(wǎng)頁設(shè)計中,信息的流動性會很強(qiáng),受眾不但擁有自由的選擇權(quán),而且還能夠制約信息對象按照受眾的意愿進(jìn)行處理。在受眾與頁面的互動體驗中,受眾的主體意識得到很大的提高,創(chuàng)造力和思維被極大的激發(fā),進(jìn)而改變受眾的思維模式,受眾的互動能力被調(diào)動起來。
4結(jié)語
在我國,視覺傳達(dá)教育起步較晚,但是發(fā)展迅速,其人才培養(yǎng)和教育模式倍受社會關(guān)注。目前很多高校在藝術(shù)類網(wǎng)頁設(shè)計課程的教學(xué)上存在兩種主要現(xiàn)象:一是重設(shè)計、輕制作;二是重軟件、輕藝術(shù)。第一種培養(yǎng)出的學(xué)生一般只注重靜態(tài)頁面的視覺效果,對網(wǎng)站的動態(tài)更新關(guān)注較少,不利于網(wǎng)頁后期維護(hù);第二種培養(yǎng)出的學(xué)生側(cè)重于Dreamweaver、Flash等軟件的操作,對網(wǎng)頁的版式、VI形象等關(guān)注較少,制作出的網(wǎng)頁往往缺乏個性、藝術(shù)表現(xiàn)力不強(qiáng)。因此,對視覺傳達(dá)專業(yè)的網(wǎng)頁設(shè)計課程的教學(xué)改革勢在必行。
二、課程教學(xué)目標(biāo)的重新確定
我們都知道,一門學(xué)科的課程目標(biāo)通常決定了該學(xué)科的最終導(dǎo)向,它不僅能為教師傳授正確的學(xué)科理念提供依據(jù),同時也給學(xué)生指明正確的課程學(xué)習(xí)方向。因此,視覺傳達(dá)專業(yè)網(wǎng)頁設(shè)計課程改革的首要環(huán)節(jié)就是對該課程教學(xué)目標(biāo)的重新確立。眾所周知,高等教育培養(yǎng)出來的人才最終要服務(wù)于社會,社會的需求決定了該學(xué)科的教學(xué)內(nèi)容和教學(xué)目標(biāo)。隨著科技的進(jìn)步,時代的發(fā)展,不同時期對網(wǎng)頁設(shè)計人員的需求也是不同的。通過市場調(diào)研,我發(fā)現(xiàn)目前社會上網(wǎng)站分工越來越細(xì),招聘的相關(guān)崗位大體分為三類:第一類為前臺美工,以視覺傳達(dá)專業(yè)為主,以網(wǎng)站的形象塑造和界面美化為崗位內(nèi)容;第二類為網(wǎng)站后臺服務(wù),多以h7V5數(shù)據(jù)庫等做交互型網(wǎng)站的,以計算機(jī)專業(yè)為主;第三類就是兩者都要具備的全才網(wǎng)頁設(shè)計師,是具有技術(shù)背景和多年實戰(zhàn)經(jīng)驗的創(chuàng)意人才。由此我們可以確定視覺傳達(dá)專業(yè)培養(yǎng)出來的網(wǎng)頁設(shè)計人才的崗位定位應(yīng)是網(wǎng)頁美工師,他應(yīng)該具有兩種專業(yè)素質(zhì):一是掌握網(wǎng)頁設(shè)計的基本要素和美學(xué)知識相結(jié)合的方法與技巧;二是懂得簡單機(jī)算計軟件(PS、Dreamweaver、Flash)的操作,便于在制作網(wǎng)頁界面時考慮到后臺維護(hù)的便利。而“藝術(shù)設(shè)計教育的人才培養(yǎng)目標(biāo)是:培養(yǎng)綜合素質(zhì)高、創(chuàng)造能力強(qiáng)的高級應(yīng)用型設(shè)計人才”。所以該課程教學(xué)目標(biāo)應(yīng)該是培養(yǎng)具有以上兩種專業(yè)綜合素質(zhì)的、創(chuàng)造能力強(qiáng)的高級網(wǎng)絡(luò)應(yīng)用型設(shè)計人才。新的培養(yǎng)目標(biāo)確定后,該課程的教學(xué)內(nèi)容應(yīng)該在此基礎(chǔ)上重新調(diào)整。
三、課程內(nèi)容的調(diào)整
視覺傳達(dá)專業(yè)網(wǎng)頁設(shè)計課程教學(xué)內(nèi)容應(yīng)該為教學(xué)目標(biāo)服務(wù),知識結(jié)構(gòu)要合理,應(yīng)注意知識點之間的交叉及有機(jī)結(jié)合,同時也要有效地培養(yǎng)學(xué)生的創(chuàng)新性思維及獨立分析、解決問題的能力?;诖?,新的教學(xué)內(nèi)容調(diào)整為兩大板塊:理論課程內(nèi)容和實踐課程內(nèi)容。
1.理論課程內(nèi)容
理論課程內(nèi)容在課程編排中為最先講授內(nèi)容,以教師PPT演示傳授為主,學(xué)生討論互動為輔,課時安排為總學(xué)時的四分之一。在教學(xué)過程中又分為兩個環(huán)節(jié)來實現(xiàn):(1)第一次課的設(shè)計把第一次課設(shè)置為課程概述,主要對網(wǎng)頁設(shè)計課程的教學(xué)特點、教學(xué)內(nèi)容、教學(xué)目的、教學(xué)重點和難點加以通篇介紹,對學(xué)生說明課程安排和考核要求,并通過簡單上機(jī)實例操作來提高學(xué)生學(xué)習(xí)興趣,進(jìn)而引入網(wǎng)頁基本理論教學(xué)環(huán)節(jié)。(2)網(wǎng)頁基本理論學(xué)習(xí)網(wǎng)頁基本理論學(xué)習(xí)包含三個知識板塊:網(wǎng)頁設(shè)計的基本要素、網(wǎng)頁界面的版式設(shè)計、網(wǎng)頁VI形象的美學(xué)塑造。我們知道每個設(shè)計門類都有自己獨特的構(gòu)成元素,這些不同的構(gòu)成元素形成了該門類不同于別的門類的獨特的藝術(shù)魅力。了解和掌握這些構(gòu)成元素的特點和作用,有助于我們更好地進(jìn)行設(shè)計工作。網(wǎng)頁構(gòu)成元素按功能和形式劃分為兩大類型,按功能劃分為頁眉和頁腳、背景與底紋、按鈕與控件、導(dǎo)航器和目錄、功能板塊和廣告位;按形式分為文字、圖片、色彩、多媒體和超級鏈接。網(wǎng)頁設(shè)計中的構(gòu)成語言不同于傳統(tǒng)平面設(shè)計,它們之間存在很大差異,例如網(wǎng)頁設(shè)計中的顏色是光色,是標(biāo)準(zhǔn)的RGB色彩,而傳統(tǒng)平面設(shè)計中的顏色在輸出過程中是以印刷色CMYK形式出現(xiàn)的;傳統(tǒng)的平面設(shè)計不用考慮網(wǎng)絡(luò)傳輸?shù)囊蛩?,而網(wǎng)頁設(shè)計中的構(gòu)成元素應(yīng)考慮在不影響顯示效果的前題下,盡量壓縮文件大小,便于網(wǎng)頁文件的上傳與下載;又如動畫、音頻等多媒體語言在傳統(tǒng)平面設(shè)計中不用考慮,而在網(wǎng)頁設(shè)計中它們是給網(wǎng)頁增加活力的重要手段因此,教師在此板塊教學(xué)中要選擇大量實例進(jìn)行比較,不但要指出網(wǎng)頁設(shè)計各構(gòu)成元素的特點和作用,而且還應(yīng)指出與平面設(shè)計中相對應(yīng)元素的異同之處,便于學(xué)生區(qū)別學(xué)習(xí)。網(wǎng)頁界面的版式設(shè)計不同于傳統(tǒng)平面設(shè)計的版式設(shè)計。平面印刷品有著各自固定的紙張大小或裁切規(guī)格,而網(wǎng)頁界面則不然,它的顯示尺寸受到電腦顯示器的限制,不同尺寸的顯示器顯示的網(wǎng)頁界面是有區(qū)別的。除此以外,它的最終顯示控制權(quán)其實掌握在瀏覽者手中。如果過分注重網(wǎng)頁界面版式設(shè)計的視覺完整性,就不能顧及網(wǎng)頁設(shè)計元素的靈活性。所以,教師在此板塊教學(xué)中應(yīng)該強(qiáng)調(diào)網(wǎng)頁界面版式的變化性,同時也要強(qiáng)調(diào)首頁與內(nèi)頁版式的連貫性,要求學(xué)生在設(shè)計中注意網(wǎng)頁界面版式完整性與靈活性的關(guān)系。網(wǎng)頁設(shè)計是VI設(shè)計的一個重要組成部分,是企業(yè)視覺形象執(zhí)行標(biāo)準(zhǔn)的延續(xù)和拓展。和所有的線下公司一樣,一個好的網(wǎng)站也需要依助于VI設(shè)計。準(zhǔn)確的、有創(chuàng)意的VI設(shè)計,有利于樹立網(wǎng)站形象,使其在眾多同類網(wǎng)站中脫穎而出,增加瀏覽者的瀏覽欲望和瀏覽記憶,對該企業(yè)的推廣和宣傳也能起到促進(jìn)作用。網(wǎng)頁設(shè)計課程上引入VI設(shè)計概念,教師應(yīng)該保持教學(xué)的延續(xù)性,要求學(xué)生在進(jìn)行網(wǎng)頁設(shè)計的同時,將VI理念應(yīng)用到網(wǎng)頁界面中。網(wǎng)頁設(shè)計應(yīng)主題突出、富有創(chuàng)意,色彩搭配應(yīng)協(xié)調(diào)統(tǒng)一,具有強(qiáng)烈的視覺沖擊力,從網(wǎng)頁LOGO到色彩運(yùn)用均要突出企業(yè)視覺形象。
2.實踐課程內(nèi)容
視覺傳達(dá)教育的目的就是培養(yǎng)出創(chuàng)造能力強(qiáng)的高級應(yīng)用型設(shè)計人才。應(yīng)用性人才的培養(yǎng)模式里實踐性課程比例要大,網(wǎng)頁設(shè)計課程也是這樣,理論是基礎(chǔ),實踐是靈魂。所以實踐課程內(nèi)容在課程編排中為比重最大的內(nèi)容,課時安排為總學(xué)時的四分之三。實踐課程包含軟件操作板塊、簡單代碼學(xué)習(xí)板塊和實際案例制作板塊三個知識點。此部分內(nèi)容在教學(xué)過程中又分為兩個環(huán)節(jié)來實現(xiàn):
(1)軟件操作和簡單代碼學(xué)習(xí)板塊的教學(xué)
此部分教學(xué)為計算機(jī)軟件學(xué)習(xí)階段,F(xiàn)ireworks、Dreamweaver、Flash是傳統(tǒng)的網(wǎng)頁設(shè)計軟件學(xué)習(xí)內(nèi)容,根據(jù)當(dāng)今互聯(lián)網(wǎng)開放性的特點和視覺傳達(dá)學(xué)生對現(xiàn)有軟件知識掌握的情況(PS是基本功,是學(xué)生都已掌握的軟件),把傳統(tǒng)軟件教學(xué)內(nèi)容更改為“網(wǎng)頁新三劍客”(PS+Dreamweaver+Flash)的學(xué)習(xí)。簡單地說,就是用PS制作靜態(tài)網(wǎng)頁界面和切圖,并處理圖片,用Dreamweaver布局和超級鏈接,用Flash做特效。而這三個軟件知識板塊里面教學(xué)重點依次為Dreamweaver、Flash、PS。在軟件教學(xué)環(huán)節(jié),教師可借助類似“紅蜘蛛”一樣的網(wǎng)絡(luò)教學(xué)平臺和學(xué)生互動教學(xué)。學(xué)生可根據(jù)老師在線傳送的素材臨摹教師的操作,教師也可以在線觀察學(xué)生執(zhí)行情況個別輔導(dǎo)。同時根據(jù)藝術(shù)學(xué)生英語和數(shù)學(xué)水平普遍較低的特點,在教學(xué)中應(yīng)該增加一些簡單代碼知識,介紹一些常用的代碼語言及Html標(biāo)簽和CSS規(guī)則的使用方法,便于優(yōu)化網(wǎng)頁樣式,使整個網(wǎng)站風(fēng)格統(tǒng)一,也便于對已有的網(wǎng)頁模板進(jìn)行更改,進(jìn)而大大提高學(xué)生的崗位實踐技能。
(2)實際案例制作教學(xué)
此板塊教學(xué)采用以項目為載體、以任務(wù)為驅(qū)動的教學(xué)方法。教師可以引入實際項目或者虛擬項目,提出項目名稱和項目要求,輔導(dǎo)學(xué)生進(jìn)行實際案例設(shè)計。實際案例制作教學(xué)應(yīng)充分強(qiáng)調(diào)實用性和自主性,教學(xué)環(huán)節(jié)可分三步進(jìn)行。首先是教師示范環(huán)節(jié):教師要根據(jù)實例要求演示創(chuàng)作過程,從網(wǎng)站創(chuàng)意草圖到制作靜態(tài)界面;從創(chuàng)建站點到Dreamweaver網(wǎng)頁布局,創(chuàng)建超級鏈接;從美化網(wǎng)頁樣式,到制作網(wǎng)頁特效,利用簡單的代碼語言和Flas實現(xiàn)動態(tài)、實時、交互的頁面效果教師應(yīng)將每個創(chuàng)作環(huán)節(jié)一一展示,并將知識點設(shè)計應(yīng)用到整個案例實際操作中去,做到知識點與案例有效融合,案例之間能承上啟下,有機(jī)銜接。其次為學(xué)生設(shè)計環(huán)節(jié):學(xué)生可以根據(jù)老師的思路對經(jīng)典案例進(jìn)行學(xué)習(xí)和分析,依據(jù)實際任務(wù)的要求,進(jìn)行網(wǎng)頁設(shè)計實際操作。其間遇到問題學(xué)生可以相互討論,或求助教師解決難題。在整個講課過程中,教師指導(dǎo)為輔,學(xué)生對案例進(jìn)行學(xué)習(xí)和分析為主,充分發(fā)揮學(xué)生的主觀能動性。要求學(xué)生充分發(fā)揮創(chuàng)意性思維,從被動學(xué)習(xí)轉(zhuǎn)換為為了實現(xiàn)項目目標(biāo)而進(jìn)行多渠道主動學(xué)習(xí),提高學(xué)生學(xué)習(xí)效率,縮短和實際崗位間的操作差距,進(jìn)而為走向社會奠定基礎(chǔ)。最后為展示評價環(huán)節(jié):學(xué)生對自己的作品公開演示匯報,并鼓勵別的學(xué)生對其作品評價,找出優(yōu)劣點,好的保留,差的改正。教師根據(jù)作品質(zhì)量和學(xué)生評價對作品打分,以此作為該生整門課程成績的一個依據(jù)。
四、結(jié)語
【關(guān)鍵詞】新形勢;電子商務(wù)網(wǎng)站;網(wǎng)頁設(shè)計與制作;web標(biāo)準(zhǔn)
前言:
互聯(lián)網(wǎng)時代的到來,改變了人們以往的生活習(xí)慣,而且對很多行業(yè)崗位產(chǎn)生了較大的影響,尤其催生了一批新型以電子商務(wù)為主要經(jīng)營模式的企業(yè)。電子商務(wù)網(wǎng)站的網(wǎng)頁設(shè)計在現(xiàn)代企業(yè)的實際運(yùn)營管理過程中十分重要,不僅起到了宣傳企業(yè)文化作用,而且也是企業(yè)拓展新業(yè)務(wù)、維護(hù)客戶的重要平臺,這是互聯(lián)網(wǎng)時代的發(fā)展為現(xiàn)代企業(yè)單位開辟的新路徑。
一、新形勢下電子商務(wù)網(wǎng)站網(wǎng)頁設(shè)計與制作的目標(biāo)
所謂“新形勢”指的就是當(dāng)前快速發(fā)展的互聯(lián)網(wǎng)時代影響下的社會環(huán)境的變化,以及人們思想意識的轉(zhuǎn)變。隨著各領(lǐng)域貿(mào)易的日益頻繁,使得商家更依賴電子商務(wù)平臺,因其成本低、信息資源豐富等特點受到了廣大社會群體的認(rèn)可。
(一)電子商務(wù)網(wǎng)站設(shè)計與制作的根本目的
在電子商務(wù)平臺之上,我們可以清晰的看到商品本身的形態(tài)、特征以及價格,而且,越來越多樣化的網(wǎng)站網(wǎng)頁設(shè)計形式層出不窮,促使電子商務(wù)平臺建設(shè)的格局逐步升級,新技術(shù)的涌現(xiàn)更是突顯了電子商務(wù)模式的優(yōu)勢。從網(wǎng)站網(wǎng)頁設(shè)計與制作的目標(biāo)來看,能夠以最直觀、最有效的網(wǎng)站網(wǎng)頁設(shè)計方案來吸引更多的顧客及促使其參與交易才是新形勢下電子商務(wù)網(wǎng)站網(wǎng)頁設(shè)計與制作的終極目標(biāo)。
(二)網(wǎng)站網(wǎng)頁設(shè)計與制作要能夠技術(shù)合規(guī)且突出重點
具體來分析,對于電子商務(wù)網(wǎng)站的設(shè)計要突出其功能性,需要最新的電子計算機(jī)技術(shù)來為其做支撐,程序的設(shè)計一定要能夠順利運(yùn)行,通常要經(jīng)過測試以后才能夠上線運(yùn)行。對于電子商務(wù)的網(wǎng)頁設(shè)計而言,結(jié)構(gòu)和形式要突出層次感,內(nèi)容要盡可能豐富,從而將電子商務(wù)的關(guān)鍵內(nèi)容呈現(xiàn)在網(wǎng)頁的重點區(qū)域,便于人們登錄瀏覽。
二、電子商務(wù)網(wǎng)站網(wǎng)頁設(shè)計與制作所需技術(shù)
對于電子商務(wù)網(wǎng)站網(wǎng)頁設(shè)計來說,能夠依托網(wǎng)絡(luò)載體使得開展電子商務(wù)業(yè)務(wù)的企業(yè)將其業(yè)務(wù)有效的推廣出去,就是一項成功的設(shè)計。在實踐過程中,需要應(yīng)用到很多計算機(jī)技術(shù)及電子商務(wù)設(shè)計軟件。就以web標(biāo)準(zhǔn)為例來看,電子商務(wù)網(wǎng)站網(wǎng)頁設(shè)計的思想是通過縝密的開發(fā)流程來體現(xiàn)的,通過對SHOPEX網(wǎng)上商店系統(tǒng)的制作,進(jìn)而達(dá)到管理網(wǎng)店、拓展業(yè)務(wù)的目的。從實質(zhì)上來看,Web標(biāo)準(zhǔn)不是單一的技術(shù)標(biāo)準(zhǔn),而是一個完整的技術(shù)體系,其層次較為清晰。在Web標(biāo)準(zhǔn)的支撐下,設(shè)計者可以很好地將網(wǎng)站網(wǎng)頁結(jié)構(gòu)分割清楚,并能夠提升網(wǎng)站開發(fā)的效率,降低設(shè)計及維護(hù)成本??傊?,從Web標(biāo)準(zhǔn)的關(guān)鍵技術(shù)來看,整個技術(shù)體系都是以Web標(biāo)準(zhǔn)基本思想為基礎(chǔ),采用一套有效的開發(fā)流程,對SHOPEX網(wǎng)店系統(tǒng)進(jìn)行電子商務(wù)網(wǎng)站的網(wǎng)頁設(shè)計與制作,最終,這種開發(fā)流程在實踐過程中得到了驗證。
三、電子商務(wù)網(wǎng)站網(wǎng)頁設(shè)計與制作過程
在具體進(jìn)行電子商務(wù)網(wǎng)站網(wǎng)頁的設(shè)計與制作的過程中,首先要分析目標(biāo)網(wǎng)站網(wǎng)頁的設(shè)計內(nèi)容、方向、網(wǎng)站所要突出的重點等問題,然后,要縷清設(shè)計思路,規(guī)劃出詳盡的設(shè)計方案,做好網(wǎng)頁結(jié)構(gòu)的編排,最后,細(xì)化網(wǎng)站結(jié)構(gòu),完善網(wǎng)頁制作的細(xì)節(jié)。只有按照規(guī)劃好的流程來,采用合適的網(wǎng)頁設(shè)計技術(shù)及軟件,才可以將電子商務(wù)網(wǎng)站網(wǎng)頁設(shè)計和制作的過程完成。
(一)電子商務(wù)網(wǎng)站網(wǎng)頁的設(shè)計內(nèi)容分析
通常情況下,網(wǎng)站設(shè)計的方案要符合當(dāng)下人們的審美觀,簡單來說,就是要符合大多數(shù)人的視覺習(xí)慣,并需要做好合理規(guī)劃。對于電子商務(wù)網(wǎng)站的設(shè)計而言,要能夠利用大塊區(qū)域來突出貿(mào)易活動的主體內(nèi)容,并讓企業(yè)的產(chǎn)品、服務(wù)等項目列在最為突出的位置上,只有本著重點突出的原則,才能讓瀏覽網(wǎng)站的客戶清楚的看到企業(yè)的業(yè)務(wù)及文化,從而令其產(chǎn)生交易的想法。
(二)網(wǎng)站網(wǎng)頁結(jié)構(gòu)編排與方案設(shè)計
以Web標(biāo)準(zhǔn)下的網(wǎng)店系統(tǒng)開發(fā)為例來看,在進(jìn)行網(wǎng)頁方案設(shè)計之前,網(wǎng)頁模版的開發(fā)較為重要。在實際設(shè)計及制作的過程中,采用了SHOPEX網(wǎng)店系統(tǒng)開發(fā)的模版來為其做支撐,在每個設(shè)計模塊區(qū)域放置一個獨立的設(shè)計內(nèi)容、產(chǎn)品或服務(wù),這樣就會令用戶對電子商務(wù)平臺上的功能及業(yè)務(wù)模塊一目了然。最后,要進(jìn)行網(wǎng)站網(wǎng)頁內(nèi)容的填充,逐步細(xì)化網(wǎng)站結(jié)構(gòu),增添時尚感的素材完善網(wǎng)頁制作。
結(jié)束語:
通過分析電子商務(wù)網(wǎng)站網(wǎng)頁設(shè)計的特殊性,結(jié)合基于web標(biāo)準(zhǔn)的制作技術(shù),來進(jìn)一步探究網(wǎng)絡(luò)時代的發(fā)展對于電子商務(wù)網(wǎng)站網(wǎng)頁設(shè)計及制作的影響,并提出完善電子商務(wù)網(wǎng)頁網(wǎng)站設(shè)計和制作的具體策略。在web標(biāo)準(zhǔn)基本思想的推進(jìn)下,開發(fā)了一套高效制作電子商務(wù)網(wǎng)站網(wǎng)頁的系統(tǒng),并且將其應(yīng)用于實踐,取得了良好的實踐成果。總之,以web標(biāo)準(zhǔn)下為例來看,新形勢下電子商務(wù)網(wǎng)站網(wǎng)頁設(shè)計與制作已經(jīng)不同以往,需要改換新型設(shè)計內(nèi)容、結(jié)構(gòu)設(shè)計、方案設(shè)計等內(nèi)容,只有這樣,才能突出現(xiàn)代電子商務(wù)網(wǎng)站網(wǎng)頁的設(shè)計特點,抓住人們的視線,從而促進(jìn)電子商務(wù)的快速發(fā)展。
參考文獻(xiàn):
[1]朱淑琴,魏威,張嘉萌.基于Web標(biāo)準(zhǔn)的電子商務(wù)網(wǎng)站網(wǎng)頁設(shè)計與制作[J].計算機(jī)與現(xiàn)代化,2012,03(03):106-109.
[2]鄭偉,張永良,郭偉,張學(xué)琴.《商務(wù)網(wǎng)頁設(shè)計與制作》項目課程的開發(fā)與建設(shè)[J].楊凌職業(yè)技術(shù)學(xué)院學(xué)報,2010,04(04):71-74.
關(guān)鍵詞:網(wǎng)頁設(shè)計與制作;教學(xué)內(nèi)容;教學(xué)方法
中圖分類號:G642文獻(xiàn)標(biāo)識碼:A文章編號:1009-3044(2012)08-1864-03
"Webpage Design and Making" Curriculum Teaching Method Exploration
FAN Yi-hong
(Electronic Information Engineering College, Henan University of Science and Technology, Luoyang 471003, China)
Abstract: Webpage design and making course has the characteristics of strong practicality and wide knowledge, how to improve the teaching effect of the course is the question that should be solved urgently. According to the author’s practical teaching experience, the paper conducts the research and the summary from the aspect of the course objectives, course content, teaching method, curriculum practice, training and other teaching links, and it achieved good results in actual teaching。
Key words: Webpage design and making; Content of courses; Teaching method
隨著計算機(jī)網(wǎng)絡(luò)技術(shù)的迅猛發(fā)展和網(wǎng)絡(luò)應(yīng)用的日益廣泛,Internet在人們的生活、學(xué)習(xí)和工作中的地位顯得越來越重要,上網(wǎng)沖浪已經(jīng)成為現(xiàn)代人生活的一個重要部分。信息技術(shù)的高速發(fā)展,使人們通過網(wǎng)絡(luò)來個人或者企業(yè)的信息、推廣企業(yè)產(chǎn)品已成為一種流行的趨勢。網(wǎng)頁已經(jīng)成為信息共享和傳播的主要載體,掌握網(wǎng)頁的制作和網(wǎng)站的管理等內(nèi)容已成為現(xiàn)代人必備的一種技能。
《網(wǎng)頁設(shè)計與制作》是軟件技術(shù)、計算機(jī)多媒體技術(shù)、計算機(jī)網(wǎng)絡(luò)技術(shù)、信息技術(shù)、信息管理、計算機(jī)應(yīng)用等專業(yè)公共的必修課程,也是許多高校的公共選修課,具有實踐性強(qiáng)和知識面廣的特點。該課程要求學(xué)生掌握HTML語言、CSS+DIV、JavaScript語言、Photoshop圖像處理、flas制作等基本知識,為后繼課程《動態(tài)網(wǎng)頁設(shè)計》、《計算機(jī)網(wǎng)絡(luò)》等打下牢固基礎(chǔ),因此該課程具有知識點多、操作性強(qiáng)的特點。如何提高《網(wǎng)頁設(shè)計與制作》課程的教學(xué)質(zhì)量,是亟待解決的問題。根據(jù)近年來對網(wǎng)頁課程的講授經(jīng)驗,筆者從課程目標(biāo)、課程內(nèi)容、教學(xué)方法、課程實踐、課程實訓(xùn)等幾個教學(xué)環(huán)節(jié)對該課程進(jìn)行了一些研究和總結(jié)。
1理論教學(xué)
1.1課程目標(biāo)
《網(wǎng)頁設(shè)計與制作》課程內(nèi)容包括HTML、CSS+DIV、JavaScript、Photoshop、Flash,本課程的教學(xué)目標(biāo)是:
1)使學(xué)生掌握HTML基本知識,熟練掌握靜態(tài)網(wǎng)頁制作技能;
2)使學(xué)生能夠掌握流行的CSS+DIV網(wǎng)頁設(shè)計技術(shù),適應(yīng)網(wǎng)頁設(shè)計社會最新需求;
3)使學(xué)生能夠用Photoshop進(jìn)行網(wǎng)頁效果圖的設(shè)計并能夠切圖輸出;
4)使學(xué)生能夠用Flash進(jìn)行網(wǎng)頁動畫的簡單設(shè)計;
5)使學(xué)生能夠掌握J(rèn)avaScript簡單程序設(shè)計,能夠?qū)崿F(xiàn)網(wǎng)頁的各種動態(tài)效果。
1.2課程內(nèi)容
1.2.1 HTML網(wǎng)頁設(shè)計
重點包括網(wǎng)頁設(shè)計基礎(chǔ)知識、用HTML設(shè)置文本和圖像、列表、超鏈接與框架、表格、表單、網(wǎng)頁制作工具Dreamweaver的基本操作,網(wǎng)站管理、Dreamweaver模板等。在進(jìn)行課程設(shè)計時,突出HTML代碼的教學(xué),而對制作網(wǎng)頁的工具Dreamweaver則著重于操作能力和動手能力的培養(yǎng)。“知其然,知其所以然”是我們的目標(biāo)。
1.2.2 DIV+CSS網(wǎng)頁設(shè)計
DIV+CSS是目前網(wǎng)頁的主流布局方式,DIV+CSS網(wǎng)頁設(shè)計技術(shù)使得網(wǎng)頁的表現(xiàn)與內(nèi)容相分離,提高了頁面瀏覽速度,并且使得 網(wǎng)站易于維護(hù)和改版,因此,在網(wǎng)頁設(shè)計教學(xué)中DIV+CSS成為核心的內(nèi)容,并將對傳統(tǒng)的網(wǎng)頁設(shè)計教學(xué)產(chǎn)生較大的影響。
該部分重點知識包括CSS基本語法、用CSS設(shè)置文本、圖像樣式、用CSS設(shè)置超鏈接與導(dǎo)航、用CSS設(shè)置表格和表單樣式、CSS盒子模型、盒子的浮動與定位、CSS+DIV布局方法剖析。教學(xué)中通過大量的實際應(yīng)用,反復(fù)的練習(xí),使學(xué)生真正掌握CSS+DIV的精髓,并體會其在設(shè)計網(wǎng)頁方面的優(yōu)越性。
1.2.3 Photoshop圖像處理
重點包括Photoshop基本工具的用法,選區(qū)操作、圖層操作、圖像變換、色彩調(diào)整、文字操作、繪畫工具、通道、路徑、融合、圖層樣式、文字樣式及濾鏡等,目的在于能夠用Photoshop設(shè)計美觀、清新大方的網(wǎng)頁效果圖并且能把網(wǎng)頁效果圖切片導(dǎo)出。注重學(xué)習(xí)工具的使用和圖片的處理方法。
課堂教學(xué)中應(yīng)注意培養(yǎng)學(xué)生的創(chuàng)新意識,突出“網(wǎng)頁設(shè)計重在創(chuàng)意”的理念。尤其對于動漫廣告等專業(yè)要發(fā)揮學(xué)生們美術(shù)方面優(yōu)勢,將計算機(jī)技術(shù)與美術(shù)相互滲透和融合,將網(wǎng)頁作品當(dāng)作一份具有生命力的完美藝術(shù)品。1.2.4 Flas制作
重點包括層的概念,工具的使用,逐幀動畫制作、運(yùn)動漸變動畫制作、形狀漸變動畫制作、引導(dǎo)動畫制作、遮罩動畫制作,元件的使用,基本動作的使用,在網(wǎng)頁中使用Flash的目的是讓網(wǎng)頁變得更加生動形象,因此在學(xué)習(xí)技術(shù)的同時更要注意網(wǎng)頁動畫的組織形式,與網(wǎng)頁協(xié)調(diào)。
1.2.5 JavaScript程序設(shè)計
JavaScript是目前Web客戶端開發(fā)的主要編程語言,也是Ajax的核心技術(shù)之一。該部分重點知識包括JavaScript編程基礎(chǔ),變量、數(shù)據(jù)類型和表達(dá)式,流程控制,函數(shù),對象編程,文檔對象模型與事件驅(qū)動,窗口、文檔和表單對象,級聯(lián)樣式表(CSS)技術(shù),動態(tài)對象和Cookies及安全等,JavaScript中的XML、Ajax技術(shù)以及JavaScript實用技巧與高級應(yīng)用。
1.3教學(xué)方法
該課程的教學(xué)實踐性較強(qiáng),知識覆蓋面廣,在教學(xué)中要極大的激發(fā)學(xué)生的參與性,鍛煉學(xué)生的動手能力,培養(yǎng)學(xué)生的學(xué)習(xí)興趣。注意引導(dǎo)學(xué)生學(xué)習(xí)理論與實踐相結(jié)合,將理論應(yīng)用于實踐。
教學(xué)過程中大膽運(yùn)用模塊教學(xué)法、案例教學(xué)法等教學(xué)手段,充分調(diào)動了學(xué)生的積極性和創(chuàng)造性,教學(xué)效果明顯提高。
1.3.1模塊教學(xué)法
根據(jù)教學(xué)內(nèi)容的不同特點,將整個《網(wǎng)頁設(shè)計與制作》課程的教學(xué)分為五個階段,第一階段使學(xué)生熟悉并掌握HTML語言;第二階段重點在于CSS樣式表以及CSS+DIV布局方法;第三階段在于利用Photoshop進(jìn)行網(wǎng)頁效果圖的制作,并將圖片切片輸出;第四階段在于利用Flash制作動畫;第五階段在于JavaScript程序設(shè)計;每一階段要給據(jù)內(nèi)容不同、重點不同采用不同的教學(xué)方法。比如在第一階段,要學(xué)生學(xué)會并熟記HTML標(biāo)記的用法,這就要通過大量小實例練習(xí);在第二階段主要進(jìn)行頁面整體布局的練習(xí),學(xué)習(xí)如何把整個網(wǎng)頁分成不同層次的塊,然后再學(xué)習(xí)每一塊的設(shè)計方法,只有通過全面的練習(xí),才能掌握豐富多彩的網(wǎng)頁設(shè)計方法;第五階段則主要學(xué)習(xí)最新流行的網(wǎng)頁效果的設(shè)計,重點在于網(wǎng)頁程序的設(shè)計。每一階段的教學(xué)內(nèi)容完成后,在機(jī)房組織小測驗,以實現(xiàn)分階段達(dá)標(biāo),最終使學(xué)生完成該門課程的學(xué)習(xí)任務(wù)。
1.3.2案例教學(xué)法
在課堂上采用案例教學(xué)法,通過精心挑選案例,明確提出需要掌握的知識點及操作技能,以案例帶動知識點,貫穿整個教學(xué)過程。比如在講解HTML的標(biāo)記時,圖片的路徑學(xué)生很容易出錯,通過一些小實例講解該標(biāo)記在網(wǎng)頁實際設(shè)計中要注意的問題,學(xué)生就很容易掌握;HTML基本標(biāo)記學(xué)完后,通過一個綜合實例――具有多個網(wǎng)頁的網(wǎng)站的設(shè)計,綜合應(yīng)用HTML語法,達(dá)到復(fù)習(xí)和融會貫通的效果;再比如在講解JavaScript程序設(shè)計時,理論的講解貫穿在許多流行的JavaScript實例中講解,極大地提高了學(xué)生的學(xué)習(xí)積極性。
2課程實踐
2.1實驗題目的設(shè)計
結(jié)合理論教學(xué),設(shè)計配套的實驗題目,對鞏固課堂效果具有重要的作用。對于上文提到的五個階段,分別設(shè)計相應(yīng)的實驗題目。
2.1.1 HTML網(wǎng)頁設(shè)計
實驗1 HTML基本標(biāo)記練習(xí)、實驗2框架與超鏈接、實驗3表格練習(xí)、實驗4表單練習(xí)、實驗5 HTML綜合實例。
2.1.2 DIV+CSS網(wǎng)頁設(shè)計
實驗1 CSS文字排版、實驗2 CSS網(wǎng)頁布局、實驗3背景設(shè)置、實驗4 CSS導(dǎo)航菜單設(shè)計、實驗5綜合實例。
2.1.3 Photoshop圖像處理
實驗1圖層的實驗、實驗2選區(qū)的練習(xí)、實驗3圖像的繪制練習(xí)、實驗4圖像的編輯練習(xí)、實驗5文本的應(yīng)用、實驗6綜合實例。
2.1.4 Flas制作
實驗1 Flash多種工具的使用、實驗2變形動畫的制作、實驗3運(yùn)動動畫的制作、實驗4引導(dǎo)(路徑)動畫的制作、實驗5逐幀動畫的制作、實驗6綜合實例。
2.1.5 JavaScript程序設(shè)計
實驗1 JavaScript程序設(shè)計案例、實驗2用JavaScript制作網(wǎng)頁特效、實驗3 JavaScript內(nèi)置函數(shù)和對象、實驗4 JavaScript事件處理、實驗5 Dom操作實例。
2.2自學(xué)模式的創(chuàng)建
為學(xué)生創(chuàng)建良好的自學(xué)環(huán)境。我們建立了該課程的課程網(wǎng)站,學(xué)生可以下載教師的多媒體課件、實驗指導(dǎo)、相關(guān)學(xué)習(xí)文檔、視頻講座資料等,課程網(wǎng)站還提供大量的題庫,包括選擇題、填空題、判斷題、問答題、設(shè)計題,學(xué)生登錄后可以自由練習(xí),從而達(dá)到了消化課堂所講知識點、提高學(xué)習(xí)效果、激發(fā)學(xué)習(xí)興趣的目的。這種做法豐富了教學(xué)手段,開辟了學(xué)生自學(xué)天地。
2.3參與教師科研,以研促學(xué)
鼓勵和吸收成績優(yōu)秀的學(xué)生參與教師的科研活動,以科研促教學(xué)。學(xué)院自行開發(fā)的學(xué)院網(wǎng)站、學(xué)生評教系統(tǒng)、教務(wù)管理系統(tǒng)等都有學(xué)生參與,同時,學(xué)院的許多活動開展后,都安排學(xué)生設(shè)計相應(yīng)的網(wǎng)站,這樣使得該課程的教學(xué)水平不斷提高。
2.4成立網(wǎng)頁興趣小組,拓寬知識面
組織成立網(wǎng)頁課程的興趣學(xué)習(xí)小組,具體活動包括:
1)舉辦講座:資深開發(fā)人員的經(jīng)驗報告,網(wǎng)頁知識講座;
2)舉辦競賽:我院已成功舉辦兩屆網(wǎng)頁與flash設(shè)計大賽。
這些活動的開展深受廣大師生的好評,激發(fā)了學(xué)生對網(wǎng)頁設(shè)計技術(shù)的興趣,培養(yǎng)了學(xué)生的動手能力和創(chuàng)新能力。
3課程實訓(xùn)
網(wǎng)頁的制作不僅要求制作者有熟練的網(wǎng)頁制作技術(shù),還要有一定的藝術(shù)設(shè)計能力,因此在掌握網(wǎng)頁設(shè)計基本技術(shù)的基礎(chǔ)上,課程實訓(xùn)主要培養(yǎng)學(xué)生設(shè)計能力、創(chuàng)作能力和對所學(xué)知識的綜合運(yùn)用能力,學(xué)生需要獨立完成一個表達(dá)特定主題的網(wǎng)站,要求參加實訓(xùn)的學(xué)生在規(guī)定的時間完成網(wǎng)頁效果圖的設(shè)計并切圖輸出,最終在Dreamweaver中布局成網(wǎng)頁。
實訓(xùn)主要內(nèi)容包括素材的搜集、網(wǎng)頁整體布局設(shè)計,網(wǎng)頁代碼的編寫、調(diào)試。實訓(xùn)時間是32學(xué)時,實訓(xùn)結(jié)束后,學(xué)生不僅要提交設(shè)計報告、Photoshop制作的網(wǎng)頁效果圖和網(wǎng)頁代碼,還要進(jìn)行現(xiàn)場答辯,這些對學(xué)生都是很好的鍛煉。最后教師根據(jù)學(xué)生所交作品的效果、原創(chuàng)性、復(fù)雜性等情況進(jìn)行成績的評定。
平時實驗課上學(xué)生總是按教師給定的素材,給定的效果進(jìn)行實驗,主要注重的是設(shè)計方法和網(wǎng)頁代碼的學(xué)習(xí),在實訓(xùn)中,素材需要學(xué)生自己搜集,效果圖需要自己制作,網(wǎng)站的制作方法自己確定。這就要求他們上網(wǎng)查詢大量的資料,遇到問題想辦法解決,學(xué)生帶著問題進(jìn)行學(xué)習(xí)和探索,培養(yǎng)了學(xué)生的探索創(chuàng)新能力。
課程實訓(xùn)不僅鞏固了學(xué)生網(wǎng)頁代碼的設(shè)計能力,更是從網(wǎng)站策劃、網(wǎng)頁的界面設(shè)計,網(wǎng)站的風(fēng)格、配色、布局、Photoshop軟件的應(yīng)用等多方面對學(xué)生進(jìn)行了訓(xùn)練,為學(xué)生能夠做出美觀而又實用的網(wǎng)頁打下了牢固的基礎(chǔ)。
4結(jié)束語
明確的教學(xué)目標(biāo)、豐富的教學(xué)內(nèi)容、科學(xué)的教學(xué)方法、有效的教學(xué)手段大大增強(qiáng)了學(xué)生主動參與學(xué)習(xí)的積極性。隨著網(wǎng)頁技術(shù)的進(jìn)一步發(fā)展和進(jìn)步,網(wǎng)頁設(shè)計與制作課程的教學(xué)還必須與時俱進(jìn),不斷的改革和創(chuàng)新,教師只有不斷的學(xué)習(xí)新的教學(xué)理論,掌握現(xiàn)代化的教學(xué)手段,才能勝任高效教育工作,為社會培養(yǎng)高素質(zhì)的技術(shù)應(yīng)用型人才。
參考文獻(xiàn):
[1]李偉,鄧紅濤,曹傳東.《網(wǎng)頁設(shè)計》課程實踐性教學(xué)改革與創(chuàng)新研究[J].改革與創(chuàng)新,2011(12):103-104.
人們不斷追求完美,網(wǎng)頁設(shè)計亦是如此。它要考慮如何使受眾能更多更高效的接受信息從而使他們對網(wǎng)站留下很好的印象。古往今來,關(guān)于形式美的規(guī)律被很多藝術(shù)家和學(xué)者所提出,因此,在網(wǎng)頁設(shè)計過程中,設(shè)計者必須去研究,并主動地掌握并運(yùn)用這些規(guī)律去發(fā)現(xiàn)美。當(dāng)然,各個時代審美觀念和美學(xué)特征不同。在信息高速發(fā)展的今天,新的審美需求隨之產(chǎn)生。將網(wǎng)頁設(shè)計推向了更高層次的境界,這也是網(wǎng)頁設(shè)計發(fā)展的必然趨勢。這就要求設(shè)計師們遵循條理與反復(fù)、變化與統(tǒng)一、均齊與平衡、對比和調(diào)和、節(jié)奏與韻律等原則,以及對網(wǎng)頁中文字、圖形、色彩的設(shè)計的規(guī)律,創(chuàng)造優(yōu)秀的網(wǎng)頁作品。
(一)網(wǎng)頁的內(nèi)容與形式必須統(tǒng)一和諧
任何設(shè)計都有一定的內(nèi)容和形式,形式與內(nèi)容的統(tǒng)一是設(shè)計網(wǎng)頁的基本原則之一。一方面,內(nèi)容占據(jù)主導(dǎo)地位,是設(shè)計存在的基礎(chǔ),被稱為“設(shè)計的靈魂”;另一方面,形式不僅直接影響設(shè)計作品的表現(xiàn),而且也有自身的審美價值,具有相對獨立性。它要兼顧整體效果與細(xì)節(jié)的視覺效果。如圖1《龍門飛甲》的電影主題網(wǎng)站的設(shè)計,網(wǎng)頁視覺效果相當(dāng)成功。設(shè)計師通過考慮電影宣傳效果及網(wǎng)站整體功能要求的同時,在設(shè)計形式上賦予變化創(chuàng)新,不僅實現(xiàn)了形式美的表現(xiàn),也深化了作品的內(nèi)涵。
(二)主題元素突出
不同類型的網(wǎng)站都有自身所特有的主題,并按照閱讀習(xí)慣和視覺心理將主題形象地傳達(dá)給觀者,使觀者更好的理解和接受它,并滿足觀者的視覺審美需求。適合主題的需要是網(wǎng)頁設(shè)計的前提。將自己的設(shè)計思想與網(wǎng)頁的主題精髓相融合,才能展現(xiàn)網(wǎng)頁設(shè)計所特有的審美形式。作為主題要素,要想成為觀者的視覺焦點就必須注意編排的位置,從而使觀者產(chǎn)生深刻的視覺印象。
二、創(chuàng)新性的視覺藝術(shù)表現(xiàn)在網(wǎng)頁設(shè)計中的運(yùn)用體現(xiàn)
(一)加強(qiáng)網(wǎng)頁整體布局,合理分配版面提高網(wǎng)頁整體美感
在網(wǎng)頁設(shè)計中,很重要的一點是,整體一致性不僅存在于某個網(wǎng)頁設(shè)計中的每個元素之間,也存在于整個網(wǎng)頁上——一個網(wǎng)頁必須被視為一個完整的單元,這就要求網(wǎng)頁設(shè)計在整體的風(fēng)格,色彩上保持統(tǒng)一。網(wǎng)頁的整體性不僅包括功能上的整體性也包含了形式上的整體性,作為信息傳達(dá)的重要載體,需要在特定的時間和空間環(huán)境里被人們所理解和接受,從而滿足人們的使用需求。這就要求網(wǎng)頁設(shè)計師在進(jìn)行設(shè)計時,首先考慮網(wǎng)頁的整體布局與版面的合理分配。
(二)傳統(tǒng)與創(chuàng)新相結(jié)合,合理運(yùn)用視覺色彩提升視覺沖擊力
色彩作為網(wǎng)頁設(shè)計的一個表現(xiàn)元素,不僅具有吸引瀏覽者視覺和維持網(wǎng)站形象的效果,而且具有有效傳遞頁面主題信息的功能。在網(wǎng)頁設(shè)計中,我們可能第一眼感知到的設(shè)計元素就是色彩了,如果設(shè)計色彩過多,用色過于混亂,造成了瀏覽者的視覺疲勞,久而久之容易導(dǎo)致網(wǎng)站瀏覽量的下降,難以達(dá)到視覺傳達(dá)的目的。如圖2,十二星座系列的官方網(wǎng)店的制作,運(yùn)用主色調(diào)為藍(lán)色的夢幻主題,彰顯十二星座的特點,給人以遐想的夢幻空間,突出整個網(wǎng)店的風(fēng)格和主題。
(三)靈活運(yùn)用現(xiàn)代科技手段,發(fā)揮各大軟件的優(yōu)勢
做出一個優(yōu)秀的網(wǎng)頁設(shè)計作品,要靈活掌握相關(guān)電腦軟件,如:“Photoshop”“DreamWeaver”“Flash”“FireWorks”“AI”等,我們要熟練掌握這些設(shè)計工具軟件,做到活學(xué)活用,并且就其特有屬性將各種軟件巧妙地結(jié)合起來。例如利用多維空間、動畫3D技術(shù)等,靜中求動,在二維空間中追尋三維甚至多維的智能化的設(shè)計。又如,我們將平面設(shè)計軟件Photoshop與動畫軟件Flash軟件進(jìn)行穿插配合使用,把動畫設(shè)計能在時間和空間上將物體進(jìn)行運(yùn)動的表現(xiàn)優(yōu)勢運(yùn)用在網(wǎng)頁設(shè)計制作中,從而使畫面更加生動活潑,賦予強(qiáng)大的表現(xiàn)力和視覺沖擊力。如圖3、4運(yùn)用平面軟件與動畫軟件相結(jié)合穿插的使用,實現(xiàn)了網(wǎng)頁的智能化設(shè)計,使畫面更加生動。
(四)突出注重設(shè)計技巧,體現(xiàn)網(wǎng)頁風(fēng)格個性
關(guān)鍵詞:色彩心理學(xué);農(nóng)產(chǎn)品電商網(wǎng)站;應(yīng)用
一、電商網(wǎng)頁設(shè)計的概述
相對于傳統(tǒng)的產(chǎn)品營銷和推廣方式,電商網(wǎng)頁所蘊(yùn)含的的信息量更為豐富,并且可以通過文字、聲音、圖像、動畫等多維度展現(xiàn)產(chǎn)品特點。農(nóng)產(chǎn)品購物網(wǎng)站作為眾多產(chǎn)品的代表,是互聯(lián)網(wǎng)時代典型的新營銷模式的代表。相對于傳統(tǒng)的叫賣模式的農(nóng)產(chǎn)品購物方式,如今通過電商平臺可以更為有效的傳遞產(chǎn)品信息,大眾點評,以及相關(guān)信息作為某產(chǎn)品來年的選種數(shù)據(jù)。一個好的網(wǎng)頁設(shè)計可以通過版式,頁面架構(gòu),多媒體展示,以及良好的交互體驗吸引客戶。而如何將這些元素行之有效的串聯(lián)起來,則要通過網(wǎng)頁的色彩設(shè)計。
二、電商網(wǎng)頁中色彩設(shè)計原則
色彩設(shè)計,構(gòu)成了訪客對網(wǎng)站第一印象。網(wǎng)站通過對色彩的合理搭建,可以喚起購買者共鳴,在形成對網(wǎng)站形成一定記憶性的同時,提升他們對品牌的好感度和認(rèn)知度。與此同時,合理的情感引導(dǎo),可以使顧客更加容易接受產(chǎn)品傳遞的信息。因此在網(wǎng)頁色彩設(shè)計的選擇上必須遵守相應(yīng)的原則,從而使頁面的呈現(xiàn)出的效果張弛有度。
(1)整體性
網(wǎng)站設(shè)計首先需要為網(wǎng)站的整體設(shè)計選定一個色彩基調(diào),用以體現(xiàn)網(wǎng)站的形象和品牌調(diào)性。根據(jù)整體性原則,網(wǎng)站色彩選取一般不超過3種。過多色彩的選用會導(dǎo)致視覺語言的混亂,造成視覺誤導(dǎo),從而影響網(wǎng)頁呈現(xiàn)的邏輯。與此同時,在色彩選定的同時也要確定顏色的主次層級以及主次顏色間所體現(xiàn)的相應(yīng)比例。在視覺上占據(jù)了較高視覺比重的色彩設(shè)計在一定程度上體現(xiàn)的是訪客的情感和心理。因此,選擇正確網(wǎng)頁色彩配色,可以為網(wǎng)站建立起符合形象的視覺語言,從而更為有效的搭建起與用戶之間的橋梁,有效傳遞產(chǎn)品信息。
(2)原則性
在網(wǎng)頁設(shè)計中,將不同的色彩按照和諧、均衡和重點突出的原則搭配組合,從而構(gòu)成產(chǎn)品頁面。但在這個過程中不得忽視所搭配的色彩對用戶心理的影響。根據(jù)色彩心理學(xué)的理論,按照色彩的記憶性原則,一般暖色較冷色的記憶性強(qiáng);色彩還具有聯(lián)想與象征的物質(zhì),如紅色象征血、太陽;藍(lán)色象征大海、天空和水面等。另外,不同色彩在不同人心中所反應(yīng)出“性格”各異。網(wǎng)頁設(shè)計正可以利用這點,表達(dá)情感。
如,電商清涼夏日的購物頁面一般選用,藍(lán)天,海洋,綠島等冷色系為主的景色搭配,所要給用戶帶來就是一種清涼,清爽的夏日體驗。又如,在日常反應(yīng)食物的顏色一般偏暖色。如果將這些熟悉的顏色替換成冷色,就會在用戶的心理上引起一定的不適。
(3)和諧性
網(wǎng)頁色彩搭配的和諧性是在網(wǎng)頁設(shè)計中不可忽略的一個部分。在網(wǎng)頁設(shè)計時不僅要從從全局出發(fā),確定網(wǎng)頁的色彩調(diào)性,也要保持色彩平衡,避免采用單純色調(diào)而減弱了明暗對比。為了使色彩均衡和諧,可以通過選用中間色的方式,使網(wǎng)頁整體色調(diào)呈現(xiàn)趨于平衡。除此之外,選用色彩飽和度高以及純度較高的顏色時,不應(yīng)該忽視它們所具有的強(qiáng)烈的情緒反應(yīng),長時間容易導(dǎo)致視覺疲勞??梢愿鶕?jù)產(chǎn)品的實際訴諸點,適當(dāng)?shù)募右哉{(diào)整。
(4)辨識度
網(wǎng)頁通過合理的色彩搭配所在用戶形成良好反應(yīng)可以形成相應(yīng)的色彩辨識度。即通過所見的類似色彩確定網(wǎng)站的調(diào)性,以便用戶識別和查找。網(wǎng)頁的整體基調(diào)后,不宜輕易改變。即使是網(wǎng)頁的承載信息根據(jù)要求不斷的更新,也應(yīng)該在整體色調(diào)不變的情況下進(jìn)行拓展和創(chuàng)新。這種在不影響用戶認(rèn)知度和記憶力的方式,可以有效的避免訪問用戶流失。(+案例)
三、網(wǎng)頁配色在農(nóng)產(chǎn)品網(wǎng)頁中的體現(xiàn)
在農(nóng)產(chǎn)品的網(wǎng)頁設(shè)計中,設(shè)計師可遵循上述的原則,根據(jù)網(wǎng)頁產(chǎn)品所要體現(xiàn)的產(chǎn)品調(diào)性、網(wǎng)站的定位和產(chǎn)片特點來選取色彩,做到對待具體案例有針對性的進(jìn)行設(shè)計。具體的農(nóng)產(chǎn)網(wǎng)頁設(shè)計在色彩搭配上具有固定的組合形態(tài),通過對這些色彩搭配的分析可以確定網(wǎng)頁的呈現(xiàn)效果。
(1)黃綠搭配的普眾型
綠色從一開始被認(rèn)知就和大自然與植物緊密相關(guān)。因此其健康,積極,生機(jī),有機(jī),溫和等性格特點也就順理成章的被廣大的農(nóng)產(chǎn)品網(wǎng)站當(dāng)做網(wǎng)站的主體色調(diào)。而綠色作為一個非常靈活的色彩,在呈現(xiàn)時也可以體現(xiàn)出不同的方式方法。作為鄰近色黃色同它的搭配是現(xiàn)如今農(nóng)產(chǎn)品網(wǎng)頁設(shè)計色彩搭配的主流。在一方面展現(xiàn)產(chǎn)品,有機(jī),天然,健康無害的同時,又不失“溫暖”;在推出某款夏日清涼水果的時候,黃和綠的配比的橄欖綠可以在保證產(chǎn)品主調(diào)穩(wěn)定的前提下,展現(xiàn)夏日的生機(jī)。農(nóng)產(chǎn)品網(wǎng)站在使用綠色的時候,根據(jù)產(chǎn)品特性尤其注意綠色的純度和色相上的把握。例如本來生活的首頁呈現(xiàn)。網(wǎng)站的整體農(nóng)產(chǎn)品的色彩呈現(xiàn)上明度偏高,所以網(wǎng)站在色彩配比上并未使用純度較高的綠色,而是有意識的降低綠色的純度和明度,以便不會宣兵奪主。
(2)暖色系的小眾型
除了以綠色為核心的色彩呈現(xiàn)外,以黃色為主的暖色系的顏色配比也在被相應(yīng)的運(yùn)用到農(nóng)產(chǎn)品的網(wǎng)頁設(shè)計中。如之前色彩心理學(xué)中提及的,食物一般以暖色系的方式呈現(xiàn),這不僅是符合人們長期的視覺規(guī)律的結(jié)果,也是色彩所在人們心理產(chǎn)生的情緒引導(dǎo)。
根據(jù)色彩心理學(xué)黃色隨著配比的色相、明暗度、以及色度的高低,都會在這種比較中產(chǎn)生前進(jìn)感。因而一個以黃色為主的暖色系農(nóng)產(chǎn)網(wǎng)站,更容易讓訪客有一種親近感。區(qū)別于過于大眾化的綠色農(nóng)產(chǎn)網(wǎng)頁設(shè)計,看似別出心裁的暖色系網(wǎng)站,更容易引起受眾注意。
(3)低純度和明度的高雅型
無論是任何網(wǎng)頁設(shè)計都要根據(jù)產(chǎn)品的調(diào)性確定頁面的調(diào)性。面對農(nóng)產(chǎn)市場一些高端農(nóng)產(chǎn)的誕生,許多網(wǎng)頁在設(shè)計色彩的選用上也傾向于一些帶有文化氣質(zhì)的“無彩色”。這樣的網(wǎng)頁呈現(xiàn)方式一般將明度和純度降到極低,使得色彩展現(xiàn)極少的感彩,而把重點放在強(qiáng)調(diào)產(chǎn)品自身的特點上。如圖所示這兩款產(chǎn)品,低純度和低明度降低了受眾強(qiáng)烈的視覺情緒,相反的簡潔清晰的表達(dá)方式和環(huán)境,卻產(chǎn)生了一種距離感和典雅感,而在情緒上所表現(xiàn)上則趨于平緩冷靜。這在無形當(dāng)中強(qiáng)調(diào)了產(chǎn)品的特性和層次,突出了不同于大眾產(chǎn)品的售賣特性。
總結(jié)
色彩設(shè)計和選擇在一定程度的方向上引導(dǎo)著整體網(wǎng)頁的視覺呈現(xiàn)。而農(nóng)產(chǎn)品通過對自身產(chǎn)品調(diào)性的掌控,按照色彩設(shè)計原則的指導(dǎo),不僅可以搭建起符合產(chǎn)品調(diào)性的產(chǎn)品網(wǎng)站,同時也能結(jié)合顏色所產(chǎn)生的情緒,提升用戶的關(guān)注度和對產(chǎn)品的認(rèn)知度。
(作者單位:湖北工業(yè)大學(xué)藝術(shù)設(shè)計學(xué)院)
參考文獻(xiàn):
[1]田婧,黃曉瑜.網(wǎng)頁設(shè)計中的色彩運(yùn)用藝術(shù).美術(shù)教育與研究.2013.06