《網頁設計與制作》課程教學探究

【摘 要】《網頁設計與制作》課程是高職學校計算機專業的必修課程，操作性和實用性都很強。依據學生的自身特點，從教學內容、教學方法、動手能力訓練上下功夫，并結合工作經驗的借鑒，不斷改革與充實教學內容，注重人才培養的需求。探究教學方法永無止境，培養學生實際動手能力和計算機的操作水平，注重培養團隊精神，使學生能夠達到運用所學的知識進行網頁設計和網站開發。

【關鍵詞】網頁制作 教學探究

在信息技術飛速發展的今天，人們獲取信息的方式更多是來源于互聯網。而吸引用戶瀏覽的則是視覺效果出色、信息量豐富、頁面美觀、使用起來方便的網頁，所以網頁設計教學是重頭戲。

《網頁設計與制作》課程是高職學校計算機專業的必修課程之一，要學好這門課程，對于初學者來說，必須先理解掌握專用術語，比如：網站和網頁、Logo、導航條、表單、超級鏈接、框架和CSS樣式、模板網頁和庫等。其次是欣賞比較優秀的網頁，并能說出好在什么地方；最后就是動手制作一個優秀的網頁網站風格，并要注意色彩的搭配、網頁布局、統一風格等都很重要。

教學時可采用“四字教學法”，將“教、學、練、做”融為一體。教學要體現“教師為主導，學生為主體，訓練為主線”的教學原則，課堂上可以采用“四字教學法”展開教學。

一、實施教學的要素

在實施教學時，主要以學生掌握知識技能為根本、以“能懂、掌握、運用”為教學前提、以培養學生動手能力為目標來指導整個教學，常言道“授之以魚，不如授之以漁”。只有讓學生學會學習，具有創新能力、解決問題的能力才能終身受益。因此，在進行教學時，要有意識地引導學生，鼓勵他們推陳出新，不斷沖破思維定勢，提倡用自己的方法，充分發揮自己的主體作用。

1.Logo和導航條的作用

網頁中的Logo即網站標志，網站標志好比是商品的商標，是獨特的形象標識，在網站推廣中能起到事半功倍的效果，設計和制作網站標志時應該體現該網站的特色和內容。導航條是網頁設計中不可缺少的部分，通過一定的技術手段，為網站的訪問者提供一定的最佳捷徑，使其可以方便地訪問到所需的內容，是人們瀏覽網站時可以快速從一個頁面跳轉到另一個頁面的通道。

2.模板網頁和庫

模板是一種用于設計統一風格和版式的特殊網頁，使用模板，可避免重復勞動，可快速創建網站并可保持網頁風格的一致性。庫主要用于存放網頁頁面元素，如文件、圖片等，并且需要重復使用或更新。

3.框架的使用

如果一個網頁的左邊導航菜單是固定不變的，而網頁右邊的信息可以上下滾動，這種網頁結構就是一個框架型網頁。一組框架通常包括一個含有導航條的框架和另一個要顯示主要內容頁面的框架?？蚣芫哂幸韵聝烖c：訪問者的瀏覽器不需要為每個頁面重新加載與導航相關的鏈接，可大大節約瀏覽時間；每個框架都具有自己的滾動條。

4.CSS樣式表的使用

CSS樣式表是一系列格式規則的集合，它可以控制網頁內容的外觀，使得網頁內的各文本、圖像、表格等對象具有統一的風格，省去了為每個對象單獨設置格式的繁瑣。通過CSS技術可以有效地對網頁整體布局、顏色、字體、字號、超鏈接、背景和其它對象的顯示效果做到精確地控制。利用它能讓網頁的外觀和格式統一等效果的實現，在網頁制作過程中讓設計者會更加輕松方便。

5.網頁表單的應用

表單是網頁訪問者與服務器之間信息交互的橋梁，是用來同瀏覽者交互（即收集返回信息）數據信息的操作界面。表單在網頁中應用廣泛，

二、網頁制作的技巧

以網頁制作專業軟件Dreamweaver CS3應用學習，應從以下幾個方面動手制作：

1.分析網頁結構

只有當網頁布局和網頁內容成功結合時，這種網頁才受歡迎。網頁布局的形式多種多樣，不同布局的網頁具有不同的視覺效果。網頁內容布局主要有：國字型、拐角型、標題正文型、左右框架型、上下框架型、封面型、Flash型等。比如：內容多，就要考慮用國字型或拐角型；如果內容不算太多而一些說明性的東西比較多，則可以考慮標題正文型；而如果是一個企業網站想展示一下企業形象或個人主頁想展示個人風采，封面型是首選；Flash型更靈活一些，好的Flash大大豐富了網頁，但是它不能表達過多的文字信息。

2.包含的元素

一個網頁中包含的元素有文字、圖片、Gif動畫、音頻和視頻等。例如：可打開多個學校的網頁，觀看網頁的優點、布局結構、視覺效果如何等等。請同學做出合理評價，相同點和不同點；如果網頁好，說出好在什么地方；如果網頁不好，指出不好的地方及改進意見。

3.網站主頁的地位

在一個網站中，最重要的頁面當屬主頁，所以主頁設計的好與壞，直接影響瀏覽者的人數。所以，一個有特色和優秀的主頁，必須包含有四個要素：文字，圖片，排列方式和主色調。他們相輔相成，缺一不可。網頁作為一種版面，既有文字，又有圖片；文字有大有小，還有標題和正文之分；圖片頁有大小而且有橫豎之別。圖片和文字都需要同時展示給觀眾，不能簡單地將其陳列在一個頁面上，否則會搞得零亂不堪。要設計出漂亮的主頁，首先要成為計算機圖形高手，這一點就可以讓初學者花上很長的時間。這需要去學習photoshop圖形圖像處理軟件，還應具備一定的美術基礎，如審美觀、創意技巧等。

4.色彩在網頁中的所占比重

有了合理清新的色調，會彌補主頁上的其它不足。頁面的色彩搭配是與網站的主題分不開的，一個網站必須有一種或兩種主題色。不至于讓瀏覽者迷失方向，也不至于單調乏味。一般來說，頁面的主體文字應盡量使用黑色等較深的顏色，與背景對比明顯，按鈕、邊框等使用彩色。例如教育類網站使用藍色為主題色，再用紅色和黑色作為配色，就能表達出嚴肅、穩重的效果。

5.遵循制作流程

網頁設計制作流程由“確定主題、網站規劃、搜集素材、版面設計、制作作品、相互評價、修改完善”七大步驟組成。在網頁設計過程中，以上七大步驟一個也不能少，老師要有計劃、有目的地讓學生去遵循流程，并嚴格把好每一關。

其實在教學過程中，要了解學生的基礎、知識接受能力的差異性，學習內容應有所取舍。要從學生實際出發，要照顧到大多數學生的實際情況，以防失去學習信心，堅持做到“教師為主導，學生為主體，訓練為主線”的教學原則。

三、點滴經驗小結

網頁設計涉及到對多種軟件、多種知識的綜合應用，以及個人的藝術性和審美觀等等。所以要想制作出漂亮的網頁，需要逐步學習和經驗積累的過程。比如：制作網頁，“學?！本W頁、“電影新片宣傳”網頁、“球星風采”網頁、“藏獒傳說”網頁、“個人簡歷”網頁、“化妝品廣告”網頁等。多動手制作一些常見的網頁，做到熟能生巧，為今后進一步提高網頁制作水平奠定堅實的基礎。

總之，職業教育重擔是任重而道遠的一項偉大工程，常講常新，尤其對專業課程的教學方法與創新也是永無止境的。只要我們在教學過程中大膽實踐、勇于開拓，精心設計教學和實例，自強不息、探究創新的學習情境，實現教學理念、教學模式、能力素質得到提高，就一定能提升職業學校計算機專業課的教學效益，從而提高學生動手實踐能力，增強綜合運用能力，適應現代社會對人才的需求。