網頁制作與設計大全11篇

緒論：寫作既是個人情感的抒發，也是對學術真理的探索，歡迎閱讀由發表云整理的11篇網頁制作與設計范文，希望它們能為您的寫作提供參考和啟發。

篇（1）

網頁制作課程包括設計軟件的學習和設計技術的學習兩部分。一般高校的計算機技術管理等專業都會設置一定的網頁制作課程來提升學生的網絡技能。

在課程設置上，一般院校都會在學生進入大二后開設網頁設計課程。主要原因是，網頁制作包含了較多的網絡技術語言，且考查到了學生對信息、設計的知識的綜合應用，需要在大一階段打好理論、技術的基礎。

網頁制作課程的教學內容主要包括程序設計語言、數據庫原理等。其中程序語言包括了C語言，C++語言，Java語言等，數據庫原理則分為Access數據庫基礎，VFP數據庫基礎等內容。學生可以根據自己的專業情況和學習進度從中做出選擇和組合。

2.教學目標

網頁制作課程的總體教學目標是，使學生通過對相關網絡技術基礎內容的學習和實際的上機操作，掌握一定的網絡技術應用能力，并在此過程中培養學生的自主創新能力和團隊協作精神。其中具體的教學目標有以下幾條：

2.1 知識目標

在進行網頁制作前首先要掌握一定的網絡基礎知識和軟件操作流程。例如Dreamweaver是網頁制作中十分常用的一種軟件。在進行網頁基礎知識的學習時要對軟件菜單欄、工具欄等項目的操作方法進行熟練掌握。對于一些基本的編輯、排版技術也要做到有一定的了解。具體應掌握的技術有表格繪制、排版的技術，動畫、音頻的處理技術，網頁編輯、鏈接的技術，圖形繪制暈染的技術等。

2.2 技能目標

技能目標主要指根據現有的網頁內容，通過模仿、修改等方式初步完成網頁的制作。在網頁中應包含一定的解釋、說明文字，與文字相對應的圖片、符號及一定的動畫、切換效果等。在進行網頁內容的排版時，可借助一定的表格劃分內容結構和層次，還可給網頁配上一定的背景圖片和音樂以豐富網頁內容，增加網頁的觀賞性和完整度。

2.3 情感目標

情感目標主要包括學生在進行網頁制作時培養的團體合作、自主創新及操作動手等能力。與此同時，學生在學習網頁制作的過程中也相應地提高了鑒賞能力和學習能力，給未來的職業發展打下了一定的基礎。

3.網頁制作課程的內容

網頁制作課程的教學內容主要包括網站制作基礎知識、網頁制作、網頁特效、網頁圖像處理和動畫制作等四個部分。其中，網站制作部分會涉及到網站和網頁概念的區分，網站設計語言等內容;網頁制作則會應用到Dream Weaver，FrontPage等網頁制作軟件;在網頁特效部分，會著重介紹JavaScript、Gif圖片的制作;在網頁圖像處理和動畫制作上則會應用到Photo Impact和Flash動畫制作軟件。

4.網頁設計課程的設計思路

盡管我國許多高校都開設了網頁設計這一課程，但由于課程設計、操作設備等條件因素的限制，其實施效果并不理想，制作出的網頁也難以達到實際使用標準。造成這一情況的主要原因有兩個。首先是網頁色彩的搭配不符合審美的要求，其次是網頁內容的安排缺乏一定的合理性和規范性。網頁設計課程的作用就是幫助學生在審美、設計等方面獲得全面的提高和成長，因此在設計教學內容時，必須綜合考慮到各個方面，設計出相對科學、高效的網頁設計培訓課程。

在教學進度的設置上，可以采用分部教學的方式，將一些具有難度的項目分解為幾個部分進行教學。例如幾個網頁制作軟件的應用，對于初學的學生而言具有一定的難度，教師在教學時可以先從基礎知識入手，使學生對軟件的用途有一個整體的把握。其次，在分部講解軟件中所包含的功能，使學生在實際操作中逐漸掌握軟件使用的方法。

課程設計必須充分遵循學生學習、進步的一般規律，切實提高學生網絡技能。為達到更好的教學目的，教師在教學時應注重根據學生的學習興趣進行教學安排，充分激發學生的學習動力，提高學習效率。同時，在教育形式上也可進行一定的創新，充分利用網絡資源，為學生提供更多的學科信息。在學習不同內容時，也應采用不同的教學模式。例如在學習網頁制作的相關理論知識時，要注重教學語言的簡潔、生動，使學生能在短時間內理解網絡應用語言和網頁圖像符號;在網頁制作過程中，應著重培養學生的自主創新能力和編排規劃能力。在設計網頁內容時充分保證學生的自主性，讓學生根據自己的審美情趣和專業技巧對網頁內容進行安排。教師在這一過程中主要起到引導作用，在學生遇到技術性困難時給予一定的指導和幫助，使學生能在具體的操作過程中，培養起一定的自學能力和創新能力。為提高學生的相互協作能力，教師還可建立合作小組，對一些重點難點的內容進行小組分工。在具體實施工作上，則由小組組員自主安排，在保證了小組合作的同時，也強調了學生學習的自主性。

5.教材分析

篇（2）

中圖分類號：TP393 文獻標識碼：A 文章編號：1009-3044（2015）31-0176-02

The Exploration and Design of the “Meticulous Teaching and Hot Training” Teaching Mode in the Course of "Web Design"

XUE Hui， YANG Xiao-feng

（The Teaching Affairs Service， Shangluo University， Shangluo 726000， China）

Abstract： In order to improve the teaching quality of the course of "Web Design"， this paper analyzed the characteristics of the course， designed the “meticulous teaching and hot training” teaching mode， made a comparison experiment of the teaching mode. The result showed that the model can effectively improve the teaching level of the course.

Key words： web design； teaching； model； design

1 《網頁制作》課程在計算機類專業課程中的地位和作用

如今網絡在人們的生活中占據了越來越重要的地位，網頁制作技術作為建設網站的基礎技術也展現了越來越多的應用，企業對網頁制作人才需求巨大。《網頁制作》課程是計算機類專業的專業主干課，通過該課程的學習，使學生全面建立對網站的認知，學會網頁制作和網站設計的基本方法，熟悉網頁制作與網站設計的基本概念和理論，掌握網頁制作的操作方法和制作技巧，使學生具備設計、開發、網站的能力，加強學生的實際動手能力和解決問題的能力，為以后激烈的就業競爭打下堅實的基礎[1]。

《網頁制作》課程是后續課程《交互式網頁動畫設計》和《》的前導課程。學生通過《網頁制作》課程的學習，可以解決《交互式網頁動畫設計》課程中對動畫網頁美術效果的設計需求，也可以解決《》課程中對網站前臺界面的設計和制作需求[2]。

2 《網頁制作》課程具有易于掌握、難于精通的特點

《網頁制作》課程屬于操作設計類計算機課程，和《計算機基礎》等課程不同的是，在簡單的操作背后隱藏著許多深層次的制作技術和操作技巧，學生學完課程之后，往往只掌握一些簡單的操作，只懂得一些簡單的技術，對于復雜的技術和深層次的制作方法一竅不通，做出的作品只能達到實習生的水平，無法達到應用型人才所需要的技術水準，無法滿足企業對人才的需求[3]。

造成這種情況的原因是，《網頁制作》課程涵蓋內容廣，技術層次深，制作技巧多，具有易于掌握、難于精通的特點。《網頁制作》課程的這個特點給學生掌握網頁制作技術造成了很大困難，要提高教學質量，必須克服這個困難。

3 針對《網頁制作》課程特點的“精講熱練”的教學模式

3.1 針對《網頁制作》課程易于掌握，難于精通的困難的解決辦法

1）把寶貴的課堂時間更多的用在講授深層次的制作技巧上

《網頁制作》課程總的教學時數是有限的，為了讓學生在有限的時間內掌握復雜的技術和深層次的制作技巧，就要把寶貴的課堂時間用在深層次的制作技巧上。《網頁制作》課程中許多簡單的操作、簡單的制作方法和《計算機基礎》課程是類似的，對于簡單的操作、簡單的制作方法大略講一下就可以，而對于復雜的操作，學生難于掌握的技術可以使用更多的時間來教學。

2）由講授和實踐分開上課轉變為在機房統一上課

傳統的《網頁制作》課程的教學模式是老師先在多媒體教室通過投影儀講授，然后學生在機房上機實踐。這種教學模式由于講授和實踐操作有一定時間間隔，對于簡單的操作影響不大，但對于復雜的操作，學生常常就忘記了操作步驟。課堂講授內容較多時，學生甚至會把不同功能的操作相互搞混。

為了使學生能夠掌握深層次的網頁制作技術，需要改變傳統的教學模式，更多地采取互動模式，以提高學生的學習效率[4]。最好講授和上機實踐統一在機房進行，教師通過機房的同步授課軟件講解、演示，講完之后學生立即練習，打破理論教學和實踐操作的時間間隔，使學生通過親自操作快速掌握相關技能。

3.2 “精講熱練”的教學模式

針對《網頁制作》課程易于掌握、難于精通的特點，本文提出“精講熱練”的教學模式，與傳統的教師先在多媒體教室講授，然后學生在機房上機實踐的教學模式不同，這種教學模式把講授和實踐結合在一起，統一在機房授課，如圖1所示。教師講授時主要講解復雜的操作和深層次的制作技巧，對于簡單的操作、簡單的制作方法大略講一下就可以，此為“精講”。上課時教師先通過機房的同步授課軟件講一塊知識點，然后學生立即練習，練完后教師再講下一塊知識點，講完之后學生再練，反復循環，循循善誘，使教師講授和學生實踐之間沒有時間間隔，此為“熱練”。精講熱練、趁熱打鐵，從而化復雜為簡單，變被動為主動，使學生在教師的引導下逐步深入學習網頁制作知識，掌握深層次的網頁制作技巧。

這種模式的特點是以教師為中心，以學生為主體，把教師講授和學生練習緊密結合在一起，變學生被動聽講為學生主動參與，創建交互式協作學習環境，加強師生交流和學習[5]，使學生在教師的引導下成為課堂的主人，從而有效提高教學質量。

圖1 “精講熱練”教學模式與傳統教學模式對比圖

3.3 “精講熱練”教學模式的優點

“精講熱練”的教學模式具有以下幾個優點：

1）“精講熱練”的教學模式克服了《網頁制作》課程易于掌握，難于精通的困難，集中有限的課堂時間用于深層次網頁制作技術的教學，能有效提高教學質量，使學生的制作水平和制作技巧達到較高的高度。

2）“精講熱練”的教學模式使教師講授和學生練習相結合，能夠充分營造學生積極參與的學習氛圍，有效活躍課堂氣氛，增進學生和教師之間的交流[6]，讓學生在教師的引導下快速掌握網頁制作技術。

3）“精講熱練”的教學模式由于把傳統的多媒體講授轉變為了機房講授，不僅增強了對學生的視覺沖擊，而且學生可以及時動手實踐操作，便于和任務驅動教學[7]、項目化教學[8]、案例教學[9]、層次化教學[10]等教學方法相結合，形成立體化教學體系[11]。

3.4 “精講熱練”教學模式的教學效果

筆者在自己所在學校同一年級計算機專業的兩個班進行了對比教學實驗，一個班采用傳統教學模式，另一個班采用“精講熱練”教學模式，課堂教學效果對比如表1所示。從表中可以看出，“精講熱練”教學模式的課堂教學效果明顯優于傳統模式。

期末進行了總評成績核定，總評成績由平時成績、實踐作品成績和期末考試成績三部分組成，其中平時成績占10%，實踐作品成績占40%，期末考試成績占50%，總評成績對比如圖2所示。從圖中可以看到，“精講熱練”教學模式的總評成績也明顯優于傳統模式。

表1 課堂教學效果對比表

[教學模式＼&課堂氣氛＼&互動性＼&學生興趣＼&逃課人數＼&傳統模式＼&一般＼&弱＼&低＼&較少＼&“精講熱練”模式＼&活躍＼&強＼&高＼&極少＼&]

圖2 總評成績對比圖

4 總結

“精講熱練”的教學模式可以有效克服《網頁制作》課程易于掌握，難于精通的困難，帶動課堂氣氛，提高學生參與學習的主動性，幫助學生掌握深層次的操作方法和制作技巧，能夠有效提高《網頁制作》課程的教學水平。該模式也可以推廣到其他計算機操作設計類課程，在課堂教學上起到示范帶動作用，改善計算機教學的教學氛圍和教學效果，慧及更多教師及學生。

參考文獻：

[1] 劉述，杜世友. 就業導向的網頁制作課程設計及其成效[J]. 中國電化教育， 2009（11）.

[2] 劉銘. 高職《網頁設計》課程的教學模式設計[J]. 職教論壇， 2010（35）.

[3] 張輝. 網頁制作類課程的教學改革與實踐――"先整體、后切分、再拼合"的新型教學法[J]. 佳木斯教育學院學報， 2010（5）.

[4] 黃宇建. 任務教學法在網頁制作教學中的實施過程和優勢[J]. 中國信息技術教育， 2014（14）.

[5] 劉楠. 網頁制作在教學中的設計應用[J]. 黑龍江教育學院學報， 2010，29（9）.

[6] 張洪星，褚建立. 高職高專《網頁設計》課程考核方式的研究與探索[J]. 教育與職業， 2007（2）. （下轉第179頁）

（上接第177頁）

[7] 薛巧梅. 任務驅動教學法在網頁制作教學設計中的應用[J]. 武漢船舶職業技術學院學報， 2013（5）.

[8] 鄭丹青. 項目教學法在動態網頁設計課程中的教學應用[J]. 中央民族大學學報（自然科學版）， 2014，23（2）.

篇（3）

doi ： 10 . 3969 / j . issn . 1673 - 0194 . 2017. 01. 087

[中圖分類號] TP393.092 [文獻標識碼] A [文章編號] 1673 - 0194（2017）01- 0155- 02

1 前 言

優秀的高校的網站建設和網頁設計建設有哪些重要作用？高校網站和網頁就是高校最基礎的形象窗口。它們主要可以用來打造高校的形象，宣傳高校的一些重要的信息，這里面包含了高校所蘊涵的校園文化，高校建校、發展的一切基本情況還有高校里面發生的希望外界了解的一些新聞信息。各種詳細的、創新的、更有活力又吸引力的網站建設和網頁設計的成果，利用圖片和文字的搭配方法、各種信息導航的具體使用、詳盡的說明等可以吸引更多搜索高校信息的瀏覽者，高校的招生在市場競爭里的一個重要方面也是要更為科學地打造自己高校的網站的建設和網頁的設計。在市場里獲得足夠競爭力的高校才能更有利的提高高校的品牌。宣傳高校的基本信息，使其能傳達給全國甚至是國際上的目標人群，讓他們通過瀏覽高校網站和網頁的時候傳輸給他們高校的品牌形象，讓他們更便利的獲得高校的信息概況。這既能推動高校被全國被世界更便利地了解，也能夠不斷地提高自己的校園品牌形象。高校正是利用網絡宣傳網站和網頁，降低高校宣傳成本，提高高校競爭力。在傳播高校的網站和網頁的時候，可通過一些策劃的公司幫助鎖定目標客戶，比如鎖定一些需要報考高校的人，將自己的信息進行推送。不少的高校都會將高校網站建設和網頁設計信息當成自己宣傳招生的重要一方面。也正是因為不同高校都會有自己的辦校特色和發展的個性，在以信息宣傳和內容創新取勝的時代，網絡上網站和網頁的宣傳就是很重要的一種宣傳方式。著可以跨越時空的限制，不用到校了解、也不僅僅只針對當地的受眾群，可以讓全國甚至世界各處的人了解高校的情況。高校的網站甚至可以豐富高校學生的學習平臺，里面有更多的方式可以幫助學生查閱資料，網絡資源中高校的網站可以提供非常豐富并有針對性的資源，學生們可以在上面各取所需，這也是高校網站和網頁建設中提供給學生學習的重要一方面作用。

2 高校網站的建設和網頁設計建設和網頁制作現狀問題

2.1 高校網站內容過于單一

高校網站建設和網頁設計因為其特殊性一般在內容的監管比較嚴格，在內容上也很容易變得單薄無趣，對瀏覽者沒有吸引力，高校類型站點在娛樂互動性會比較不足，特別是高校網站往往定位在以“自我為中心”也就是以高校的信息為主要內容呈現，并沒有充分考慮到學生以及社會對高校網站的內容要求，這種形式上的單一，并不可怕，可怕的是“自我為中心”后的自我封閉，在現代信息化的時代背景下，高校必須要有獨立的自我認識和氣質，否剛就會成擺設，而從目前的情況來看，內容單是所有高校網站建設和網頁設計建設中經常會出現的問題。

2.2 高校網站的建設和設計缺乏全局觀念

在網站建設和網頁設計建設的規劃上系統的規劃設計往往會缺乏全局觀念，工作量非常的大，會出現多項重復的內容，導航的設計在網站設計中也是非常重要的，導航設計既要在具有新穎、創新的同時也要保證它能夠實際發揮作用，更能夠與高校整個網站的建設和網頁的設計相聯系、將高校的形象融入進去，使導航的信息也能夠設計的更加完整。導航也是有內容的，具有實際作用和創新吸引力同時并有的，這些都是符合瀏覽者的實際操作的。

2.3 高校網站的管理程度不足，內容更新緩慢

高校網站建設和網頁設計由老師空閑時間做，但一個人很難管理的完整的網站建設和網頁設計建設工作和后期維護、和內容的定時更新，因為高校擁有多個部門，這些部門的內容和功能也都應該在高校的網站和網頁上有所體現，但是因為完整的網站和網頁建設中各個部門可供介紹瀏覽到的信心非常的有限，一些深層的工作和作用也是很難體現到的，而且網站和網頁建設中的繁復導致網站和網頁中的內容更新太慢，新聞信息等都跟不上校園的發展，內容的更新緩慢、滯后也是高校網站建設和網頁設計建設中常見的問題。

2.4 高校網站的安全性不足，許多網站無獨立服務器

通常高校網站建設和網頁設計都不會自己建立服務器，而是選擇虛擬主機空間作為放置網站建設和網頁設計內容的。這些空間都是有著不同的大小，這些大小也要根據高校的具體情況而不同，這里面有規模的大小和自己的大小選擇等，一般實力雄厚的高校會選擇自己高校服務器來確保數據的安全。高校網站建設和網頁設計是屬于公益性，因此會出現比較多的安全隱患。

3 高校網站建設和網頁設計建設規劃設計與網頁制作方法淺析

首先要確定的是程序，其次是排版，然后是內容，最后是推廣和運營。具體的每一步都要有詳細的思考和準備。

3.1 要明確網站建設和網頁設計的基本內容和基本目標

確立做網站建設和網頁設計的目標，網站建設和網頁設計建好后，要達到什么樣的目的，擴大招生還是供學生使用？也就是確立主體內容。確定服務對象，是面對學生，還是家長，還是老師。高校和它的服務對象最初的交流窗口就是通過高校的網站和網頁，學生和家長都可以通過網站和網頁了解到高校的辦校的理念，高校的教育情況，教學中的改革成果等，這些希望服務對象了解的信息一定是高校網站和網頁設計中基本要做到的。

3.2 要規劃好各種欄目

清晰的欄目方便瀏覽網站建設和網頁設計的瀏覽者，希望達成什么效果是否能實現美觀和表述同時實現。加強特色內容建設。特色就是競爭力。高校網站和網頁建設中需要規劃好各個欄目的內容，這就需要各個欄目負責人一起組織規劃分工協調好各自的工作。負責網絡建設的中心應該積極分配好工作，設置什么風格，不同部門不同系的不同模板的設置都規劃好。

在設置功能方面要適合用戶的操作，簡化簡明操作步驟比如怎么留言，怎么報名，填寫什么，網站建設和網頁設計使用者怎么更新新聞，怎么傳活動圖片，這些都要一目了然，方便客戶也方便自己操作。

3.3 加強硬件的建設，做好師生信息技術培訓

隨著各地經濟的發展和教育信息化工作的不斷推進，越來越多的高校在新一輪建設高峰中購置了大量的先進硬件資源，但是再先進的先進的硬件都是要有一定信息技術和專業素養的師生來操作的。高校的硬件利用率并不高因而必須在加強硬件建設的同時，做好師生信息技術培訓、電腦軟件資源的配套、相關的管理制度等的“軟件”建設。

3.4 加強網站的監管和提升安全意識

在網站建設和網頁設計的監管方面也是非常必要的，高校網在設計中需要有監督管理的部分，這些并不只是防御黑客或者病毒的入侵，而是也需要監督信息傳播中對信息的篩選，畢竟這些信息直接面向了學生，所以要對網站和網頁上傳播的信息進行有效的監督管理，監督這一部分需要專門的工作人員進行，加強監管的各種措施是一個長期又堅決的工作。

3.5 加強高校網站的宣傳和引流

注重瀏覽量的擴大，達到建設網站的目的，要想擴大瀏覽量，加入一些宣傳手段，加強校友錄的建設也是一個可行的辦法，一個優秀的高校網站離不開廣大畢業生校友的參與和支持，畢業的校友會通過書信和電話等方式與母校保持聯系，很多熱心的校友也會積極致力于母校的發展中，宣傳母校、推動發展、加強聯系等方式都是他們對母校責任心的體現，加強這些校友的校友錄建設，綜合他們的力量，能夠吸引更多人的宣傳和為母校發展獻計獻策的動力。

4 結 語

高校網站和網頁建設是高校宣傳打造自己的重要方式，好的網站和網頁建設對高校的發展有著各種推動作用。但校網站建設和網頁設計過程中存在的一系列問題，校網站建設和網頁設計需要從技術、組織、創新等的改變入手，還需要與時俱進的方法，增加更多的交流，融入更多的創意，綜合自身的優點來達到校網站建設和網頁設計的目的。建立功能完備、操作簡單、應用豐富的高校網站是一項系統性的工程。通過制訂相應的高校信息化發展規劃和配套的規章制度來予以推行，這樣才能使高校的信息化應用水平提高到一個更高的水平。

篇（4）

第五，單擊菜單“窗口”中的[框架]，顯示[框架]面板，在[框架]面板中，選中“mainFrame”，在[屬性]面板中將“滾動”設為“自動”。

第六，在頂部的框架中插入圖像。在左側的框架中插入一個7行1列的表格，在表格中輸入文字。

第七，在左框架的表格中選中文字，分別設置文字的超鏈接。

第八，按下F12鍵，打開瀏覽器查看網頁內容。

這個例子用框架布局整個頁面，但在框架里又嵌套了表格，這就實現了框架和表格有機結合，讓頁面布局更加靈活。

三、表格和框架的優缺點

表格是用于劃分頁面區域的。使用表格布局頁面的好處是：表格方便排列有規律、結構均勻；使用表格會使頁面結構清晰、布局整齊；表格可被絕大部分的瀏覽器所支持，具有很好的兼容性。表格的缺點是容易產生垃圾代碼，影響頁面下載時間，靈活性不大，難于修改。

框架則是用于分割瀏覽器窗口的，框架可以將一個頁面拓展為多個頁面，每個頁面都可以顯示不同的網頁。框架的優點是支持滾動條，方便導航。框架的缺點是：難以實現在不同框架中精確地對齊各個頁面元素；保存時不方便，應用范圍有限；兼容性不好，并不是所有瀏覽器都提供良好的框架支持。

使用表格和框架對網頁進行布局，各有利弊。初學者要根據不同網頁頁面的要求做出良好判斷。

篇（5）

【關鍵詞】

網頁設計；高職；教學內容

隨著互聯網逐漸深入到經濟生活的各個角落，涌現出越來越多的網站。相應的，各類單位、企業等用人單位對網頁設計與制作人才的需求也開始變得普遍。而《網頁設計與制作》也早已成為大多數高職院校普遍開設的課程，甚至在同一所高職院校中也有相當數量的專業開設了這一課程，這些現象都反映出了社會對網頁設計與制作人才的需求。而互聯網的不斷發展也在推動著社會對網頁設計與制作人才水平要求的不斷提高，也對《網頁設計與制作》的教學提出了新的挑戰。

一、《網頁設計與制作》教學內容存在的問題

1.教學內容與實際應用脫節。

目前，《網頁設計與制作》的教學內容大致分為：網頁設計基礎知識、HTML語言基礎、CSS樣式基礎、網頁文本和圖像、超鏈接、表格、框架、Div、多媒體網頁、模板和庫、站點管理維護。不同院校、不同專業在具體內容的選擇上可能會有所差異，但大致都包括了這些內容。首先，在《網頁設計與制作》教學中，往往會以Dreamweaver這一網頁制作軟件的使用作為主要內容，所有的操作都依賴于Dreamweaver，很少涉及對HTML代碼的講解，這導致學生無法熟練的查看、修改HTML代碼，一旦離開了Dreamweaver，學生將無法制作、修改網頁。而在實際應用中，HTML代碼是在進行網頁設計時無法繞過的一個知識點。因為在Dreamweaver的設計視圖下操作是不能解決所有問題的，很多網頁設計中出現的問題只有通過查看HTML代碼才能發現并解決。此外，Dreamweaver也并不是計算機上的常用軟件，學生應該具備在脫離Dreamweaver的環境中進行簡單網頁制作、修改的能力。其次，早期的頁面布局以表格布局為主，但隨著互聯網技術與網頁設計標準的不斷發展，表格布局技術已經不再是主流，取而代之的是Div+CSS布局，也是所謂的內容與形式分開的布局方式。在這種布局方式下，頁面元素的布局更加靈活、頁面代碼更加簡潔。而更重要的是，采用這種布局方式的網站在整體風格的管理和后期維護上更加方便、效率更高。因此，《網頁設計與制作》的教學內容應當給予Div+CSS足夠的重視，加大其在教學內容中的比重，以增強與實際應用聯系的緊密程度。再次，隨著移動互聯網的興起，通過手機等移動終端訪問互聯網的用戶數量已經超過了傳統的通過PC訪問互聯網的用戶數量，如何設計適合于移動終端瀏覽的頁面，也應該作為《網頁設計與制作》教學內容的一部分。

2.只重視“制作”忽略“設計”。

不同院校、不同專業對《網頁設計與制作》課程的命名不盡相同，但大多帶有“設計”二字。而在實際的教學內容安排中，卻往往沒有體現出“設計”的部分。網頁設計是一門典型的交叉課程，既有計算機科學知識，又有人文社會科學知識。網頁設計雖較多的依賴技術性手段，但并不代表在教學內容的安排上就要以技術為主導。學習Dreamweaver也是只是為了掌握一種工具而不是最終目的，成功的網頁設計作品還要有美觀的布局、配色和人性化的信息導航。

二、確定合理的《網頁設計與制作》教學內容

1.加強對HTML基礎的教學。

雖然Dreamweaver作為主流的“所見即所是”編輯工具，可以讓使用者不接觸HTML代碼就能完成大部分網頁制作的工作，但是只有真正理解HTML語言，才能理解網頁工作的原理，才能真正深入到網頁設計的核心，才能學習到其他優秀網頁設計作品的內涵，為將來的能力提升鋪平道路。

2.加強對Div+CSS內容的教學。

Div+CSS布局已經是成熟的主流網頁布局技術，《網頁設計與制作》的教學應該突出對該技術的側重，將已經被淘汰的表格布局作為輔助。同時，對CSS的教學內容應該貫穿始終，因為CSS可以說是控制網頁元素表現形式的關鍵，掌握了CSS就能根據需要輕松的設置頁面元素的各種效果，從而為整個頁面增色。

3.增加對藝術設計的教學。

目前網頁設計行業內最缺乏的是具備優秀設計能力的高端網頁設計人才，而目前《網頁設計與制作》教學中最欠缺的就是對設計能力的培養，導致學生在學完課程后也只能進行簡單的模仿和重復，無法進行有效的創新和設計。因此網頁設計課程的教學應該以藝術設計為出發點，增加對傳統藝術設計方面的教學內容，如構圖、色彩、設計思維等知識，并進行相應的實踐練習，以此培養學生基本的審美能力和在設計上的創新能力，這樣才能讓網頁制作技術服務于網頁設計，從而真正體現出“設計”，避免舍本逐末。

4.補充對主流技術的教學。

互聯網的發展日新月異，新的技術不斷涌現，作為《網頁設計與制作》的任課教師，應該具備一定的判斷能力，將未來網頁設計技術發展的新趨勢呈現給學生，幫助他們緊跟行業動態，為將來就業打下良好基礎。

三、結束語

《網頁設計與制作》作為一門開設多年的課程，在教學內容的設計上必須要關注行業的最新動態，同時明確課程的核心內容，才能培養出社會所需要的網頁設計人才。

作者：韋喆哲 單位：廣西經濟管理干部學院信息管理系

篇（6）

項目教學模式作為一種以生為本，具有多元化、開放性特點的新型教學模式，強調了在教學時，以學生文本，加強對意義建構的主義理論、探究式學習的理論的重視作用。即在整個教學過程中，嚴格遵循“以生為主體，教師輔導”的教學原則，以教學目標、任務為出發點，讓學生在教師指導下，按照自己的學習能力與喜好，與同學進行自由組合，選擇相應的題型，組織開展項目研究學習，以充分發揮學生的主觀能動性，從而提高他們的創造能力與創新精神。因此基于項目教學模式下，對“網頁設計與制作”課程進行改革與實踐，勢在必行。

1教學改革的理念與思路

在計算機應用專業的教學中，對于網頁設計和制作課程的教學總體目標，主要是通過真實的網站項目來開展教學活動，讓學生能夠依據網站開發的過程和網頁制作方法，結合需要制作的要求，制作出簡單的網頁圖像與自動生成的動態網頁，以提升學生網頁制作技能，積累豐富的網頁制作經驗，從而滿足日后工作崗位需求。因此在進行網頁設計與制作時，應體現以下理念：(1)培養與人溝通和團隊合作的能力。為能準確地把握項目制作的要求與客戶的需要，教師必須重點培養學生與人溝通、團隊合作的能力。讓學生通過自由組隊的方式合作開發項目，共同努力完成布置的任務，讓學生之間能夠形成良好合作的關系，以提升學生的心理素質與適應社會環境的能力。(2)培養職業技術能力和解決問題的能力。培養學生具備扎實的專業技術能力，這是網頁設計與制作課程中能力培養的關鍵。因此在進行教學時，對學生職業技術能力的培養，主要包括以下幾方面：①網站的規劃能力。在項目教學中，應了解分析項目的內容，正確地理解項目的要求，并合理規劃項目，編寫網站的建設方案。②網站的設計能力。學生應熟悉網頁的工作環境，詳細規劃與設計網頁布局，并了解開發的主要工具，靈活使用網頁元素，保證網頁設計順利完成。③網站的維護與更新能力。應依據專業規范操作，來維護與更新網站。④解決問題的應變能力。網頁設計對專業性要求極高，因此要想強化學生處理問題和解決問題的能力，必須引導學生熟悉與掌握網頁設計中較為常用的方法與工具。(3)自學與創新能力。自學能力即培養學生自我解決問題的能力，主要是指學生在學習的過程中，能夠形成良好的學習習慣與掌握所學的知識，并通過自主學習的方式，來獲得有用的信息，以積極的應對職業中遇到的問題。而創新能力則是培養學生具備創新思維與創新意識，從而為日后工作打下扎實基礎[1]。

2基于項目教學的“網頁設計與制作”課程改革與實踐的途徑

2.1課程整體設計

在網頁設計與制作課程中應用項目教學，是否能成功的關鍵在于給學生安排的學習任務是否恰當。通常在設計項目的內容時，必須保證對學生具有挑戰性、實用性、趣味性以及可操作性，要求學生通過查閱相關資料，經過仔細研究和思考，便可順利地完成學習任務。但需要特殊注意的是，教師在設計學習任務時，必須按照教學目標與學生個性差異來設計，保證內容設計不能過于復雜[2]。例如在“網頁設計與制作”的教學過程中，課程整體設計的目標是從簡單——復雜——綜合網站建設項目的訓練方式，讓學生能夠依據網站業務的需要，對網站需要的功能加以分析，以明確網頁風格與結構，理解并設計出相應的制作方案，從而掌握網頁制作與網站的方法，熟練HTML語言、Dreamweaver網頁制作軟件，能讀取JavaScript代碼，并學會靈活運用CSS設計網站的元素。這時教師需要在設計上，依據項目的需要，選出“企業網站建設”作為該課程的實訓項目，將課程設計任務劃分為5個項目，16個任務、每個任務4學時，前2個項目是網站點的創建和靜態網頁設計，屬于簡單的入門項目，由教師輔導；第3與4個項目是進行網頁素材設計和制作，依據規范進行標準化網頁設計；第5個項目課后完成項目的情況，讓學生能夠積極參與項目的開發和維護中，以拓寬課程教學的內容。但是每1個項目都應以任務為載體，將課程學習的內容劃分到每1個項目中。且每1個項目之間都有明顯的獨立性，同時項目之間相互聯系，知識與技能循環漸進；前1項是后1項的基礎，后1項是鞏固前1項的關鍵，實現知識和技能學習的層層遞進、由淺到深、由簡到繁，以樹立學生學習的自信心。

2.2建立項目小組

在明確項目教學的內容后，教師集全班的學生，讓學生依據項目，自由分組學習，全班分成若干組，每組為3~5名，并安排組織能力較強、善于表達的學生擔任本組的小組長。然后每組學生在組長的領導下，按照項目要求的內容，在課后充分利用參考書目、內容對網站制作與設計所涉及的資料進行查閱。此外，教師是項目的指導者，應適當引導學生整理所需要資料。讓每個成員之間依據不同的學習任務，專門負責自己的問題。例如在“網頁設計與制作”的教學過程中，教師依據本班學生的情況，將學生劃分成每組5名成員后，結合實施方案，讓1名理論功底扎實的學生負責網站欄目的整體規劃；1名計算機操作能力較強的學生負責網頁制作；2名程序設計能力較強的學生負責代碼的編寫和程序調試；然后讓擔任小組長的學生負責對網站加以宣傳，并制定項目進度表，明確成果完成的時間，同時詳細記錄每個成員學習的情況、態度，為教師的評價提供依據。

2.3項目教學的實施

項目教學的實施主要是引導學生為完成項目，而組織開展自主性的學習，以輔導學生依據項目學習中所需要的知識與技能，通過有效的學習方法來開展學習活動，激發學生的學習熱情與主動性[3]。例如在確定各小組的學習任務后，進入具體“網頁設計與制作”課程的學習中，一開始部分學生會感覺到制作一個網站，以我個人的能力，難以順利完成教師布置的任務，又怎會設計出具有個人鮮明、獨具個性的網站來吸引客戶的注意力？針對這些問題，在進行教學時，教師需要將教學知識轉變成學習任務，以學生合作的方式，然后詳細講解網頁設計與制作的知識點，讓學生結合參考目錄和資料，來回答提出的學習問題：(1)什么是框架？有什么作用？(2)框架和網頁之間的聯系？框架的優缺點？(3)依據各網站主頁布局，怎樣合理地使用框架？這樣學生不僅能夠在合作的前提下，進行自主探究學習，還可快速找到問題的答案：在Web瀏覽器窗口中，HTML框架集文檔顯示的若干個獨立的可滾動區域就是框架，框架集中每一個框架在Web瀏覽器窗口中，屬于自己管轄區域內顯示一個HTML文檔，可使用選項內是否滾動和可調整大小來調整頁面。

2.4成果展示

在網頁設計與制作課堂教學中應用項目教學時，項目成果的展示是為教師評價提供參考的關鍵。因此在實際項目學習成果展示的過程中，要求教師應依據項目教學的要求來組織各個小組的小組長匯報本組的項目成果。但需要特殊注意的是，小組長在展示、匯報本組的項目成果時，需要詳細說明作品涉及的知識點、創新、優缺點和項目中遇到的困難，并說明對于遇到的問題，應該如何解決，而其他小組的成員，也可提問與設計有關的思路、技術和特點等問題，讓課堂教學生動活潑，從而提高教學的效果[4]。例如在“網頁設計與制作”的教學過程中，各小組完成動態網頁作品的制作后，教師應通過組織活動的方式，讓每個小組的組長借助電子演示文稿的方式，詳細的介紹、JSP和PHP等動態網頁技術，但是由于時間的限制，教師需要引導每個小組結合學習的情況，將關于ASP的內置對象：Request、SQL查詢語言、Respone、Server、Application、Session以及ADO組件中的Connection、Command和Record.Set等歸納為一個單獨的知識點加以闡述，以便其他小組的成員理解掌握Dreamweaver數據庫、綁定和服務器行為等網頁制作知識。

2.5考核方式的改革

項目完成后的最后環節就是教師要進行及時客觀的點評與總結，評定學生的學習成績。但是以往的課程考核方式都是通過筆試與期末提交個人作品的方式來考核，這種考核模式過于注重結果，忽略學生學習的過程，難以達到項目教學的考核目的。因此在對學生的成績進行評價與總結時，教師必須將現場匯報、學生自我評價和學生互評內評價內容納入到考核評價中，形成完善的課程考核評價體系，從作品的主題、版面、圖片、色彩搭配、網站布局和超鏈接等方面來考核學生的口頭表達能力、溝通能力、日常出勤、課堂表現和每個階段實訓項目的質量，以了解學生掌握的技能，然后通過百分制的方式進行最后總評，依據40%的比例納入到課程總評成績中，實現評價的合理性[5]。

3結束語

綜上所述，項目教學在網頁設計與制作中的應用，不僅能豐富課堂教學的內容，拓寬學生的知識面，實現知識的轉化與整合。還可按照項目的目標進行課程的整體設計、建立項目小組、成果展示和考核，將枯燥、乏味的文字變得更加生動有趣，讓學生積極參與到項目活動中，充分發揮學生的主動性與潛力，進行自主性探究學習，以培養學生形成良好的學習習慣，從而促進學生全方面發展。

參考文獻：

[1]勞飛.基于項目化教學的“網頁設計與制作”課程改革與實踐[J].教育與職業,2014(29)：139-140.

[2]毛樂琦.高職《網頁設計與制作》課程項目化教學改革實踐[J].電子制作,2013(23)：113-113.

篇（7）

隨著互聯網的發展和普及，網頁設計和制作技術成為網絡時代非常實用的技術，這一課程也成為學校開設的熱門課程。無論是計算機專業的學生還是非計算機專業的學生，網頁制作都成了一門重要的基礎性技術課程。但是很多學校在教學中采用傳統的教學模式，導致學生的學習積極性不高，實際動手能力也比較差，為了讓學生快速的掌握網頁設計和制作的技術，需要采用一些新型的教學方法實施教學，加強學生綜合能力地培養。

1加強學生創新能力的培養

創新是一個民族的靈魂和動力，同時也是當今社會競爭的核心。學生創新能力的提升和創新意識的增強對于他們以后的發展具有非常重要的作用。網頁設計與制作教學作為新時期教學的主要課程，在教學中培養學生的創新能力有利于促進整體教學的發展。因此，在教學中，可以通過多方面內容加強學生創新能力的培養，首先，可以通過興趣教學法喚醒學生的求知欲望，興趣是能夠推動學生求知的內在力量，學生只有對某一學科充滿興趣，才能夠持續的鉆研該學科知識，從而增強學生的學習效率。在教學中，為了增強學生對網頁設計和制作的興趣，教師可以在上課時準備一些網頁作品，讓學生對作品進行點評，然后提出改造的意見。讓學生在頭腦中對網頁設計有一個模糊的認識，產生做網站的想法，這樣一來，通過教師的指導就能夠讓學生梳理一個成型的站點框架，緊接著引導學生如何做網頁，如何使用工具，學生對這些內容產生興趣，就會帶著教師提出的問題進行主動探索和學習，以此增強學生的學習效果。除此之外，還可以通過精品賞析的方式增強學生的學習靈感。網頁設計和制作課程是一門藝術和藝術相結合的課程，學生不僅要掌握基本的網頁制作技巧，還要具備欣賞美和創造美的能力。創造的來源是靈感，而靈感的來源則是通過觀察，因此，可以在教學中設計精品賞析的環節，利用上課之前的時間展示作品，向學生展示一些布局合理，設計新穎的精美網頁，讓學生對這些網頁進行觀察和欣賞，這樣不僅可以拓寬學生的視野，同時還能激發學生的創造靈感，為學生以后設計出精美的作品奠定基礎。

2培養學生的網頁制作綜合能力

在學生掌握網頁設計和制作的基本知識之后，網頁制作綜合能力的培養就顯得非常重要了。即使學生掌握了網頁制作技術，也不一定能夠設計出好的網站，只有提升學生的綜合能力，加強對他們所掌握知識的綜合應用，才能夠設計出一個精美的網站。為此，需要注重學生在實踐方面的能力培養，可以從教學實驗方面入手，將所有的理論教學和實驗教學都安排在計算機機房完成，可以讓學生在學習理論知識之后直接進入實踐探索階段。此外，為了給學生提供更好的實踐機會，可在學校建立計算機基礎教學網，網頁設計和制作教學的老師可以建立自己的教學網站，同時給學生分配相應的網站空間，要求學生建立自己的個人網站主頁，然后將自己的實踐作業上傳到網站空間中，設計的風格和主題不受限制，網站主頁的內容也不做要求，學生可以根據自己的興趣進行網頁的制作，將所學習的網頁制作技術靈活的運用到個人網頁的設計中，做好個人網站。為了讓學生在網站設計中學會創新，教師可以搜集一些具有創意的網站和網頁設計的素材，和學生一起分享，然后與學生所做的網站進行對比，從而提升學生的創新能力。在網站設計中，針對不同的設計環節，學生可以自己發現設計中存在的問題，然后進行分析和解決，對于學生綜合能力的培養具有很大的幫助。

3加強培養學生的團隊協作能力

現在社會的分工越來越細，很多工作都需要人們協助完成，這樣以來，團隊精神就顯得格外重要。協同合作是團隊精神的核心內容，尊重個人的興趣和成就是團隊協作的基礎。就學生而言，獨立意識較強，現代的學生比較自我，溝通能力也有待提升，這些缺陷顯然不適合學生未來的工作。網頁設計和制作教學是一門實踐性要求較高的課程，同時也對學生的團隊協作能力要求很高。在教學中的綜合實訓中可以選擇采取項目教學法實施教學，將學生分成不同的小組，在自愿的基礎上進行強弱搭配，并且每一個小組推薦一位組長，在老師布置任務之后，組長可以做好小組內的分工，讓學生能各司其職，然后合力完成作品的設計和制作。在作品制作中，如果組內的成員存在意見不同意的現狀，組長可以和其他的成員進行溝通協調，最后達成一致，當組員能夠為同一個目標一起努力時，無論最后的結果如何，學生最后都會有成就感。在這一過程中，有利于提升學生的團隊協作精神，增強學生的溝通能力。

4結語

網頁設計和制作教學是一門實踐性很強的課程，對于學生的綜合實踐能力以及創新能力的要求較高，因此，在教學中，教師要給根據學生的興趣愛好設計教學內容，并且為學生提供一些優秀的教學作品，讓他們進行賞析，在優秀作品的激勵和教師的引導下，學生的學習興趣會有很大的提升，從而真正的投入到網頁設計和制作的探索當中，熟練的掌握網頁制作方面的技巧，增強學生開發和維護網站的能力，使他們的知識結構不斷得到完善，對于教學效果的提升會起到很大的作用。

參考文獻:

［1］馬玲燕．《網頁設計與制作》課程的教學實踐研究［D］．呼和浩特:內蒙古師范大學，2013．

［2］畢惠麗．淺談網頁設計與制作教學中學生能力的培養［J］．新課程(上)，2012，02:185．

篇（8）

隨著萬維網的迅速發展,網頁已經成為網絡世界傳播信息、開展業務的最主要載體,網頁制作相關職位的市場需求持續增長。中等職業學校相關專業紛紛開設了網頁制作課程,但是對于非計算機專業的學生來說,沒有前期基礎知識的支撐,對于理論的學習會覺得較枯燥,實踐操作上手容易,但想要融會貫通卻很難,很多學生死記硬背,久而久之學習變成了一種負擔,學生的學習積極性和主動性都受到了一定的影響。在這樣的教與學的過程中,想要讓學生體會到學習的快樂就變得更難,快樂學習成了一紙空談。面對這樣的狀況,在網頁設計與制作教學中,我積極探討多種教學方法,合理設計教學環節,采用適當的評價方法,努力增強學生的學習快樂感。

一、采用適當教學方法,激發學生的學習興趣

傳統的教學方式是教師在課堂上講授理論內容,學生上機練習,教師輔導。這樣一堂課結束后,學生可能對上課講的內容聽明白了,但在實際操作時往往無從下手。《網頁設計與制作》是一門實踐性很強的課程,教師讓學生動手去做,經歷網頁制作、網站設計的各個細微環節,實現教與學的互動,才能充分激發學生主動學習的興趣。學生具備了網頁制作的基本知識和操作能力,教師可以采用“模仿”式教學,讓學生設計和制作一個完整的網站,邊做邊學,使學生進一步熟悉相關理論知識的應用與實際操作。

在教學中,教師要選定一個難易度適中的網站,既不能太難模仿,使學生產生畏懼心理,又不能太簡單,而達不到教學的目的。學生在“模仿”課環節,對指定的網站首頁和其他主要網頁進行模仿還原,該網站的各類素材可以直接使用,對于頁面在尺寸、色彩、外觀上也可以相同。對于這種特定的、明確的任務,學生往往會表現出極大的熱情。學生在演練的過程中難免會遇到各種問題,網站完成以后,普遍都會存在著不同方面的缺陷。老師應通過實際案例的具體剖析,拉近學生與課程教學的距離,將收集的典型的問題重點講解。學生因為剛剛實際操作過,對具體的問題有具體的認識,因而在聽講過程中針對性較強,對如何解決自己遇到的問題也會很感興趣。興趣是最好的老師,有興趣才有快樂可言。

這樣,學生既可以復習網頁制作的基本操作,又能對完整設計一個網站的流程有更深的了解。學生在模仿教學的過程中,會不斷地克服一個又一個的困難,學習自信心會大大地增強。愛默生說過,自信是成功的第一秘訣。有了信心,學生才能起航去找尋學習中的快樂。

二、注重綜合實踐環節,調動學生的學習主動性

在學生基本掌握了本課程的內容后,教師要注重綜合實踐環節的融會貫通,可布置一份綜合作業,要求學生設計一個個人網站,網站既要有鮮明、統一的風格,又要有完善的內容,頁面的結構、圖片的位置、鏈接的方式設置合理,做到網頁布局的和諧統一,還要做到容易更新,等等。要做到這些,學生就必須在制作網站之前,對網站進行一個總體規劃,然后逐步進行設計。

為了讓學生展現良好的創作技巧和獨特的風格,布置綜合作業之后,教師可先讓學生進行選題,構建出自己的網站結構,然后上網查詢相關的資料,再對網站進行規劃,寫出書面的網站設計方案,教師對每個學生的方案進行審查和評閱,及時指出應改進的地方和存在的問題。通過這些環節讓學生學會查找、閱讀專業文獻資料的方法,培養學生撰寫方案的能力。

如此完整的綜合實踐,放手讓學生依照自己的想法設計、制作屬于自己的網站,讓學生自己做主,學生的學習主動性會大大提高,就能愉快、積極地去學習,調動自己的內在潛能,不斷完善和提高自己。學生對某一件事和某一項活動的主動性發揮得越充分,與之相關的能力發展得就越快。

三、綜合全面評價學生,增強學生的學習成就感

《網頁設計與制作》課程的考核方式承襲傳統的應試模式,考試內容側重于對記憶型知識的考查,忽視實踐動手能力和知識運用能力的考查。這樣傳統的考核方式既不能考查出學生真正的實力,在某種程度上又束縛了學生多向思維的發展。為了讓學生對學習《網頁制作與設計》課程產生興趣,除了理論考試之外,我們還應該將整個考核過程融入到日常的教學環節中去,設計出讓學生容易接受并感到“快樂”的考核方法。

實踐表明,《網頁設計與制作》課程的考核方式應該以學生實際制作的網頁作品作為考核的主要內容。在作品考核的基礎上,把學生的學習過程也納入考核的范圍,形成“過程+作品”的考核模式。教師可以將學生不同階段作品的完成情況作為考核依據。這樣,教師不僅可以有效控制學生的學習過程,而且可以根據反饋,適當調整教學進度。

一直以來,考核都是教師的“專利”,學生是被動的“待估品”,這樣傳統的考核方式讓老師和學生的距離拉得太遠,產生疏離感。“親其師”才能“信其道”,只有老師做學生的朋友,親近學生,與學生相互學習、共同切磋,以學習成員的身份與學生一起參與到學習的過程中,學生才敢在老師面前放松身心,體驗到零距離帶來的那份親切,敞開自己的心扉。因此在考核中,教師要放棄自己的“權力”,和學生一起相互的討論、評價,讓學生享受到自己考核自己的樂趣。學生在其中找到自己的優點,會肯定自己;發現自己的缺點,會提高自己,學習成就感會逐漸增強,考核過程就不再是痛苦的,而是蘊藏無限快樂的過程。

在網絡高度發展的今天,學生可以非常便捷地在網絡上獲取到大量的關于網頁制作的學習資源,因此老師面臨著更多的挑戰,不僅需要對網頁制作相關技術進行持續研究,而且要在教學方法、教學手段上不斷進行革新,以充實的內容吸引學生,以活躍的氛圍打動學生,讓學生愛學習、好學習,在學習過程中獲得成就感和滿足感,得到身心的愉悅,實現快樂學習。

參考文獻:

[1]謝志妮.案例教學法在《網頁設計》課程中的應用[J].廣東青年干部學院學報,2007,(68).

篇（9）

互聯移動終端的大面積推廣，使得掌握網頁制作技術的人才在各個行業里都成為必不可少的需求；同時，地方普通高校為社會服務的使命感在不斷增強，如何培養出“學即能用”的人才，使之在短時間內掌握主流的網頁設計技術，提高站點訪問量，是這門課程課堂教學效果進步的體現。

一、技術背景與課堂教學要求

（一）Internet發展歷程

Internet經歷了從Web1.0到Web3.0的迅猛發展。Web1.0是靜止、單向、被動的；Web2.0則為用戶開設了主動權，使得用戶和網站可行雙向信息互動；Web3.0提升了用戶的主動權，用戶可對頁面的多種元素（顯示、色彩、像素、框架等）按需設置，訂制專屬的功能模塊，整合數據資源，適用于電腦、手機、PDA等多終端平臺定制。

（二）傳統的網頁設計與制作課程內容

一般情況下，高校開設的網頁設計課程從教學內容上可劃分為兩大塊：1.相關知識介紹。網站的概念、基本元素及頁面等相關知識的介紹。2.應用軟件的使用。介紹使用最多的Dreamweaver系列網頁制作工具，使學生掌握布局（表格、層、框架、模板等）、超級鏈接、表單和幾種特效。隨著互聯網的全面推廣和“學即能用”的需求，以上內容已不能滿足互聯網時代與時俱進的特點。最關鍵的問題在于：課堂學到的知識是否馬上就能得到應用，是否與目前社會上專業的網頁制作公司的技術規格保持一致。因此，本門課程的改革勢在必行。

二“、服務于地方”教學內容的改革

（一）教學內容改革

內容改革是課程改革的首要環節。關于什么是關鍵內容，什么是次要內容，筆者走訪了本地專業網頁設計公司中企動力的設計總監馬女士，通過對她的訪談，了解到時下主流的網頁設計公司所涉及到的技術規范，對本校現階段的教學內容做了必要的調整，簡化了表格布局頁面、框架設計等已被淘汰的陳舊技術的授課內容，有選擇地介紹了網頁交互特效及表單的應用，加強了網頁美化工具、HTML語言及CSS的學習內容。改革后的課程主要分為六大模塊：網頁和網站的基礎知識、網頁美化工具（Photoshop或者Fireworks）、HTML語言、網頁開發工具的介紹、DIV+CSS、動態網頁技術。首先，通過具體的例子闡明網頁、網站的定義，頁面的布局類型（主要是盒模型）、整體造型及配色方案的相關知識；其次，介紹網頁美化工具圖片處理工具（Photoshop或Fireworks）的使用，學生可用其設計頁面元素，加強頁面的視覺效果與美觀性，提升站點的專業度；再次，介紹HTML的基本語法結構和語句，使學生熟練掌握其主要標簽的使用（傳統的教學模式對這一部分的內容有所忽略）。實踐證明，學生若不熟悉HTML的語法構成，學習DIV+CSS這一主流的網頁布局模式就會相當吃力。當然，對于非專業學生而言，學習一門語言，即便是文本標記語言，由于其本身對計算機系統相關知識的欠缺，授課會比較困難，學生也學得辛苦，但這又是一個必要的過程，其所占用的時間比較長，需要設計大量實例，反復練習才能掌握。之后介紹開發工具，重點是要理解頁面的代碼模式和設計模式，而DIV+CSS則是本門課程的重頭戲，由于學生對代碼有種天生的恐懼，所以，在建立CSS時又以開發工具建立為主，修改程序為輔。最后簡單提及動態網頁技術。由于課時限制（32節），本課程主要講授靜態網頁制作。靜態網頁技術分為傳統技術和新技術。傳統課堂教學內容重點是布局表格、框架、模板等，而目前主流的網頁制作公司則主要應用DIV+CSS。所以，對于陳舊的技術簡單介紹即可，而把DIV+CSS作為布局的主要技術進行講解。由于這些內容需要學生對代碼部分比較熟悉，所以，在課時中增加了相應的HTML的基本語法結構和語句的介紹，并對主要標簽的使用熟練掌握。

（二）實際授課效果

筆者今年為設計和思政兩個專業的學生授課。設計專業的學生已經開設了PS，有一定的設計基礎，所以，課程內容改革中的第一部分可以省略；思政專業的學生沒有圖片處理基礎，筆者在授課過程中有意加強了這部分內容，講授簡單的圖片處理方法和文字特效工具。實踐證明，學生有追求新知識的欲望，基本能做到學以致用，并反饋到最終的作品中。往屆學生的作品更像電子小報，而今年通過課程內容改革的學生作品雖不完美，但在形式內容上更接近Internet的正規網站，教學效果良好。針對我校提出建立培養服務于地方應用型人才的本科院校，傳統的網頁設計與制作課程必須響應時代號召，更新教學內容與方法。本文僅供從事該課程教學的教師參考。

篇（10）

職業技能大賽已經成為職業教育的重要載體，其技能要求也代表了職業教育培養的方向。每年各省市舉辦的技能大賽可以促進高等學校人才培養模式改革，提高高校創新型、應用型人才培養的質量，營造創新人才培養環境，拓寬學生動手能力和就業能力的培養途徑。筆者帶領學生參加了網頁設計與制作比賽。網頁設計與制作課程是計算機類教學的重要組成部分，現就教學與參賽經歷，以網頁設計與制作為例，談談職業技能大賽對網頁設計與制作教學的啟示與思考。

1 網頁設計與制作在人才培養中的地位、作用

網頁設計與制作是高等職業技術學院計算機類專業開設的一門專業主干課程，是一門操作性和實踐性很強的職業技術課程，在專業人才培養方案中處于核心地位，對于網頁設計與制作崗位應具備的網頁設計與制作能力的培養起到重要作用。在學生具備了一定的美術設計知識和一定的圖形圖像處理及動畫制作能力的基礎上，本課程主要學習網頁設計與布局知識、網頁制作技術及網頁編輯與制作軟件Dreamweaver cs6的使用，讓學生能熟練地設計與制作出符合客戶需求的網站。

這也就決定了網頁設計與制作在整個人才培養中的地位和作用。各個高校也為計算機相關專業開設了網頁設計與制作方面課程，來滿足社會的人才需求。通過這些課程的學習，使學生掌握一定的網頁設計與制作理論知識和開發技術，在進行網站開發時，能夠熟練地制作出有專業水準的網站。

2 網頁設計與制作教學現狀

在大多數高校的網頁設計與制作教學中，許多教師在教授這門課程的時候，只是注重理論的傳授，雖然也有一些上機操作教學，但是整個一學期下來做的也只是一些簡單的操作，在教學中幾乎從來是不用一個完整的網站來講授的。整個一個網站開發應該怎樣具體的一步一步的去實現不會講，沒有將理論和實踐進行很好的結合，使學生在整個教學中感覺不到網站制作的實際應用，也不知道網站設計的具體過程是怎樣實現的，需要掌握哪些技能點，這對我們人才的培養是很不利的，在當今計算機技術發展迅猛的信息社會，如果讓學生掌握不了實際的應用操作的話，我們的教學只能說是失敗的。為此，為了培養有核心競爭力的人才，我們必須對網頁設計與制作教學進行改革，培養創新型人才。

3 以大賽要求為教學目標，激發學生的學習興趣

興趣指人對事物喜好或關切的情緒，它表現為人們對某件事物、某項活動的選擇性態度和積極的情緒反應。興趣以需要為基礎，在人的實踐活動中具有重要的意義。唯物辯證法告訴我們，事物的發展，通常情況下，內因起決定作用。可見，能否使學生主動學習直接決定了學生的學習效果。在課堂教學中，要想讓學生主動學習，就要使他們對所學內容感興趣。激發學生學習興趣，可以提高教學質量。激發并維持學生的學習興趣要從把握教學目標這個關鍵點入手。對學生制訂的教學目標不能過高或過低。例如，大賽要求制作一個完整的網站，需要電腦和手機都能訪問。根據比賽試題和提供的需求，分析網站目錄的規劃、素材的收集、版面的設計與制作、交互式功能設計，并完成站點的與調試以及網站的美化處理等任務，選手需提供相應的網站設計文檔。把以上大賽要求作為一階段教學的目標，把以前的參賽獲獎作品展示給學生看，吸引學生的眼球。

現在大多數學生都喜歡通過電腦或智能手機網上購物、瀏覽網頁、網上查找學習資料。上課時談到網購或某個網站的特效，學生都很感興趣，引導學生平時多觀察、多模仿，將學習到的知識能運用到以后的工作生活中去，真正做到學以致用。

4 將大賽要求細化，找出教學中的重點和難點問題

有了明確的教學目標，教學也就有了明確的方向。確定課堂教學的重點和難點，是教學設計的重要組成部分。教師需正確把握教學重點和難點，才能夠在教學中有的放矢，教學針對性強，效果也才會達到最佳。教師可以根據學生的原有知識水平和技能基礎、學生已有的經驗和生活體驗、學生學習新知識的認知水平、學生的綜合素質等確立教學的重點和難點。

參加技能大賽需要深入理解大賽要求，才能制作出高水平的網站。通過分析大賽要求，重新規劃了本課程的重點和難點。

《網頁設計與制作》課程重點：

1）規劃網站目錄結構；

2）網頁主題明確，內容欄目設置合理，布局結構層次清晰，主次關系分配合理；

3）掌握網頁布局的常用技術；

4）網頁色彩搭配得當，美觀得體，能正確處理色彩與網頁內容的對比關系，使網頁數據能清晰呈現；

5）導航鏈接功能設置正確；

6）HTML書寫格式規范、正確，無語法錯誤；

7）熟練使用css美化網頁。

《網頁設計與制作》課程難點：

1）使用javascript或jQuery技術，實現交互行為；

2）兼容不同瀏覽器；

3）響應式web效果的設計。

從大賽要求可以看出，比賽的要求更接近企業對網頁制作人才的要求，對網頁的視覺效果要求比較高，另外，大賽緊跟技術前沿，要求學生能夠開發出手機版的網頁，因為現在使用手機上網的人越來越多。

5 結束語

篇（11）

中圖分類號：G64文獻標志碼：A文章編號：2095-6401(2016)02-0068-01

作者簡介：侯敏（1979-），女，漢族，陜西西安人，講師。研究方向：軟件工程，數據庫

互聯移動終端的大面積推廣，使得掌握網頁制作技術的人才在各個行業里都成為必不可少的需求；同時，地方普通高校為社會服務的使命感在不斷增強，如何培養出“學即能用”的人才，使之在短時間內掌握主流的網頁設計技術，提高站點訪問量，是這門課程課堂教學效果進步的體現。

一、技術背景與課堂教學要求

（一）Internet發展歷程

Internet經歷了從Web1.0到Web3.0的迅猛發展。Web1.0是靜止、單向、被動的；Web2.0則為用戶開設了主動權，使得用戶和網站可進行雙向信息互動；Web3.0提升了用戶的主動權，用戶可對頁面的多種元素（顯示、色彩、像素、框架等）按需設置，訂制專屬的功能模塊，整合數據資源，適用于電腦、手機、PDA等多終端平臺定制。

（二）傳統的網頁設計與制作課程內容一般情況下，高校開設的網頁設計課程從教學內容上可劃分為兩大塊：

1.相關知識介紹。網站的概念、基本元素及頁面等相關知識的介紹。

2.應用軟件的使用。介紹使用最多的Dreamweaver系列網頁制作工具，使學生掌握布局（表格、層、框架、模板等）、超級鏈接、表單和幾種特效。隨著互聯網的全面推廣和“學即能用”的需求，以上內容已不能滿足互聯網時代與時俱進的特點。最關鍵的問題在于：課堂學到的知識是否馬上就能得到應用，是否與目前社會上專業的網頁制作公司的技術規格保持一致。因此，本門課程的改革勢在必行。

二、“服務于地方”教學內容的改革

（一）教學內容改革

內容改革是課程改革的首要環節。關于什么是關鍵內容，什么是次要內容，筆者走訪了本地專業網頁設計公司中企動力的設計總監馬女士，通過對她的訪談，了解到時下主流的網頁設計公司所涉及到的技術規范，對本校現階段的教學內容做了必要的調整，簡化了表格布局頁面、框架設計等已被淘汰的陳舊技術的授課內容，有選擇地介紹了網頁交互特效及表單的應用，加強了網頁美化工具、HTML語言及CSS的學習內容。改革后的課程主要分為六大模塊：網頁和網站的基礎知識、網頁美化工具（Photoshop或者Fireworks）、HTML語言、網頁開發工具的介紹、DIV+CSS、動態網頁技術。首先，通過具體的例子闡明網頁、網站的定義，頁面的布局類型（主要是盒模型）、整體造型及配色方案的相關知識；其次，介紹網頁美化工具圖片處理工具（Photoshop或Fireworks）的使用，學生可用其設計頁面元素，加強頁面的視覺效果與美觀性，提升站點的專業度；再次，介紹HTML的基本語法結構和語句，使學生熟練掌握其主要標簽的使用（傳統的教學模式對這一部分的內容有所忽略）。

實踐證明，學生若不熟悉HTML的語法構成，學習DIV+CSS這一主流的網頁布局模式就會相當吃力。當然，對于非專業學生而言，學習一門語言，即便是文本標記語言，由于其本身對計算機系統相關知識的欠缺，授課會比較困難，學生也學得辛苦，但這又是一個必要的過程，其所占用的時間比較長，需要設計大量實例，反復練習才能掌握。之后介紹開發工具，重點是要理解頁面的代碼模式和設計模式，而DIV+CSS則是本門課程的重頭戲，由于學生對代碼有種天生的恐懼，所以，在建立CSS時又以開發工具建立為主，修改程序為輔。最后簡單提及動態網頁技術。由于課時限制（32節），本課程主要講授靜態網頁制作。靜態網頁技術分為傳統技術和新技術。傳統課堂教學內容重點是布局表格、框架、模板等，而目前主流的網頁制作公司則主要應用DIV+CSS。所以，對于陳舊的技術簡單介紹即可，而把DIV+CSS作為布局的主要技術進行講解。由于這些內容需要學生對代碼部分比較熟悉，所以，在課時中增加了相應的HTML的基本語法結構和語句的介紹，并對主要標簽的使用熟練掌握。

（二）實際授課效果

筆者今年為設計和思政兩個專業的學生授課。設計專業的學生已經開設了PS，有一定的設計基礎，所以，課程內容改革中的第一部分可以省略；思政專業的學生沒有圖片處理基礎，筆者在授課過程中有意加強了這部分內容，講授簡單的圖片處理方法和文字特效工具。實踐證明，學生有追求新知識的欲望，基本能做到學以致用，并反饋到最終的作品中。往屆學生的作品更像電子小報，而今年通過課程內容改革的學生作品雖不完美，但在形式內容上更接近Internet的正規網站，教學效果良好。針對我校提出建立培養服務于地方應用型人才的本科院校，傳統的網頁設計與制作課程必須響應時代號召，更新教學內容與方法。本文僅供從事該課程教學的教師參考。