網(wǎng)頁課程設(shè)計報告書

　　網(wǎng)頁設(shè)計的本質(zhì)是為用戶的體驗服務(wù)，網(wǎng)頁設(shè)計的具體設(shè)計實踐活動主要包括交互和視覺兩個部分，交互的重要程度決定了匹配對應(yīng)的視覺效果。下面是小編整理的網(wǎng)頁課程設(shè)計報告書，希望對你有幫助。

　　網(wǎng)頁課程設(shè)計報告書一

　　網(wǎng)頁設(shè)計作為高校設(shè)計學(xué)專業(yè)的專業(yè)課程，在教學(xué)課程知識體系的不斷探索和完善中，形成了以藝術(shù)和技術(shù)分別主導(dǎo)的側(cè)重不同而又緊密關(guān)聯(lián)的兩種課程知識體系。隨著網(wǎng)頁設(shè)計理論與方法研究的不斷深入和發(fā)展，人們對網(wǎng)頁的產(chǎn)品設(shè)計的屬性認(rèn)知越來越明確，對網(wǎng)頁設(shè)計的工作分工更細(xì)致也更專業(yè)，這種認(rèn)知進(jìn)步也應(yīng)該體現(xiàn)于當(dāng)前的高校網(wǎng)頁設(shè)計課程的知識構(gòu)建體系中。

　　一、網(wǎng)頁設(shè)計課程知識體系的構(gòu)建變遷

　　1.從代碼知識到網(wǎng)頁制作工具知識的轉(zhuǎn)變

　　早期，高校網(wǎng)頁類課程的知識體系構(gòu)建得益于院校的科研優(yōu)勢，互聯(lián)網(wǎng)的發(fā)展直接促成了計算機(jī)專業(yè)的開設(shè)和網(wǎng)頁設(shè)計課程的設(shè)立。20世紀(jì)90年代末，網(wǎng)頁設(shè)計課程陸陸續(xù)續(xù)被列入部分高校設(shè)計類專業(yè)課程目錄。面向高校學(xué)生的網(wǎng)頁設(shè)計課程內(nèi)容是一種全新的事物，即使面向藝術(shù)類專業(yè)，也由計算機(jī)專業(yè)相關(guān)教師承擔(dān)教學(xué)任務(wù)。各高校、科研院所對網(wǎng)頁制作方法不斷探索，并將成果發(fā)布于各種學(xué)術(shù)研究出版物，教學(xué)方面則直接引用案例教學(xué)，教學(xué)內(nèi)容以HTML知識為主。由于面向?qū)ο蟮脑O(shè)計思想在軟件開發(fā)中普及，各種不需要用戶直接面對代碼的網(wǎng)頁制作工具相繼誕生，于是，這方面的知識成為課堂的新內(nèi)容，大大減輕了學(xué)生的記憶負(fù)擔(dān)。2.網(wǎng)頁制作向網(wǎng)頁美工的轉(zhuǎn)變網(wǎng)站制作的快速發(fā)展、網(wǎng)頁制作技術(shù)的傳播，使網(wǎng)站在技術(shù)層面進(jìn)入了同質(zhì)化階段，市場需求開始轉(zhuǎn)向頁面視覺效果方面的提升。在網(wǎng)頁設(shè)計課程中，由于對網(wǎng)頁設(shè)計分工認(rèn)知不足，早期的網(wǎng)頁設(shè)計課程時常將設(shè)計和制作的名稱與授課內(nèi)容混用，沒有嚴(yán)格區(qū)分，也沒有明確的網(wǎng)頁前端設(shè)計與視覺設(shè)計分工。高校網(wǎng)頁設(shè)計課程的授課內(nèi)容以網(wǎng)頁制作技術(shù)為主，以美化頁面效果為輔。此時，高校對于網(wǎng)頁設(shè)計課程的視覺設(shè)計方面的專業(yè)教學(xué)研究處于摸索階段。之后，隨著時代的發(fā)展，網(wǎng)頁設(shè)計課程教學(xué)核心開始轉(zhuǎn)變?yōu)橹谱骶哂懈�佳視覺效果的網(wǎng)頁。3.網(wǎng)頁視覺設(shè)計與網(wǎng)頁前端設(shè)計的內(nèi)容分離側(cè)重于設(shè)計的網(wǎng)頁設(shè)計課程知識體系重構(gòu)從探索、發(fā)展到成熟，經(jīng)歷了較長的準(zhǔn)備階段。隨著界面設(shè)計方法和流程理論體系的日益完善，分工協(xié)作機(jī)制日趨成熟，前端設(shè)計分離后，網(wǎng)頁設(shè)計課程的重心確定為符合網(wǎng)頁制作技術(shù)規(guī)范和條件的頁面創(chuàng)意表達(dá)、視覺效果設(shè)計與優(yōu)化。網(wǎng)頁視覺設(shè)計的探索從傳統(tǒng)的平面設(shè)計方法尋找切入點(diǎn)，通過對網(wǎng)頁設(shè)計中的審美需求和各種視覺構(gòu)成要素（如文字、圖片、顏色等）進(jìn)行分析，結(jié)合人們在瀏覽信息時的視覺習(xí)慣，探索網(wǎng)頁視覺信息如何被更有效、更合理地表達(dá)。網(wǎng)頁設(shè)計教學(xué)重心內(nèi)容在轉(zhuǎn)移到視覺設(shè)計之后，該階段還未意識到網(wǎng)頁交互設(shè)計的核心地位。

　　二、用戶模式的網(wǎng)頁之設(shè)計認(rèn)知構(gòu)建

　　網(wǎng)頁設(shè)計的本質(zhì)是用戶的體驗設(shè)計。網(wǎng)站作為互聯(lián)網(wǎng)非可觸形態(tài)的產(chǎn)品，對其認(rèn)知的構(gòu)建包含產(chǎn)品屬性認(rèn)知與服務(wù)屬性認(rèn)知兩個層面的內(nèi)容。1.網(wǎng)頁設(shè)計是一種產(chǎn)品設(shè)計設(shè)計是一門交叉學(xué)科，網(wǎng)頁本身也是一種產(chǎn)品。網(wǎng)頁設(shè)計最初被視作平面領(lǐng)域的設(shè)計，而鏈接交互是網(wǎng)頁設(shè)計有別于平面設(shè)計的基本特征。網(wǎng)頁設(shè)計存在交互性，使其具有交互設(shè)計可用性與易用性體驗的內(nèi)在要求，適用于工業(yè)產(chǎn)品的基本設(shè)計流程。2.網(wǎng)頁設(shè)計是一種服務(wù)設(shè)計服務(wù)設(shè)計層面，各種網(wǎng)頁交互體驗、視聽信息、線上內(nèi)容服務(wù)與線下互動等，是網(wǎng)站向用戶提供服務(wù)的設(shè)計組成部分。作為一種廣義的產(chǎn)品形態(tài)，網(wǎng)頁設(shè)計與傳統(tǒng)的實物形態(tài)的工業(yè)產(chǎn)品設(shè)計有一定區(qū)別，更傾向于體驗的系統(tǒng)化設(shè)計。隨著互聯(lián)網(wǎng)向物聯(lián)網(wǎng)的可用技術(shù)研究與拓展，基于智能化網(wǎng)絡(luò)的服務(wù)設(shè)計將成為跨越線上線下的主流設(shè)計形態(tài)。3.網(wǎng)頁頁面信息設(shè)計是關(guān)系網(wǎng)頁設(shè)計品質(zhì)的深度設(shè)計網(wǎng)頁設(shè)計作為一種信息量龐大的互聯(lián)網(wǎng)單元，從工效學(xué)角度來看，網(wǎng)站信息本身也擔(dān)負(fù)著面對用戶、有效傳遞信息的功能和任務(wù)，在具體的設(shè)計活動中，表現(xiàn)為對信息的設(shè)計。信息設(shè)計具有多學(xué)科交叉性、空間多維性、時間流動性等基本特征，信息設(shè)計的'目的是為了提高信息的可理解度和可閱讀性。優(yōu)質(zhì)的網(wǎng)頁信息設(shè)計可以降低用戶獲取信息的時間和精力成本，提升頁面信息獲取體驗。

　　三、基于用戶模型的網(wǎng)頁設(shè)計課程的知識體系構(gòu)建

　　網(wǎng)頁設(shè)計的本質(zhì)是對體驗的設(shè)計，即以用戶為核心思考設(shè)計方案，研究用戶在訪問網(wǎng)站時的需求是網(wǎng)頁課程設(shè)計任務(wù)的基本出發(fā)點(diǎn)。課程內(nèi)容模塊應(yīng)該以回答網(wǎng)頁設(shè)計是什么、怎么設(shè)計、為什么這樣設(shè)計三個問題為主線，構(gòu)建網(wǎng)頁設(shè)計課程的知識體系。1.課程的基本目標(biāo)掌握網(wǎng)站項目與網(wǎng)頁制作的基本設(shè)計流程，培養(yǎng)設(shè)計項目管理和組織能力；掌握用戶需求研究分析的基本方法，對用戶體驗和需求研究有較為敏銳的洞察力；掌握網(wǎng)站交互原型相關(guān)的設(shè)計方法與工具；掌握網(wǎng)頁視覺設(shè)計方法和設(shè)計規(guī)范；了解目前網(wǎng)頁前端設(shè)計的相關(guān)技術(shù)和工具。2.知識體系與模塊組成（1）設(shè)計方法教學(xué)內(nèi)容模塊設(shè)計方法教學(xué)內(nèi)容模塊主要為了解決面對具體問題時設(shè)計師怎樣展開分析研究工作并確定設(shè)計執(zhí)行方案。網(wǎng)頁設(shè)計方法主要分為項目流程設(shè)計與管理、網(wǎng)站策劃方法與規(guī)范、用戶體驗研究、交互原型設(shè)計方法等，讓學(xué)生通過貫穿整個課堂教學(xué)的項目流程設(shè)計和每個流程的具體設(shè)計方法的實踐，掌握基本的設(shè)計理論。（2）軟件工具教學(xué)內(nèi)容模塊軟件工具教學(xué)內(nèi)容在形式方面包括課堂內(nèi)的指導(dǎo)和課堂外的自學(xué)兩個部分。鑒于設(shè)計軟件的頻繁更新和新的設(shè)計軟件不斷涌現(xiàn)，教師必須培養(yǎng)學(xué)生自學(xué)工具的主動意識以適應(yīng)社會需求。在工具種類方面，包括圖形處理工具、交互原型工具和代碼工具三類。第一類是圖形處理工具，其中常見的Photoshop、Illustrator等圖形設(shè)計軟件，已經(jīng)在前置課程中基本完成學(xué)習(xí)。第二類是交互原型制作工具，常見的工具有墨刀、Axure等。第三類是代碼編輯工具，選擇較多，作為對網(wǎng)頁前端知識的入門介紹部分，在本課程中以介紹為主。（3）設(shè)計經(jīng)驗教學(xué)內(nèi)容模塊設(shè)計經(jīng)驗教學(xué)以啟發(fā)式案例實踐為主，按照網(wǎng)站項目設(shè)計的流程需要，設(shè)定不同層次、不同要求的設(shè)計實踐任務(wù)作為課程結(jié)課的考核內(nèi)容。學(xué)生通過案例的練習(xí)能從優(yōu)秀作品中學(xué)到設(shè)計經(jīng)驗，從具體的案例模仿中獲得設(shè)計的成就感。網(wǎng)頁設(shè)計課程案例教學(xué)同時也是對網(wǎng)頁設(shè)計方法的實踐驗證，有助于學(xué)生對網(wǎng)頁設(shè)計方法的理解和體會。結(jié)語任何一種技術(shù)變革，都可能讓網(wǎng)頁設(shè)計出現(xiàn)新的藝術(shù)形態(tài)，前端依然是課程必須了解的知識。目前，就設(shè)計藝術(shù)角度而言，網(wǎng)頁設(shè)計課程的內(nèi)容以交互和視覺設(shè)計為基礎(chǔ)，在信息設(shè)計層面也有較大的提升空間，設(shè)計途徑也已經(jīng)拓展到用戶的視覺、行為、聲音和邏輯等方面。網(wǎng)頁設(shè)計課程的知識體系構(gòu)建必須以產(chǎn)品的視角，讓學(xué)生更深刻、更完整地理解用戶模式下的網(wǎng)頁設(shè)計藝術(shù)。

　　網(wǎng)頁課程設(shè)計報告書二

　　隨著現(xiàn)代化科技的發(fā)展，計算機(jī)已經(jīng)成為人們生活中的重要組成部分，網(wǎng)頁瀏覽的形式已經(jīng)代替以往書籍瀏覽的形式，也正因為如此網(wǎng)頁的設(shè)計與布局尤為重要。科學(xué)合理的網(wǎng)頁設(shè)計布局不但能夠帶給人們美感，并且還能使人們在瀏覽的過程中內(nèi)心放松。計算機(jī)網(wǎng)頁設(shè)計的概念主要包括網(wǎng)頁設(shè)計布局的整體造型以及網(wǎng)頁設(shè)計布局頁面的尺寸。頁面設(shè)計的整體造型指的就是網(wǎng)頁設(shè)計中的布局形狀，其中最常見的形狀有三角形、圓形等，也有部分計算機(jī)網(wǎng)頁設(shè)計采用綜合體的形狀，在頁面的選擇上，大多是根據(jù)網(wǎng)站自身的特點(diǎn)來選擇的。計算機(jī)網(wǎng)頁設(shè)計的尺寸也較為多樣化，在計算機(jī)使用過程中，常常由于客觀影響造成屏幕的分辨率以及尺寸的影響，但由于是客觀因素?zé)o法改變，在瀏覽器自帶的功能上，對于瀏覽過程中網(wǎng)頁的增大與減小都能夠借助瀏覽器工具欄中的相應(yīng)功能解決。計算機(jī)網(wǎng)頁設(shè)計中的布局與計算機(jī)的發(fā)展有著直接的聯(lián)系，并且影響網(wǎng)站的瀏覽量，目前最為常見的布局分為同字型布局、標(biāo)題正文型布局、綜合框架型布局、封面型布局以及Flash型布局等五種形式。這五種布局形式都能夠最大程度的提高網(wǎng)頁的美感，并且在現(xiàn)代網(wǎng)頁布局中被廣泛運(yùn)用，以下便是對五種布局類型的詳細(xì)分析。

　　1.同字型布局

　　同字型布局主要針對網(wǎng)頁布局的內(nèi)容，這種布局其內(nèi)的填充范圍較廣、填充的數(shù)量也較大。在網(wǎng)頁設(shè)計布局中，大多都是在網(wǎng)頁的'標(biāo)題欄進(jìn)行網(wǎng)站主體的填充，有的是填充廣告，也有少數(shù)網(wǎng)頁設(shè)計布局中填充的形式是小標(biāo)題。在頁面的兩側(cè)分別布置內(nèi)容，其中網(wǎng)站的信息與動態(tài)或是服務(wù)人員以及相應(yīng)的廣告等，在以往網(wǎng)頁設(shè)計布局中這部分并沒有受到重視，因此也是相對具有價值的部分。同字型布局網(wǎng)頁主要都是從中央位置布置，根據(jù)網(wǎng)頁內(nèi)容的重點(diǎn)由上到下布局，或是根據(jù)網(wǎng)頁自身的特點(diǎn)以及相應(yīng)的顏色進(jìn)行布局，也有部分網(wǎng)頁是根據(jù)其中的細(xì)節(jié)進(jìn)行布局的。在網(wǎng)頁的下端并不會進(jìn)行內(nèi)容的布局，就目前網(wǎng)頁來看下端也只是網(wǎng)頁的信息以及登錄方式等。

　　2.標(biāo)題正文型布局

　　標(biāo)題正文型布局與同字型布局不同的是標(biāo)題正文型布局并沒有兩端的布局，其它布局類型相似。在頁面上端的布局中大多都是網(wǎng)頁的標(biāo)題，其中也有廣告，頁面的中端是網(wǎng)頁的主要內(nèi)容以及和重點(diǎn)內(nèi)容，其中中端內(nèi)容中包含同字型布局兩端布局的內(nèi)容，例如，在正標(biāo)題下方是對網(wǎng)站的簡訊，之后便是相應(yīng)的附加咨詢，最為常見的就是天氣信息以及網(wǎng)站的注冊信息等，在下方便是網(wǎng)站的主要內(nèi)容也就是正文，在正文的布局上，其結(jié)構(gòu)都是簡單明了的。

　　3.綜合框架型布局

　　綜合框架型布局與其它布局相比形式較為復(fù)雜，主要采用框架的形式來進(jìn)行網(wǎng)頁的布局，分別在上端、兩端以及下端，網(wǎng)站的主要內(nèi)容都是在框架中進(jìn)行布局的。這種布局形式與其他布局形式相比更具有輪廓性，能夠?qū)⑵渌�布局中的�?nèi)容類型充分地體現(xiàn)出來。

　　4.封面型布局

　　封面類型布局便是字面上的意思，按照書本頁面的形式進(jìn)行布局，在封面型布局中大多采用的是圖片，其中圖片篇幅較大。一般在不同種類網(wǎng)站的主頁上大多采用封面型布局，在布局的周圍相應(yīng)的分布著較小以及較為簡單的信息，此種信息所采用的形式都是超鏈接的形式，例如，最為常見的QQ空間，其主頁便采用封面型布局的形式，采用此種布局的主要目的就是能夠凸顯網(wǎng)頁自身的特點(diǎn)，能夠吸引使用者的目光的同時，對其功能更加一目了然方便操作。

　　5.Flash型布局

　　Flash型布局與頁面布局較為相似，F(xiàn)lash型布局與頁面型布局唯一不同的便是在頁面的布局過程中采用更多的Flash，其中包含聲音以及動畫的形式，因此與封面型布局相比在聲音上更能給人們帶來聽覺上的享受，除了聽覺上的享受外在視覺上Flash型布局也能夠給人們帶來相應(yīng)的震撼效果。例如，在現(xiàn)代最為常見的游戲頁面上，采用的都是Flash型布局，尤其是在登錄的界面或是在進(jìn)入游戲過程中的等待界面，在現(xiàn)代科技的發(fā)展中，也有少數(shù)網(wǎng)頁在主頁布局的過程中采用Flash型布局，以此提高網(wǎng)頁的瀏覽量�？偠�言之，計算機(jī)時代已經(jīng)到來，網(wǎng)頁設(shè)計布局已經(jīng)成為重要的發(fā)展趨勢，網(wǎng)頁設(shè)計布局并沒有固定的格式，做一種形式設(shè)計的過程中主要根據(jù)個人的審美，因此想要在網(wǎng)頁的設(shè)計布局中增添其美感，首先就要對美有更深刻的了解，合理的運(yùn)用到網(wǎng)頁的布局中，使人們在網(wǎng)頁的瀏覽中獲取所需信息的同時還能夠帶來相應(yīng)的視覺享受。

【網(wǎng)頁課程設(shè)計報告書】相關(guān)文章：

網(wǎng)頁課程設(shè)計心得體會03-21

關(guān)于網(wǎng)頁課程設(shè)計心得體會07-03

課程設(shè)計小結(jié)02-02

課程設(shè)計總結(jié)09-19

課程設(shè)計報告07-23

課程設(shè)計心得12-17

課程設(shè)計的總結(jié)12-17

【精選】課程設(shè)計總結(jié)08-29

課程設(shè)計報告09-11

課程設(shè)計感悟08-14