時間：2023-04-01 10:29:24
序論：在您撰寫網頁設計論文時，參考他人的優秀作品可以開闊視野，小編為您整理的7篇范文，希望這些建議能夠激發您的創作熱情，引導您走向新的創作高度。
1、大多數教師的教學內容主要為以下幾種類型：
（1）上課主要講解Dreamweaver軟件的使用，主要介紹如何使用這個工具進行網站的開發。
（2）介紹fireworks如何繪圖，并將繪圖的內容切片，將網頁展現出來。
（3）將Dreamweaver、Flash和Fireworks分別教給學生。由于課時的原因，學生每種都會點，但沒有一樣能精通。
2、存在的不足：
經過與現從事網站建設相關工作的學生調研，我發現上面的任何一種教學內容，都無法在實踐中得到充分的應用，原因如下：首先，從事網站設計的企業，一般都有專門的美工，負責網頁界面的設計，他們的美術功底及設計能力遠非計算機專業的學生能達到。其次，現在的網站基本采用DIV+CSS進行設計，原先采用表格設計網頁的技術已處于淘汰階段。而在目前的教學中，DIV+CSS在中職學校中根本沒有開展教學。于是就出現了這樣的現象：計算機專業的學生在網頁設計的崗位上美工做不好，頁面也不會設計，教學內容和實際需求的能力脫節。
3、當前計算機專業的網頁設計課程教學內容的組織
首先，在學習Dreamweaver的基礎上，講解HTML語言。其次，好的網頁需要有新的技術支持?，F在主流的網站都采用了DIV+CSS結構,DIV+CSS是網頁美工必須了解和掌握的一門技術,DIV+CSS采用樣式和結構分離的方式,利于搜索引擎讀取網站頁面,方便管理和網站維護。
二、教學方法和教學思路探索改善
針對上述提出的實際問題，我對中職網頁設計教學的教學思路和教學方法提出以下的見解：
1、提高教師實踐能力水平，改進教學方法。
作為網頁設計課程教學的教師來說必須關注互聯網應用的實時趨勢，走出課堂、走出校園、深入到企業了解就業市場需求。學校可以加強校企合作，從政策上引導和鼓勵教師利用寒暑假深入到企業進行實踐。深入了解一個完整的網站的創建過程，從規劃到素材的搜集與處理，到網站制作，再到網站維護。教師把企業中的項目拿到課堂教學中，學生從完成項目的過程中，明確地知道自己學習了網頁設計這門課程，以后能做什么工作，在工作中怎么去應用課堂上的知識。
2、多種教學方法并用，優化課堂教學。
(1)分層次教學法
傳統的課程設計對所有學生都制定統一的標準和要求,這樣影響了基礎好、動手能力較高的學生,抑制了他們的發展。“分層教學”就是進行有層次的教學，針對于每堂課程給每個層次學生制定不同的標準,根據學生掌握的水平和對這門課學習的興趣、智力水平及內在潛力等一些軟指標來區分學生層次,讓同學們在正確認識自己、評價自己的基礎上進行自我選擇。教學對象的分層有利于教學目標的分層,可以更好地調動每一個學生的學習積極性、主動性。
(2)個性化教學法
網頁設計教學有別于其他軟件的教學,它具有較強的實踐性。所以在教學中應充分體現學生的主體作用,雖然很多教師都注意到了這一點,教師利用較短時間操作演示,讓學生用大量時間去實踐,但是學生出現了模仿、記憶的操作過程,往往按部就班的學習,知識沒有經過自己思維的深加工而一知半解。為了避免該問題發生,教師在綜合訓練時可以提供給學生一些優秀的網頁作品供學生參考,讓他們在某一特定主題下自己動手制作。這樣才有利于學生探究知識、自我學習能力的培養,也能充份體驗出學生的個性，從而保護了每個學生的創造力。
(3)案例教學法
案例教學法對于這門課程是非常重要的，要求學生做出高水平、高質量的網頁，首先要開闊學生的視野，開拓學生的思路，見多才能識廣，教師在上課的過程中，一定要精心設計案例，案例應該由易到難，不能讓學生產生畏難情緒，而降低積極性。案例教學的著眼點在于學生創造能力以及實際解決問題的能力的培養，不僅僅是獲得那些固定的原理、規則，而是如何用更有效的方式獲得知識。案例教學是一種“做中學”的形式，它是從經驗與活動中獲取知識，增進才干。通過案例教學，學生不僅可以從中獲得認知的知識，而且有助于提高表達、討論的技能，增強面對困難的自信心。
（4）任務驅動法
任務驅動法是以完成具體任務為目的而展開教學活動，使學生緊緊圍繞任務進行探索學習，由淺入深，由簡及繁，循序漸進地完成特定的教學任務。在整個過程中，學生是學習的主體，教師只起到引導的作用，從而使學生逐漸養成發現問題、思考問題、分析問題、解決問題的習慣。同時“任務”的完成使學生有成就感，激發學生學習興趣，從而使學生由傳統的“被動學習”狀態轉化為“主動學習”狀態。本課程期末考核可以通過設計一個覆蓋網頁設計與制作所需要掌握的知識和技術的總任務，然后再將總任務進行細分為一個個小的任務，做到具體小任務的完成推動總任務的完成。通過任務的完成，學生能夠在一個學期內有效的掌握相關知識和技能，提高了學生學習效率和實際操作能力。因此，任務驅動法在網頁設計教學中是非常有效的。
3、教學手段，以啟發和體會為主
在網頁設計教學中，理論知識講得再多，如果學生不會靈活運用，一點用處也沒有。在教學中，不必太拘束于理論，應讓學生結合實踐，去理解和體會知識。如在學習網頁的布局和頁面色彩時，教師應找各種各樣的典型網頁或網站，讓學生在上網或觀察中體會。學生在觀察和研究這些不同的網站設計的時候，教師可以讓學生評選出自己喜歡的或者是覺得最好的和最差的，讓學生說說它們的差異。通過這樣的觀察和體會，讓學生明白網頁設計過程中，需要注意什么，怎么做才會更好。學生結合自己的實際體會，歸納總結出自己能理解和掌握的知識。
4、實踐環節重引導
中職計算機教學更重視實踐，重視動手操作，否則理論知識再豐富，如果不會動手實踐，也不能保證學生能夠更好地就業。實踐環節不但要重視，還要高效，有些學校在課程的實踐方面，分配了足夠的課時，但實踐的效果并不好。在網頁設計這種相對比較開放和自由的實踐課上，可讓學生充分發揮自己的想象力和創造力。值得注意的是，在學生的實踐過程中，教師要對學生進行適當的幫助和引導，如果任由學生自己去摸索，那么很可能在上機實踐這段有限的時間內，學生很難做出點東西來。這個階段并不是學生探索的階段，重要的是鼓勵學生把設想變為現實。
三、考核、評價方法的改變
網頁設計課程的實踐性非常強，我們要檢驗的是學生的設計能力、綜合應用能力和創新能力，那么單純靠最后的期末考試，是不能確切的評價一個學生的真實水平，而要將平時的作業、練習都納入學生評價中。對于網頁這門課程，我認為比較合理的評價方法應該是平時的作業占50%，期末考試占50%。平時的作業就是一次次的案例，檢查學生平時學習的態度和知識的掌握情況。對于期末考試，我認為應該以要求學生設計一個完整的網站來結束本課程，而不是要求在給定時間內完成任務，本身一個網站的建設在短短的兩三個小時內是無法完成的，包括素材的收集、版面的布局、內容的充實等，何況學生可以利用互聯網來收集相關的資料，參考引用他人模板來完成任務，所以應該以上交作品的形式完成本課程的期末考試，在作品完成的過程中，老師進行巡視、評價，也就是我們考核的不僅僅是最后的作品，而是將完成作品的過程也作為我們評價的一個依據。最后，上交的作品可以讓全班同學互相點評、互相評價，在評價別人作品的同時以提高自己的水平。
四、總結
在用戶獲取信息的方式上，網頁有別于紙質媒介，網頁是以瀏覽為主，而紙質媒介是以閱讀為主。所謂瀏覽，按照字面意思就是粗略、大致地看一遍，其主要目的是大致了解，搜尋是否有感興趣的信息線索；閱讀比瀏覽更具有主動性和目的性，是有目的地讀，其目標是理解?？唆敻裨凇秳e讓我動腦筋——網頁設計效果優化藝術》一書中提出了設計出好網頁必須面對的三個事實：一是“我們不是閱讀網頁，而是瀏覽”；二是“我們不做最佳選擇，而是滿意而止”；三是“我們不深究原理或本質，而是想當然地使用”。我們為什么對網頁是瀏覽呢？克魯格的分析認為有三個原因：一是因為匆忙，使用網絡的目的多半是想節約時間，這樣用戶就會不停地運動；二是用戶知道不必全部閱讀，通常一個網頁里面只有很少一部分是他們感興趣的；三是用戶擅長瀏覽，瀏覽是人們日常生活中搜尋信息的慣用方法。基于這樣一些原因，用戶使用網站就是瀏覽、滿意、再瀏覽、再滿意這樣一個循環往復的過程，直至滿意而歸。如果中間出現了不滿意，這個過程就會終止，用戶就帶著不滿意而離開。所以，在設計網頁時，哲學家威廉提出的奧卡姆剃刀原理“如無必要，勿增實體”和建筑大師密斯•凡•德•羅提出的“少即是多”原則是我們檢驗設計的兩面鏡子。在確定網頁的內容時，突出那些重要的內容，去掉那些不必要的圖案和文字，即使那些能夠讓你的網頁在視覺上產生更好的效果，但如果其干擾重要信息的瀏覽，仍然應該果斷地去掉。在網頁中，只有那些有利于信息傳達目標的美才是有價值的，美應該符合于功能的需要，美和功能的和諧統一才是網頁設計追求的目標。為了便于瀏覽，在網頁內容的編排上必須尊重視覺習慣，我們在瀏覽時總是從左到右，由上而下地掃視，要根據內容的重要性，進行從左到右、由上而下地依次排列，使重要的內容最先映入瀏覽者的眼簾。在文案的寫作上，為了便于快速瀏覽，一是對標題、關鍵內容加以強調；二是采用短的句子和段落；三是采用清晰的分區和列表；四是先總體后詳細的寫作順序。用戶在進行瀏覽時首先是通過標題和關鍵詞來初步判斷內容是否符合自己的興趣，然后再通過總體的概述來決定是否有繼續瀏覽下去的必要。在瀏覽的過程中，短句和短的段落有利于減小理解的難度和縮短判斷的時間，清晰的分區和列表能夠讓人快速抓住其關注的興趣點，促進人們繼續瀏覽。
二、網頁設計不應打破慣例
前面已經提到，網頁是一個要求即看即用的特殊“產品”，也就是一看我們就要知道如何使用。我們雖然使用了若干手機，但我們購買了一款新的手機時，我們還是得閱讀說明書后才能正常使用，網頁確不需要。那如何才能達到即看即用呢？使用慣例就是最好的武器，這也是提高所有產品易用性的重要法寶。慣例就是我們已經習慣了的東西，我們一看就知道它的意思，就知道怎么去操作，因為慣例是我們日常生活中積累起來的，已經存入大腦的固有知識。唐納德•A•諾曼在《設計心理學》中將知識分為了存儲于外部的知識和存儲于頭腦內部的知識，使用存儲于外部的知識不需要學習，但效率低；使用頭腦內部的知識需要專門學習，但效率高。而慣例是已經存儲在頭腦內部的知識，具有外部知識的高易用性和頭腦內部知識的高效率。在網頁設計中有很多慣例是不能輕易去打破的，一是重要導航在頁面的位置，按照慣例一般布置在頁面的上部、左上部或右上部，首頁的鏈接放置在最前面；二是網站的標識放置在頁面的左上部，瀏覽者用其來判別是否到達了目標網站；三是文字鏈接要加下劃線（也可以鼠標放上去才出現），瀏覽者用其來判斷是否有超級鏈接；四是常用標識符號，如在多頁文檔中，代表向上翻頁，代表向下翻頁；在視頻、音頻播放中■代表停止，代表暫停，代表播放。這些標識符號在網頁中已經具有特定的意義，是不能隨意改變的。
三、設計層面之間的邏輯聯系
在《用戶體驗的要素——以用戶為中心的Web設計》一書中論述了網頁設計的五個層面，包括戰略層、范圍層、結構層、框架層和表現層，并確定了自下而上的建設流程，規定了設計的程序。自下而上的各個層面，從抽象逐漸變成具體，并且包含著密切的邏輯聯系。戰略層確定的網站目標和用戶需求，是整個網站設計的基石，其決定范圍層的內容選擇和功能設計；結構層是對范圍層選擇的內容進行分類和組織，形成信息架構，以及對確定的功能進行交互設計，確定交互的過程和交互行為；框架層是在結構層信息架構的基礎上，根據完成任務的需要，利用超級鏈接設置來完成導航設計，以及規劃信息架構在頁面空間中的位置關系，形成布局框架；表現層是對框架層進行具體的視覺表現，包括圖形設計、色彩設計、信息圖表設計、動畫設計、視頻設計等。從上面的分析可以看出，下一層是上一層的設計依據或設計對象，上一層是下一層的進一步深化和具體，相鄰層之間緊密聯系，既不能交換，也不能跨越，更不能缺少，具有嚴格的秩序，形成了完整的邏輯鏈條，理性思維貫穿在整個設計過程之中。
四、結語
在一個合理的課程體系的基礎之上，針對目前中職學生基礎差，學習積極性不高的特點，選擇一本好的教材，在一定程度上也影響了學生的學習興趣和教學效果。在選擇教材時，一定要堅持少理論，多應用實例的原則，如果條件允許，可以根據本校學生的實際情況編寫校本教材。比如，可以編寫一門《網頁美工設計》的教材，內容分為Photoshop和Flash兩大部分，在Photoshop部分主要學習如何應用該軟件處理網頁圖像以及設計網頁布局和對網頁進行切片的技術，而在Flash部分主要是學習如何制作網頁的動態元素?？紤]到中職學生英語基礎差，對程序代碼的理解能力有限，在動態網頁制作教材的選擇中，要優先選擇利用Dreamweaver軟件的服務器行為實現動態技術的教材，盡可能減少對程序代碼的過多講述，以提高學生學習的興趣和自信心。
2突出實踐能力，部分內容實行協同教學
2.1設計學習任務，激發學生的學習興趣
興趣是最好的老師。在進行入門教學的時候，如何激發學生的學習興趣，使得學生在主觀上由“要我學”轉變為“我要學”，是個關鍵問題。以講授網頁美工設計的內容為例，在開始幾節課，要結合國內外的幾個知名網站的整體結構進行分析，介紹知名網站在版面設計方面如何布局，在色彩搭配方面如何合理地統一網站的風格、網站Logo和Banner的設計理念，以及如何對網頁圖片進行處理才能更加吸引網民的眼球等，讓學生意識到網頁世界的豐富多彩，從而激發他們的學習興趣。與此同時，在每個學習階段結束的時候，都要求學生獨立完成一個任務，從最基本的圖片處理、Logo設計到整個網站結構的布局和色彩搭配，這樣學生就會在自己心里形成一個風格，這也是學生學習好網頁設計課程的基礎和前提。
2.2舉一反三，培養學生學習能動性
網頁設計是一門專業技能，非常注重學生實際動手能力的培養。在實際教學中，教師要充分準備大量的具體案例，采用提問法、任務驅動教學法、講練結合法等方法對學生進行教學。在開始教授一個新的內容時，要提出一個問題，讓學生帶著疑問去學習，這樣才能有的放矢。教師可以先在教師機上演示操作一個具體案例，在演示的過程中，采用邊講邊練的方式，讓學生在“做中學”，然后布置一個與此案例類似的任務，讓學生獨立完成，在任務結束的時候，根據學生的完成質量情況，讓做得比較好的學生在教師機演示自己的成果，談談自己在做的過程中的心得體會。這樣，在課堂上，大部分的時間就交給了學生，讓學生始終處于動手的狀態。作為教師，在學生實施任務的過程中，不要過多干涉學生，而是多給學生以引導，讓學生自己思考、設計、完善，讓學生在實踐中自我摸索，不斷提高。通過這種方式，不僅起到了舉一反三的教學效果，而且充分發揮了學生的學習能動性，使得學生學得扎實，記得牢固，也進一步提高學生的分析問題和解決問題的能力。
2.3部分內容協同教學，明確分工
組內成員的分工，首先是角色分工。每個合作小組要選定小組長，以分配任務，監督進度情況，協調組內成員等。對于小組內的成員，要明確分工職責。以網頁設計綜合實訓為例，面對一個完整的網站系統任務，需要3個小組成員，其中，一個負責網頁圖片素材、動態效果的處理，一個負責整體網站的布局、色彩搭配，以及切片導入Dreamweaver的工作，一個負責數據庫設計和后臺服務器行為的實現。當然，為了讓每個學生都能夠全面掌握網頁設計的技術，每次合作時的角色也是應該輪換的，而非固定不變，特別是小組長的輪換，體現了人人平等的精神，讓每個學生都體會到自己在小組中的重要性，從而激發他們內在的能力。在任務實現過程中，通過協同合作，明確分工的方式，可以逐步培養學生的組織能力、交流能力、協調能力、相互尊重的態度等，以期學生在不同的學習任務中發展不同的能力，從而可以大大提高學習效率。
3教師要及時指導，將德育教育融入教學過程
在學生的學習過程中，無論是獨立學習還是合作學習，教師絕不能是旁觀者，而應該是學生的合作伙伴和指導者。特別是在學生以小組為單位的合作學習過程中，教師不是更清閑了，而是擔負起了更大的職責。在合作學習中，教師要針對班級、小組的具體情況，在宏觀層面給學生以指導，涉及整個任務的管理，調控和引導，要充分展示各種問題的形成過程和解決過程。實踐證明，在合作學習過程中，如果有教師的及時指導，如指導學生一些合作學習的步驟，明確合作學習的規則，有利于學生順利開展學習，充分發揮小組協同合作的作用。與此同時，要將德育教育融入到教學過程中。現階段，作為網絡信息承載者的網頁是一把雙刃劍，各種信息充斥其中，對于這些正處于青春期的中職生，如何正確對待這些信息，將對他們的成長發揮重要作用。因此要將網頁作為德育教育的載體，通過制作以“健康、向上”為主題的網站，在搜集素材的過程中多接觸先進人物、先進事跡，無形中讓學生，逐步樹立正確的人生觀和價值觀，讓學生學會做人做事。
4結束語
通過《網頁設計與制作》多年的教學發現，應用傳統的教學方式及考核方法學生只建立了的基礎的專業課程知識概念及單一的基本操作，并不能綜合應用操作技能完成某主題網站的設計與制作。為了建立以網頁設計與制作技能考核為主線的開放式、全過程的考核體系，提高學生綜合項目實踐能力，更好的與社會需求接軌。有必要對傳統的考核方式進行改革，同時經過多年教學探索，結合人才培養方案制定了以下的考核方案。
二、考核方案
1.考核方案的制定
本考核采取學生小組合作（每組2-3名學生）完成一個規定主題網站項目的方式展開?？偝煽冇刹僮骺己顺煽?、項目報告成績兩部分組成，權重分別為70％、30％，每一項按百分制評分后依權重比例計入總成績，總成績不及格者必須重修本課程并重新參加考試。因本校的現有學期總評成績是由平時成績30%、期中成績30%、期末成績40%組成，為了與學校的評分要求接軌，將本次考試所得的總成績作為學校學期總評成績的期末成績部分。并在此說明平時成績30%部分是由學生本學期的課程作業完成情況、出勤及上課表現綜合評定。本考核方案中的操作考核、項目報告都有具體的考核方案，其中操作考核實施的具體要求以試卷形式展現，內容要求以表“操作考核內容”為中心，以考核學生綜合網站制作能力為基本思路，通過小組合作完成主題網站的設計與制作，具體要求在此省略。此外要求學生撰寫項目報告不僅讓學生明確各自的份內工作，同時要求學生善于思考、總結，每做一個項目都有所收獲。項目報告實施的具體要求涉及以下幾個方面的內容：
（1）項目實施過程。項目實施過程包括前期策劃、資料搜集、網頁制作。在前期策劃階段，要求小組共同確定網站名稱、網站風格（列舉網頁采用主要色彩及網頁色調定位）、網站欄目、站點目錄結構的內容以形成完整的網站規劃，在此規劃的指導下進行資料搜集、協作完成網頁制作。其中網頁制作中要求頁面美工設計階段介紹所用軟件及提供至少首頁效果圖截圖；靜態頁面制作階段要求繪制網頁布局的結構圖及標注尺寸；程序開發階段列舉所用的開發工具、對數據庫、表進行截圖，以及繪制程序開發頁面流程圖。
（2）項目總結。對本項目完成情況進行分析、總結，并介紹項目實施過程中的收獲及體會。在作品展示時要求各小組派出代表對作品進行介紹，總結，便于相互交流經驗。
（3）項目組介紹。對該項目組成員進行介紹及項目實施過程中的人員分工情況進行報告。體現小組合作開發項目的工作模式，讓學生明白實際工作中不僅需要具備較高的技術能力，還要有合作意識，與合作者之間有效、和諧的溝通。
2.考核方式
作者在論文的寫作當中難免要閱讀相關的學術資料，在論文引用的他人作品時不能全部都寫到論文當中去，那么只要將其主要文獻標注好后依次列在論文的最后面。下面是學術參考網的小編整理的關于網頁設計論文參考文獻，歡迎大家閱讀賞析。
網頁設計論文參考文獻：
[1]胡崧.HTML從入門到精通[M].北京：中國青年出版社，2007.
[2]知新文化.HTML完全手冊與速查辭典[M].北京：科學出版社，2007.
[3]楊選輝.網頁設計與制作教程[M].北京：清華大學出版社，2009.
[4]王誠君，劉振華，郭竑暉，高中山.Dreamweaver8網頁設計應用教程[M].北京：清華大學出版社，2007.
[5]李光明，曹蕾，余輝.中文Dreamweaver8網頁設計與實訓教程[M].北京：冶金工業出版社，2006.
[6]周德華，許銘霖.新編網頁設計教程[M].北京：冶金工業出版社，2006.
[7]趙銘建，趙慧，喬孟麗，康梅娟.網頁設計與制作[M].東營：中國石油大學出版社，2007.
[8]趙祖蔭，王云翔，胡耀芳.網頁設計與制作教程[M].北京：清華大學出版社，2008.
[9]陳季.Flash基礎與實例教程[M].北京：北京希望電子出版社，2005.
[10]丁海祥.計算機平面設計實訓[M].北京：高等教育出版社，2005.
[11]曹雁青，楊聰.Photoshop經典作品賞析[M].北京：北京海洋智慧圖書有限公司，2002.
[12]張怒濤.Photoshop平面設計圖像處理技法[M].北京：清華大學出版社，2003.
[13]陳笑.Dreamweaver8，PhotoshopCS2，Flash8網頁制作實用教程[M].北京：清華大學出版社，2006.
[14]孫強，李曉娜，黃艷.JavaScript從入門到精通[M].北京：清華大學出版社，2008.
[15]劉智勇.JavaScript開發技術大全[M].北京：清華大學出版社，2009.
[16]陳會安.JavaScript基礎與實例教程[M].北京：中國電力出版社，2007.
[17]常永英.ASP.NET程序設計教程(C#版)[M].北京：機械工業出版社，2009.
[18]肖金秀，馮沃輝，陳少涌.ASP.NET程序設計教程[M].北京：冶金工業出版社，2003.
[19]金旭亮.ASP.NET程序設計教程[M].北京：高等教育出版社，2009.
[20]劉培文，韓小祥.ASP.NET程序設計教程[M].北京：中國人民大學出版社，2009.
網頁設計論文參考文獻：
[1]安穎蓮，李秀，姚瑞霞，田榮牌.《網頁設計與制作》課程教學設計與實踐.中國教育信息化，2007(17).
[2]沈志剛，于曉霞.“模塊項目化”教學法在網頁設計與制作課程中的應用.福建電腦，2009(5).
[3]周娟.高職網頁設計與制作課程教學的幾點改進.電腦知識與技術，2009(26).
[4]蔡北勤.模塊化基礎上的工作過程系統化教學模式探討.交通職業教育，2007(6).
[5]，馮永華.課堂教學變革的反思與重建———“慕課”背景下課堂教學變革的思考[J].教師教育學報，2014，11(3)：53-63.
[6]孫曉娟.基于“慕課”的高職課程改革及教學評價的研究[J].中國管理信息化，2016，1(4)：236-237.
[7]張琳.高職網頁設計課程的教學生態模式研究[J].教育現代化，2015，4(10)：99-101.
[8]鄭偉、薛嵐.高職院校圖形類專業實踐教學研究[J].科技資訊，2010(12)：248-248.
[9]鄭偉.高職院校非圖形類專業《網頁設計與制作》課程教學改革的探討[J].福建電腦，2011，27(1)：205-206.
[10]鄭偉、薛嵐.高職院校圖形類專業《網頁設計與制作》課程建設改革的探討[J].藝術科技，2013，26(3)：283-283.
[11]李榮剛.視覺傳達專業中的網頁設計課程探索[J].美術學刊，2012，(10).
[12]何磊孫志宜.視覺傳達設計專業課程教學改革與創新[J].合肥師范學院學報，2015，(1)33期
[13]魏坤.視覺傳達設計專業發展現狀與教學對策——以漢江大學設計學院為例[J].中國藝術，2013，(4).
[14]戴士弘.職業教育課程教學改革[M].北京：清華大學出版社，2007：13-15
[15]梁景紅.網站設計與網頁配色[M].北京，人民郵電出版社，2008，(52).
網頁設計論文參考文獻：
[1]王寅田.基于Hadoop的交通物流大數據處理系統設計與實現[D].上海交通大學2014
[2]滕勇.基于WMI的電信營業終端管理系統的設計與實現[D].上海交通大學2013
[3]劉暢.模型驅動的飛機座艙顯示控制應用軟件開發方法研究與實現[D].上海交通大學2014
[4]李巖.可調整時間自動機可達性算法的研究與實現[D].上海交通大學2014
[5]余啟鴻.物流企業信用評級技術研究及系統實現[D].上海交通大學2014
[6]張明銳.基于AOP的座艙顯示應用軟件框架研究與實現[D].上海交通大學2014
[7]浦杰.券商門戶系統統一通訊平臺的研究和實現[D].上海交通大學2012
[8]陸志林.基于jBPM和SSH的電子政務開發平臺的研究和實現[D].上海交通大學2012
[9]鄭琦.基于OCM模型的在線計費系統開發及應用[D].上海交通大學2007
[10]華天.電子制造企業產品生命周期管理系統的研究與實現[D].上海交通大學2013
引言…………………………………………………………………..2
1系統設計目標和使用的主要技術……………………………….4
1．1設計目標………………………………………………………4
1．2主要技術………………………………………………………4
1．2．1模板技術………………………………………………….4
1．2．2標簽庫技術……………………………………………….4
2系統的組成和實現……………………………………………….6
2．1系統組成………………………………………………………6
2．2系統的實現……………………………………………………7
2．2．1模板庫和標簽庫的實現………………………………….7
2．2．2系統開發環境…………………………………………….11
3結束語…………………………………………………………….11
引言
隨著WWW（WorldWideWeb）的普及，動態網頁技術也急速發展。從原來的CGI（CommonGatewayIn－terface）到ASP（ActiveServerPage），都從某種程度上滿足了網頁開發人員對動態網頁開發技術的需求論文。但是不管是CGI還是ASP都存在一定的局限性，如CGI對服務器資源的耗費，ASP只能同MicrosoftIIS一起使用等，這些都限制了這些技術的使用范圍，極大地阻礙了它們的推廣。廣大的頁面開發人員都熱切地盼望一種統一的頁面開發技術，該技術應該具有的特點：①與操作平臺無關，能夠在任何Web或應用程序服務器上運行；②將應用程序邏輯和頁面顯示分離；③提供代碼重用，簡化開發基于Web的交互式應用程序的過程。
JSP（JavaServerPage）技術就是被設計用來滿足這樣的要求的。JSP是由SunMicroSystem公司于1999年6月推出的新的網頁開發技術，它是基于JavaServ－let以及整個Java體系的Web開發技術，是Servlet2．1API的擴展。利用這一技術，可以建立先進、安全和跨平臺的動態網站。
Java是未來的主流開發技術，具有很多優勢。JSP則是Java在Internet／IntranetWeb上的重要應用技術，得到了廣泛的支持和承認，它可以和各種Java技術完好地結合在一起，從而實現非常復雜的應用。
作為一種基于文本的、以顯示為中心的開發技術，JSP提供了JavaServlet的所有好處。為了做到邏輯功能和顯示功能分開，JSP已經可以和JavaBeans、EnterpriseJavaBeans（EJB）和Servlet一起工作。JSP的開發人員可以通過使用JavaBeans、EJB和Servlet來完成大部分與網站邏輯相關的工作，而僅僅把顯示的工作交給JSP頁面來完成。內容和顯示邏輯分開的好處在于，更新頁面外觀的人員不必懂得Java代碼，而更新Java類的人員也不必是設計網頁的行家。這就可以用帶Java類的JSP頁面來定義Web模板，以建立一個具有相似外觀的頁面組成的網站。Java類完成數據提供，在模板中就沒有Java代碼，這意味著這些模板可以由一個HTML編寫人員來維護。
JSP作為當前主流的網頁開發技術，具有如下特點。
1）將內容的生成和顯示進行分離：使用JSP技術，Web頁面開發人員可以使用HTML或者XML標識來設計和格式化最終的頁面。使用JSP標識或者小腳本來生成頁面上的動態內容（內容是根據請求來變化的）。生成內容的邏輯被封裝在標識和JavaBeans組件中，并且捆綁在小腳本中，所有的腳本在服務器端運行。如果核心邏輯被封裝在標識和JavaBeans中，那么其他人，如Web管理人員和頁面設計者，能夠編輯和使用JSP頁面，而不影響內容的生成。
2）強調可重用的組件：絕大多數JSP頁面依賴于可重用的、跨平臺的組件來完成應用程序所要求的更為復雜的處理。得益于Java的操作平臺無關性，開發人員能夠很方便共享和交流執行普通操作的組件，或者使得這些組件為更多的使用者所使用。基于組件的方法加速了總體的開發過程，極大地提高了項目整體開發的效率。
雖然JSP功能強大，但是它要求網頁開發人員對Java要相當熟悉。而現在Java程序員還比較少，對一般的網頁開發人員來說，JSP的語法還是比較難于掌握的。所以，就需要有一種網頁開發工具，為一般的網頁開發人員提供常用的JSP應用，讓只懂得一般頁面開發技術（HTML）的開發人員也能夠使用JSP的強大功能。
1系統設計目標和使用的主要技術
1．1設計目標
本系統的設計目標是為只懂得HTML但完全不了解JSP的一般網頁開發人員提供一個網頁開發工具，使他們能夠根據系統文檔，通過標簽使用JSP的常用功能，最后生成一個只包含靜態HTML和JSP標簽的動態JSP網頁。
1．2主要技術
本系統在設計時，主要考慮使用模板和JSP標簽的技術來實現。
1．2．1模板技術
模板技術被廣泛地應用于各種開發和應用系統中。它預先生成一些常用的框架結構，使用戶可以根據自己的需要方便地從模板庫中選擇模板，而不用自己重新去搭建，節省了用戶的開發時間，方便了用戶的使用。在本系統中，將頁面按照功能類型進行分類，歸納出常用的頁面類型，生成模板庫。
1．2．2標簽庫技術
在JSP中，動作是可以創造與訪問程序語言對象和影響輸出流的元素。JSP定義了六個標準的動作。除了這六個標準動作以外，用戶可以定義自己的動作來完成特定的功能。這些動作被稱為客戶化動作，它們是可重用的程序模塊。通過這些動作，程序員就可以在JSP頁面中把頁面的顯示功能也部分地封裝起來，使整個頁面更加簡潔和易于維護。在一個JSP頁面中，這些客戶化動作是通過客戶化標簽來調用的。而標簽庫（TagLibrary）就是客戶化標簽的集合。
JSP標簽庫是一種通過JavaBeans生成基于XML的腳本的方法。它是JSP的最大特點之一。通過標簽庫，能夠無限制地擴展JSP應用，完成任何復雜的應用需求。
JSP標簽庫具有以下特點。
1）易于使用：JSP中的標簽和一般的HTML標記外表上是完全一樣的，使用起來和普通的HTML標記一樣方便。
2）易于代碼重用：標簽庫中的每一個標簽都能完成一定的功能。一旦定義好了一個標簽庫，只需要把這個標簽庫包裝成一個Jar文件，那么以后只要在別的系統中使用這個標簽庫就行了，而不用重新開發代碼，極大地提高了系統開發效率，降低了開發成本。
3）易于代碼維護：所有的應用邏輯都封裝在標簽處理器和JavaBeans中，所有的標簽都集中在一個標簽庫中。如果需要更新代碼或者需要修改一個網頁上的功能，只需要修改相應的標簽即可。通過這種統一維護方式，不用在每個網頁上去作修改，極大地減少了維護的工作量，節約了維護成本。
4）易于系統擴充：如果需要向系統中添加新的功能，只需要定義一個新的標簽來完成這一功能即可，無需對系統的其它方面作任何改動。標簽庫可以繼承JSP規范各方面的特性。這樣就可以無限制地擴展和增加JSP的功能，而不需要等待下一版本JSP的出現。
2系統的組成和實現
2．1系統組成
本系統主要由四個部分組成，見圖1。
1）數據庫連接部分：本系統支持常用的幾個數據庫，包括Oracle、Sybase、MSSQLServer、MySQL和DB2，根據用戶選擇的數據庫類型和用戶提供的數據庫名稱、用戶名、密碼使用JDBC同數據庫相連。
2）系統基本表生成部分：和數據庫連接以后，根據同數據庫相連的用戶名生成兩個系統基本表TC－Tables和TC－Columns，TC－Tables表包含在該數據庫中屬于該用戶的所有的表的英文名稱、中文名稱和一些屬性，如是否可修改、是否可查詢等；TC－Columns表包含在該數據庫中屬于該用戶的所有的表的所有列的中英文名稱和其它一些屬性。如是否可顯示、是否可查詢等。這兩個系統基本表在整個系統的開發過程中提供用戶所使用數據庫的基本信息。
3）模板選擇和網頁生成部分：該部分是系統的核心部分。它包含了兩個子模塊。
①模板選擇部分：系統為用戶提供模板選擇界面，讓用戶根據需要從模板庫中選擇所要使用的模板。
②模板處理部分：根據用戶選擇的模板，系統調用指定的模板處理模塊對這個模板進行處理。當處理程序遇到模板中的標簽時，就為用戶提供交互界面，讓用戶為指定的標簽輸入參數，并由系統驗證用戶輸入的標簽的有效性。最后由系統完成JSP頁面的生成。
4）網頁預覽和修改部分：網頁生成出來以后，系統為用戶提供了一個網頁預覽窗口和代碼查看修改窗口。通過這個預覽窗口，用戶可以預覽一下生成出來的JSP頁面的效果。如果用戶對頁面的靜態方面的效果不太滿意，用戶可以通過代碼查看修改窗口修改代碼中的HTML代碼。如果用戶對頁面的靜態效果有進一步的要求，系統還為用戶提供了一個調用DreamWeaver編輯器的接口，用戶可以使用它來對生成出來的JSP頁面的靜態效果進行進一步的修改和完善。
2．2系統的實現
2．2．1模板庫和標簽庫的實現
標簽庫的規劃和設計在整個系統設計中至關重要，它關系到了代碼重用的程度和系統運行的效率。它的規劃應該遵循以下原則。
1）在標簽中應該盡量少的包含靜態的HTML。對于一般用戶來說，標簽是透明的。用戶不能夠查看和修改標簽。如果在標簽中包含了過多的靜態HT－ML語句，將影響用戶對頁面的靜態效果的修改和完善，限制標簽的使用。
2）盡量提高代碼的重用度。在對JSP應用進行分類是盡量把公用的JSP應用提取出來，形成標簽。而不用在每個標簽中都重復實現該應用。這樣在以后要對該應用進行修改和完善時，只需對這一個標簽進行修改即可，易于代碼的維護。
3）方便用戶的使用。在設計標簽庫時，應該充分考慮到用戶的使用情況，使用戶能夠很容易和方便地理解和使用標簽。
①標簽庫的定義：定義一個標簽庫，必須首先定義一個標簽庫描述文件（TLD）。這是一個基于XML的腳本文件，在這個文件中定義了XML的版本、所使用的編碼、標簽庫的版本、所使用的JSP的版本、標簽庫的名稱和這個庫中所包含的所有的標簽的定義和參數描述，包括標簽的名稱，標簽所對應的Java類，標簽的描述信息等。
②標簽的實現：一個標簽就是一個特殊的Java
類，這個類必須繼承TagSupport類，這個類是在javax．servlet．jsp．tagext包中定義的。在標簽類中，包含了這個標簽的參數初始化方法（Set／Get）、標簽的主體處理方法（Handler）以及供下一級標簽調用的方法等。
③模板的實現：一個模板就是一個含有標簽引用的JSP文件。為了在模板中引用所定義的標簽，必須首先引入標簽庫。
＜％＠tagliburi＝“tag．tld”prefix＝“ctag”％＞
其中uri指定標簽庫描述文件的路徑；prefix指定引用標簽時所使用的前綴。
在模板中引用指定的標簽時，使用引入標簽庫時所指定的前綴，指定標簽的名稱；為標簽的參數賦值。
2．2．2系統開發環境
本系統主體程序開發使用的是Borland公司的JBuilder6．0，模板開發使用是Microsoft公司的Front－Page2000，標簽庫開發使用的是UltraEdit編輯器，JDK采用的是JDK1．4。系統測試環境是JRun3．0。
3結束語
Java是未來開發語言的主流，而Java在Web上的主要應用JSP也必將成為未來Web開發的主流技術。本系統采用了JSP的最大特點之一的標簽庫，使一般的Web開發人員也能夠方便地使用JSP強大的動態頁面功能，開發出技術先進的JSP動態Web頁面。由于本系統采用Java語言進行開發，所以可以在任何支持圖形化界面的操作系統下運行，實現了完全的與平臺無關。本系統易于擴充和完善。在以后可以考慮為用戶提供接口，使用戶可以自己擴充模板庫和標簽庫，進一步增強系統的功能。
參考文獻
［1］CayS．Horstmann，GaryCornell．Java2核心技術（CoreJava2）［M］．北京：機械工業出版社．
［2］BruceEckel．Java編程思想（ThinkinginJava）［M］．北京：機械工業出版社．
一、網站整體規劃，要做網頁的第一步便是做網站的整體規劃這主要包括四個方面的內容。
1.討論網站的主題。
網站整體規劃是做網頁的第一步也是制作網頁最關鍵的一步它決定了你要表答的信息，因此我選擇了我選擇我最喜愛的服飾來為它做網頁。在平時我也對服裝的網頁比較關心，無論是淘寶網上的衣店還是各種品牌裝。這次我是為“易菲”服飾做的網頁。
2.定位網站的CI形象?！耙追啤敝哺袊幕?，汲取自然稟賦之靈性，形成一個既有濃厚文化底蘊，又有現代自然人文氣息的特色品牌?！耙住奔词侨?，是包容，是寬容，是五千年中華民族的文化精髓，是厚德載物，是對人性寬度的一種拓展?！胺啤蓖ǚ?，是生機、是個性、是春意盎然、是自強不息，是對人性深度的一種挖掘?！吧钊缁ǎ栽诳鞓贰笔荵IFINI易菲的設計理念，倡導一種與自然和諧相處，如花兒綻放般美好舒適、自在快樂的生活方式。這也便是我網站的CI形象。
3.確定欄目和板塊。
于時間的關系在本次我準備做四張網頁：一張主頁三張二級頁面。分別設計了“時尚首頁、時尚衣秀、推薦產品、潮流信息”等四個欄目。在這四張頁面中我打算都用淡藍色做背景顏色來映襯我網頁的主打色綠色。
2.網站的整體風格和創意。
整個網站的創意就在于顏色的搭配，與各種圖片的搭配，它們相互輝映，相互襯托。以便達到表現其品牌的和諧之美、自然之美。我踩用淡藍色和綠色為我網站的主打色主要是因為我的產品特性。在設計上，YIEINI易菲推崇“自然美”，將帶表女性氣質的花卉和自然元素融入設計之中，充分體現設計師和顧客所追求的一種灑脫、舒適的生活氛圍，力求表現悠閑、舒暢、自然的生活情趣。因此我用天空與自然的顏色來表達這張自然之美、和諧之美。
二、網頁制作的前期策劃與準備，在本階級主要有兩方面的工作。
1.資料的搜集。
在做網頁我上網收集了許多方面的資料主要是有關網站的布局與服飾品牌方面的資料，我首先進它的企業網站找了一些關于“易菲”服飾的圖片主要是一些代言形象還有代表其企業形象的圖片。其次我去瀏覽了許多的網頁觀察其網頁的布局、顏色搭配、欄目、板塊等方面的內容，同時也搜集了一些對我有用的資料。在搜索資料最困難的便是動態圖片的搜集，動態圖片其gif格式的還是好保存，但是要搜集flash動態圖片就相對較難了。我用了一天的時間來搜集我的flash都不太成功，不過還搜到了可以換自己圖片的代碼。在開始時我根本就不知道flash是怎樣搜索，不過經過三次像老實詢問我終于懂得一些關于代碼的搜索。在搜集資料的過程之中我發現了自己的許多不足之處，最關鍵就是平時對知識的掌握不夠，連最基本的資料搜尋都覺得困難。也是我平時不夠認真和努力的表現。通過這次的教訓在以后我一定會做得更好，爭取不范類似錯誤。
2.熟悉制作軟件。
做網頁主要用的工具便是Dremweaver、Photoshop、Flash軟件。在這些軟件我對Dremweaver、Photoshop相對比較熟悉，因為在平時上課是老師帶領我們運用過。所以我還可以正常的運用，但是出現的問題還是有很多。有很多不懂如何操作，只有通過在次去看書才能夠了解，這也體現了我學習方面的缺點，它是我平時不夠認真的具體表現。
三、網頁制作，這便進入我該次的主題了具體制作流程如下。
1.構建站點框架。
在我打開Dremweaver后第一步便是新建站點，我把我的站點建立在F\儀下面。并將我搜集的全部資料都保存在其文件夾中，以便網頁制作時可以方便的使用。
2.設計主頁及二級頁面。
在主頁我設首頁制作時，時刻考慮著網頁的基本原則：統一，連貫，分割，對比及和諧的原則，內容統一，都是為了主題服務，美容美體，一個網站強調的就是一個整體，只有圍繞一個統一的目標所做的設計才是成功的；連貫，頁面之間關系連貫，統成一體；每版內容都自成一體，顏色各異，便于瀏覽；整個網頁有動有靜，色彩呼應，搭配協調，不呆板，富有生氣；顏色各異，但又不同之中又相同，渾然一體。而且制作過程中，不忘以下原則：
簡潔實用：這是非常重要的，網絡特殊環境下，盡量以最高效率的方式將用戶所要想得到的信息傳送給他就是最好的，所以要去掉所有的冗余的東西。使用方便：同第一個是相一致的，滿足使用者的要求，網頁做得越適合使用，就越顯示出其功能美；頁面用色協調，布局符合形式美的要求：布局有條理，充分利用美的形式，是網頁富有可欣賞性，提高檔次。當然雅俗共賞是人人都追求的。
交互式強：發揮網絡的優勢，是每個使用者都參與到其中來，這樣的設計才能算成功的設計。這樣的網頁才算真正的美的設計。每個子頁都設有上導航欄，便于瀏覽和跳轉。3個二級網頁制作時，使用的是表格，每一個頁面都用表格為它布局好，然后在插入圖片文字及其他，這樣有一定的規劃性，體現了連貫統一性，不同的內容根據各自的特色建立了不同的表格，突出各自的主題，增強了對比性。在做這些網頁的時候我就進行了如上所述的方法。但我所以網頁的背景顏色及主題顏色都是相同的以便突出我每一個網頁都是為凸顯我主題而服務。
3.實現網頁間的鏈接。
我的鏈接按鈕主要有四個“時尚首頁、時尚衣秀、推薦產品、潮流信息”它分別鏈接到我所做的四個網頁。鏈接的過程其實很簡單，主要是把要鏈接的文字選擇在選擇工具欄的鏈接按鈕最后選擇自己要鏈接的網頁單擊確定便可以了。
4.向靜太網頁插入動態效果。
在這一階段我遇到了許多的問題，主要是我在主頁插入我的flash的時候，開是我將帶碼粘貼到我的網頁上可是在瀏覽網頁的時候flash卻不能夠顯示。最后我向老師的請教后終于在老師的幫助下我成功的在我的主頁插入了flash。而在其它的二級網頁我主頁插入的是一些gif格式的動態圖片。
