時(shí)間:2023-08-01 17:39:55
開(kāi)篇:寫(xiě)作不僅是一種記錄,更是一種創(chuàng)造,它讓我們能夠捕捉那些稍縱即逝的靈感,將它們永久地定格在紙上。下面是小編精心整理的12篇網(wǎng)頁(yè)設(shè)計(jì)的流程,希望這些內(nèi)容能成為您創(chuàng)作過(guò)程中的良師益友,陪伴您不斷探索和進(jìn)步。
隨著我國(guó)經(jīng)濟(jì)的不斷發(fā)展,我國(guó)的IT行業(yè)得到了有效的發(fā)展。網(wǎng)頁(yè)設(shè)計(jì)是IT行業(yè)領(lǐng)域中發(fā)展中重要的組成部分,其中DIV+CSS布局技術(shù)是網(wǎng)頁(yè)設(shè)計(jì)和開(kāi)發(fā)過(guò)程中重要的技術(shù)組成部分。文章對(duì)網(wǎng)頁(yè)設(shè)計(jì)中DIV+CSS布局技術(shù)的應(yīng)用和實(shí)踐進(jìn)行了分析和闡述,并且對(duì)DIV+CSS布局技術(shù)的表現(xiàn)、內(nèi)容、代碼、搜索等形式進(jìn)行了一定程度的研究,以此促進(jìn)IT行業(yè)領(lǐng)域中網(wǎng)頁(yè)設(shè)計(jì)、開(kāi)發(fā)的長(zhǎng)遠(yuǎn)發(fā)展。
關(guān)鍵詞:
網(wǎng)頁(yè)設(shè)計(jì);DIV+CSS布局技術(shù);應(yīng)用
在進(jìn)入21世紀(jì)以后,我國(guó)逐漸向信息化發(fā)展,人們的日常生活水平也得到了有效的提高,互聯(lián)網(wǎng)也成為人們?cè)谌粘I睢⒐ぷ髦斜夭豢缮俚墓ぞ撸蔀槿藗冊(cè)诮涣鳌⑿畔⒉檎业闹匾緩街弧T诨ヂ?lián)網(wǎng)的發(fā)展過(guò)程中,網(wǎng)頁(yè)設(shè)計(jì)、開(kāi)發(fā)是人們使用互聯(lián)網(wǎng)工作和生活的重要工具,其中DIV+CSS的布局技術(shù)在網(wǎng)頁(yè)設(shè)計(jì)和開(kāi)發(fā)的過(guò)程中占有重要的地位。但是在傳統(tǒng)的網(wǎng)頁(yè)布局技術(shù)運(yùn)用的過(guò)程中,出現(xiàn)了很多隱藏的弊端,并在發(fā)展的過(guò)程中逐漸顯現(xiàn)出來(lái)。同時(shí),在這樣的情況下,IT行業(yè)在網(wǎng)頁(yè)設(shè)計(jì)、開(kāi)發(fā)過(guò)程中,對(duì)DIV+CSS布局技術(shù)給予了高度的重視,并且也得到IT行業(yè)的廣泛應(yīng)用。DIV+CSS布局技術(shù)也是網(wǎng)頁(yè)設(shè)計(jì)、開(kāi)發(fā)過(guò)程中一種較為流行的技術(shù)和術(shù)語(yǔ),開(kāi)發(fā)人員通過(guò)利用DIV+CSS布局技術(shù)對(duì)網(wǎng)頁(yè)設(shè)計(jì)過(guò)程中的對(duì)象進(jìn)行準(zhǔn)確的定位,從而增加了網(wǎng)頁(yè)在使用過(guò)程中的效果和傳輸、下載速度,也在最大程度上方便了開(kāi)發(fā)人員對(duì)網(wǎng)頁(yè)維護(hù)和更新的操作流程。
1網(wǎng)頁(yè)設(shè)計(jì)中DIV+CSS布局技術(shù)的含義
在網(wǎng)頁(yè)開(kāi)發(fā)的過(guò)程中,DIV+CSS技術(shù)布局占有重要的地位。其實(shí)DIV+CSS技術(shù)也可以分開(kāi)來(lái)說(shuō),DIV,CSS在網(wǎng)頁(yè)布局的過(guò)程中,所代表的含義和意義也是不一樣的,下面對(duì)DIV+CSS布局技術(shù)的含義進(jìn)行了分析:第一,DIV是DIV+CSS布局技術(shù)中的重要組成部分,也是網(wǎng)頁(yè)設(shè)計(jì)和開(kāi)發(fā)過(guò)程中重要的應(yīng)用語(yǔ)言和標(biāo)記元素,為網(wǎng)頁(yè)設(shè)計(jì)、開(kāi)發(fā)過(guò)程中的文檔,提供了網(wǎng)頁(yè)中的布局結(jié)構(gòu)和網(wǎng)頁(yè)的背景,在網(wǎng)頁(yè)設(shè)計(jì)、開(kāi)發(fā)的過(guò)程中也可以將DIV稱(chēng)為定位技術(shù)。DIV在起始和結(jié)束的過(guò)程中都進(jìn)行了一定標(biāo)記,并且都是網(wǎng)頁(yè)設(shè)計(jì)、開(kāi)發(fā)過(guò)程中的文檔構(gòu)成服務(wù)的,DIV對(duì)網(wǎng)頁(yè)設(shè)計(jì)和開(kāi)發(fā)過(guò)程中的一些元素進(jìn)行了有效的控制。第二,CSS的全稱(chēng)是CascadingStyleSheet,按照中文翻譯為層疊樣式表,是在網(wǎng)頁(yè)設(shè)計(jì)、開(kāi)發(fā)過(guò)程中,網(wǎng)頁(yè)形式和網(wǎng)頁(yè)信息之間的一種標(biāo)記語(yǔ)言。在網(wǎng)頁(yè)設(shè)計(jì)的過(guò)程中,DIV+CSS布局技術(shù)中的CSS技術(shù)可以準(zhǔn)確控制網(wǎng)頁(yè)中的頁(yè)面的顏色、布局、背景等,網(wǎng)頁(yè)中的頁(yè)面效果更加的豐富,并且開(kāi)發(fā)人員在進(jìn)行網(wǎng)頁(yè)設(shè)計(jì)的過(guò)程中,操作流程也相對(duì)簡(jiǎn)單,也使網(wǎng)頁(yè)中的語(yǔ)言更加簡(jiǎn)潔化。第三,DIV+CSS布局技術(shù)在某種程度上將也是XHTML+CSS技術(shù)。人們?cè)谑褂镁W(wǎng)頁(yè)文檔的過(guò)程中,對(duì)網(wǎng)頁(yè)中的結(jié)構(gòu)也在進(jìn)行了一定程度上的規(guī)范。DIV+CSS布局技術(shù)將網(wǎng)頁(yè)設(shè)計(jì)中的結(jié)構(gòu)進(jìn)行了一定的規(guī)范化,將頁(yè)面中元素進(jìn)行了一定的規(guī)整,使頁(yè)面中的樣式和內(nèi)容分離,成為一個(gè)單獨(dú)的個(gè)體。并且在將2種技術(shù)合為1種技術(shù)的過(guò)程中,可以使網(wǎng)頁(yè)在操作的過(guò)程中,更加靈活、方便。
2DIV+CSS布局技術(shù)在網(wǎng)頁(yè)設(shè)計(jì)中的作用
2.1和搜索引擎可以相互融合搜索引擎在網(wǎng)頁(yè)設(shè)計(jì)的過(guò)程中起到了重要的作用,是根據(jù)Spider程序查找互聯(lián)網(wǎng)中的內(nèi)容。Spider程序一般是由少到多地進(jìn)行網(wǎng)頁(yè)內(nèi)容的查找,等到將所有的內(nèi)容查找掃描后,引入到其他網(wǎng)頁(yè)中,然后訪(fǎng)問(wèn)網(wǎng)頁(yè)頁(yè)面,重復(fù)掃描、更新,直到內(nèi)容出現(xiàn)為止。在使用傳統(tǒng)的數(shù)據(jù)代碼的過(guò)程中,在內(nèi)容瀏覽和操作時(shí)不僅復(fù)雜,多余的代碼也較多,但是在DIV+CSS布局技術(shù)中,可以將瀏覽和操作的流程相對(duì)地簡(jiǎn)單化,并且在搜索內(nèi)容的過(guò)程中,時(shí)間也相對(duì)較短,其執(zhí)行的效率也相應(yīng)提高。另外,在DIV+CSS布局技術(shù)的應(yīng)用過(guò)程中,將代碼也進(jìn)行了一定程度的簡(jiǎn)化,和搜索引擎配合良好。這樣,不僅提高了網(wǎng)頁(yè)設(shè)計(jì)中的執(zhí)行的效率,也有效提高了網(wǎng)頁(yè)設(shè)計(jì)、開(kāi)發(fā)過(guò)程中的質(zhì)量。
2.2簡(jiǎn)化了網(wǎng)頁(yè)維護(hù)、更新等操作流程設(shè)計(jì)人員在對(duì)網(wǎng)頁(yè)進(jìn)行設(shè)計(jì)、開(kāi)發(fā)的過(guò)程中,利用Table對(duì)網(wǎng)頁(yè)進(jìn)行版本的更新設(shè)計(jì)時(shí),需要對(duì)網(wǎng)頁(yè)中所有的代碼進(jìn)行一定程度上的整合,這樣造成網(wǎng)頁(yè)維護(hù)和更新的工作效率在一定程度上的降低。但是,隨著時(shí)代的不斷發(fā)展,我國(guó)IT行業(yè)將DIV+CSS布局技術(shù)有效地應(yīng)用到網(wǎng)頁(yè)設(shè)計(jì)。更新、維護(hù)的過(guò)程中,在一定程度上降低了網(wǎng)頁(yè)中的內(nèi)容,并利用DIV+CSS布局技術(shù)進(jìn)行一定程度上的控制。當(dāng)設(shè)計(jì)人員對(duì)網(wǎng)頁(yè)中的某一個(gè)部分進(jìn)行一定程度上的更新時(shí),可以有效地提出這部分內(nèi)容和代碼,設(shè)計(jì)該區(qū)域代碼,設(shè)計(jì)人員利用DIV+CSS布局技術(shù)對(duì)網(wǎng)頁(yè)進(jìn)行設(shè)計(jì)、維護(hù)、更新,對(duì)其他部位也不會(huì)造成任何的損傷。
2.3加強(qiáng)了傳輸?shù)男试趥鹘y(tǒng)的網(wǎng)頁(yè)設(shè)計(jì)的過(guò)程中,往往只注重網(wǎng)頁(yè)頁(yè)面的效果和帶給人們的視覺(jué)沖擊,在這種情況下,設(shè)計(jì)人員在網(wǎng)頁(yè)中的傳輸效率較慢,也給網(wǎng)頁(yè)使用帶來(lái)一定程度上的影響。但是設(shè)計(jì)人員在使用DIV+CSS布局技術(shù)進(jìn)行網(wǎng)頁(yè)設(shè)計(jì)、開(kāi)發(fā)的過(guò)程中,可以對(duì)網(wǎng)頁(yè)中的代碼、文字、圖片進(jìn)行靈活的設(shè)計(jì),設(shè)計(jì)人員利用網(wǎng)頁(yè)中的過(guò)濾軟件,取代了圖片帶給網(wǎng)頁(yè)的視覺(jué)沖擊。同時(shí),DIV+CSS布局技術(shù)也將網(wǎng)頁(yè)中的中體布局分為不同的層次,在網(wǎng)頁(yè)開(kāi)始使用的過(guò)程中,無(wú)需將網(wǎng)頁(yè)的內(nèi)容儲(chǔ)存到一個(gè)較大的表格中,這樣在一定程度上加快了網(wǎng)頁(yè)的傳輸效率,在人們的日常生活、工作使用的過(guò)程中最大程度地提高了便利性。
2.4有效地提高了網(wǎng)頁(yè)設(shè)計(jì)中的視覺(jué)效果軟件設(shè)計(jì)人員在進(jìn)行網(wǎng)頁(yè)設(shè)計(jì)、開(kāi)發(fā)的過(guò)程中,利用傳統(tǒng)的Table對(duì)代碼進(jìn)行整合,在網(wǎng)頁(yè)的頁(yè)面中,圖片、文字等效果的分辨率并不高,頁(yè)面的效果并不是很好,同時(shí)在設(shè)計(jì)的過(guò)程中,需要大量的設(shè)計(jì)人員。不同的設(shè)計(jì)人員所設(shè)計(jì)的網(wǎng)頁(yè)形式也是不同的,這樣對(duì)人們使用的網(wǎng)頁(yè)造成了一定程度上的影響。但是,在DIV+CSS布局技術(shù)對(duì)網(wǎng)頁(yè)設(shè)計(jì)、開(kāi)發(fā)的背景下,DIV+CSS布局技術(shù)能夠有效地統(tǒng)一設(shè)計(jì)人員的設(shè)計(jì)理念、風(fēng)格、特點(diǎn)等,并且DIV+CSS布局技術(shù)可以有效控制網(wǎng)頁(yè)中的結(jié)構(gòu),提高了頁(yè)面中圖片、文字的分辨率,也給人們?cè)谑褂镁W(wǎng)頁(yè)的過(guò)程中帶來(lái)一定程度上的視覺(jué)沖擊。
3DIV+CSS布局技術(shù)在網(wǎng)頁(yè)設(shè)計(jì)、開(kāi)發(fā)中的應(yīng)用
在網(wǎng)頁(yè)設(shè)計(jì)、開(kāi)發(fā)的過(guò)程中,設(shè)計(jì)人員要想有效地利用DIV+CSS布局技術(shù)對(duì)網(wǎng)頁(yè)中的結(jié)構(gòu)進(jìn)行一定程度上的規(guī)劃,就要對(duì)網(wǎng)頁(yè)中的語(yǔ)言代碼的結(jié)構(gòu)進(jìn)行一定程度的分析。網(wǎng)頁(yè)中的語(yǔ)言代碼其實(shí)就是網(wǎng)頁(yè)結(jié)構(gòu)中的構(gòu)成元素,網(wǎng)頁(yè)結(jié)構(gòu)其實(shí)就是網(wǎng)頁(yè)設(shè)計(jì)、開(kāi)發(fā)過(guò)程中的構(gòu)架。換句話(huà)說(shuō),就是在網(wǎng)頁(yè)設(shè)計(jì)的過(guò)程中,對(duì)網(wǎng)頁(yè)中的內(nèi)容進(jìn)行有效的規(guī)劃。下面就對(duì)DIV+CSS布局技術(shù)在網(wǎng)頁(yè)設(shè)計(jì)中的應(yīng)用進(jìn)行簡(jiǎn)單的分析。
3.1DIV+CSS布局技術(shù)在網(wǎng)頁(yè)中內(nèi)容規(guī)劃的應(yīng)用設(shè)計(jì)人員在網(wǎng)頁(yè)設(shè)計(jì)、開(kāi)發(fā)的過(guò)程中,應(yīng)當(dāng)對(duì)網(wǎng)頁(yè)中的內(nèi)容的幾個(gè)基本組成要素進(jìn)行具體的分析。網(wǎng)頁(yè)內(nèi)容中的幾個(gè)基本的要素一般情況下可以分為:網(wǎng)頁(yè)的頭部、網(wǎng)頁(yè)的主體、網(wǎng)頁(yè)的頁(yè)腳和網(wǎng)頁(yè)中的版權(quán)區(qū)域。另外,DIV+CSS布局技術(shù)在網(wǎng)頁(yè)設(shè)計(jì)的過(guò)程中,可以使網(wǎng)頁(yè)形成基本的框架。并且在具體的編寫(xiě)的過(guò)程中,DIV+CSS布局技術(shù)可以有效整合網(wǎng)頁(yè)中的代碼,最大程度地簡(jiǎn)化操作流程,為設(shè)計(jì)人員提供了方便,提高了設(shè)計(jì)人員的工作效率,同時(shí)也使人們?cè)谑褂镁W(wǎng)頁(yè)的過(guò)程中可以一目了然。
3.2DIV+CSS布局技術(shù)在網(wǎng)頁(yè)設(shè)計(jì)中信息的應(yīng)用設(shè)計(jì)人員在利用DIV+CSS布局技術(shù)進(jìn)行網(wǎng)頁(yè)設(shè)計(jì)、開(kāi)發(fā)的過(guò)程中,可以靈活地將網(wǎng)頁(yè)中的信息進(jìn)行一定程度上的整合,并有效地展現(xiàn)出來(lái),給人們視覺(jué)的沖擊。在網(wǎng)頁(yè)設(shè)計(jì)的過(guò)程中,要對(duì)網(wǎng)頁(yè)中的信息元素進(jìn)行定義,合理安排網(wǎng)頁(yè)頁(yè)面中的信息,這樣不僅簡(jiǎn)化了設(shè)計(jì)、開(kāi)發(fā)的流程,也有效地減少了設(shè)計(jì)人工作人員的工作負(fù)擔(dān),從而提高了工作人員的工作效率。同時(shí),也使網(wǎng)頁(yè)中的形式更加豐富,例如:新聞、通知、公告、天氣等信息形式,也有效地節(jié)省了網(wǎng)頁(yè)中的空間,給人們使用網(wǎng)頁(yè)提供了最大程度的方便,也給人們帶來(lái)了視覺(jué)上的沖擊。
3.3DIV+CSS布局技術(shù)在網(wǎng)頁(yè)設(shè)計(jì)中的鏈接的應(yīng)用設(shè)計(jì)人員在網(wǎng)頁(yè)設(shè)計(jì)、開(kāi)發(fā)的過(guò)程中,DIV+CSS布局技術(shù)具有重要的作用,同時(shí),網(wǎng)頁(yè)動(dòng)態(tài)鏈接是DIV+CSS布局技術(shù)中應(yīng)用的重要的環(huán)節(jié)。a:link,a:visited,a:hover,a;active是網(wǎng)頁(yè)動(dòng)態(tài)鏈接過(guò)程中重要的組成部分。在網(wǎng)頁(yè)設(shè)計(jì)、開(kāi)發(fā)的過(guò)程中,要想將DIV+CSS布局技術(shù)應(yīng)用在網(wǎng)頁(yè)動(dòng)態(tài)鏈接中,就要對(duì)a:link,a:visited,a:hover,a;active等一一定位,這樣可以在最大程度上提高設(shè)計(jì)人員的工作效率,也給人們?cè)谌粘I睢⒐ぷ髦惺褂镁W(wǎng)頁(yè)提供了最大程度的方便,同時(shí)也有效地促進(jìn)了我國(guó)IT行業(yè)的發(fā)展。
4結(jié)語(yǔ)
綜上所述,DIV+CSS布局技術(shù)在網(wǎng)頁(yè)設(shè)計(jì)、開(kāi)發(fā)的過(guò)程中起到了重要的作用。文章中對(duì)DIV+CSS布局技術(shù)在網(wǎng)頁(yè)設(shè)計(jì)、開(kāi)發(fā)過(guò)程中的應(yīng)用進(jìn)行了簡(jiǎn)單的介紹,隨著我國(guó)經(jīng)濟(jì)的不斷發(fā)展,DIV+CSS布局技術(shù)成為一種較為流行的網(wǎng)頁(yè)設(shè)計(jì)、開(kāi)發(fā)技術(shù),簡(jiǎn)化了操作流程,使設(shè)計(jì)人員的工作效率得到有效的提高,也給人們?cè)谌粘I睢⒐ぷ髦惺褂镁W(wǎng)頁(yè)提供了最大程度的方便,同時(shí)也有效促進(jìn)了我國(guó)IT行業(yè)的發(fā)展,為我國(guó)的經(jīng)濟(jì)建設(shè)作出了自己的一份努力。
[參考文獻(xiàn)]
[1]車(chē)元媛.基于DIV+CSS的網(wǎng)頁(yè)布局技術(shù)應(yīng)用[J].電腦知識(shí)與技術(shù),2011(9):2019-2020,2023.
[2]趙清華,林學(xué)華.基于DIV+CSS的網(wǎng)頁(yè)布局技術(shù)應(yīng)用研究[J].現(xiàn)代計(jì)算機(jī):專(zhuān)業(yè)版,2010(5):140-142.
[3]溫盛萍.DIV+CSS布局技術(shù)在網(wǎng)頁(yè)設(shè)計(jì)中的應(yīng)用[J].信息化建設(shè),2015(10):75.
而目前國(guó)內(nèi)網(wǎng)頁(yè)設(shè)計(jì)的現(xiàn)狀是:為了追求頁(yè)面內(nèi)容的豐富,無(wú)論網(wǎng)站屬于何種性質(zhì)都盡可能將頁(yè)面內(nèi)容做多、做長(zhǎng);首頁(yè)被分為若干個(gè)相應(yīng)區(qū)域,每?jī)蓧K之間再加一條廣告,更有甚者會(huì)在頁(yè)面的最上端加一個(gè)所謂重中之重的綜合區(qū)域。一些企業(yè)類(lèi)的網(wǎng)頁(yè)還會(huì)盡量將該公司所有的產(chǎn)品介紹都羅列到網(wǎng)頁(yè)上。這些網(wǎng)站將文字、圖片、動(dòng)畫(huà)等各種信息不加考慮地塞到頁(yè)面上,不分主次,不進(jìn)行規(guī)范化、條理化的歸類(lèi),更談不上藝術(shù)處理,其直接結(jié)果是導(dǎo)致信息傳播的效率低下,與設(shè)計(jì)者的初衷相去甚遠(yuǎn)。
一、影響網(wǎng)頁(yè)版面和空間設(shè)計(jì)的生理和心理因素
1、視容量
視覺(jué)容量是指在一定時(shí)間內(nèi),視覺(jué)所能容納的信息量。人眼的視覺(jué)容量一般用比特作為計(jì)算單位,每一秒鐘正常的視覺(jué)容量是25比特,約四個(gè)信息單位(如文字)。視覺(jué)容量的接受程度受到視覺(jué)對(duì)象的清晰程度,照明對(duì)比程度以及人們的文化程度和實(shí)際經(jīng)驗(yàn)等因素的影響,各人略有不同。一旦視覺(jué)接受到的信息超出一定的視覺(jué)容量,人們就會(huì)產(chǎn)生相應(yīng)的抵觸反應(yīng),引起不快。這就是為什么瀏覽一些超大容量的頁(yè)面時(shí),人們?nèi)菀桩a(chǎn)生視覺(jué)疲倦和心理抵觸的主要原因之一。
在網(wǎng)頁(yè)設(shè)計(jì)過(guò)程中應(yīng)當(dāng)重視視覺(jué)容量的限制。網(wǎng)頁(yè)上的內(nèi)容容量需要多大?文字、圖片等信息應(yīng)該如何歸類(lèi)?頁(yè)面級(jí)別應(yīng)如何區(qū)分等等,在進(jìn)行網(wǎng)頁(yè)設(shè)計(jì)初始時(shí)需要進(jìn)行認(rèn)真規(guī)劃,才可能將網(wǎng)站信息有效快捷地傳遞給用戶(hù)。
2、視覺(jué)流程
人們?cè)陂喿x中,視覺(jué)有一種自然的流動(dòng)習(xí)慣,視覺(jué)流程的形成是由人類(lèi)的視覺(jué)特性所決定的。受生理結(jié)構(gòu)限制,人眼只能產(chǎn)生一個(gè)焦點(diǎn),不能同時(shí)把視線(xiàn)停留在兩處或更多的地方,所以人們只有依照一定的順序?yàn)g覽觀察。
網(wǎng)頁(yè)瀏覽過(guò)程是一個(gè)動(dòng)態(tài)的視覺(jué)流程。一般來(lái)說(shuō),我們的視覺(jué)習(xí)慣于從左向右,從上向下看,所以一個(gè)空白的網(wǎng)頁(yè)給我們帶來(lái)的自然視覺(jué)流程是從左上方到右下方的一個(gè)弧形曲線(xiàn)。在這個(gè)弧形曲線(xiàn)上,視覺(jué)優(yōu)勢(shì)從上到下遞減。合理運(yùn)用視覺(jué)流程原理,有助于我們合理地布置網(wǎng)頁(yè)中視覺(jué)元素的位置,劃分相關(guān)的頁(yè)面版式區(qū)域,提高信息傳播的效率。
二、通過(guò)合理的設(shè)計(jì)有效傳達(dá)信息
1、合理借鑒傳統(tǒng)信息載體的信息規(guī)劃方法
“版面編排”實(shí)際上就是中國(guó)古代畫(huà)論中的“經(jīng)營(yíng)位置”。而網(wǎng)頁(yè)的版面設(shè)計(jì)也遵循著同樣的規(guī)律。尤其是起著門(mén)戶(hù)作用的首頁(yè),其版面的設(shè)計(jì)規(guī)劃更需要慎之又慎。作為版面內(nèi)容的文字和圖片都需要第一時(shí)間展示給用戶(hù),所以決不能簡(jiǎn)單地羅列在頁(yè)面上。首頁(yè)的作用就像書(shū)籍的目錄:作為傳統(tǒng)的信息載體,書(shū)籍的目錄主要起著引導(dǎo)瀏覽的作用,而作為網(wǎng)頁(yè)的首頁(yè)也起著相同的作用。因此在設(shè)計(jì)過(guò)程中就要盡量避免將過(guò)多的信息內(nèi)容堆放在首頁(yè)上,只需將主要導(dǎo)覽信息列入即可,這樣反而更有助于瀏覽者快速找到所需信息,提高信息傳達(dá)的效率。這也正是中國(guó)傳統(tǒng)繪畫(huà)中所講的“少即是多”。
在網(wǎng)頁(yè)設(shè)計(jì)中,網(wǎng)頁(yè)的空間結(jié)構(gòu)反映了網(wǎng)站內(nèi)各種信息之間的關(guān)系,是直接影響視覺(jué)信息傳達(dá)效果的重要因素。網(wǎng)頁(yè)之間的關(guān)系就像書(shū)籍中各章節(jié)之間的聯(lián)系一樣,形成一個(gè)無(wú)形的“空間”。這個(gè)“空間”包含物理和心理兩個(gè)方面:物理空間如首頁(yè)與各級(jí)頁(yè)面之間的聯(lián)系。各級(jí)頁(yè)面之間的設(shè)計(jì)風(fēng)格的相互統(tǒng)一,內(nèi)容的相互協(xié)調(diào),都對(duì)這個(gè)“空間”的形成起著至關(guān)重要的作用。從心理方面來(lái)講:為網(wǎng)頁(yè)創(chuàng)造人性化的視覺(jué)和心理空間也是必需的,我們可以從整個(gè)WEB站點(diǎn)的角度出發(fā),考察頁(yè)面之間的空間關(guān)系,充分利用網(wǎng)頁(yè)這種信息載體的特點(diǎn),創(chuàng)造更高效的思維互動(dòng)心理空間。
2、傳統(tǒng)形式美法則同樣適用于網(wǎng)頁(yè)版面設(shè)計(jì)
作為傳統(tǒng)平面媒體版面設(shè)計(jì)的一些基本原則,依然可以在網(wǎng)頁(yè)的版式和空間設(shè)計(jì)中發(fā)揮其重要的作用,比如:
(1)變化和統(tǒng)一。
在圖形設(shè)計(jì)中運(yùn)用變化與統(tǒng)一的規(guī)律,是處理形象和組織的對(duì)立統(tǒng)一過(guò)程,那么在網(wǎng)頁(yè)設(shè)計(jì)中同樣要恰當(dāng)?shù)氐睦眠@種規(guī)律。在我們把大量的信息塞到網(wǎng)頁(yè)上去的時(shí)候,應(yīng)該考慮怎樣把它們用合理的、統(tǒng)一的方式來(lái)排列組織,使網(wǎng)頁(yè)整體感強(qiáng)并且富于變化,使頁(yè)面更豐富,更有生氣。
(2)條理與反復(fù)。
條理與反復(fù)的原則是圖形構(gòu)成整體的秩序美的基礎(chǔ),這種手法在很多優(yōu)秀的網(wǎng)頁(yè)設(shè)計(jì)作品中運(yùn)用的較多。這類(lèi)網(wǎng)站信息含量大,需要運(yùn)用一定的方式將信息條理化并加以歸納后重復(fù)利用,使頁(yè)面整潔,脈絡(luò)清晰,信息瀏覽方便快捷。當(dāng)然,對(duì)于信息量較少的網(wǎng)站同樣需要條理與反復(fù),以達(dá)到更富有變化和清晰的視覺(jué)效果。
(3)對(duì)比和調(diào)和。
對(duì)比是指在質(zhì)或量方面相互差異甚大的兩個(gè)視覺(jué)要素同時(shí)配置在一起時(shí),兩者之間相互作用給人以更加強(qiáng)烈的視覺(jué)沖擊力。那么在網(wǎng)頁(yè)設(shè)計(jì)中,如何利用它來(lái)達(dá)到好的效果呢?首先合理地利用對(duì)比的因素,例如文本和圖片尺寸、比例以及位置的排布等等,最終的目的就是如何取得較為強(qiáng)烈的視覺(jué)效果。此外還要恰如其分地找到調(diào)和的因素,即版面和空間的聯(lián)系點(diǎn),使整體感覺(jué)突出,不至于僅僅因?yàn)閷?duì)比而造成割裂的感覺(jué)。只有做到對(duì)比和調(diào)和的相輔相成,才能使網(wǎng)頁(yè)頁(yè)面鮮明、突出,更好地傳達(dá)出設(shè)計(jì)者的意圖。
(4)均齊與平衡。
這是設(shè)計(jì)中求得中心穩(wěn)定的兩種組織形式。在網(wǎng)頁(yè)設(shè)計(jì)中,平衡是一個(gè)動(dòng)態(tài)的平衡,因?yàn)轫?yè)面上兩邊的配置不會(huì)總是絕對(duì)統(tǒng)一的。更多的時(shí)候是版面中各個(gè)區(qū)域的相互平衡,這是一種動(dòng)態(tài)的平衡。這種方法可以滿(mǎn)足人們視覺(jué)上的整體平衡感,也是人的心理因素的一種圖形化表現(xiàn),當(dāng)然不是片面地追求靜止的對(duì)稱(chēng),那種僵硬的、不生動(dòng)的形式同樣會(huì)失去美感。
(5)節(jié)奏與韻律。
運(yùn)動(dòng)中的事物都具有節(jié)奏和韻律的形式規(guī)律。在具體的網(wǎng)頁(yè)設(shè)計(jì)的運(yùn)用中,版面的編排就經(jīng)常會(huì)遇到這個(gè)問(wèn)題,優(yōu)秀的版而設(shè)計(jì)富有音樂(lè)般的美感,同時(shí)絲毫不損其實(shí)用性,這需要不僅是從形狀上,而且要從整體的色澤、大小等綜合方面人手。
(6)適當(dāng)留自。
關(guān)鍵詞:網(wǎng)頁(yè)設(shè)計(jì);職業(yè)定位;人才培養(yǎng)
中圖分類(lèi)號(hào):G712 文獻(xiàn)標(biāo)識(shí)碼:A 文章編號(hào):1674-7712 (2013) 04-0130-03
一、網(wǎng)頁(yè)設(shè)計(jì)人才培養(yǎng)現(xiàn)狀
高職院校網(wǎng)頁(yè)設(shè)計(jì)課程體系與教學(xué)之間存在許多弊端,概括起來(lái),主要有以下幾個(gè)方面:
(1)課程與教學(xué)內(nèi)容理論性強(qiáng),實(shí)踐教學(xué)方法、教學(xué)手段不適應(yīng)行業(yè)需求,學(xué)生職業(yè)能力和創(chuàng)新能力的培養(yǎng)沒(méi)有真正落實(shí)。
(2)師資力量存在缺陷,普遍現(xiàn)象是:大部分老師是從校門(mén)進(jìn)校門(mén),沒(méi)有企業(yè)的從業(yè)經(jīng)驗(yàn),也沒(méi)有實(shí)際項(xiàng)目開(kāi)發(fā)經(jīng)驗(yàn),基本上是“照本宣科”,所謂的項(xiàng)目驅(qū)動(dòng),項(xiàng)目的開(kāi)發(fā)流程屬于模擬范疇,與實(shí)際客戶(hù)的需求,還相差甚遠(yuǎn)。目前高職院校已意識(shí)到這個(gè)問(wèn)題,通過(guò)各種方式尋求校企合作,實(shí)現(xiàn)校企互動(dòng)的新模式,如何盡快解決師資在理論知識(shí)和實(shí)踐應(yīng)用方面的不足是十分迫切的。
(3)課程設(shè)置不盡合理,課程內(nèi)容上重“設(shè)計(jì)”輕“技術(shù)”。教學(xué)上按照以往的教學(xué)模式,僅僅在多媒體教室中講解操作步驟、做典型范例是遠(yuǎn)遠(yuǎn)不夠的。應(yīng)著重培養(yǎng)學(xué)生的創(chuàng)新意識(shí)和獨(dú)立開(kāi)發(fā)網(wǎng)站的能力。藝術(shù)性與技術(shù)性的高度統(tǒng)一是今后網(wǎng)頁(yè)設(shè)計(jì)發(fā)展的大趨勢(shì),不斷探索新的教學(xué)模式和教學(xué)理念,根據(jù)行業(yè)需求來(lái)構(gòu)建合理的課程體系。
二、網(wǎng)頁(yè)設(shè)計(jì)專(zhuān)業(yè)的職業(yè)崗位
根據(jù)對(duì)沈陽(yáng)、大連地區(qū)IT行業(yè)的發(fā)展現(xiàn)狀與趨勢(shì)、人才需求狀況、企業(yè)調(diào)研等方面調(diào)查分析,可以將網(wǎng)頁(yè)設(shè)計(jì)崗位分為網(wǎng)頁(yè)設(shè)計(jì)、網(wǎng)頁(yè)制作、網(wǎng)站編輯、網(wǎng)站管理四大崗位群。
三、構(gòu)建科學(xué)合理的網(wǎng)頁(yè)設(shè)計(jì)人才培養(yǎng)體系
(一)網(wǎng)頁(yè)設(shè)計(jì)人才培養(yǎng)目標(biāo)的定位
本專(zhuān)業(yè)培養(yǎng)適應(yīng)社會(huì)與區(qū)域經(jīng)濟(jì)發(fā)展需要,德、智、體、美全面發(fā)展,熟悉網(wǎng)站的配色及制作流程,掌握網(wǎng)站設(shè)計(jì)與策劃、網(wǎng)站的安全與服務(wù)器配置以及網(wǎng)站的搜索引擎優(yōu)化技術(shù);掌握動(dòng)態(tài)網(wǎng)站編程技術(shù),具有獨(dú)立制作整站系統(tǒng)的能力,在企事業(yè)單位、網(wǎng)絡(luò)公司、廣告公司等IT行業(yè)從事網(wǎng)頁(yè)設(shè)計(jì)、網(wǎng)站美工、各類(lèi)網(wǎng)站的開(kāi)發(fā)與維護(hù)等工作的網(wǎng)頁(yè)設(shè)計(jì)師、高級(jí)技師和高級(jí)網(wǎng)站程序員。
(二)網(wǎng)頁(yè)設(shè)計(jì)專(zhuān)業(yè)的課程體系
根據(jù)網(wǎng)頁(yè)設(shè)計(jì)行業(yè)的職業(yè)崗位分析及人才需求,確定網(wǎng)頁(yè)設(shè)計(jì)的人才培養(yǎng)目標(biāo)。按人才的職業(yè)能力的培養(yǎng)為主線(xiàn)構(gòu)建了該專(zhuān)業(yè)的課程體系。確定了該專(zhuān)業(yè)的核心專(zhuān)業(yè)課程,課程體系結(jié)構(gòu)如圖1所示。
按課程的培養(yǎng)目標(biāo),將網(wǎng)頁(yè)設(shè)計(jì)的專(zhuān)業(yè)課程分成以下四個(gè)模塊:網(wǎng)頁(yè)設(shè)計(jì)基礎(chǔ)模塊、客戶(hù)端開(kāi)發(fā)模塊、數(shù)據(jù)庫(kù)操作模塊和Web應(yīng)用程序開(kāi)發(fā)模塊。
模塊一:網(wǎng)頁(yè)設(shè)計(jì)基礎(chǔ)模塊,對(duì)應(yīng)的課程是《網(wǎng)頁(yè)設(shè)計(jì)與制作》,主講內(nèi)容是“網(wǎng)頁(yè)三劍客”,DW也就是Dreamweaver(網(wǎng)頁(yè)制作),F(xiàn)W是Firework(矢量圖形制作和圖像處理),F(xiàn)lash(動(dòng)畫(huà)制作)。這三種軟件能相互合作。比較實(shí)用的操作方式是:在Firework中做好主要頁(yè)面,然后導(dǎo)出,在Dreamweaver中加以修改,添加鏈接等,便做出一個(gè)非常好看的頁(yè)面。
模塊二:客戶(hù)端開(kāi)發(fā)模塊,對(duì)應(yīng)的課程是《JavaScript》或《VBScript》,《JavaScript》是一種由Netscape的LiveScript發(fā)展而來(lái)的原型化繼承的面向?qū)ο蟮膭?dòng)態(tài)類(lèi)型的客戶(hù)端腳本語(yǔ)言,該語(yǔ)言區(qū)分大小寫(xiě),主要目的是解決服務(wù)器端語(yǔ)言(比如Perl)遺留的速度問(wèn)題,為客戶(hù)端提供更流暢的瀏覽效果。
模塊三:數(shù)據(jù)庫(kù)操作模塊,對(duì)應(yīng)的課程是《SQLServer》或《Access》或《mySQL》,作為網(wǎng)站的后臺(tái)數(shù)據(jù)庫(kù)管理系統(tǒng),負(fù)責(zé)網(wǎng)站的實(shí)時(shí)更新,對(duì)數(shù)據(jù)進(jìn)行存儲(chǔ),在網(wǎng)站的建設(shè)中起著至關(guān)重要的作用。
模塊四:Web應(yīng)用程序開(kāi)發(fā)模塊,對(duì)應(yīng)的課程是《》或《JSP》或《PHP》,主要講述動(dòng)態(tài)Web頁(yè)面的實(shí)用技術(shù)。
模塊教學(xué)采用理實(shí)一體化教學(xué)模式,采用了“任務(wù)驅(qū)動(dòng)”教學(xué)法,教學(xué)任務(wù)分為:課堂教學(xué)模擬、企業(yè)真實(shí)項(xiàng)目操作兩部分,這些任務(wù)的設(shè)計(jì)遵循了由簡(jiǎn)單到復(fù)雜,由單人獨(dú)立操作到項(xiàng)目組成員共同完成,充分調(diào)動(dòng)了學(xué)生的學(xué)習(xí)積極性和主動(dòng)性,有效提高學(xué)生的知識(shí)應(yīng)用能力和創(chuàng)新能力。
教學(xué)評(píng)價(jià)建議改變單一的總結(jié)性評(píng)價(jià)的方法,采用評(píng)價(jià)過(guò)程、階段評(píng)價(jià)和綜合評(píng)價(jià)相結(jié)合的評(píng)價(jià)方法。教學(xué)中要注重學(xué)生學(xué)習(xí)的過(guò)程,精心設(shè)計(jì)對(duì)學(xué)生學(xué)習(xí)過(guò)程的記錄及評(píng)價(jià),如學(xué)習(xí)的形式、獲取信息的方式、討論的要點(diǎn)、設(shè)計(jì)的方案等進(jìn)行記錄,并對(duì)作品進(jìn)行交流、自評(píng)和互評(píng)等,從而讓學(xué)生學(xué)會(huì)學(xué)習(xí)。
(三)網(wǎng)頁(yè)設(shè)計(jì)專(zhuān)業(yè)課程的教學(xué)評(píng)價(jià)標(biāo)準(zhǔn)
制訂本專(zhuān)業(yè)各核心課程的教學(xué)評(píng)價(jià)標(biāo)準(zhǔn),此標(biāo)準(zhǔn)以《動(dòng)態(tài)網(wǎng)頁(yè)設(shè)計(jì)》課程為例。
1.考核方式
本學(xué)習(xí)領(lǐng)域的課程考核宜采用過(guò)程考核、公共考核和期末考試相結(jié)合,具體考核內(nèi)容及權(quán)重見(jiàn)表3。期末考試分為理論考試和實(shí)踐考試。其中,理論考試主要考核8個(gè)學(xué)習(xí)情境中的主要知識(shí)點(diǎn),試卷分值100分,其中填空題(占25%)、選擇題(25%)、判斷題(20%)、簡(jiǎn)答題(30%),試卷從不同角度考查學(xué)生基礎(chǔ)知識(shí)的掌握能力;實(shí)踐考試內(nèi)容為2至3道上機(jī)操作題,主要考核學(xué)生的上機(jī)設(shè)計(jì)和調(diào)試能力,及對(duì)知識(shí)的綜合運(yùn)用能力。
(四)網(wǎng)頁(yè)設(shè)計(jì)專(zhuān)業(yè)的師資建設(shè)
建立一支高素質(zhì)的師資隊(duì)伍是網(wǎng)頁(yè)設(shè)計(jì)專(zhuān)業(yè)建設(shè)的關(guān)鍵,這支隊(duì)伍不僅要具有網(wǎng)頁(yè)設(shè)計(jì)相關(guān)的理論知識(shí)和實(shí)踐經(jīng)驗(yàn)的特長(zhǎng),而且還熟悉整個(gè)網(wǎng)站的運(yùn)作和前臺(tái)后臺(tái)維護(hù)管理等方面的理論知識(shí)。教師的培養(yǎng)可以通過(guò)以下的方法:
1.以行業(yè)為基地進(jìn)行專(zhuān)業(yè)培訓(xùn),加快與行業(yè)的聯(lián)系。
2.組織教師到其它兄弟學(xué)校進(jìn)行交流和調(diào)研,提高教師業(yè)務(wù)水平。
3.積極從國(guó)內(nèi)外及相關(guān)行業(yè)引進(jìn)、或者借用專(zhuān)家人才,提高教師隊(duì)伍水平。
4.專(zhuān)業(yè)教師自身應(yīng)該時(shí)時(shí)刻刻跟蹤、掌握電網(wǎng)頁(yè)設(shè)計(jì)發(fā)展的最新動(dòng)態(tài),掌握網(wǎng)頁(yè)設(shè)計(jì)最前沿的知識(shí),不斷地更新知識(shí)。總之,網(wǎng)頁(yè)設(shè)計(jì)專(zhuān)業(yè)人才培養(yǎng)應(yīng)當(dāng)以企業(yè)需要什么樣的人才為出發(fā)點(diǎn),總結(jié)過(guò)去的經(jīng)驗(yàn)和教訓(xùn),從實(shí)際出發(fā),嚴(yán)格按照客觀規(guī)律來(lái)建立網(wǎng)頁(yè)設(shè)計(jì)人才培養(yǎng)的模式和體系,這樣才能培養(yǎng)出符合社會(huì)需要的合格人才。
參考文獻(xiàn):
[1]高云.高職高專(zhuān)《網(wǎng)頁(yè)設(shè)計(jì)》課程改革探索[J].吉林省教育學(xué)院學(xué)報(bào),2009,11:2.
[2]趙京丹,閆寧.任務(wù)驅(qū)動(dòng)教學(xué)法在Dreamweaver網(wǎng)頁(yè)制作教學(xué)設(shè)計(jì)中的應(yīng)用[J].職業(yè)教育研究,2007,7.
>> 用Photoshop和Dreamweaver輕松布局網(wǎng)頁(yè)表格 Dreamweaver網(wǎng)頁(yè)設(shè)計(jì)中表格與層布局的比較 CSS+DIV布局與表格布局網(wǎng)頁(yè)的對(duì)比 CSS+DIV與表格實(shí)現(xiàn)網(wǎng)頁(yè)布局的比較 網(wǎng)頁(yè)設(shè)計(jì)中的表格繪制 網(wǎng)頁(yè)版面布局設(shè)計(jì)教學(xué)之我見(jiàn) 淺談網(wǎng)頁(yè)設(shè)計(jì)中頁(yè)面布局的教學(xué) 網(wǎng)頁(yè)設(shè)計(jì)教學(xué)中表格與層的應(yīng)用研究 網(wǎng)頁(yè)表格布局方式和DIV+CSS布局方式的比較研究 網(wǎng)頁(yè)設(shè)計(jì)的布局和用色技巧 基于CSS頁(yè)面布局的網(wǎng)頁(yè)設(shè)計(jì) 網(wǎng)頁(yè)版面布局設(shè)計(jì)的探討 淺析網(wǎng)頁(yè)設(shè)計(jì)中的頁(yè)面布局 網(wǎng)頁(yè)設(shè)計(jì)中布局模式的比較 淺談網(wǎng)頁(yè)設(shè)計(jì)中的布局工具 淺談網(wǎng)頁(yè)設(shè)計(jì)用圖 基于項(xiàng)目化教學(xué)的“網(wǎng)頁(yè)設(shè)計(jì)與布局”課程教學(xué)研究 表格與DIV+CSS的布局設(shè)計(jì)分析 “網(wǎng)頁(yè)設(shè)計(jì)”課程中DIV+CSS布局技術(shù)的教學(xué) DIV+CSS布局在網(wǎng)頁(yè)設(shè)計(jì)教學(xué)中的應(yīng)用研究 常見(jiàn)問(wèn)題解答 當(dāng)前所在位置:打開(kāi))請(qǐng)你將這個(gè)頁(yè)面中的文字和圖片排列整齊(文字、圖片無(wú)法排列整齊,再打開(kāi)bg2.htm)。現(xiàn)在請(qǐng)你將圖片和文字分別放到表格中,看看效果。
教師:通過(guò)這個(gè)實(shí)驗(yàn),你得出了什么結(jié)論?
學(xué)生:用表格可以很方便地將文字與圖片排列整齊。
教師:說(shuō)得很好,表格的作用就是將網(wǎng)頁(yè)中的文字、圖片等素材對(duì)象進(jìn)行定位。網(wǎng)頁(yè)都是用表格來(lái)進(jìn)行布局的,請(qǐng)看兩個(gè)范例(展示網(wǎng)頁(yè)的表格)。
【設(shè)計(jì)意圖】事先預(yù)設(shè)此環(huán)節(jié),安排學(xué)生李彥在適當(dāng)?shù)臅r(shí)候提出問(wèn)題,引出課堂知識(shí)沖突,為下一環(huán)節(jié)做好鋪
墊;同時(shí)吸引學(xué)生的注意力,及時(shí)調(diào)整學(xué)生的學(xué)習(xí)狀態(tài)。通過(guò)設(shè)計(jì)一個(gè)對(duì)比實(shí)驗(yàn),用實(shí)驗(yàn)驗(yàn)證學(xué)生的猜想,讓學(xué)生總結(jié)實(shí)驗(yàn)結(jié)論――表格在網(wǎng)頁(yè)布局的作用,培養(yǎng)學(xué)生的鉆研、思考、解決問(wèn)題的能力。
插入表格
教師:插入表格之前,為了編輯的方便,我們通常要先設(shè)置網(wǎng)頁(yè)大小。在通常情況下,我們一般將網(wǎng)頁(yè)大小設(shè)置成默認(rèn)狀態(tài)的“當(dāng)前網(wǎng)頁(yè)大小”。
教師:接著請(qǐng)各位設(shè)計(jì)師在此頁(yè)面中按照你的布局草圖的行列數(shù)插入表格,最后將相應(yīng)的文字信息填寫(xiě)到表格中,效果請(qǐng)參照大屏幕。
【設(shè)計(jì)意圖】通過(guò)演示法講解、回顧打開(kāi)網(wǎng)站站點(diǎn)的技巧與方法、網(wǎng)頁(yè)大小設(shè)置方法,快速進(jìn)入任務(wù)二的學(xué)習(xí)中。
調(diào)整表格
教師:各位設(shè)計(jì)師,表格插入好的請(qǐng)舉手。(環(huán)顧學(xué)生)若有不會(huì)的,請(qǐng)一個(gè)設(shè)計(jì)師演示。請(qǐng)各位結(jié)合Word中表格的相關(guān)操作,還可以結(jié)合教材中的步驟,完成單元格的合并與拆分的操作,使網(wǎng)頁(yè)布局更加合理。
【設(shè)計(jì)意圖】關(guān)于表格的插入、拆分、合并單元格等操作已經(jīng)在Word、PowerPoint設(shè)計(jì)多媒體作品時(shí)學(xué)過(guò),學(xué)生可以憑已有的知識(shí)完成,也可以參照教材的步驟完成,培養(yǎng)學(xué)生的自學(xué)能力與意識(shí)。
作品的保存與評(píng)價(jià) 要求所有設(shè)計(jì)師保存提交作品,展示1~2個(gè)設(shè)計(jì)師作品,并做好評(píng)價(jià)。
【設(shè)計(jì)意圖】及時(shí)評(píng)價(jià)與反饋學(xué)生的作品,能夠鼓勵(lì)和督促學(xué)生認(rèn)真完成作品的設(shè)計(jì)。
課堂拓展練習(xí) 如圖3所示課堂提高練習(xí),在第二行調(diào)整導(dǎo)航欄這一行單元格列寬,使他們平均分布時(shí)不影響第三列圖片這一行,該如何實(shí)現(xiàn)?請(qǐng)參照教材的閱讀材料一提供的方法試一試。
【設(shè)計(jì)意圖】結(jié)合教材閱讀材料,通過(guò)設(shè)計(jì)課堂拓展練習(xí),能使學(xué)習(xí)有余力的學(xué)生在課堂上有充分發(fā)揮,培養(yǎng)其自學(xué)能力。
4 課堂總結(jié)
師生一起回顧所學(xué)知識(shí),課堂小結(jié)內(nèi)容如圖4所示。
關(guān)鍵詞:網(wǎng)頁(yè)交互設(shè)計(jì);視覺(jué)傳達(dá)
因時(shí)代的進(jìn)步互聯(lián)網(wǎng)絡(luò)的快速發(fā)展是必然的,作為一種全新的視覺(jué)傳播媒介,具有迅速、價(jià)廉、及時(shí)、傳播面廣的特點(diǎn)。網(wǎng)頁(yè)作為互聯(lián)網(wǎng)的代表傳播方式之一,它的設(shè)計(jì)既要有傳統(tǒng)平面該有的設(shè)計(jì)特點(diǎn),還要有現(xiàn)代技術(shù)的組成,將技術(shù)與藝術(shù)巧妙的相融為一體的交互性活動(dòng)。本文嘗試著從視覺(jué)傳達(dá)設(shè)計(jì)中文字、色彩和排版對(duì)人生理和心理的作用應(yīng)如何運(yùn)用到網(wǎng)頁(yè)設(shè)計(jì)的交互式上,幫助設(shè)計(jì)師更好地利用視覺(jué)表現(xiàn)讓客戶(hù)達(dá)到良好體驗(yàn)。
在筆者看來(lái),一個(gè)好的設(shè)計(jì)師或互聯(lián)網(wǎng)技術(shù)人員未必能夠做好網(wǎng)頁(yè)設(shè)計(jì),因?yàn)樗恢皇枪庑枰O(shè)計(jì)師的審美或技術(shù)人員的開(kāi)發(fā)。一個(gè)好的互聯(lián)網(wǎng)產(chǎn)品需要產(chǎn)品經(jīng)理與設(shè)計(jì)師和技術(shù)人員的三方溝通,一個(gè)優(yōu)秀的設(shè)計(jì)師其實(shí)可以勝任產(chǎn)品經(jīng)理加設(shè)計(jì)師的工作。所以我們?cè)谧鼍W(wǎng)頁(yè)設(shè)計(jì)時(shí),應(yīng)該以一個(gè)產(chǎn)品經(jīng)理加設(shè)計(jì)師的思維共同設(shè)計(jì)。心里的思路應(yīng)該很清晰,例如我們的客戶(hù)群體是哪些、他們有哪些習(xí)慣、我的顏色該如何搭配、字體用什么才能吸引讓客戶(hù)群體等等,這些都是在進(jìn)行網(wǎng)頁(yè)設(shè)計(jì)前所要思考的,至于如何正確地匹配到這些選項(xiàng),還需要我們仔細(xì)地探究。
一個(gè)好的網(wǎng)頁(yè)設(shè)計(jì)并不是簡(jiǎn)單地把文字圖片放上去就夠了,我們需要揣測(cè)用戶(hù)的心理因素和生理本能,比如說(shuō)網(wǎng)頁(yè)的大小比例、字體大小、圖片大小和整體的排版風(fēng)格。下面就跟大家淺談下網(wǎng)頁(yè)設(shè)計(jì)中的信息視覺(jué)傳達(dá):
1 文字
對(duì)于在網(wǎng)頁(yè)上的文字設(shè)計(jì)來(lái)說(shuō)字體的基本要求是可閱讀性,其包括文字的大小、字與字的間距、段與段的間距和行列長(zhǎng)短間距等方面的處理。
很少一些網(wǎng)頁(yè)對(duì)字體進(jìn)行再次設(shè)計(jì),原因是不同的計(jì)算機(jī)操作系統(tǒng)和字體文件安裝都是不同的,所以必須選取一些常規(guī)的字體,否則一部分用戶(hù)上的字體就會(huì)變成默認(rèn)字體,這將與設(shè)計(jì)者本身的設(shè)計(jì)意圖大大相否。
其次,用戶(hù)使用的屏幕顯示也對(duì)字體有一定的影響,設(shè)計(jì)是大多數(shù)會(huì)采用宋體或黑體兩種字體,從用戶(hù)心理感受來(lái)說(shuō),宋體字較為活躍、生動(dòng),閱讀起來(lái)不容易疲勞。而黑體字方正端莊,線(xiàn)條粗獷醒目,但在縮小到一定程度時(shí)容易模糊,造成識(shí)別困難。
2 色彩
色彩設(shè)計(jì)對(duì)于一個(gè)優(yōu)秀的設(shè)計(jì)來(lái)說(shuō)非常重要,在網(wǎng)頁(yè)設(shè)計(jì)中也是設(shè)計(jì)的關(guān)鍵,在互聯(lián)網(wǎng)快速的閱讀中如何第一秒吸引到用戶(hù)成為視覺(jué)傳播的關(guān)鍵。人對(duì)色彩是相當(dāng)敏感的,當(dāng)他們首次接觸一個(gè)網(wǎng)頁(yè)時(shí),最先吸引其注意力的就是網(wǎng)頁(yè)的顏色,其次是圖像,最后是文字。色彩給其他人的印象特別強(qiáng)烈,所以設(shè)計(jì)師最容易通過(guò)色彩去表達(dá)他的設(shè)計(jì)意念,例如天貓和京東的紅白色主頁(yè)的設(shè)計(jì),強(qiáng)烈的顏色沖擊了人們的心理視覺(jué)給人強(qiáng)烈的購(gòu)買(mǎi)欲望。
網(wǎng)頁(yè)上的顏色主要表現(xiàn)在主導(dǎo)色、輔助顏色和背景顏色這幾個(gè)方面。占顏色面積最大的是網(wǎng)頁(yè)主色調(diào)。主色調(diào)像是一幅畫(huà)中的主色,在創(chuàng)造特定的氣氛與意境上發(fā)揮主導(dǎo)作用。第二大的是輔助顏色,起的作用是強(qiáng)調(diào)或調(diào)和。網(wǎng)頁(yè)的背景色是增加畫(huà)面空間感的重要措施。例如,較暗的背景色與鮮明的主導(dǎo)色形成鮮明的前后空間關(guān)系。
設(shè)計(jì)師對(duì)不同功能的色彩進(jìn)行理解和分析,搭配好主色、輔色和背景色的運(yùn)用比例才能給用戶(hù)一個(gè)良好的視覺(jué)體驗(yàn)。
3 排版
排版設(shè)計(jì)在網(wǎng)頁(yè)設(shè)計(jì)中也可以叫做頁(yè)面布局,把零散的網(wǎng)頁(yè)名稱(chēng)、導(dǎo)航欄、搜索欄、圖形、文字和符號(hào)進(jìn)行點(diǎn)線(xiàn)面排版。四周的“空間”并不是沒(méi)有的,可以留白或留灰,突出頁(yè)面主題物讓網(wǎng)頁(yè)在使用中更加簡(jiǎn)潔和便利。
設(shè)計(jì)師根據(jù)“以虛托實(shí)、以無(wú)襯有”和信息傳達(dá)的要求進(jìn)行合理排版,此時(shí)需要注重用戶(hù)心理的潛意識(shí)和生理的行為習(xí)慣進(jìn)行排版設(shè)計(jì)。比如用戶(hù)在瀏覽頁(yè)面時(shí),第一眼優(yōu)先注意到的是四周留白的文字,@就是視覺(jué)的邊際效應(yīng)在虛空間的一個(gè)體現(xiàn)。從而使設(shè)計(jì)師設(shè)計(jì)的平面網(wǎng)頁(yè)能夠充分與用戶(hù)有所“交互”,使用戶(hù)體驗(yàn)獲得更佳的視覺(jué)印象。
4 視覺(jué)規(guī)律
視覺(jué)規(guī)律是根據(jù)人的視覺(jué)心理因素和生理習(xí)慣而決定的。人有兩只眼睛但是因?yàn)槿说难矍蛟碇辉试S產(chǎn)生一個(gè)視覺(jué)焦點(diǎn),不能同時(shí)停留在兩處以上(包含兩處)的地方。因此人們自由閱讀時(shí),都會(huì)有一個(gè)生理習(xí)慣,從上往下和從左往右閱讀。
心理學(xué)研究顯示出,在一個(gè)平面內(nèi)人在閱覽上半部分時(shí)會(huì)讓人感到輕松愉悅,下半部分時(shí)則會(huì)感到郁悶壓抑。同樣左半部分讓人感到輕松愉悅,右半部分則會(huì)感到郁悶壓抑。所以左上部分稱(chēng)為“最佳閱覽區(qū)”。視覺(jué)流程導(dǎo)向又分為導(dǎo)向類(lèi)視覺(jué)流程、重心視覺(jué)流程、反復(fù)視覺(jué)流程、散點(diǎn)視覺(jué)流程,我們?cè)诰W(wǎng)頁(yè)設(shè)計(jì)中就可以依據(jù)這些用戶(hù)的生理和心理的“規(guī)律”來(lái)進(jìn)行交互設(shè)計(jì),從而使用戶(hù)達(dá)到良好的使用體驗(yàn)。
優(yōu)秀的網(wǎng)頁(yè)設(shè)計(jì)師提供愉悅的交互式體驗(yàn),不僅對(duì)文字、色彩和排版進(jìn)行探究設(shè)計(jì)。網(wǎng)頁(yè)上操作面板上的按鈕和開(kāi)關(guān)和導(dǎo)航的分欄等,設(shè)計(jì)師利用交互性及時(shí)讓用戶(hù)知道如何操作這是很重要的。那么設(shè)計(jì)師必須合理地運(yùn)用示能、意符、約束、映射和反饋這幾個(gè)心理學(xué)概念進(jìn)行科學(xué)的設(shè)計(jì)。
參考文獻(xiàn):
關(guān)鍵詞 網(wǎng)頁(yè)設(shè)計(jì) 發(fā)展趨勢(shì) 教學(xué)設(shè)計(jì)
中圖分類(lèi)號(hào):G642 文獻(xiàn)標(biāo)識(shí)碼:A
Improve Web Design Curriculum Teaching of Art
Professional with the Development Trend
XIE Tao
(Graduate Department, Hubei Academy of Fine Arts, Wuhan, Hubei 430060)
AbstractAs a digital media arts and visual communication in one aesthetic, as an integrated interdisciplinary curriculum, "Web Design" is developed as the core curriculum by many professional art and design colleges and universities. With the rapid technological development, professional web design courses for the Art features need continuously to improve teaching methods, enrich the teaching content in order to enable students to master the most practical web design techniques, to train highly qualified personnel for the different needs.
Key wordsweb design; development trend; teaching design
隨著計(jì)算機(jī)技術(shù)的發(fā)展和Internet互聯(lián)網(wǎng)普及化程度越來(lái)越高,網(wǎng)頁(yè)設(shè)計(jì)與制作已經(jīng)成為當(dāng)代視覺(jué)設(shè)計(jì)師必備的專(zhuān)業(yè)技能之一。就網(wǎng)頁(yè)設(shè)計(jì)課程教學(xué)而言,不僅要求學(xué)生掌握相關(guān)的計(jì)算機(jī)技術(shù),更要具有專(zhuān)業(yè)的美工基礎(chǔ)和藝術(shù)素養(yǎng)。培養(yǎng)能適應(yīng)時(shí)展與市場(chǎng)需求的網(wǎng)頁(yè)設(shè)計(jì)師,藝術(shù)專(zhuān)業(yè)網(wǎng)頁(yè)設(shè)計(jì)課程就必須緊隨技術(shù)更新步伐進(jìn)行教學(xué)改革,以便適應(yīng)時(shí)展需求。
1 設(shè)計(jì)軟件與開(kāi)發(fā)技術(shù)的發(fā)展與更新
網(wǎng)頁(yè)設(shè)計(jì)軟件眾多,業(yè)界廣泛使用Adobe公司的Dreamweaver,高校網(wǎng)頁(yè)設(shè)計(jì)課程也基本以此作為軟件教學(xué)內(nèi)容。經(jīng)過(guò)數(shù)年發(fā)展,最新版的Dreamweaver CS 5推出了許多新功能,因此課程的軟件操作教學(xué)內(nèi)容也需圍繞新版本展開(kāi)講授。
早期的網(wǎng)頁(yè)設(shè)計(jì)師在設(shè)計(jì)流程中主要追求良好的美學(xué)效果,不太關(guān)注語(yǔ)義化和可用性方面的問(wèn)題。隨著技術(shù)的發(fā)展進(jìn)步,遵循網(wǎng)頁(yè)標(biāo)準(zhǔn)(Web標(biāo)準(zhǔn))進(jìn)行網(wǎng)頁(yè)設(shè)計(jì)和網(wǎng)站開(kāi)發(fā),已經(jīng)成為當(dāng)代網(wǎng)頁(yè)設(shè)計(jì)師必備的技能之一。用Div+CSS布局來(lái)替代傳統(tǒng)的table布局,使內(nèi)容與表現(xiàn)相分離,頁(yè)面信息結(jié)構(gòu)更清晰,有利于內(nèi)容的重用。網(wǎng)頁(yè)標(biāo)準(zhǔn)還使網(wǎng)站開(kāi)發(fā)與維護(hù)更簡(jiǎn)易,與未來(lái)瀏覽器也完美兼容,使訪(fǎng)問(wèn)者獲得更好的瀏覽體驗(yàn)。
Flash曾經(jīng)作為網(wǎng)頁(yè)設(shè)計(jì)中的視覺(jué)元素之一,現(xiàn)在已經(jīng)發(fā)展成能夠開(kāi)發(fā)整套網(wǎng)站的強(qiáng)大工具,提供了大量的遠(yuǎn)遠(yuǎn)超過(guò) Html 所能夠?qū)崿F(xiàn)的視覺(jué)表現(xiàn)效果,F(xiàn)lash 使創(chuàng)建復(fù)雜的、互動(dòng)性強(qiáng)并且擁有動(dòng)畫(huà)元素的網(wǎng)站成為可能。Flash流媒體技術(shù)的廣泛使用也是網(wǎng)頁(yè)設(shè)計(jì)的一個(gè)新趨勢(shì),頁(yè)面元素不再是靜態(tài)的文字和圖片,也不再局限于二維的Flas效果,結(jié)合音頻和視頻技術(shù)的Flv流媒體技術(shù)由于不需要安裝插件,有著優(yōu)秀的兼容性及交互性,在網(wǎng)頁(yè)設(shè)計(jì)中的應(yīng)用達(dá)到一個(gè)新的高度。
3D技術(shù)是當(dāng)前視覺(jué)藝術(shù)的一個(gè)熱點(diǎn),基于Internet具有交互性的虛擬現(xiàn)實(shí)建模語(yǔ)言Web 3D技術(shù),使二維的網(wǎng)頁(yè)向三維發(fā)展提供了很好的支持,代表了三維網(wǎng)頁(yè)的發(fā)展方向。同時(shí),更多的瀏覽器開(kāi)始完美支持和表現(xiàn)新一代Web 語(yǔ)言、互聯(lián)網(wǎng)標(biāo)準(zhǔn)Html5,視頻播放、動(dòng)畫(huà)、3D交互圖像、Web視頻聊天及會(huì)議、音頻的采樣和混合都將是Html5的重要優(yōu)點(diǎn)和應(yīng)用趨勢(shì),并將引領(lǐng)下一代 Web 實(shí)現(xiàn)類(lèi)似桌面的應(yīng)用體驗(yàn)。
隨著技術(shù)的進(jìn)步,網(wǎng)頁(yè)設(shè)計(jì)越來(lái)越重于表現(xiàn)多媒體的特性,這就需要網(wǎng)頁(yè)設(shè)計(jì)師不僅要掌握基本的專(zhuān)業(yè)技能,還需拓展其他相關(guān)領(lǐng)域的專(zhuān)業(yè)知識(shí),才能提高職場(chǎng)競(jìng)爭(zhēng)實(shí)力。
2 審美的提高促進(jìn)網(wǎng)頁(yè)設(shè)計(jì)新思維
一個(gè)極具藝術(shù)感染力的網(wǎng)頁(yè)設(shè)計(jì)作品會(huì)得到眾多來(lái)訪(fǎng)者的傾心,提高網(wǎng)站的親和力與回訪(fǎng)率。特別是在信息高速發(fā)展的今天,人們審美意識(shí)的提高,客觀上將網(wǎng)頁(yè)設(shè)計(jì)推向了更高層次的表現(xiàn)境界,網(wǎng)頁(yè)設(shè)計(jì)風(fēng)格個(gè)性化、技術(shù)多元化將成為必然的發(fā)展趨勢(shì)。
網(wǎng)頁(yè)的設(shè)計(jì)與制作,除了要表現(xiàn)動(dòng)態(tài)效果及強(qiáng)大的交互功能,還應(yīng)著力提高設(shè)計(jì)美感和藝術(shù)氛圍,界面設(shè)計(jì)同樣要符合視覺(jué)藝術(shù)的形式美法則。
(1)布局合理、排版簡(jiǎn)潔。結(jié)合優(yōu)秀的版式設(shè)計(jì),對(duì)頁(yè)面元素及內(nèi)容進(jìn)行歸檔分類(lèi)與優(yōu)化,做到信息的主次分明。
(2)風(fēng)格統(tǒng)一、整體性好。網(wǎng)站的整體性是通過(guò)好的界面設(shè)計(jì)風(fēng)格體現(xiàn)出來(lái)的,色彩搭配要協(xié)調(diào),圖像圖形的制作要精致,突顯網(wǎng)站主題與格調(diào)。
(3)創(chuàng)新性的視覺(jué)特色。善于做創(chuàng)新性的視覺(jué)設(shè)計(jì),讓頁(yè)面設(shè)計(jì)在同類(lèi)網(wǎng)站中脫穎而出,帶給用戶(hù)愉悅的視覺(jué)感受和瀏覽體驗(yàn)。
(4)易用性。網(wǎng)頁(yè)最終會(huì)于用戶(hù)終端顯示,簡(jiǎn)潔易用也是非常重要的設(shè)計(jì)原則,讓美的頁(yè)面建立在易用的基礎(chǔ)上,在整個(gè)設(shè)計(jì)過(guò)程中都要始終貫穿這種思想。
網(wǎng)頁(yè)設(shè)計(jì)師根據(jù)網(wǎng)站定位的需求,重視用戶(hù)體驗(yàn),并將獨(dú)特的設(shè)計(jì)思維融合到網(wǎng)頁(yè)設(shè)計(jì)中去才能做出最優(yōu)異的網(wǎng)頁(yè)設(shè)計(jì)。藝術(shù)專(zhuān)業(yè)的學(xué)生應(yīng)充分發(fā)揮自己的設(shè)計(jì)優(yōu)勢(shì),將技術(shù)與藝術(shù)緊密結(jié)合,使設(shè)計(jì)制作出來(lái)的網(wǎng)頁(yè)達(dá)到實(shí)用性和審美性的高度統(tǒng)一。
3 根據(jù)市場(chǎng)的需求充實(shí)網(wǎng)頁(yè)設(shè)計(jì)課程教學(xué)內(nèi)容
藝術(shù)設(shè)計(jì)專(zhuān)業(yè)培養(yǎng)的網(wǎng)頁(yè)設(shè)計(jì)師主要涉及網(wǎng)頁(yè)前端架構(gòu),如網(wǎng)站的整體風(fēng)格規(guī)劃及版式設(shè)計(jì)、界面設(shè)計(jì)等,這些都屬于網(wǎng)站開(kāi)發(fā)流程中視覺(jué)設(shè)計(jì)的范疇。作為整個(gè)開(kāi)發(fā)團(tuán)隊(duì)的一員,網(wǎng)頁(yè)設(shè)計(jì)師不僅要?jiǎng)偃吻岸嗽O(shè)計(jì),還要與站點(diǎn)開(kāi)發(fā)人員合作密切,熟悉網(wǎng)站后臺(tái)的管理;不僅要精通靜態(tài)Html(Xhtml)語(yǔ)言與CSS,還要了解各種動(dòng)態(tài)網(wǎng)站架構(gòu)語(yǔ)言如ASP、PHP、JSP、CGI等;除了能勝任網(wǎng)站的規(guī)劃與設(shè)計(jì),還要掌握網(wǎng)站建設(shè)相關(guān)方面的知識(shí)如服務(wù)器與虛擬主機(jī)的管理與維護(hù)、域名的注冊(cè)與解析、網(wǎng)站備案、SEO搜索引擎優(yōu)化等。除此以外,網(wǎng)頁(yè)設(shè)計(jì)師還能借助各類(lèi)CMS(網(wǎng)站內(nèi)容管理系統(tǒng))構(gòu)建各種功能性的網(wǎng)站、論壇及博客系統(tǒng)。
競(jìng)爭(zhēng)所需使越來(lái)越多的公司和企業(yè)開(kāi)始開(kāi)拓網(wǎng)絡(luò)市場(chǎng),樹(shù)立其在互聯(lián)網(wǎng)上的良好形象。市場(chǎng)的多元化發(fā)展趨勢(shì)也對(duì)網(wǎng)頁(yè)設(shè)計(jì)師的素質(zhì)提出了更高的要求,不僅要精通專(zhuān)業(yè)技能,還要眼光敏銳及時(shí)把握網(wǎng)頁(yè)設(shè)計(jì)相關(guān)領(lǐng)域的最新動(dòng)向。這就要求網(wǎng)頁(yè)設(shè)計(jì)課程教學(xué)在講授理論知識(shí)與操作技能的同時(shí),還需重視實(shí)踐教學(xué)的重要性,從多方面拓寬學(xué)生的知識(shí)層面。
4 根據(jù)教學(xué)目標(biāo)及內(nèi)容調(diào)整教學(xué)方法
在傳統(tǒng)網(wǎng)頁(yè)設(shè)計(jì)教學(xué)中,一般沿用以教材為中心,教師課堂理論陳述及操作演示的教學(xué)模式,缺乏實(shí)踐性,無(wú)法達(dá)到課程教學(xué)目標(biāo)。因此,要充分利用多媒體教學(xué)環(huán)境,發(fā)揮教師在教學(xué)中的主導(dǎo)作用和學(xué)生在學(xué)習(xí)過(guò)程中的主體作用,采用適當(dāng)?shù)慕虒W(xué)方法激發(fā)學(xué)生學(xué)習(xí)興趣。
4.1 改進(jìn)實(shí)踐教學(xué),鍛煉學(xué)生獨(dú)立創(chuàng)作的能力
在實(shí)踐教學(xué)中,根據(jù)教學(xué)目的和教學(xué)內(nèi)容選用典型案例,通過(guò)對(duì)網(wǎng)頁(yè)設(shè)計(jì)案例的分析講授其中所應(yīng)用到的理論知識(shí),在學(xué)生理解基本理論知識(shí)的基礎(chǔ)上再演示案例,使學(xué)生進(jìn)一步熟悉相關(guān)理論知識(shí)的應(yīng)用及實(shí)際操作,有助于培養(yǎng)學(xué)生分析問(wèn)題、解決問(wèn)題的能力。同時(shí),教師可以從威客網(wǎng)上搜集一些商業(yè)設(shè)計(jì)項(xiàng)目作為實(shí)訓(xùn)內(nèi)容,讓教學(xué)目標(biāo)更加貼近市場(chǎng)的真實(shí)需求,提高學(xué)生學(xué)習(xí)的主動(dòng)性和積極性。另外,還可以定期舉辦網(wǎng)頁(yè)設(shè)計(jì)大賽,組織學(xué)生和專(zhuān)業(yè)教師進(jìn)行評(píng)選,并將優(yōu)秀參賽作品放在網(wǎng)站上作為教學(xué)成果展示,這些活動(dòng)不僅能調(diào)動(dòng)學(xué)生的學(xué)習(xí)興趣,也極大地豐富了學(xué)生的學(xué)習(xí)生活。
4.2 借助網(wǎng)絡(luò)技術(shù)實(shí)現(xiàn)教學(xué)互動(dòng),完善教學(xué)手段
在實(shí)際教學(xué)中,不是所有學(xué)生都能及時(shí)掌握教師課堂上所講的內(nèi)容,還需在課后對(duì)相關(guān)知識(shí)點(diǎn)進(jìn)行復(fù)習(xí)鞏固,網(wǎng)頁(yè)設(shè)計(jì)課程本身的特點(diǎn)也決定了可以充分發(fā)揮網(wǎng)絡(luò)資源的巨大優(yōu)勢(shì)。教師可以開(kāi)設(shè)個(gè)人教學(xué)網(wǎng)站,將課件及相應(yīng)的學(xué)習(xí)資料放到網(wǎng)站上供學(xué)生訪(fǎng)問(wèn)下載,同步與更新各種學(xué)習(xí)相關(guān)信息,學(xué)生也能通過(guò)在線(xiàn)留言板和學(xué)習(xí)論壇與同學(xué)或老師相互討論,解決問(wèn)題,教師則可以根據(jù)反饋信息及時(shí)調(diào)整教學(xué)內(nèi)容。
4.3 理論與操作相結(jié)合,綜合全面評(píng)價(jià)學(xué)生
考核是檢測(cè)教與學(xué)的重要手段,也是教學(xué)中一個(gè)重要環(huán)節(jié)。一個(gè)好的考核方式不僅能全面真實(shí)地反映學(xué)生的學(xué)習(xí)水平,還能反映出教學(xué)中存在的問(wèn)題。除了必要的理論知識(shí)考核,可以布置一個(gè)項(xiàng)目設(shè)計(jì)任務(wù)作為課程實(shí)踐部分的考核內(nèi)容,比如讓學(xué)生設(shè)計(jì)制作自己的個(gè)人網(wǎng)站。先對(duì)個(gè)人網(wǎng)站的設(shè)計(jì)做總體規(guī)劃,列出設(shè)計(jì)方案,由教師審閱并給予修改建議后再完善方案并實(shí)施,在設(shè)計(jì)過(guò)程中教師要關(guān)注進(jìn)度并及時(shí)指出設(shè)計(jì)中的不足之處讓學(xué)生解決。這種考核方式既強(qiáng)調(diào)了實(shí)踐性教學(xué),又培養(yǎng)了學(xué)生自己獨(dú)立完成網(wǎng)站設(shè)計(jì)和制作的能力。
互聯(lián)網(wǎng)作為一種新興的數(shù)字媒體發(fā)展迅速,網(wǎng)頁(yè)設(shè)計(jì)也成為視覺(jué)設(shè)計(jì)師最為關(guān)注的新領(lǐng)域之一。藝術(shù)專(zhuān)業(yè)的網(wǎng)頁(yè)設(shè)計(jì)課程教學(xué)不僅要體現(xiàn)時(shí)代性,還要富于創(chuàng)造性,具備前瞻性。教師必須緊密關(guān)注網(wǎng)頁(yè)發(fā)展動(dòng)向,隨市場(chǎng)和時(shí)代的發(fā)展趨勢(shì)改進(jìn)教學(xué)內(nèi)容和教學(xué)方法,才能培養(yǎng)出適應(yīng)市場(chǎng)需求的高素質(zhì)設(shè)計(jì)人才。
參考文獻(xiàn)
[1]張偉娜.《網(wǎng)頁(yè)設(shè)計(jì)與制作》課程教學(xué)的探討與實(shí)踐[J].中國(guó)教育信息化?高教職教,2008(2).
[2]張麗香.高校《網(wǎng)頁(yè)設(shè)計(jì)》課程教學(xué)探討[J].大眾科技,2008(5):104-150.
關(guān)鍵詞:“職業(yè)崗位定位”,“工作過(guò)程”,職業(yè)教育,網(wǎng)頁(yè)設(shè)計(jì)
1引言
近年來(lái),我國(guó)高等職業(yè)教育取得了令人注目的成績(jī)。但是,在高等職業(yè)教育領(lǐng)域仍然有一些問(wèn)題沒(méi)有得到很好的解決,其中之一就是高等職業(yè)教育人才培養(yǎng)效果與市場(chǎng)需求之間存在偏差。也就是我們高職學(xué)校培養(yǎng)的人才定位與企業(yè)需求人才崗位定位之間存在差異。高等職業(yè)技術(shù)學(xué)校的計(jì)算機(jī)專(zhuān)業(yè)主要是培養(yǎng)計(jì)算機(jī)技術(shù)應(yīng)用型人才,重點(diǎn)是培養(yǎng)動(dòng)手能力和解決問(wèn)題的能力,學(xué)生參加工作后,能很快根據(jù)自己的定位進(jìn)入角色。本文正是基于這一理念,提出了以“工作過(guò)程”為導(dǎo)向,面向“職業(yè)崗位定位”的教學(xué)模式,將企業(yè)人才崗位定位引入到課程職業(yè)定位中,將企業(yè)項(xiàng)目開(kāi)發(fā)過(guò)程貫穿于整個(gè)教學(xué)過(guò)程中,并將企業(yè)人員角色進(jìn)入教學(xué)環(huán)節(jié)中,同時(shí)采用“項(xiàng)目導(dǎo)入、任務(wù)驅(qū)動(dòng)”的教學(xué)法。并將其實(shí)施于網(wǎng)頁(yè)設(shè)計(jì)與制作課程的教學(xué)過(guò)程中,得到了很好的效果。
2.基于“工作過(guò)程”面向“職業(yè)崗位定位”的教學(xué)模式
基于“工作過(guò)程”面向“職業(yè)崗位定位”的教學(xué)模式是一種培養(yǎng)技術(shù)應(yīng)用能力和綜合應(yīng)用所學(xué)理論知識(shí)解決實(shí)際問(wèn)題的新模式。能夠使得學(xué)生在一個(gè)仿真的職業(yè)環(huán)境中,為學(xué)生提供不同的工作崗位,使得不同性格,不同學(xué)習(xí)進(jìn)度,不同興趣愛(ài)好的學(xué)生都能找到自己的位置。讓學(xué)生在畢業(yè)之前就能明確自己的職業(yè)崗位定位,并且學(xué)生可以充分了解企業(yè)中的業(yè)務(wù)流程,真正認(rèn)識(shí)自己,為自己在今后的工作中進(jìn)行進(jìn)一步定位,在社會(huì)上找到真正適合自己的工作,在工作中能很快適應(yīng)工作環(huán)境和工作方式。
2.1網(wǎng)頁(yè)設(shè)計(jì)課程的崗位職業(yè)定位
通過(guò)“中山人才網(wǎng)”、“前程無(wú)憂(yōu)”、“中華英才”、“智聯(lián)招聘”等專(zhuān)業(yè)招聘網(wǎng)站對(duì)北京、上海、廣州、深圳、中山、珠海等大中型城市的人才招聘信息進(jìn)行分析,并對(duì)1萬(wàn)多份相關(guān)職業(yè)崗位的招聘信息進(jìn)行統(tǒng)計(jì),確定本課程職業(yè)崗位。與高職“網(wǎng)頁(yè)設(shè)計(jì)”課程相關(guān)的職業(yè)崗位主要有:網(wǎng)頁(yè)設(shè)計(jì)與制作、網(wǎng)頁(yè)美工、網(wǎng)頁(yè)制作、網(wǎng)站管理、界面設(shè)計(jì)、網(wǎng)頁(yè)編輯、網(wǎng)站運(yùn)營(yíng)、搜索引擎優(yōu)化,如下圖1所示。
圖1 相關(guān)職業(yè)崗位分析圖
將技能要求相似的崗位進(jìn)行合并,主要崗位有:網(wǎng)頁(yè)設(shè)計(jì)與制作、網(wǎng)頁(yè)美工、網(wǎng)站管理、網(wǎng)頁(yè)編輯、網(wǎng)站運(yùn)營(yíng)。因此,通過(guò)對(duì)職業(yè)崗位的分析,對(duì)于《網(wǎng)頁(yè)設(shè)計(jì)》這門(mén)課程來(lái)說(shuō),主要面向的崗位是:網(wǎng)頁(yè)設(shè)計(jì)與制作員、網(wǎng)站管理員、網(wǎng)站編輯員。
3基于“工作過(guò)程”面向“職業(yè)崗位定位” 教學(xué)環(huán)節(jié)
基于“工作過(guò)程”面向“職業(yè)崗位定位”的教學(xué)環(huán)節(jié)是將企業(yè)的經(jīng)營(yíng)理念、企業(yè)項(xiàng)目開(kāi)發(fā)過(guò)程和企業(yè)內(nèi)部的人員崗位定位引入到傳統(tǒng)實(shí)驗(yàn)教學(xué)環(huán)節(jié)中。這對(duì)傳統(tǒng)的實(shí)驗(yàn)教學(xué)環(huán)節(jié)起到了很好的補(bǔ)充作用。“項(xiàng)目導(dǎo)入、任務(wù)驅(qū)動(dòng)”的教學(xué)法是培養(yǎng)學(xué)生的基礎(chǔ)知識(shí)運(yùn)用,而基于“工作過(guò)程”面向“職業(yè)崗位定位”的教學(xué)模式是培養(yǎng)學(xué)生的綜合知識(shí)的運(yùn)用,并且模擬企業(yè)提供了許多不同的工作崗位,為不同個(gè)性的學(xué)生提供了更多的自我發(fā)展和培養(yǎng)機(jī)會(huì),在這個(gè)真實(shí)的環(huán)境中,學(xué)生能了解企業(yè)中都需要哪些工作崗位,自己適合那種工作,為自己的將來(lái)定下目標(biāo),而且通過(guò)對(duì)“崗位定位”教學(xué)模式的實(shí)施,學(xué)生在畢業(yè)時(shí)基本上已經(jīng)對(duì)網(wǎng)站開(kāi)發(fā)流程有了基本的認(rèn)識(shí),這樣能更好的適應(yīng)企業(yè)的取藥,學(xué)生能更好的融入工作角色中。
4網(wǎng)頁(yè)設(shè)計(jì)課程教學(xué)環(huán)節(jié)實(shí)施
4.1 職業(yè)崗位定位
網(wǎng)頁(yè)設(shè)計(jì)課程是以“項(xiàng)目導(dǎo)入、任務(wù)驅(qū)動(dòng)”的教學(xué)方法來(lái)培養(yǎng)學(xué)生的基礎(chǔ)知識(shí)運(yùn)用。教師所設(shè)計(jì)的項(xiàng)目,應(yīng)將培養(yǎng)學(xué)生的職業(yè)能力作為出發(fā)點(diǎn),聯(lián)系市場(chǎng)發(fā)展,從企業(yè)需要出發(fā),以實(shí)際項(xiàng)目開(kāi)發(fā)流程來(lái)確立課程的知識(shí)體系,使知識(shí)體系結(jié)構(gòu)中的各個(gè)知識(shí)模塊包含學(xué)生應(yīng)掌握的能力素質(zhì)。選取的項(xiàng)目要有一定的應(yīng)用價(jià)值,可以直接從企業(yè)中獲取真實(shí)項(xiàng)目,也可由教師根據(jù)教學(xué)需要,精心設(shè)計(jì)有市場(chǎng)適應(yīng)性的項(xiàng)目。因此對(duì)于職業(yè)崗位定位模擬公司的內(nèi)部結(jié)果,下面圖2是模擬公司的人事結(jié)構(gòu)圖:
圖2公司的人事結(jié)構(gòu)圖
對(duì)于網(wǎng)頁(yè)制作部這塊,主要有部門(mén)經(jīng)理、項(xiàng)目經(jīng)理、網(wǎng)頁(yè)制作人員。。網(wǎng)頁(yè)制作部的經(jīng)理負(fù)責(zé)管理網(wǎng)頁(yè)制作部門(mén)的各項(xiàng)工作,宏觀控制各網(wǎng)頁(yè)項(xiàng)目的完成情況。項(xiàng)目經(jīng)理負(fù)責(zé)根據(jù)項(xiàng)目的客戶(hù)需求,書(shū)寫(xiě)概要設(shè)計(jì)和詳細(xì)設(shè)計(jì);負(fù)責(zé)開(kāi)發(fā)、測(cè)試、及驗(yàn)收的全過(guò)程;負(fù)責(zé)項(xiàng)目成員的管理以及項(xiàng)目組之間的協(xié)調(diào)和技術(shù)交流。網(wǎng)頁(yè)制作人員負(fù)責(zé)按照項(xiàng)目經(jīng)理的工作分配,根據(jù)詳細(xì)設(shè)計(jì)編寫(xiě)代碼和開(kāi)發(fā)數(shù)據(jù)庫(kù),并對(duì)程序進(jìn)行初步測(cè)試。。
教學(xué)正式開(kāi)始之前,先對(duì)學(xué)生分組,一般4 - 6人一組,盡量使每一組學(xué)生的能力都比較均衡,并選定一個(gè)項(xiàng)目經(jīng)理(在本教學(xué)中也叫項(xiàng)目組長(zhǎng))負(fù)責(zé)每個(gè)小組的工作。
4.2 基于工作過(guò)程教學(xué)環(huán)節(jié)的實(shí)施
4.2.1項(xiàng)目的確立
項(xiàng)目教學(xué)的關(guān)鍵在于項(xiàng)目的選取。一個(gè)項(xiàng)目的選取好壞直接影響到項(xiàng)目教學(xué)法實(shí)施后是否能取得較好的結(jié)果。好的項(xiàng)目不但鍛煉了學(xué)生的學(xué)習(xí)和動(dòng)手能力,還可以激發(fā)學(xué)生的學(xué)習(xí)興趣,讓學(xué)生在完成任務(wù)之后能獲得成就感。因此,要選擇切實(shí)可行并且是學(xué)生感興趣的項(xiàng)目。
本教學(xué)環(huán)節(jié)一般是以小組為單位,走進(jìn)社會(huì)進(jìn)行網(wǎng)站需求調(diào)查,在小組通過(guò)調(diào)查、討論之后,確定具體項(xiàng)目。這時(shí)教師根據(jù)學(xué)生的實(shí)際水平和網(wǎng)站的難易、典型性給出指導(dǎo)性意見(jiàn),選擇合適的網(wǎng)站主題并指導(dǎo)學(xué)生寫(xiě)出詳細(xì)的內(nèi)容策劃書(shū)。在隨后的課堂活動(dòng)中,各個(gè)小組總結(jié)并由組長(zhǎng)介紹本小組的網(wǎng)站項(xiàng)目,在全班開(kāi)展交流討論,由其他同學(xué)提出意見(jiàn)。最后確定網(wǎng)站的具體項(xiàng)目?jī)?nèi)容。讓學(xué)生以小組為單位開(kāi)發(fā)設(shè)計(jì)網(wǎng)站的主題、類(lèi)型、風(fēng)格,具體的計(jì)劃、設(shè)計(jì)等工作都由學(xué)生自主完成。。
4.2.2項(xiàng)目的開(kāi)發(fā)
要完成一個(gè)項(xiàng)目,即完成一個(gè)網(wǎng)站的建設(shè),必須制定項(xiàng)目計(jì)劃,有特定的工作流程,只要按照這個(gè)步驟,才能設(shè)計(jì)出滿(mǎn)意的網(wǎng)站。項(xiàng)目計(jì)劃如圖3:
圖3 項(xiàng)目計(jì)劃
圖3不僅是一個(gè)網(wǎng)站的開(kāi)發(fā)基本流程,還是一個(gè)課程體系結(jié)構(gòu)圖。
對(duì)于網(wǎng)站的開(kāi)發(fā)基本流程是:確定網(wǎng)站的主題、收集資料、規(guī)劃網(wǎng)站、選擇工具、制作網(wǎng)頁(yè)、上傳測(cè)試、推廣宣傳。
對(duì)于課程體系結(jié)構(gòu):以項(xiàng)目開(kāi)發(fā)流程為出發(fā)點(diǎn),將該課程分成網(wǎng)站策劃、網(wǎng)站規(guī)劃、網(wǎng)頁(yè)風(fēng)格設(shè)計(jì)、網(wǎng)頁(yè)制作、網(wǎng)站測(cè)試和網(wǎng)站上傳與更新維護(hù)等六個(gè)知識(shí)模塊,每一個(gè)小的模塊項(xiàng)目又具體細(xì)化為一個(gè)個(gè)小的任務(wù)。每個(gè)任務(wù)根據(jù)教學(xué)的實(shí)際情況可以再細(xì)化。
4.2.3 項(xiàng)目考核評(píng)價(jià)
項(xiàng)目的考核、評(píng)價(jià)在教學(xué)過(guò)程中也是非常重要的一個(gè)部分,對(duì)提高學(xué)生的開(kāi)發(fā)能力有很大的幫助。本方法采取的評(píng)價(jià)方式有:
①小組團(tuán)隊(duì)自評(píng)
學(xué)生完成一個(gè)任務(wù)后,每個(gè)小組都要展示他們的成果,并由項(xiàng)目經(jīng)理對(duì)他們?nèi)蝿?wù)的完成情況進(jìn)行總結(jié)和評(píng)價(jià)。
②學(xué)生互評(píng)
其他同學(xué)也可以對(duì)該小組的開(kāi)發(fā)提出問(wèn)題或發(fā)表看法意見(jiàn),營(yíng)造各抒己見(jiàn)、相互學(xué)習(xí)的氛圍。
③教師總評(píng)
最后,教師對(duì)各小組的成果做綜合評(píng)價(jià)。教師的評(píng)價(jià)既要注意對(duì)技能和成果進(jìn)行評(píng)價(jià),也要對(duì)學(xué)生的態(tài)度和方法進(jìn)行評(píng)價(jià)。既要肯定學(xué)生的成績(jī)和進(jìn)步,也要根據(jù)各小組的特點(diǎn)提出存在的問(wèn)題,幫助他們進(jìn)一步提高。此外,教師還要推薦優(yōu)秀的學(xué)生參加能力鑒定考試,取得相應(yīng)的證書(shū)。
本文應(yīng)用于網(wǎng)頁(yè)設(shè)計(jì)課程項(xiàng)目的考核評(píng)價(jià)模式結(jié)構(gòu)圖,如圖4所示。
圖4 項(xiàng)目與任務(wù)的實(shí)施與評(píng)價(jià)的模式結(jié)構(gòu)圖
5 總結(jié)
本文提出了基于“工作過(guò)程”面向“職業(yè)崗位定位”的教學(xué)模式,并將它應(yīng)用于網(wǎng)頁(yè)設(shè)計(jì)課程中,它使學(xué)生置于一種模擬環(huán)境中,呈現(xiàn)給學(xué)生具有挑戰(zhàn)性、真實(shí)性、復(fù)雜性的問(wèn)題。本文的特色在于在人才培養(yǎng)過(guò)程中將企業(yè)人才崗位定位引入到課程職業(yè)定位中,將企業(yè)項(xiàng)目開(kāi)發(fā)過(guò)程貫穿于整個(gè)教學(xué)過(guò)程中,在教學(xué)環(huán)節(jié)中,模擬公司內(nèi)部的結(jié)構(gòu)和運(yùn)作模式,是學(xué)生熟悉公司項(xiàng)目開(kāi)發(fā)的流程和人員定位,增強(qiáng)了項(xiàng)目開(kāi)發(fā)的實(shí)踐經(jīng)驗(yàn),同時(shí)與就業(yè)零距離。
參考文獻(xiàn):
[1] 梁瑞玲.任務(wù)驅(qū)動(dòng)法在《網(wǎng)頁(yè)制作》課程中的應(yīng)用實(shí)踐[J].教育信息技術(shù).2007年09期.
[2] 史瑞芳.”網(wǎng)頁(yè)設(shè)計(jì)與制作課程中項(xiàng)目教學(xué)法的引用[J].山西經(jīng)濟(jì)管理干部學(xué)院學(xué)報(bào).2008年04期.
[3] 余平.項(xiàng)目驅(qū)動(dòng)在網(wǎng)頁(yè)設(shè)計(jì)實(shí)踐教學(xué)中的應(yīng)用[J].實(shí)驗(yàn)室科學(xué).2007年05期.
關(guān)鍵詞:網(wǎng)頁(yè)設(shè)計(jì);視覺(jué)美感;審美價(jià)值 一、網(wǎng)頁(yè)設(shè)計(jì)美的標(biāo)準(zhǔn)
對(duì)于美,每個(gè)人都有不同的標(biāo)準(zhǔn),但是我們衡量一個(gè)事物的美丑不能只看外表。比如,一個(gè)真正美的人不單單是指外貌美,更重要的是指心靈美。網(wǎng)頁(yè)設(shè)計(jì)亦是同樣的道理,那么怎樣評(píng)價(jià)一個(gè)網(wǎng)頁(yè)的美丑呢?
從審美性上講,一個(gè)優(yōu)美的網(wǎng)頁(yè)首先要有好看的界面設(shè)計(jì),網(wǎng)頁(yè)屬于瞬間藝術(shù),當(dāng)瀏覽網(wǎng)頁(yè)的時(shí)候?yàn)g覽者首先看到的是網(wǎng)頁(yè)的界面設(shè)計(jì),因此網(wǎng)頁(yè)的 “外貌”首先要吸引人的注意,使人們看著舒服,看著美。同時(shí)現(xiàn)階段人們隨著人們對(duì)網(wǎng)頁(yè)設(shè)計(jì)重視程度的加大,設(shè)計(jì)師逐漸將字體設(shè)計(jì)、版式設(shè)計(jì)以及配色藝術(shù)等多種視覺(jué)語(yǔ)言應(yīng)用于網(wǎng)頁(yè)設(shè)計(jì),使網(wǎng)頁(yè)的界面設(shè)計(jì)更加美觀。另外從功能性上講,一個(gè)美的網(wǎng)頁(yè)設(shè)計(jì)首先在功能上利于人們的閱讀,具有科學(xué)的、合理的、符合人體工程學(xué)的視覺(jué)流程,能夠使用戶(hù)能夠輕而易舉的獲取信息。新的科學(xué)技術(shù)、新的計(jì)算機(jī)編程語(yǔ)言相繼被應(yīng)用于網(wǎng)頁(yè)設(shè)計(jì)中,使網(wǎng)頁(yè)設(shè)計(jì)的交互性不斷加強(qiáng),人們?cè)讷@取信息的同時(shí)也能夠感受到人機(jī)互動(dòng)帶來(lái)的觸覺(jué)、視覺(jué)雙重感受,增加了網(wǎng)頁(yè)設(shè)計(jì)的趣味性。
通過(guò)以上可以看出,美的網(wǎng)頁(yè)設(shè)計(jì)不僅在形式外觀上要能夠取悅?cè)诵模诠δ苌线€能準(zhǔn)確有效的傳播信息。因此只有兼?zhèn)渫庠谛问矫琅c內(nèi)在功能性的網(wǎng)頁(yè)才能稱(chēng)之為美的網(wǎng)頁(yè)設(shè)計(jì)。
二、網(wǎng)頁(yè)設(shè)計(jì)面臨的問(wèn)題
通過(guò)實(shí)踐與教學(xué)在具體網(wǎng)頁(yè)設(shè)計(jì)過(guò)程中經(jīng)常遇到的問(wèn)題大體可以分成兩大類(lèi):
(一)視覺(jué)引導(dǎo)性弱。造成這樣問(wèn)題的主要原因是頁(yè)面內(nèi)容的失控,沒(méi)有分清主次,想要傳遞的內(nèi)容太多太龐雜,沒(méi)有處理好信息之間的關(guān)系從而造成了大量文字、圖片等構(gòu)成元素的堆積,而忽略了整體條理性。同時(shí)沒(méi)有設(shè)計(jì)章法與秩序?qū)λ鼈冞M(jìn)行約束,導(dǎo)致頁(yè)面的布局的混亂,從而影響瀏覽者的閱讀。
(二)設(shè)計(jì)細(xì)節(jié)。第一種是只顧及內(nèi)心感受,只憑自己的感覺(jué)設(shè)計(jì),缺少理性思考,沒(méi)有細(xì)節(jié)處理。無(wú)論是圖片質(zhì)量、字號(hào)字體還是顏色搭配,處處都能體現(xiàn)出網(wǎng)頁(yè)設(shè)計(jì)的細(xì)節(jié)問(wèn)題。第二種,過(guò)于在乎細(xì)節(jié),將細(xì)節(jié)當(dāng)成主要設(shè)計(jì)元素盡享處理,喧賓奪主,忽視了基本功能,這些過(guò)多的細(xì)節(jié)裝飾打破了頁(yè)面整體布局的統(tǒng)一性。
在網(wǎng)頁(yè)設(shè)計(jì)中,大部分設(shè)計(jì)人員只重視表達(dá)網(wǎng)頁(yè)的表面視覺(jué)效果,而忽略設(shè)計(jì)支撐網(wǎng)頁(yè)的骨骼框架,才使得現(xiàn)如今很多網(wǎng)頁(yè)在設(shè)計(jì)上出現(xiàn)以上問(wèn)題。
三、柵格設(shè)計(jì)
15世紀(jì)法國(guó)的數(shù)學(xué)家尼古拉斯加宗成功將幾何網(wǎng)格與字體設(shè)計(jì)相結(jié)合,這就是柵格設(shè)計(jì)的雛形。之后人們將這中設(shè)計(jì)方法運(yùn)用到平面設(shè)計(jì)中,直到現(xiàn)在柵格設(shè)計(jì)在平面設(shè)計(jì)中仍是一種非常普遍的設(shè)計(jì)方法,而網(wǎng)頁(yè)的柵格是從平面柵格系統(tǒng)中發(fā)展而來(lái)。
在日常生活中我們看的書(shū)籍、雜志、報(bào)紙,很容易發(fā)現(xiàn)它們的內(nèi)容被限制在一定的方格內(nèi),整個(gè)版面具有很強(qiáng)的秩序感,之所以出現(xiàn)這樣的視覺(jué)效果完全是因?yàn)榘婷嬖O(shè)計(jì)時(shí)運(yùn)用了柵格設(shè)計(jì)。柵格設(shè)計(jì)又稱(chēng)柵格設(shè)計(jì)系統(tǒng),它是利用規(guī)則單位矩形來(lái)規(guī)范、約束版面上的內(nèi)容從而起到規(guī)范網(wǎng)頁(yè)內(nèi)容的作用,它可以充分的體現(xiàn)出網(wǎng)頁(yè)設(shè)計(jì)的結(jié)構(gòu)美。
柵格設(shè)計(jì)之所以能夠被廣泛的應(yīng)用是因?yàn)樗軌蚴乖O(shè)計(jì)作品呈現(xiàn)出清晰的脈絡(luò),簡(jiǎn)約的結(jié)構(gòu),同時(shí)也能起到突出中心與重點(diǎn),起到引導(dǎo)視覺(jué)的作用。由此可以看出柵格設(shè)計(jì)能夠在網(wǎng)頁(yè)中起到支持起整個(gè)網(wǎng)頁(yè)頁(yè)面,可以說(shuō)是網(wǎng)頁(yè)頁(yè)面的骨骼,因此我們將柵格設(shè)計(jì)也作為網(wǎng)頁(yè)布局的理論支持。
那么怎樣利用柵格設(shè)計(jì)對(duì)網(wǎng)頁(yè)進(jìn)行布局呢?柵格設(shè)計(jì)具有一定的設(shè)計(jì)方法,大體可以概括為兩種:一種是單元格的加減法,另一種是柵格填補(bǔ)法。
(一)單元格加減法。
顧名思義,就是將網(wǎng)頁(yè)事先做一個(gè)大體布局,而后根據(jù)具體內(nèi)容的需要,對(duì)單元格進(jìn)行相應(yīng)的合并或拆分,從而使網(wǎng)頁(yè)達(dá)到視覺(jué)上的和諧。單元格加減法使柵格設(shè)計(jì)優(yōu)勢(shì)得到充分體現(xiàn),它具有極強(qiáng)的布局靈活性,但是不同的設(shè)計(jì)元素具有不同的組織方法也不相同。
1、單純文字加減法,文字的加減的對(duì)象是文字與頁(yè)面空間,它是在柵格的作用下,運(yùn)用文字對(duì)頁(yè)面進(jìn)行劃分,從而使人們可以輕松的感受到文字的秩序美。柵格的數(shù)量不宜過(guò)多,過(guò)多會(huì)使頁(yè)面元素分散,失去整體感。
對(duì)文字的編排,應(yīng)該考慮視覺(jué)流程的設(shè)定。文字的字號(hào)行距設(shè)置要適中,,同時(shí)文字的排列長(zhǎng)度不易太寬,以方便閱讀為準(zhǔn)。
2、單純圖片加減法,他是根據(jù)柵格進(jìn)行操作,可以是單張的加減,可以是多張的加減。但要切記圖片不要太多太雜,風(fēng)格色調(diào)要統(tǒng)一,還要把握全局,突出核心信息。
3、文字與圖片加減法,當(dāng)文字與圖片共同存在于頁(yè)面中時(shí),要根據(jù)需要有所側(cè)重,視覺(jué)流動(dòng)性要強(qiáng),思路要清晰。文字與圖片的搭配要統(tǒng)一協(xié)調(diào)。另外在圖片的選材上,圖片質(zhì)量好的圖片在網(wǎng)頁(yè)設(shè)計(jì)能夠提升網(wǎng)頁(yè)的審美性。
(二)柵格填補(bǔ)法
柵格填補(bǔ)法就是將我們?cè)O(shè)定好的柵格固定不變,將所需要的內(nèi)容機(jī)械的填充到對(duì)單元格空白區(qū)域。這種方法的優(yōu)點(diǎn)就是能夠直截了當(dāng)?shù)膫鬟f信息,主題更直接更明了;缺點(diǎn)是無(wú)論是文字還是圖片都不宜過(guò)于復(fù)雜,以簡(jiǎn)約為主。
柵格設(shè)計(jì)在網(wǎng)頁(yè)中應(yīng)用的很靈活,在具體網(wǎng)頁(yè)設(shè)計(jì)時(shí)還要根據(jù)具體情況制定柵格設(shè)計(jì)的方案,只有這樣才能使柵格設(shè)計(jì)的靈活性得到完美的發(fā)揮。
柵格設(shè)計(jì)是網(wǎng)頁(yè)設(shè)計(jì)的靈魂,是網(wǎng)頁(yè)設(shè)計(jì)結(jié)構(gòu)美的核心所在,柵格的好壞直接決定了網(wǎng)頁(yè)的優(yōu)劣,那么如何才能設(shè)計(jì)出一些審美性高與設(shè)計(jì)感強(qiáng)的柵格呢?
在藝術(shù)史上,埃舍爾的畫(huà)可以用數(shù)字計(jì)算,巴赫的曲子可以用數(shù)學(xué)公式推導(dǎo),還有柯布西耶的設(shè)計(jì)理念,也融合了幾何學(xué)的創(chuàng)新理念,可以說(shuō)數(shù)字創(chuàng)造了藝術(shù)的奇跡。諾瓦利斯曾說(shuō)過(guò) “數(shù)字是最高的藝術(shù)形式” 當(dāng)設(shè)計(jì)運(yùn)用到數(shù)字或是數(shù)學(xué)的時(shí)候,設(shè)計(jì)的嚴(yán)謹(jǐn)性與邏輯性就隨之出現(xiàn)。柵格設(shè)計(jì)中比較典型的分割方法是黃金分割與根號(hào)矩形,兩者在柵格布局中被普遍認(rèn)為是比較美的比例。
1、自然界中的事物符合1:1.618的為都屬于黃金分割比。黃金分割比是被公認(rèn)為是最和諧,最完美的比例。黃金分割比合理的運(yùn)用到柵格設(shè)計(jì)中能夠構(gòu)建出比較美的網(wǎng)頁(yè)結(jié)構(gòu)框架。
2、根號(hào)矩形是比較特殊的矩形,拿矩形來(lái)講它可以被分成無(wú)限個(gè)等比的小矩形,可以產(chǎn)生大量的分割組合,因此根號(hào)矩形被應(yīng)用的比較多。在網(wǎng)頁(yè)設(shè)計(jì)時(shí)可以格局矩形的分割比進(jìn)行相應(yīng)的柵格設(shè)計(jì)。
以上圖例是對(duì)黃金分割與根號(hào)矩形兩種柵格樣式的具體表現(xiàn)形式,實(shí)際上柵格設(shè)計(jì)的變化相當(dāng)豐富,在具體網(wǎng)頁(yè)設(shè)計(jì)中我們可以根據(jù)以上的兩種樣式為變化基礎(chǔ),對(duì)柵格設(shè)計(jì)進(jìn)行相應(yīng)變化設(shè)計(jì)。在網(wǎng)頁(yè)設(shè)計(jì)中合理的運(yùn)用柵格設(shè)計(jì)能夠襯托出網(wǎng)頁(yè)設(shè)計(jì)的結(jié)構(gòu)美。
“設(shè)計(jì)體現(xiàn)在細(xì)節(jié)上”在網(wǎng)頁(yè)設(shè)計(jì)中,細(xì)節(jié)的設(shè)計(jì)相當(dāng)重要, 通常1像素的線(xiàn),1磅的行距,1點(diǎn)的字號(hào)這些都是設(shè)計(jì)時(shí)需要注意的細(xì)節(jié),都能襯托出網(wǎng)頁(yè)設(shè)計(jì)的美。當(dāng)細(xì)節(jié)被注意后,網(wǎng)頁(yè)設(shè)計(jì)失誤就會(huì)越小,頁(yè)面就會(huì)更精致。
關(guān)鍵詞:網(wǎng)頁(yè)設(shè)計(jì);互聯(lián)網(wǎng)絡(luò);信息傳播;平面設(shè)計(jì)教學(xué)
每一個(gè)時(shí)代都有代表性的發(fā)明作為這個(gè)時(shí)代的象征,像第一次工業(yè)革命,蒸汽機(jī)的發(fā)明,使得那時(shí)成為蒸汽時(shí)代;愛(ài)迪生發(fā)明了電燈從那時(shí)起進(jìn)入了電的時(shí)代,要說(shuō)21世紀(jì),我想應(yīng)該是網(wǎng)絡(luò)的時(shí)代,自從互聯(lián)網(wǎng)的出現(xiàn)使“地球村”的概念更加貼切,可以說(shuō)網(wǎng)絡(luò)拉近了地球上每一個(gè)角落的人。互聯(lián)網(wǎng)代表著一種嶄新的信息交流方式,它使信息的傳播突破了傳統(tǒng)的政治、經(jīng)濟(jì)、地域及文化的阻隔,使信息傳達(dá)的范圍、速度與效率都產(chǎn)生了質(zhì)的飛躍。互聯(lián)網(wǎng)是由成千上萬(wàn)的網(wǎng)站組成,而每個(gè)網(wǎng)站都是由諸多網(wǎng)頁(yè)構(gòu)成,故網(wǎng)頁(yè)是構(gòu)成互聯(lián)網(wǎng)的基本元素。而網(wǎng)頁(yè)設(shè)計(jì)是伴隨著計(jì)算機(jī)互聯(lián)網(wǎng)絡(luò)的產(chǎn)生而形成的平面設(shè)計(jì)新課題,是網(wǎng)頁(yè)設(shè)計(jì)者以所處時(shí)代所能獲取的技術(shù)和藝術(shù)經(jīng)驗(yàn)為基礎(chǔ),依照設(shè)計(jì)目的和要求自覺(jué)地對(duì)網(wǎng)頁(yè)的構(gòu)成元素進(jìn)行藝術(shù)規(guī)劃的創(chuàng)造性思維活動(dòng),必然要成為設(shè)計(jì)藝術(shù)的重要組成部分,并隨著網(wǎng)絡(luò)技術(shù)的發(fā)展而發(fā)展。表面上看,它不過(guò)是關(guān)于網(wǎng)頁(yè)版式編排的技巧與方法,而實(shí)際上,它不僅是一種技能,更是藝術(shù)與技術(shù)的高度統(tǒng)一。設(shè)計(jì)師如何將網(wǎng)絡(luò)與設(shè)計(jì)、技術(shù)與藝術(shù)完美地結(jié)合,是非常值得我們深思和研討的。
一、一騎紅塵妃子笑,誰(shuí)人知是荔枝來(lái)之信息傳播
信息元素可以說(shuō)是網(wǎng)絡(luò)最基本的元素,互聯(lián)網(wǎng)自始至終都起著一個(gè)信息傳播的做用,也是由此而產(chǎn)生的。自從人類(lèi)誕生以來(lái),人類(lèi)社會(huì)至少已經(jīng)經(jīng)歷了四次意義重大的信息傳播革命,每一次信息傳播革命都把人類(lèi)文明推向一個(gè)新的發(fā)展階段。第一次信息傳播革命是語(yǔ)言傳播的誕生。第二次信息傳播革命是文字傳播的誕生。第三次信息傳播革命是印刷傳播的誕生。第四次信息傳播革命是模擬式電子傳播的誕生。
最新的一次信息傳播革命,即正在我們身邊發(fā)生的第五次信息傳播革命,是數(shù)字式電子——網(wǎng)絡(luò)傳播的誕生。網(wǎng)絡(luò)媒體的出現(xiàn),使得傳播者與受眾之間的傳統(tǒng)的相互關(guān)系正面臨巨大的變化。人類(lèi)進(jìn)入了真正的信息時(shí)代。
網(wǎng)頁(yè)設(shè)計(jì)以信息傳達(dá)為目的,而傳達(dá)的最終表現(xiàn)界面則永遠(yuǎn)也脫離不了媒體。媒體與網(wǎng)頁(yè)設(shè)計(jì)之間的關(guān)系是互動(dòng)的,媒體既體現(xiàn)了設(shè)計(jì),又給設(shè)計(jì)帶來(lái)了局限性;設(shè)計(jì)既受制于媒體,又是新媒體產(chǎn)生的動(dòng)力之一。
我們大家所共知的傳媒方式有報(bào)紙、廣播、雜志、電視等等,這些在現(xiàn)代媒體中仍然占主要位置。如果與互聯(lián)系網(wǎng)絡(luò)比較的話(huà),它們這些傳媒方式就顯的相當(dāng)單一。因此它們的先天缺陷也越來(lái)越明顯,所以像這種單一的傳達(dá)方式也使設(shè)計(jì)師受到了一定程度上的限制。人們接受信息的途徑是多方面的。像視覺(jué)、聽(tīng)覺(jué)、觸覺(jué)、嗅覺(jué)、味覺(jué)等一系列感官的綜合使我們更加全面的去了解其他的事物。為了能使信息傳達(dá)的更全面一些,一直在追求完美的設(shè)計(jì)師也在尋找著一個(gè)嶄新的媒體來(lái)表達(dá)完善的設(shè)計(jì)。因此當(dāng)今互聯(lián)網(wǎng)絡(luò)順利的成為新生的、綜合感官的、充滿(mǎn)活力的新媒體,也為設(shè)計(jì)師創(chuàng)造了前所未有的信息傳達(dá)手段與途徑。而且隨著技術(shù)的不斷發(fā)展,它極有可能成為最完善的媒體。這應(yīng)該引起每一個(gè)平面設(shè)計(jì)師的關(guān)注。網(wǎng)絡(luò)的發(fā)展速度和力量是驚人的。
二、橫看成嶺側(cè)成峰之視覺(jué)效果
可以說(shuō)網(wǎng)頁(yè)是通過(guò)視覺(jué)元素來(lái)進(jìn)行信息傳達(dá)的,這里說(shuō)的視覺(jué)元素包括文本、背景、按鈕、圖標(biāo)、圖像、表格、顏色、導(dǎo)航工具、背景音樂(lè)、動(dòng)態(tài)影像等。無(wú)論是文字、圖形、動(dòng)畫(huà),還是視頻,為了使網(wǎng)頁(yè)獲得最大的視覺(jué)傳達(dá)功能,網(wǎng)頁(yè)設(shè)計(jì)者所要考慮的是如何適應(yīng)人們視覺(jué)流向的心理和生理的特點(diǎn)把它們放進(jìn)頁(yè)面這個(gè)“大展示窗口”里。由此確定各種視覺(jué)構(gòu)成元素之間的關(guān)系和秩序。因此,設(shè)計(jì)時(shí)應(yīng)該研究各種視覺(jué)造型元素之間的距離、位置、面積和視覺(jué)流程的問(wèn)題。
從理論說(shuō)起,視覺(jué)流程的形成是由人類(lèi)的視覺(jué)特性所決定的。因?yàn)槿搜郦?dú)特的結(jié)構(gòu),造成只能產(chǎn)生一個(gè)焦點(diǎn),而不能同時(shí)把視線(xiàn)停留在兩處或兩處以上的地方。這樣就使得人們?cè)陂喿x一種信息時(shí),視覺(jué)總有一種自然的流動(dòng)習(xí)慣,先看什么,后看什么,再看什么。視覺(jué)流程往往會(huì)體現(xiàn)出比較明顯的方向感,它無(wú)形中形成一種脈絡(luò),似乎有一條線(xiàn)、一股氣貫穿其中,使整個(gè)版面的運(yùn)動(dòng)趨勢(shì)有一個(gè)主旋律。心理學(xué)的研究表明,在一個(gè)平面上,上半部讓人輕松和自在,下半部則讓人穩(wěn)定和壓抑。同樣,平面的左半部讓人輕松和自在,右半部讓人穩(wěn)定和壓抑。所以平面的視覺(jué)影響力上方強(qiáng)于下方,左側(cè)強(qiáng)于右側(cè)。這樣平面的上部和中上部被稱(chēng)為“最佳視域”,也就是最優(yōu)選的地方。
所以在網(wǎng)頁(yè)設(shè)計(jì)中,重要的信息和標(biāo)題欄通常在這個(gè)位置出現(xiàn)。只要遵循視覺(jué)流程和符合人們認(rèn)識(shí)過(guò)程的心理順序和思維發(fā)展的邏輯順序就可以更為靈活的運(yùn)用。在網(wǎng)頁(yè)設(shè)計(jì)中,靈活而合理地運(yùn)用視覺(jué)流程和最佳視域,組織好自然流暢的視覺(jué)導(dǎo)向,直接影響到傳播者傳達(dá)信息的準(zhǔn)確與有效性。
三、進(jìn)化、發(fā)展之必要
網(wǎng)頁(yè)設(shè)計(jì)這門(mén)學(xué)科是一門(mén)后期新興的設(shè)計(jì)類(lèi)與網(wǎng)絡(luò)方面交叉的學(xué)科,在最近的幾年也隨著網(wǎng)絡(luò)的發(fā)展越來(lái)越受人們的重視,它是以網(wǎng)絡(luò)為載體,把各種各樣不同的信息以最快捷與最方便的模式傳達(dá)給每一位與之相關(guān)的人員,但是單單這種標(biāo)準(zhǔn)是不夠的,人們也對(duì)在觀看各類(lèi)信息的同時(shí)逐步產(chǎn)生了視視美觀的需求。然而每個(gè)人對(duì)美的追求是不盡相同的,網(wǎng)頁(yè)設(shè)計(jì)也是同樣的。因?yàn)橐罅司W(wǎng)頁(yè)不光是把各類(lèi)信息與事物放上去能看就行,這些對(duì)現(xiàn)在的人們已經(jīng)是遠(yuǎn)遠(yuǎn)不夠的了,這時(shí)設(shè)計(jì)師就要考慮如何使受眾能更好更有效率的接收到網(wǎng)頁(yè)上的信息。這方面就需要從審美入手了,如何制作出清晰、整體性效果好的頁(yè)面。使人們?yōu)g覽起來(lái)更方面,心情更舒暢,制作出清晰、整體性好的頁(yè)面。使人瀏覽起來(lái)心情愉快,接收信息也會(huì)更加容易。網(wǎng)頁(yè)設(shè)計(jì)的審美需求是對(duì)平面設(shè)計(jì)美學(xué)的一種繼承和延伸。
我們經(jīng)常所說(shuō)的如變化和統(tǒng)一、條理與反復(fù)、對(duì)比和調(diào)和、均齊與平衡等,對(duì)網(wǎng)頁(yè)中文字、圖形、色彩的設(shè)計(jì)都是十分有效的視覺(jué)規(guī)律。首先,網(wǎng)頁(yè)的內(nèi)容與形式的表現(xiàn)必須統(tǒng)一和具有秩序,形式表現(xiàn)必須服從內(nèi)容要求,網(wǎng)頁(yè)上的各種構(gòu)成要素之間的視覺(jué)流程,能自然而有序地達(dá)到信息訴求的重點(diǎn)位置。在我們把大量的信息塞到網(wǎng)頁(yè)上去的時(shí)候,考慮怎樣把它們以合理統(tǒng)一的方式來(lái)排布,使整體感加強(qiáng)同時(shí)又有變化。怎樣使它們脈絡(luò)清楚又富有清晰的視覺(jué)效果等等。這樣使頁(yè)面更豐富,更有生氣,看起來(lái)就不感到枯燥。其次,突出主題要素,必須在眾多構(gòu)成要素中突出一個(gè)清楚的主體,它應(yīng)盡可能地成為閱讀時(shí)視線(xiàn)流動(dòng)的起點(diǎn)。如果沒(méi)有這個(gè)主體要素,瀏覽者的視線(xiàn)將會(huì)無(wú)所適從,或者導(dǎo)致視線(xiàn)流動(dòng)偏離設(shè)計(jì)的初衷。
四、千里之行始于足下之構(gòu)成效果
文字作為信息傳達(dá)的主要手段目前也是網(wǎng)頁(yè)設(shè)計(jì)的主體,文字是網(wǎng)頁(yè)中必不可少的元素,也是網(wǎng)頁(yè)中的主要信息描述要素,所以網(wǎng)頁(yè)中文字將占據(jù)相當(dāng)大的面積,文字表現(xiàn)的好與壞將影響到整個(gè)網(wǎng)頁(yè)的質(zhì)量。網(wǎng)頁(yè)文字的主要功能是傳達(dá)各種信息,而要達(dá)到這種傳達(dá)的有效性,必須考慮文字編輯的整體效果,能給人以清晰的視覺(jué)印象,避免頁(yè)面繁雜零亂,減去不必要的裝飾變化,使人易認(rèn)、易懂、易讀。不能為造型而編輯,忘記了文字本身是傳達(dá)內(nèi)容和表達(dá)信息的主題。
網(wǎng)頁(yè)文字編排與設(shè)計(jì),重要的一點(diǎn)在于要服從信息內(nèi)容的性質(zhì)及特點(diǎn)的要求,其風(fēng)格要與內(nèi)容特性相吻合,而不是相脫離,更不能相互沖突。如政府網(wǎng)頁(yè)其文字具有莊重和規(guī)范的特質(zhì),字體造型規(guī)整而有序,簡(jiǎn)潔而大方;休閑旅游類(lèi)內(nèi)容網(wǎng)頁(yè),文字編輯應(yīng)具有歡快輕盈的風(fēng)格,字體生動(dòng)活潑,跳躍明快,有鮮明的節(jié)奏感,給人以生機(jī)盎然的感受;有關(guān)歷史文化教育方面的網(wǎng)頁(yè),字體編輯可具有一種蒼勁古樸的意蘊(yùn)、端莊典雅的風(fēng)范或優(yōu)美清新的格調(diào);公司網(wǎng)頁(yè)可根據(jù)行業(yè)性質(zhì)、企業(yè)理念或產(chǎn)品特點(diǎn),追求某種富于活力的字體編排與設(shè)計(jì);個(gè)人主頁(yè)則可結(jié)合個(gè)人的性格特點(diǎn)及追求,別出心裁,給人一種強(qiáng)烈獨(dú)特印象。
在網(wǎng)頁(yè)文字的編排與設(shè)計(jì)中,由于計(jì)算機(jī)給我們提供了大量可供選擇的字體,導(dǎo)致字體的變化趨于多樣化這既為網(wǎng)頁(yè)編輯提供了方便,同時(shí)也對(duì)編排與設(shè)計(jì)的選擇能力提出了考驗(yàn)。雖然可供選擇的字體很多,但在同一網(wǎng)頁(yè)上,使用幾種字體尚需精心編輯和考慮。一般來(lái)講,同一頁(yè)面上使用的字體種類(lèi)最多只能有三四種。由于文本字體的顯示是需要本地硬盤(pán)字體文件的支持的,所以在互聯(lián)網(wǎng)上使用過(guò)多的字體是沒(méi)有意義的。文字在視覺(jué)傳達(dá)中作為頁(yè)面的形象要素之一,除了表意以外,還具有傳達(dá)感情的功能,因而必須具有視覺(jué)上的美感,能給人以美好印象,獲得良好的心理反應(yīng)。
圖片是文字以外最早引入到網(wǎng)絡(luò)中的多媒體對(duì)象。網(wǎng)絡(luò)可以圖文并茂地向用戶(hù)提供信息,成倍地加大了它所提供的信息量。而且圖片的引入也大大美化了網(wǎng)絡(luò)頁(yè)面。可以說(shuō),要使網(wǎng)頁(yè)在純文本基礎(chǔ)上變得更有趣味,最為簡(jiǎn)捷省力的辦法就是使用圖片。對(duì)于一條信息來(lái)說(shuō),圖片對(duì)受眾吸引也遠(yuǎn)遠(yuǎn)超過(guò)單純的文字。
圖片的位置、面積、數(shù)量、形式、方向等直接關(guān)系到網(wǎng)頁(yè)的視覺(jué)傳達(dá)。在圖片的選擇和優(yōu)化的同時(shí),應(yīng)考慮圖片在整體編輯計(jì)劃中的作用,達(dá)到和諧整齊。要達(dá)到這樣的效果,在頁(yè)面圖片的合理選用時(shí),一要注意統(tǒng)一,二要注意悅目,三要注意突出重點(diǎn),特別是在處理和相關(guān)文字編排在一起的圖片時(shí)。
網(wǎng)頁(yè)在一定意義上說(shuō)也是一種藝術(shù)品,因?yàn)樗纫笪淖值膬?yōu)美流暢,又要求頁(yè)面的新穎、整潔,使用色彩可以產(chǎn)生強(qiáng)烈的視覺(jué)效果,使頁(yè)面更加生動(dòng)。而且,瀏覽者在洲覽網(wǎng)頁(yè)時(shí),留下的第一印象就是頁(yè)面的色彩設(shè)計(jì),它的好壞直接影響閱讀者的觀賞興趣。因此,色彩設(shè)計(jì)在網(wǎng)頁(yè)設(shè)計(jì)中居于十分重要的地位。網(wǎng)頁(yè)的色彩設(shè)計(jì)應(yīng)把握以下幾個(gè)方面。
首先是整個(gè)頁(yè)面的色彩選擇,確定一個(gè)主色調(diào),可以有利于體現(xiàn)網(wǎng)站主題。我們現(xiàn)在看到的網(wǎng)頁(yè),一般以淺顏色為背景的居多,如淺灰色、淺黃色、淺藍(lán)色、淺綠色。以淺顏色為底,柔和、素淡,配上深顏色的字,如黑色,讀來(lái)自然、流暢,也有利于突出頁(yè)面的重點(diǎn),有利于整個(gè)頁(yè)面的配色,更容易為大多數(shù)人認(rèn)可和掌握。其他一些次要內(nèi)容,如背景圖片、線(xiàn)條適宜采用不搶眼的顏色,以免喧賓奪主。只有少量精心選擇的元素,為了突出強(qiáng)調(diào)的需要,才采用明亮的色彩,這些彩色亮點(diǎn)就會(huì)產(chǎn)生強(qiáng)烈的視覺(jué)沖擊,但如果用得太多了,就會(huì)形成一種均勻的噪聲,而達(dá)不到強(qiáng)調(diào)的效果。
其次,在背景的色調(diào)搭配上一定要注意不能有強(qiáng)烈的對(duì)比,特別是同時(shí)使用色彩對(duì)立的顏色。大面積顏色適宜采用低比度,因?yàn)檫^(guò)于豐富的背景色彩會(huì)影響前景圖片和文字的取色,嚴(yán)重時(shí)會(huì)使文字溶于背景中,不易辨識(shí)。所以,背景一般應(yīng)以單純?yōu)橐恕H绻枰欢ǖ淖兓栽黾颖尘暗暮穸龋矐?yīng)是在盡量統(tǒng)一的前提下的一種變化。例如在制用標(biāo)題時(shí),為追求醒目的視覺(jué)效果,可用比較深的顏色,配上對(duì)比鮮明的字體。實(shí)際上背景的作用主要在于統(tǒng)一整個(gè)網(wǎng)頁(yè)的風(fēng)格和情調(diào),對(duì)視覺(jué)的主體起到一定的襯托和協(xié)調(diào)作用,一方面吸引網(wǎng)民的注意力,另一方面有助于體現(xiàn)網(wǎng)站的主題。
五、技術(shù)、設(shè)計(jì)之兩手都
網(wǎng)絡(luò)技術(shù)與設(shè)計(jì)創(chuàng)意的緊密結(jié)合,使網(wǎng)頁(yè)的設(shè)計(jì)由平面設(shè)計(jì)擴(kuò)展到立體設(shè)計(jì),由純粹的視覺(jué)藝術(shù)擴(kuò)展到空間聽(tīng)覺(jué)藝術(shù),網(wǎng)頁(yè)效果不再近似于書(shū)籍或報(bào)刊雜志等印刷媒體,而更接近干電影或電視的觀賞效果。技術(shù)發(fā)展促進(jìn)了技術(shù)與設(shè)計(jì)的緊密結(jié)合,把瀏覽者帶入一個(gè)真正現(xiàn)實(shí)中的虛擬世界。技術(shù)與設(shè)計(jì)的緊密結(jié)合在網(wǎng)頁(yè)藝術(shù)設(shè)計(jì)中體現(xiàn)得尤為突出。wWw.gWyoO
個(gè)用來(lái)展現(xiàn)自己的網(wǎng)站作為平臺(tái),其中插畫(huà)也在各類(lèi)網(wǎng)頁(yè)設(shè)計(jì)中被頻繁使用。不同類(lèi)型的網(wǎng)站受眾面不同,門(mén)戶(hù)網(wǎng)站中的用戶(hù)量大,面對(duì)大量的用戶(hù)需要滿(mǎn)足不同的審美需求,網(wǎng)頁(yè)設(shè)計(jì)中的插畫(huà)也需要滿(mǎn)足大眾的審美。
插畫(huà)在網(wǎng)頁(yè)設(shè)計(jì)中的作用
1.插畫(huà)在網(wǎng)頁(yè)設(shè)計(jì)中的效果
插畫(huà)在網(wǎng)頁(yè)環(huán)境中的運(yùn)用必須要與傳統(tǒng)媒介的運(yùn)用有所區(qū)分,為了突出主題和滿(mǎn)足人們的需求,這就要求插畫(huà)設(shè)計(jì)在強(qiáng)調(diào)藝術(shù)性的同時(shí),更應(yīng)該注重通過(guò)獨(dú)特的風(fēng)格和強(qiáng)烈的視覺(jué)沖擊力,讓受眾在審美的過(guò)程中接受和處理所傳達(dá)的信息。這就是網(wǎng)頁(yè)設(shè)計(jì)中插畫(huà)與獨(dú)立插畫(huà)的大區(qū)別,優(yōu)秀的網(wǎng)頁(yè)設(shè)計(jì)插畫(huà)是能更好的表現(xiàn)訴求的插畫(huà),而不一定是從藝術(shù)性角度最好的插畫(huà)。
2.插畫(huà)帶來(lái)的用戶(hù)體驗(yàn)價(jià)值
網(wǎng)站都在講究用戶(hù)體驗(yàn),最重要的是體現(xiàn)在頁(yè)面的設(shè)計(jì)和表達(dá)上,給用戶(hù)的第印象也往往是從視覺(jué)開(kāi)始。插畫(huà)作為一種藝術(shù)的形式可以給網(wǎng)站建設(shè)以視覺(jué)上的填補(bǔ),利用其特性改變網(wǎng)站的形象,給網(wǎng)站增添感染力。例如谷歌,從1998年開(kāi)始嘗試插畫(huà)運(yùn)用到主頁(yè)logo上,自此以后利用插畫(huà)來(lái)裝飾谷歌Logo變成一項(xiàng)傳統(tǒng),重大紀(jì)念日、小游戲以及音樂(lè)元素都被融進(jìn)谷歌的涂鴉中(如圖1),這種插畫(huà)元素的融入不僅僅受到用戶(hù)的喜愛(ài),還使自己的員工感受到公司對(duì)各種創(chuàng)新、創(chuàng)造的支持和鼓勵(lì),他們因此在這樣的氛圍中便能更加積極而無(wú)所顧忌地貢獻(xiàn)他們的創(chuàng)造和想法。這一切的最終受益者還是谷歌,它因而得以這么多年來(lái)都保有源源不竭的創(chuàng)新能力,成為全球最領(lǐng)先的互聯(lián)網(wǎng)公司。
插畫(huà)在網(wǎng)頁(yè)設(shè)計(jì)中的運(yùn)用
1.插畫(huà)使用在網(wǎng)頁(yè)設(shè)計(jì)中的表達(dá)方式
插畫(huà)在整個(gè)網(wǎng)頁(yè)設(shè)計(jì)中的運(yùn)用應(yīng)該和導(dǎo)航系統(tǒng)聯(lián)合起來(lái)共同引導(dǎo)瀏覽老的視覺(jué)流程,因此插畫(huà)的藝術(shù)性在于確保整個(gè)網(wǎng)頁(yè)的個(gè)性化和整體性。設(shè)計(jì)師需要讓瀏覽者在最短的時(shí)間內(nèi)接受到信息與美感的雙重體驗(yàn),滿(mǎn)足人們的實(shí)用和需求。通過(guò)塑造可視的形象來(lái)表現(xiàn)社會(huì)生活和設(shè)計(jì)師情感的藝術(shù)形式。生動(dòng)的視覺(jué)藝術(shù)能夠喚起瀏覽者的審美情緒,從而符合他們獲取信息的心理需求和審美體驗(yàn)上的滿(mǎn)足。
2.不同類(lèi)型的網(wǎng)頁(yè)設(shè)計(jì)中插畫(huà)的使用
插畫(huà)在企業(yè)網(wǎng)站中的運(yùn)用對(duì)于企業(yè)類(lèi)型的網(wǎng)站來(lái)說(shuō),主要訴求便是以用戶(hù)為中心讓網(wǎng)站既美觀又實(shí)用,提高企業(yè)形象,是種以網(wǎng)站的用戶(hù)體驗(yàn)為導(dǎo)向的設(shè)計(jì)。網(wǎng)站通過(guò)設(shè)計(jì)師的藝術(shù)化渲染,讓瀏覽者對(duì)企業(yè)產(chǎn)生好感度,從而激發(fā)瀏覽者的點(diǎn)擊沖動(dòng)。企業(yè)類(lèi)型的網(wǎng)站把插畫(huà)與網(wǎng)頁(yè)設(shè)計(jì)融為一體,轉(zhuǎn)化為生動(dòng)、精彩的網(wǎng)頁(yè)視覺(jué)形象,喚起人們對(duì)網(wǎng)絡(luò)視覺(jué)藝術(shù)的追求與熱愛(ài)。這種對(duì)于網(wǎng)站的喜歡最終會(huì)轉(zhuǎn)化成為點(diǎn)擊率再轉(zhuǎn)化為購(gòu)買(mǎi)率,為企業(yè)獲得收益。通常這類(lèi)網(wǎng)頁(yè)設(shè)計(jì)中插畫(huà)是使用是比較小面積的,起到畫(huà)龍點(diǎn)睛的作用,例如美團(tuán)外賣(mài)的網(wǎng)頁(yè)設(shè)計(jì)(如圖2)插畫(huà)更加讓本來(lái)呆板的網(wǎng)頁(yè)按鈕和分類(lèi)設(shè)置,都變得卡通可愛(ài)。現(xiàn)代插畫(huà)元素在網(wǎng)站中的除了能將信息簡(jiǎn)潔清晰的傳遞給用戶(hù)之外,能夠透過(guò)插畫(huà)看到更深層次的網(wǎng)站內(nèi)涵,通過(guò)欣賞插畫(huà)從而帶用戶(hù)走進(jìn)網(wǎng)站主題,引起對(duì)網(wǎng)站的關(guān)注。
插畫(huà)在個(gè)人網(wǎng)站或小眾風(fēng)格網(wǎng)站中的應(yīng)用對(duì)于個(gè)人網(wǎng)站或者小眾風(fēng)格的網(wǎng)站來(lái)說(shuō),插畫(huà)風(fēng)格成了網(wǎng)頁(yè)設(shè)計(jì)中不可替代的藝術(shù)形式,在設(shè)計(jì)的表現(xiàn)上顯示出獨(dú)特的藝術(shù)魅力,利用插畫(huà)表達(dá)自身獨(dú)特的想法用來(lái)體現(xiàn)與眾不同,從而在各種網(wǎng)站中脫穎而出。這種類(lèi)型的網(wǎng)頁(yè)需要大量的插畫(huà)來(lái)形成風(fēng)格,插畫(huà)在網(wǎng)頁(yè)設(shè)計(jì)中成為主體,插畫(huà)中獨(dú)特的親切、活波、個(gè)性、旋目的感覺(jué)展現(xiàn)出網(wǎng)頁(yè)設(shè)計(jì)的多樣性,插畫(huà)中個(gè)性化的表現(xiàn)技巧貫穿網(wǎng)頁(yè)設(shè)計(jì)中,使得頁(yè)面免于平庸,給瀏覽者帶來(lái)別出心裁、強(qiáng)烈奇特的多元化視覺(jué)印象。
插畫(huà)在移動(dòng)端網(wǎng)頁(yè)設(shè)計(jì)中的應(yīng)用。由于移動(dòng)端設(shè)備具有屏幕較小,使用場(chǎng)景多樣這種特性,插畫(huà)在移動(dòng)端的運(yùn)用和上面兩個(gè)類(lèi)別有著很大的不同。不像web端樣喜歡圖文混排,移動(dòng)端的圖和文字內(nèi)容的界限比較分明,插畫(huà)的形式主要有app啟動(dòng)界面和banner兩種,其中啟動(dòng)界面占很大的比重。啟動(dòng)頁(yè)面多以純插畫(huà)的形式表現(xiàn),在單個(gè)的頁(yè)面當(dāng)中信息不會(huì)過(guò)多,表現(xiàn)個(gè)突出的主題即可,視覺(jué)形式上也會(huì)聚焦在個(gè)主題上。這類(lèi)插畫(huà)通常用來(lái)表現(xiàn)營(yíng)銷(xiāo)文字的內(nèi)容,有的插畫(huà)內(nèi)容是卡通化的應(yīng)用使用場(chǎng)景,還有的沒(méi)有具體的活動(dòng)內(nèi)容,只是用插畫(huà)來(lái)體現(xiàn)應(yīng)用的產(chǎn)品形象和氛圍,用插畫(huà)形式展示自己的態(tài)度。當(dāng)然還有類(lèi)重要的類(lèi)型節(jié)日插畫(huà),每逢節(jié)日或者熱點(diǎn)各個(gè)應(yīng)用軟件搜索引擎都會(huì)有節(jié)日相關(guān)插畫(huà)出現(xiàn),這種插畫(huà)可以大大提升企業(yè)的文化氛圍和形象。
關(guān)鍵詞: 《網(wǎng)頁(yè)設(shè)計(jì)與制作》 教學(xué)研究 教學(xué)探索
一、教學(xué)現(xiàn)狀
1.課程特點(diǎn)。
學(xué)生在先修課程的基礎(chǔ)上,具備一定的網(wǎng)頁(yè)效果圖制作的能力,然后通過(guò)《網(wǎng)頁(yè)設(shè)計(jì)與制作》這門(mén)課的學(xué)習(xí),按照效果圖可制作出網(wǎng)頁(yè)。《網(wǎng)頁(yè)設(shè)計(jì)與制作》的綜合性很強(qiáng),不僅要求學(xué)生有一定的插畫(huà)、動(dòng)畫(huà)制作,以及配色、審美的功底,還要求學(xué)生具有較強(qiáng)的實(shí)踐動(dòng)手能力和代碼編寫(xiě)能力。
2.學(xué)生特點(diǎn)。
《網(wǎng)頁(yè)設(shè)計(jì)與制作》是針對(duì)高職高專(zhuān)軟件技術(shù)專(zhuān)業(yè)、網(wǎng)站建設(shè)與維護(hù)專(zhuān)業(yè)的學(xué)生所開(kāi)設(shè)的,這兩個(gè)專(zhuān)業(yè)學(xué)生共同的特點(diǎn):一是普遍沒(méi)有美術(shù)功底;二是學(xué)生英文基礎(chǔ)薄弱、自律性較差、綜合素質(zhì)有很大的差異性、計(jì)算機(jī)的熟練水平參差不齊。當(dāng)面對(duì)設(shè)計(jì)的網(wǎng)頁(yè)效果圖要求美觀時(shí),學(xué)生因?yàn)槊佬g(shù)功底的缺失,往往達(dá)不到要求;當(dāng)面對(duì)對(duì)英文基礎(chǔ)有一定要求的網(wǎng)頁(yè)中代碼編寫(xiě)內(nèi)容的學(xué)習(xí)時(shí),部分學(xué)生會(huì)有力不從心的感覺(jué),從而導(dǎo)致學(xué)習(xí)興趣的喪失。
3.教師特點(diǎn)。
“名師出高徒”,要教出實(shí)踐能力強(qiáng)的學(xué)生,教師自身的實(shí)踐能力就要強(qiáng)。但現(xiàn)狀不容樂(lè)觀,任教《網(wǎng)頁(yè)設(shè)計(jì)與制作》的專(zhuān)職教師在相關(guān)企業(yè)實(shí)踐過(guò),且具有一定實(shí)踐經(jīng)驗(yàn)的所占的比例并不大,而這門(mén)課程本身對(duì)實(shí)踐操作能力的要求就很高,于是產(chǎn)生了矛盾。雖然有行業(yè)兼職教師來(lái)校教授該門(mén)課程,但因?yàn)檫@門(mén)課不是一蹴而就,而是要通過(guò)循序漸進(jìn)的學(xué)習(xí)才能學(xué)好的,行業(yè)兼職教師所任課的時(shí)間稍顯不足。
4.教學(xué)方法。
高職教育注重學(xué)生實(shí)踐動(dòng)手能力的培養(yǎng),且《網(wǎng)頁(yè)設(shè)計(jì)與制作》這門(mén)課程對(duì)學(xué)生的動(dòng)手能力要求很高。傳統(tǒng)教學(xué)采取“理論+實(shí)踐”的形式,理論指的是在多媒體教室中,教師以講授和演示的方式,把實(shí)踐所涉及的理論知識(shí)傳授給學(xué)生,學(xué)生以聽(tīng)和記筆記為主;實(shí)踐指的是學(xué)生在過(guò)后安排的上機(jī)課中予以實(shí)踐,但理論和實(shí)踐往往沒(méi)有實(shí)現(xiàn)無(wú)縫對(duì)接。
二、教學(xué)探索
1.在實(shí)踐中提高高職高專(zhuān)專(zhuān)職教師的動(dòng)手能力。
針對(duì)提高專(zhuān)職教師的實(shí)踐動(dòng)手能力,提出“實(shí)踐”這個(gè)解決方法。第一,與各大公司企業(yè)加強(qiáng)校企合作,在專(zhuān)職教師休假時(shí)間,特別是在寒暑假這種假期比較長(zhǎng)的時(shí)間里派教師下企業(yè)鍛煉,體驗(yàn)企業(yè)具體所需技能及學(xué)習(xí)新的技術(shù);第二,定期組織行業(yè)專(zhuān)家來(lái)校對(duì)專(zhuān)職教師進(jìn)行交流和指導(dǎo),實(shí)現(xiàn)教師下企業(yè)鍛煉和在校接受培訓(xùn)雙保險(xiǎn)。
2.改進(jìn)教學(xué)模式,引入CDIO教學(xué)模式。
高職教育注重對(duì)學(xué)生實(shí)踐能力的培養(yǎng),改善教學(xué)模式對(duì)學(xué)生實(shí)踐能力的培養(yǎng)顯得尤為重要。CDIO是由MIT等世界著名高校研發(fā)的一整套先進(jìn)的工程教育模式,C(conceive)指的是“構(gòu)思”,D(design)指的是“設(shè)計(jì)”,I(implement)指的是“實(shí)施”,O(operate)指的是“項(xiàng)目分析和展示階段”,該模式可應(yīng)用到《網(wǎng)頁(yè)設(shè)計(jì)與制作》這門(mén)課的教學(xué)中。
(1)“教”在CDIO教學(xué)模式中的體現(xiàn)。教師可借鑒該教學(xué)模式,不再按課本上的具體章節(jié)講解,而是將一整個(gè)網(wǎng)頁(yè)制作項(xiàng)目具體,從如何“構(gòu)思”到如何“設(shè)計(jì)”,再到如何“實(shí)施”,完成后“展示”給學(xué)生欣賞。也可理解為教師引入項(xiàng)目引導(dǎo)式的教學(xué)方法,對(duì)該項(xiàng)目進(jìn)行分階段拆分,通過(guò)完成具體的項(xiàng)目、逐步帶領(lǐng)學(xué)生掌握網(wǎng)頁(yè)設(shè)計(jì)與制作的各種方法。
(2)“學(xué)”在CDIO教學(xué)模式中的體現(xiàn)。該模式要求《網(wǎng)頁(yè)設(shè)計(jì)與制作》這門(mén)課程有三方面的目標(biāo),即知識(shí)目標(biāo)、能力目標(biāo)和素質(zhì)目標(biāo)。為了實(shí)現(xiàn)這門(mén)課程的課程目標(biāo),要求學(xué)生在學(xué)習(xí)網(wǎng)頁(yè)設(shè)計(jì)基本知識(shí)的基礎(chǔ)上自愿分組,每小組確定一個(gè)網(wǎng)頁(yè)的主題,完成至少一個(gè)完整的項(xiàng)目。該項(xiàng)目要求包括表格布局、框架布局、div+CSS布局三種布局方式,以及CSS美化和JavaScript特效一整套,按照CDIO的流程,從構(gòu)思(具體需求)、設(shè)計(jì)、實(shí)施改進(jìn)及展示本團(tuán)隊(duì)設(shè)計(jì)開(kāi)發(fā)的項(xiàng)目對(duì)學(xué)生進(jìn)行訓(xùn)練。學(xué)生在學(xué)習(xí)任務(wù)的驅(qū)動(dòng)下,能自發(fā)地利用課后時(shí)間搜集資料學(xué)習(xí)和實(shí)踐,彌補(bǔ)課程教學(xué)時(shí)間的有限性和教學(xué)范圍的局限性的不足。同時(shí)按照這個(gè)流程走下來(lái),學(xué)生的團(tuán)隊(duì)合作精神也得到鍛煉。在項(xiàng)目的實(shí)施過(guò)程中,學(xué)生難免會(huì)碰到各種難題,這就鍛煉了學(xué)生解決問(wèn)題的能力。
3.加大實(shí)訓(xùn)項(xiàng)目在期末考核中的比重。
傳統(tǒng)考核模式采取平時(shí)成績(jī)30%+期末理論考試70%的比重,現(xiàn)在則提高實(shí)訓(xùn)項(xiàng)目在期末考核中的比重,本著理論夠用、注重實(shí)踐的原則,考核形式采取平時(shí)成績(jī)20%+期末理論考試40%+學(xué)生實(shí)訓(xùn)項(xiàng)目占40%這一考核方式,凸顯理論的不可或缺性和實(shí)踐的重要性。
綜上所述,在《網(wǎng)頁(yè)設(shè)計(jì)與制作》課程教學(xué)中,要注意豐厚學(xué)生理論儲(chǔ)備,提高所需技能和素質(zhì),為學(xué)生的可持續(xù)發(fā)展打下堅(jiān)實(shí)的基礎(chǔ)。
參考文獻(xiàn):
[1]蔣秀姣.CDIO環(huán)境下網(wǎng)頁(yè)設(shè)計(jì)課程教改探討[J].廣西教育C(職業(yè)與高等教育版),2012(10).
[2]王剛.CDIO工程教育模式的解讀與思考[J].中國(guó)高教研究,2009(5).
Flash網(wǎng)頁(yè)設(shè)計(jì)“總分總”的教學(xué)模式
在軟件基礎(chǔ)和線(xiàn)性動(dòng)畫(huà)(Flash廣告設(shè)計(jì))的基礎(chǔ)上,進(jìn)入到課程的主體模塊,即Flash網(wǎng)頁(yè)設(shè)計(jì)。與HTML靜態(tài)網(wǎng)頁(yè)的分頁(yè)面結(jié)構(gòu)不同,F(xiàn)lash網(wǎng)頁(yè)設(shè)計(jì)在集成設(shè)計(jì)開(kāi)發(fā)環(huán)境內(nèi)(Flash軟件和Action腳本)實(shí)現(xiàn)網(wǎng)頁(yè)內(nèi)容與非線(xiàn)性結(jié)構(gòu)的編排,模塊化特性明顯。為此,筆者嘗試采用“基本結(jié)構(gòu)設(shè)計(jì)—模塊分解設(shè)計(jì)、網(wǎng)站整合”三步走的教學(xué)法,可概括為“總—分—總”教學(xué)流程,合理調(diào)配教學(xué)難點(diǎn)和重點(diǎn),循序漸進(jìn),在實(shí)踐中取得了一定的效果。(一)基本結(jié)構(gòu)設(shè)計(jì)首先,從網(wǎng)頁(yè)基本結(jié)構(gòu)入手,利用按鈕對(duì)時(shí)間線(xiàn)上各幀的控制構(gòu)造網(wǎng)站模型,其中包含了最基本的場(chǎng)景轉(zhuǎn)換。在學(xué)習(xí)的后期,可以針對(duì)每幀對(duì)應(yīng)的畫(huà)布進(jìn)行深入設(shè)計(jì),包括內(nèi)容擴(kuò)展和淡入、淡出動(dòng)畫(huà)效果的實(shí)現(xiàn)等。基本結(jié)構(gòu)設(shè)計(jì)涉及每幀對(duì)應(yīng)的畫(huà)布設(shè)計(jì)、按鈕設(shè)計(jì)、元件和實(shí)例的進(jìn)一步應(yīng)用以及補(bǔ)間動(dòng)畫(huà)等內(nèi)容,還涉及一些基礎(chǔ)的Action腳本內(nèi)容,如“stop”“gotoAndStop”“gotoAndPlay”命令以及幀標(biāo)記的參數(shù)調(diào)用等,適合入門(mén)學(xué)習(xí)。在腳本程序編寫(xiě)的最初階段,重點(diǎn)要使學(xué)生理解腳本語(yǔ)言代替人進(jìn)行指令操作的特性,如“去哪”“做什么”等,利用這種指向性的形象思維逐漸強(qiáng)化學(xué)生的編程思維。一般來(lái)說(shuō),靜態(tài)網(wǎng)頁(yè)設(shè)計(jì)課程教學(xué)不會(huì)將Java腳本作為重點(diǎn),在這種情況下,這一階段的Action腳本學(xué)習(xí)就更加重要。(二)具體模塊學(xué)習(xí)由于Flash網(wǎng)頁(yè)多在屏幕的顯示面內(nèi)不翻屏,高度有限,這就需要使用軟件功能和腳本程序創(chuàng)造更多的結(jié)構(gòu)層次去容納網(wǎng)頁(yè)內(nèi)容。除了場(chǎng)景的轉(zhuǎn)換外,在每個(gè)場(chǎng)景之中,還要借助于不同類(lèi)型的頁(yè)面組件來(lái)實(shí)現(xiàn)額外的結(jié)構(gòu)層次。針對(duì)種類(lèi)較多的頁(yè)面組件,可以實(shí)施“分解教學(xué)”,即拋開(kāi)網(wǎng)站設(shè)計(jì)的整體性,單純提煉每個(gè)組件的設(shè)計(jì)與編程要點(diǎn),使每節(jié)課都可以完成一種組件設(shè)計(jì),實(shí)現(xiàn)相關(guān)功能。筆者選擇的頁(yè)面組件包括按鈕組(菜單)、彈出框、下拉菜單、聲音控制模塊和預(yù)加載器等。在設(shè)計(jì)層面,要考慮到各組件與網(wǎng)頁(yè)整體風(fēng)格的一致性;在內(nèi)容層面,要合理地選擇組件類(lèi)型,豐富內(nèi)容層次,便于用戶(hù)訪(fǎng)問(wèn),形成良好的互動(dòng)性。而在Action腳本編寫(xiě)方面,要以典型程序、核心程序?yàn)橹鳎鸩皆黾痈嗟臉邮阶兓?shí)際上,雖然組件類(lèi)型不同,其背后的程序控制大多有著一定的內(nèi)在聯(lián)系,如很多組件都會(huì)用到onEnterFrame頻率控制函數(shù)。隨著教學(xué)的不斷深入,要盡量將腳本教學(xué)系統(tǒng)化,將松散的知識(shí)點(diǎn)整合起來(lái),盡量覆蓋到常用的函數(shù)、方法和命令。(三)網(wǎng)站內(nèi)容搭建經(jīng)過(guò)不同組件的分解學(xué)習(xí),接著補(bǔ)充幾種場(chǎng)景轉(zhuǎn)換的方法,結(jié)合不同設(shè)計(jì)項(xiàng)目中對(duì)組件的選擇,F(xiàn)lash網(wǎng)站就可以搭建起來(lái)。至此,F(xiàn)lash網(wǎng)頁(yè)設(shè)計(jì)的技術(shù)性教學(xué)目標(biāo)就基本完成了。在技術(shù)性教學(xué)目標(biāo)之外,在課程的收官階段,要融入行業(yè)設(shè)計(jì)理念,以提高結(jié)課作業(yè)的質(zhì)量,保證教學(xué)效果。在HTML靜態(tài)網(wǎng)頁(yè)設(shè)計(jì)教學(xué)階段,筆者針對(duì)結(jié)課作業(yè)挑選了“實(shí)用設(shè)計(jì)”這一特定行業(yè)分類(lèi)進(jìn)行教學(xué)強(qiáng)化,避免學(xué)生在結(jié)課階段設(shè)計(jì)得沒(méi)有針對(duì)性,學(xué)無(wú)所用。
靜態(tài)網(wǎng)頁(yè)的有效補(bǔ)充
如果分析“靜態(tài)網(wǎng)頁(yè)”的內(nèi)涵和外延,可以看到,在基于HTML網(wǎng)頁(yè)設(shè)計(jì)之外,只要立足于本地,與服務(wù)器沒(méi)有數(shù)據(jù)交互的網(wǎng)頁(yè)設(shè)計(jì)都可以統(tǒng)稱(chēng)為“靜態(tài)網(wǎng)頁(yè)”。從這個(gè)角度來(lái)看,藝術(shù)設(shè)計(jì)專(zhuān)業(yè)中的Flash網(wǎng)頁(yè)設(shè)計(jì)課程也基本上以靜態(tài)網(wǎng)頁(yè)為主。在Web2.0時(shí)代,交互性的社交網(wǎng)絡(luò)已經(jīng)發(fā)展得比較成熟,使每個(gè)獨(dú)立域名的網(wǎng)站不再是用戶(hù)交互的首選。在這種形勢(shì)下,靜態(tài)網(wǎng)頁(yè)設(shè)計(jì)要“揚(yáng)長(zhǎng)避短”,不拘泥于本身用戶(hù)交互行為的弱點(diǎn),以設(shè)計(jì)為主,反而有自己的一席之地。在教學(xué)中,要鼓勵(lì)學(xué)生在參與網(wǎng)絡(luò)互動(dòng)之余,盡量發(fā)揮自身設(shè)計(jì)優(yōu)勢(shì),具備獨(dú)立完成內(nèi)容展示型網(wǎng)站的能力。經(jīng)過(guò)相關(guān)調(diào)整,F(xiàn)lash網(wǎng)頁(yè)設(shè)計(jì)課程具備了循序漸進(jìn)、由淺入深的教學(xué)層次,直至課程結(jié)尾處,著眼于設(shè)計(jì)之“道”的有目的訓(xùn)練,使整個(gè)網(wǎng)頁(yè)設(shè)計(jì)課程體系具備了從基礎(chǔ)知識(shí)到綜合設(shè)計(jì)提升的完備性,并與其他課程有機(jī)結(jié)合,最大限度實(shí)現(xiàn)了課程的自身價(jià)值,為該課程的序列化、標(biāo)準(zhǔn)化建設(shè)積累了一定經(jīng)驗(yàn)。
作者:劉立偉 杜美易