藝術(shù)類高校網(wǎng)頁設(shè)計(jì)教學(xué)課程模塊研究

摘 要：隨著我國“互聯(lián)網(wǎng)+”時代的到來，社會各界對互聯(lián)網(wǎng)美術(shù)人才的培養(yǎng)提出了新的要求，傳統(tǒng)的教學(xué)內(nèi)容已經(jīng)不能滿足當(dāng)代的需求，新的教學(xué)課程體系急需研究與確立。本文針對傳統(tǒng)網(wǎng)頁設(shè)計(jì)美術(shù)人才培養(yǎng)中出現(xiàn)的問題，從藝術(shù)類網(wǎng)頁設(shè)計(jì)課程教學(xué)內(nèi)容、教學(xué)方法兩個層面進(jìn)行闡述，提出具體改革方案，旨在提高藝術(shù)類高校培養(yǎng)網(wǎng)頁設(shè)計(jì)美術(shù)人才的社會實(shí)踐對接能力。

關(guān)鍵詞：藝術(shù)類高校；網(wǎng)頁設(shè)計(jì)；教學(xué)課程；改革

隨著“互聯(lián)網(wǎng)”國家策略的大力推進(jìn)，我國社會發(fā)展急需大量優(yōu)秀的網(wǎng)絡(luò)應(yīng)用人才，網(wǎng)頁設(shè)計(jì)美術(shù)人才是互聯(lián)網(wǎng)人才的重要組成部分，為了配合國家戰(zhàn)略，目前國內(nèi)各大藝術(shù)類高校紛紛把《網(wǎng)頁設(shè)計(jì)》設(shè)置為藝術(shù)設(shè)計(jì)專業(yè)高年級學(xué)生的必修課程。然而，隨著近年來藝術(shù)設(shè)計(jì)高等教育教育的不斷擴(kuò)招，以往的課程體系和教學(xué)方法已無法滿足當(dāng)代及未來社會對網(wǎng)頁設(shè)計(jì)美術(shù)人才的要求，而無視市場需求的人才培養(yǎng)模式也會使網(wǎng)頁設(shè)計(jì)美術(shù)人才的培養(yǎng)與市場需求間的距離越拉越大，對藝術(shù)類高校網(wǎng)頁設(shè)計(jì)課程教學(xué)的探討和廓清已愈發(fā)重要。

一、網(wǎng)頁設(shè)計(jì)美術(shù)人才培養(yǎng)現(xiàn)狀分析

藝術(shù)設(shè)計(jì)教育在我國發(fā)展起步雖晚，但成長迅速，其人才培養(yǎng)方法備受各方關(guān)注。網(wǎng)頁設(shè)計(jì)是一種新興的數(shù)字藝術(shù)，它的創(chuàng)意取決于企業(yè)的文化屬性和互聯(lián)網(wǎng)的特色，它是一種附屬于互聯(lián)網(wǎng)之上的、藝術(shù)與技術(shù)合二為一的新型設(shè)計(jì)形式，它的界面設(shè)計(jì)既要注重界面中的構(gòu)成元素，又要遵循用戶體驗(yàn)，還要注重各頁面鏈接的空間關(guān)系和視覺協(xié)調(diào)性，使之成為有著互聯(lián)網(wǎng)特征的、綜合性的數(shù)字設(shè)計(jì)藝術(shù)。

目前，國內(nèi)各大本科院校多是依據(jù)所屬專業(yè)來確定《網(wǎng)頁設(shè)計(jì)》課程的教學(xué)側(cè)重：計(jì)算機(jī)類的側(cè)重代碼編程，用于網(wǎng)站后臺人才培養(yǎng)；藝術(shù)類的側(cè)重界面規(guī)劃和美化，適于網(wǎng)站前臺網(wǎng)頁美工的培養(yǎng)，但在網(wǎng)頁設(shè)計(jì)課程的教學(xué)上存在主要以下兩種現(xiàn)象：一是“輕維護(hù)、重美觀”，培養(yǎng)出的學(xué)生多在意靜態(tài)頁面的藝術(shù)性，不在乎是否有利于后臺維護(hù)；另一種是“輕線下、重線上”，培養(yǎng)的學(xué)生往往只在意屏幕的視覺效果，對線下互聯(lián)網(wǎng)用戶的需求了解不夠，雖然網(wǎng)頁界面看起來很漂亮，鏈接也很流暢，但實(shí)用性不強(qiáng)，更別說線下產(chǎn)品的開發(fā)了。因此，對藝術(shù)類高校網(wǎng)頁設(shè)計(jì)課程的教學(xué)改革勢在必行。

二、教學(xué)課程改革措施

對于藝術(shù)類高校網(wǎng)頁設(shè)計(jì)課程教學(xué)中所出現(xiàn)的問題，有必要進(jìn)行課程改革。首先要調(diào)整教學(xué)內(nèi)容，新的教學(xué)內(nèi)容將設(shè)置為網(wǎng)頁設(shè)計(jì)藝術(shù)理論課程和軟件實(shí)踐課程兩大模塊。

1.網(wǎng)頁設(shè)計(jì)藝術(shù)理論課程模塊

網(wǎng)頁設(shè)計(jì)藝術(shù)理論課程模塊的知識點(diǎn)包含三部分，即網(wǎng)頁設(shè)計(jì)的功能要素、網(wǎng)頁交互設(shè)計(jì)、網(wǎng)站品牌形象的美學(xué)塑造。

網(wǎng)頁設(shè)計(jì)的功能要素是網(wǎng)頁界面設(shè)計(jì)的基礎(chǔ)元件，了解其功能元素特點(diǎn)、作用及各元素之間的相互關(guān)系對網(wǎng)頁的設(shè)計(jì)工作起著至關(guān)重要的作用。它的功能元素有背景與底紋、按鈕與控件、頁眉與頁腳、導(dǎo)航器和目錄、功能板塊和廣告位等，這些功能元素依靠文字、圖片、色彩、多媒體和超級鏈接來實(shí)現(xiàn)。這些元素的形式語言遵循傳統(tǒng)平面設(shè)計(jì)的設(shè)計(jì)原則，又和傳統(tǒng)平面設(shè)計(jì)有很大不同。例如傳統(tǒng)平面設(shè)計(jì)多是以印刷為目的，作品尺寸是固定數(shù)值，而網(wǎng)頁設(shè)計(jì)是以連接互聯(lián)網(wǎng)的顯示器為最終呈現(xiàn)方式，它的寬度不宜超過顯示器寬度，高度可以任意但只能顯示一屏的高度，隨著瀏覽者拖動下滑竿，顯示高度隨之變化；用于傳統(tǒng)平面設(shè)計(jì)中的色彩在輸出過程中是以印刷色CMYK形式出現(xiàn)的，而網(wǎng)頁設(shè)計(jì)中顏色是的RGB模式，是標(biāo)準(zhǔn)的光色；傳統(tǒng)平面設(shè)計(jì)中對于圖像像素的設(shè)置往往是300像素，而屏幕顯示的像素只有72像素…因此，教師在此部分教學(xué)中不但要傳授網(wǎng)頁設(shè)計(jì)各功能元素的作用與特點(diǎn)，還應(yīng)該指出與平面設(shè)計(jì)中相對應(yīng)元素的異同，讓學(xué)生在區(qū)別中學(xué)習(xí)。

交互設(shè)計(jì)是網(wǎng)頁設(shè)計(jì)最為重要的功能設(shè)計(jì)。交互設(shè)計(jì)源于工業(yè)設(shè)計(jì)的概念，原來平面設(shè)計(jì)專業(yè)教學(xué)內(nèi)容沒有交互設(shè)計(jì)的內(nèi)容，為了更好的讓教學(xué)內(nèi)容與市場接軌，在調(diào)整后的教學(xué)內(nèi)容中新增了這一知識點(diǎn)。此部分教學(xué)內(nèi)容包括用戶體驗(yàn)研究、層級結(jié)構(gòu)設(shè)計(jì)、流程設(shè)計(jì)、低保真和高保真圖等，通過模擬用戶上網(wǎng)實(shí)際操作來進(jìn)行分析，找出痛點(diǎn)，確定網(wǎng)站特色，確定欄目，將站點(diǎn)ID，欄目、實(shí)用工具、搜索引擎等交互設(shè)計(jì)元素和平面設(shè)計(jì)知識結(jié)合，將功能設(shè)計(jì)教學(xué)落到實(shí)處。

品牌化建設(shè)是企業(yè)視覺形象執(zhí)行標(biāo)準(zhǔn)的延續(xù)和拓展。和大多線下公司一樣，一家優(yōu)秀的網(wǎng)站也需要品牌形象的塑造。從企業(yè)文化和性質(zhì)入手，樹立準(zhǔn)確而獨(dú)特的網(wǎng)站品牌形象，有利于公司在互聯(lián)網(wǎng)上同類公司中凸顯出來，提高上網(wǎng)者的瀏覽興趣，增強(qiáng)瀏覽記憶，促進(jìn)網(wǎng)站企業(yè)的宣傳推廣。

在教學(xué)內(nèi)容中應(yīng)滲透品牌形象概念，將此概念應(yīng)用到網(wǎng)頁設(shè)計(jì)的各個環(huán)節(jié)之中，無論是網(wǎng)頁 LOGO、網(wǎng)頁色彩、版式和導(dǎo)航設(shè)計(jì)等等都應(yīng)該保持品牌形象的一致性。

2.軟件實(shí)踐課程模塊

此課程模塊包含兩部分：新網(wǎng)頁三劍客和常用簡單代碼識別

Fireworks、Dreamweaver、Flash是傳統(tǒng)意義上的網(wǎng)頁三劍客，過去網(wǎng)頁設(shè)計(jì)的教學(xué)基本都依靠對它們的學(xué)習(xí)，雖然具有普遍性但對不同專業(yè)學(xué)習(xí)的針對性不強(qiáng)，結(jié)合平面設(shè)計(jì)專業(yè)現(xiàn)有軟件掌握情況（Photoshop是藝術(shù)設(shè)計(jì)學(xué)生必修基礎(chǔ)軟件，多數(shù)學(xué)生都已掌握它的基本操作技巧），把此部分內(nèi)容調(diào)整為“新網(wǎng)頁三劍客（PS+Dreamweaver+Flash）”的學(xué)習(xí)。簡單的說就是根據(jù)界面規(guī)劃草圖，用Photoshop制作出精美的靜態(tài)界面效果圖，并在此基礎(chǔ)上再次利用PS軟件進(jìn)行切片、優(yōu)化和輸出HTML文檔，用Dreamweaver版式、美化處理和超級鏈接，最后用Flash做特效替換，最終做出具備跳轉(zhuǎn)鏈接功能的動態(tài)網(wǎng)頁設(shè)計(jì)效果圖。

網(wǎng)頁設(shè)計(jì)美術(shù)人才最終所做出來的網(wǎng)頁設(shè)計(jì)作品是網(wǎng)頁效果圖，需要軟件工程師根據(jù)動態(tài)效果圖代碼編程上傳才能更好的在互聯(lián)網(wǎng)上呈現(xiàn)使用，為了更好后臺工程師溝通，把動態(tài)效果圖設(shè)計(jì)的共準(zhǔn)確，網(wǎng)頁美工師需要了解一些常規(guī)編程代碼知識，但藝術(shù)設(shè)計(jì)專業(yè)學(xué)生多是文科生，數(shù)學(xué)和英語的掌握水平普遍不高，對此，在代碼教學(xué)內(nèi)容上選取一些常用的簡單的代碼語言，并結(jié)合Dreamweaver的Html標(biāo)簽和CSS規(guī)則的使用方法，利用框架，對現(xiàn)有模板優(yōu)化和美化，提高網(wǎng)頁設(shè)計(jì)動態(tài)效果圖的實(shí)用性。

三、對接社會、校企合作，提高學(xué)生實(shí)戰(zhàn)能力

藝術(shù)類高校網(wǎng)頁設(shè)計(jì)課程教學(xué)改革的最終目的就是為社會輸出合格的互聯(lián)網(wǎng)網(wǎng)頁設(shè)計(jì)人才，更好的服務(wù)社會。對此，在在校期間能夠?qū)⒄n程教學(xué)活動中對接社會、加強(qiáng)校企合作就顯得尤為必要和重要。學(xué)校根據(jù)自身特點(diǎn)選擇合適企業(yè)建立教學(xué)實(shí)踐基地，聘請企業(yè)網(wǎng)頁設(shè)計(jì)骨干作為指導(dǎo)教師參與此課程實(shí)踐教學(xué)。也可以組織部分優(yōu)秀學(xué)生組建設(shè)計(jì)團(tuán)隊(duì)，成立工作坊，工作坊可以按照企業(yè)模式管理運(yùn)營，承接校外的網(wǎng)頁設(shè)計(jì)項(xiàng)目。此階段教學(xué)針對學(xué)生社會接軌針能力培養(yǎng)，為學(xué)生對接社會提供條件，將企業(yè)文化和行業(yè)規(guī)范引入教學(xué)，實(shí)現(xiàn)校企無障礙對接，真正將理論與實(shí)踐兩種教學(xué)有機(jī)結(jié)合在一起。

在計(jì)算機(jī)信息技術(shù)飛速發(fā)展的大環(huán)境下，藝術(shù)類高校網(wǎng)頁設(shè)計(jì)課程更要緊扣時代的脈搏，求實(shí)創(chuàng)新，不斷地更新和豐富教學(xué)內(nèi)容，結(jié)合市場創(chuàng)新教學(xué)方法，及時將最新案例和相關(guān)知識點(diǎn)引入課堂，最終培養(yǎng)出滿足“互聯(lián)網(wǎng)+”國家戰(zhàn)略需要的，具有綜合素養(yǎng)的，網(wǎng)頁設(shè)計(jì)美術(shù)高級應(yīng)用人才。

參考文獻(xiàn)：

[1]呂威飛 .陳潔滋.網(wǎng)頁設(shè)計(jì)與制作[M].上海人民美術(shù)出版社.2016.

[2] 許廣彤 .網(wǎng)頁美術(shù)設(shè)計(jì)[M].中國人民大學(xué)出版社.2011.

[3] （美）Robert Hoekman.Jr .瞬間之美：Web界面設(shè)計(jì)如何讓用戶心動[M].人民郵電出版社.2009.

作者簡介：

洪濤（1973.02—），男，河南大學(xué)藝術(shù)學(xué)院視覺藝術(shù)傳達(dá)系副教授，研究生學(xué)歷，碩士學(xué)位，河南省美術(shù)家協(xié)會會員。

注：該論文為“河南大學(xué)民生學(xué)院院級教育教學(xué)改革研究項(xiàng)目”成果。

項(xiàng)目名稱：平面設(shè)計(jì)專業(yè)網(wǎng)頁設(shè)計(jì)課程教學(xué)改革研究。

項(xiàng)目編號：MSJG2015004。