網頁設計教學設計3篇 "創新設計，探索網頁設計教學的更高境界"
本文主要介紹網頁設計教學設計，包括教學目標、教學內容和教學方法等方面的內容。通過系統的教學設計，能夠幫助學生更好地掌握網頁設計的基本知識和技能，提高其實踐能力和創新能力，為今後的就業和創業打下堅實的基礎。
第1篇
?網頁設計與製作》是中計算機專業開設的一門專業必修課，是計算機類專業的一門實踐環節課程，也可以作為其他相關專業的實踐課程或選修課，它是一門操作性和實踐性很強的職業技術課程。本課程的主要內容為系統介紹網頁編輯與製作軟件dreamweaver cs3，通過這種有代表性的網頁製作軟件的使用，掌握網站設計的全過程，並能熟練地製作出有專業水準的網站。2、課程任務
本門課程在專業教學計劃中起着十分重要的作用，通過這門課程，學生可以掌握以下技能和知識：
* 掌握網站的開發流程，如建站規劃、效果圖製作、建立站點等相關知識。
* 掌握各種網頁元素在dreamweaver cs3中的使用。例如表格、文本、圖像、超級鏈接、層和表單等。
* 熟悉一些網頁設計輔助軟件的功能和使用方法。例如flash、fireworks、photoshop等。* 掌握測試和發佈網站的方法。包括網站測試的內容和方法。* 能夠解決一些網頁設計中的常見問題。
* 瞭解asp開發平台的搭建，dreamweaver cs3在動態網頁製作方面的應用。
（1）使學生通過本課程的學習，掌握dreamweaver cs3的使用方法，學會使用dreamweaver cs3製作web網頁的技術。
（2）本課程學習結束後，學生應能自行設計各種網頁、開發一定規模的網站，使學生通過本課程的學習，熟練掌握其基本製作方法和技巧，並最終設計一個綜合性的網站並且編制簡單的腳本上傳到互聯網上。
深入瞭解internet，理解、http、html等概念及作用；掌握網站設計和發佈的1 流程。理解網站維護管理的意義及重要性，理解服務器、客户端、瀏覽器的概念和作用；瞭解多種網頁製作軟件和圖像處理軟件相結合設計網站的好處。瞭解dreamweaver cs3在動態網站上的應用。（2）素質要求
本課程將培養學生以下幾方面的職業素質： 服務意識：能夠為他人提供優質的服務；
文明法制意識：網站內容應積極健康向上，不做違法的事；
合作精神：能夠與他人進行合作，具有協調工作能力和組織管理能力； 較強的自我知識及技術更新能力：快速跟蹤網頁製作的新技術及市場應用動態。
學生應按照《網頁設計與網站建設課程設計指導書》的要求認真設計。教師應掌握好課程設計的總體進度，並組織答疑，以保證學生按時保質、保量地完成任務。學生最後所完成的《網頁設計與網站建設課程設計報告》應當做到內容齊全、條理清楚、文字通暢、打印或書寫規範。
（2）域名註冊與建站方式選擇論證（3）網站總體設計（4）網站靜態頁面設計（5）web數據庫設計
網頁設計概述：重點講授網站，網頁設計的概念；瞭解網頁設計設計的相關概念；瞭解網頁設計的語言html；掌握學習網頁設計的某一種工具；理解網站和網頁的關係。
網頁賞析：初步瞭解網頁賞析要求；理解網頁賞析的理論要求；掌握網頁突破性設計的要素；分清各類網站的設計要求和框架；理解實例分析過程。
網頁規劃與佈局：瞭解網頁的組織結構，掌握網頁內容上的組織方法；熟悉網頁設計的流程和注意事項；瞭解網站的規劃與建設；熟悉網站設計，掌握網站與網頁的區別。
網頁設計創意：通過對創意思維及創意手法的講解，輔以對優秀網頁作品的分析，啟發學生全面的創新思維，進而從多角度的思維中獨樹一幟，培養學生的個性化意識。讓學生對優秀設計的創意進行解讀和闡釋，並分析其創新之處，鼓勵學生敢於發覺新意，提2 出自己獨到的見解。
網頁編程語言：瞭解html、css的定義、概念和作用；理解html語言中的各種文本格式、字符格式、段落設置、列表標記的作用；會用html語言總的標記設置顏色、文本格式和列表；掌握html的語法結構，掌握html語言中標記的使用方法；理解表格、框架、表單的作用。理解css樣式表的作用和意義；掌握css樣式表的結構；掌握在網頁中添加css的方法。掌握三種添加樣式信息的方法，會使用css設置網頁格式和列表的格式。
（1）通過教學，使學生能夠用基本法和高級法新建站點、編輯站點，掌握如何在站點中新建文件和文件夾，會預覽網頁。
（2）掌握表格的組成和基本操作方法；熟練掌握穿件表格、表格操作、表格編輯的方法；（3）掌握表單的基本概念和表單的各個組成元素；掌握插入表單以及表單元素的方法；會製作具有表單的網頁。
（4）通過教學，掌握在動畫中添加聲音的操作方法以及設置動畫聲音的各種屬性。（5）通過教學，使學生掌握導出與發佈flash動畫的方法，能夠準確設置flash8動畫作品的發佈格式。
動態網頁介紹：掌握靜態網頁和動態網頁的概念；瞭解實現動態網頁的四種技術（cgi、asp、jsp和php）的特點；掌握數據庫、數據庫管理系統、web數據庫的概念及關係數據庫的特點；理解數據庫在開發動態網頁中的地位；瞭解asp、jsp、php如何訪問web數據庫。
設計實例：綜合運用前七章所學的知識創建和編輯一個站點，掌握主頁和子頁、子頁之間、以及站內和站外的鏈接。
1、教學方法：本課程是一門應用型課程，涉及到以前所學知識點較多，因此在教學中應注意啟發式教學並加強項目教學的直觀性。
2、教學場所與設備要求：安裝有 windows xp 或 windows 2000 的機房均可以進行實驗，教學要求在多媒體教室進行。
有筆試和機試兩種考試形式，主要由選擇題、實驗操作題組成。在總成績中，筆試成績和上機考試成績各佔50%。
第2篇
?網頁設計與製作》是中計算機專業開設的一門專業必修課，是計算機類專業的一門實踐環節課程，也可以作為其他相關專業的實踐課程或選修課，它是一門操作性和實踐性很強的職業技術課程。本課程的主要內容為系統介紹網頁編輯與製作軟件dreamweaver cs3，通過這種有代表性的網頁製作軟件的使用，掌握網站設計的全過程，並能熟練地製作出有專業水準的網站。2、課程任務
本門課程在專業教學計劃中起着十分重要的作用，通過這門課程，學生可以掌握以下技能和知識：
* 掌握網站的開發流程，如建站規劃、效果圖製作、建立站點等相關知識。
* 掌握各種網頁元素在dreamweaver cs3中的使用。例如表格、文本、圖像、超級鏈接、層和表單等。
* 熟悉一些網頁設計輔助軟件的功能和使用方法。例如flash、fireworks、photoshop等。* 掌握測試和發佈網站的方法。包括網站測試的內容和方法。* 能夠解決一些網頁設計中的常見問題。
* 瞭解asp開發平台的搭建，dreamweaver cs3在動態網頁製作方面的應用。二、課程教學目標與要求
（1）使學生通過本課程的學習，掌握dreamweaver cs3的使用方法，學會使用dreamweaver cs3製作web網頁的技術。
（2）本課程學習結束後，學生應能自行設計各種網頁、開發一定規模的網站，使學生通過本課程的學習，熟練掌握其基本製作方法和技巧，並最終設計一個綜合性的網站並且編制簡單的腳本上傳到互聯網上。
深入瞭解internet，理解、http、html等概念及作用；掌握網站設計和發佈的 以人為本 誠信務實 勇於創新 樂於奉獻
流程。理解網站維護管理的意義及重要性，理解服務器、客户端、瀏覽器的概念和作用；瞭解多種網頁製作軟件和圖像處理軟件相結合設計網站的好處。瞭解dreamweaver cs3在動態網站上的應用。（2）素質要求
本課程將培養學生以下幾方面的職業素質： 服務意識：能夠為他人提供優質的服務；
文明法制意識：網站內容應積極健康向上，不做違法的事；
合作精神：能夠與他人進行合作，具有協調工作能力和組織管理能力； 較強的自我知識及技術更新能力：快速跟蹤網頁製作的新技術及市場應用動態。三、教學內容結構
學生應按照《網頁設計與網站建設課程設計指導書》的要求認真設計。教師應掌握好課程設計的總體進度，並組織答疑，以保證學生按時保質、保量地完成任務。學生最後所完成的《網頁設計與網站建設課程設計報告》應當做到內容齊全、條理清楚、文字通暢、打印或書寫規範。
（2）域名註冊與建站方式選擇論證（3）網站總體設計（4）網站靜態頁面設計（5）web數據庫設計
（6）網站測試、發佈與維護管理 四、教學內容與要求
網頁設計概述：重點講授網站，網頁設計的概念；瞭解網頁設計設計的相關概念；瞭解網頁設計的語言html；掌握學習網頁設計的某一種工具；理解網站和網頁的關係。
網頁賞析：初步瞭解網頁賞析要求；理解網頁賞析的理論要求；掌握網頁突破性設計的要素；分清各類網站的設計要求和框架；理解實例分析過程。
網頁規劃與佈局：瞭解網頁的組織結構，掌握網頁內容上的組織方法；熟悉網頁設計的流程和注意事項；瞭解網站的規劃與建設；熟悉網站設計，掌握網站與網頁的區別。
網頁設計創意：通過對創意思維及創意手法的講解，輔以對優秀網頁作品的分析，啟發學生全面的創新思維，進而從多角度的思維中獨樹一幟，培養學生的個性化意識。讓學生對優秀設計的創意進行解讀和闡釋，並分析其創新之處，鼓勵學生敢於發覺新意，提 以人為本 誠信務實 勇於創新 樂於奉獻
網頁編程語言：瞭解html、css的定義、概念和作用；理解html語言中的各種文本格式、字符格式、段落設置、列表標記的作用；會用html語言總的標記設置顏色、文本格式和列表；掌握html的語法結構，掌握html語言中標記的使用方法；理解表格、框架、表單的作用。理解css樣式表的作用和意義；掌握css樣式表的結構；掌握在網頁中添加css的方法。掌握三種添加樣式信息的方法，會使用css設置網頁格式和列表的格式。
（1）通過教學，使學生能夠用基本法和高級法新建站點、編輯站點，掌握如何在站點中新建文件和文件夾，會預覽網頁。
（2）掌握表格的組成和基本操作方法；熟練掌握穿件表格、表格操作、表格編輯的方法；（3）掌握表單的基本概念和表單的各個組成元素；掌握插入表單以及表單元素的方法；會製作具有表單的網頁。
（4）通過教學，掌握在動畫中添加聲音的操作方法以及設置動畫聲音的各種屬性。（5）通過教學，使學生掌握導出與發佈flash動畫的方法，能夠準確設置flash8動畫作品的發佈格式。
動態網頁介紹：掌握靜態網頁和動態網頁的概念；瞭解實現動態網頁的四種技術（cgi、asp、jsp和php）的特點；掌握數據庫、數據庫管理系統、web數據庫的概念及關係數據庫的特點；理解數據庫在開發動態網頁中的地位；瞭解asp、jsp、php如何訪問web數據庫。
設計實例：綜合運用前七章所學的知識創建和編輯一個站點，掌握主頁和子頁、子頁之間、以及站內和站外的鏈接。五、教學實施
1、教學方法：本課程是一門應用型課程，涉及到以前所學知識點較多，因此在教學中應注意啟發式教學並加強項目教學的直觀性。
2、教學場所與設備要求：安裝有 windows xp 或 windows 2000 的機房均可以進行實驗，教學要求在多媒體教室進行。六、考核與評價方式
有筆試和機試兩種考試形式，主要由選擇題、實驗操作題組成。在總成績中，筆試成績和上機考試成績各佔50%。
第3篇
遼寧師範大學出版社 國中信息技術八年級上冊，第二單元《網站設計與製作》，活動1“創建個人網站”以及活動2中的關於部分frontpage2000的內容。
信息技術課是一門實踐性很強、極富創造性、具有明顯時代發展性特點的課程。而現代教育理論提倡以學生為中心，強調學生“學”的主動性，學生是信息加工的主體，教師的作用體現在組織、指導、幫助和促進學生的學習、充分發揮學生的主動性、積極性和創造性，從而使學生最有效地進行學習，達到最優的教學效果。因此本課題遵循“教師主導，學生主體”的設計理念，讓學生在教師的引導下，對所學的內容進行探索、分析、研究，在實踐操作中培養學生科學的態度和價值觀，同時培養學生的學習興趣。
教學對象是八年級的學生，這一階段的學生正處在抽象邏輯思維逐步形成的過程中，但形象思維仍是獲取知識的重要思維方式。而本節課中涉及到的html語言有其枯燥難懂的一面，學生在理解上存在着一定的難度，所以教師在教學設計中希望能通過學生自己的雙眼、雙手以及思考來發現新知識，從而減輕他們對新知識的畏懼、降低理解的難度。
國中學生活潑好動、好奇心強、求知慾旺、視野廣泛，對信息技術充滿興趣，大部分學生都能熟練使用瀏覽器瀏覽網頁，他們對上網和網頁有着極大的興趣。所以在本課題中教師利用學生的這種心理設計了一個趣味導入，從趣味引入學生感興趣的網頁，使學生在課堂中保持着較高的學習積極性。
本節課是新授課且是第二單元《網站設計與製作》的第一節課，教師將這節課的重心放在了“啟下”上，目的是激發學生的學習興趣和他們的求知慾，為順利開展以後的教學活動打好基礎、做好鋪墊。本節課的教學內容有兩個方面，一是初識html語言，二是初識frontpage2000的窗口組成。教師設計的重點並不是讓學生充分理解html語言的結構，而是通過html語言能夠有效地引出製作網頁的軟件frontpage2000，繼而使學生能順其自然產生使用frontpage2000製作網頁的興趣。
教學內容的整合：課本上將初識html語言和frontpage2000的窗口組成分在了兩個活動中，考慮到信息技術課一星期一個班只有一節課，如果第一節課只講html語言，不涉及製作網頁的軟件frontpage2000，會令學生感到枯燥，同時這種枯燥感很可能會維持一個星期直到下節課，這樣學生對製作網頁的興趣就遠不如將兩個教學內容結合起來的高，也不利於今後的教學活動開展。所以教師將本節課的重心放在讓學生理解html語言與frontpage2000之間的聯繫上。
（４）瞭解常用的製作網頁的軟件；（５）瞭解網站策劃與定位的重要性，掌握網站的規劃流程；
（７）學會設計有意義的網站主題，收集網站相關資料，畫出網站的結構圖。【過程與方法】
（１）趣味導入新課的內容，極大地發揮學生主體、教師主導的作用；
（２）適時引導學生產生新的問題，再通過教師的講解與演示、對比和學生的自主學習來解決問題。
（１）強烈的求知慾激發學生的學習興趣和學習積極性；
（２）瞭解信息技術的前沿知識後，學生會對信息技術課保持新鮮感和興趣感；
（３）學生在不斷實現自己主體地位的同時，也獲得了新知識，更從中體會到了學習的快樂。
1、認識構成網頁內容的基本元素，理解網頁佈局的特點；
3、學會啟動frontpage2000，瞭解網站設計軟件frontpage2000的窗口組成，理解各組成部分的功能；
4、網站主題的確立，規劃網站結構圖，學會創建新站點的基本方法。
1、理解html標識性語言的結構及應用html語言編寫簡單網頁；
②打開多媒體電腦教室的教師機和學生機，保證電腦教室的廣播系統工作正常；
1.情境引入： 向學生展示一組優秀網站、網頁，激發學生創作自己個人網站的興趣和慾望。學生在觀看，欣賞網站時，受到激勵產生想製作一個網頁的衝動。在師生欣賞網頁作品時複習回顧已學並已淡忘的基礎知識。問題：網頁的構成元素及佈局？教師分析案例，與學生共同回顧文字的插入、圖片的插入和設置、動畫的插入和設置、表格的相關操作等相關知識。讓學生在案例中回顧基礎，激發靈感。並引入本節主題，自己動手製作網頁。
教師向學生展示本節課要完成的網頁。要求學生會模仿製作出該網頁模板，並能夠自己創作出新的網頁模板。
2）一個網頁由哪些元素組成？對照給出的網頁分析網頁的組成元素—標題圖片，標題欄，水平線，滾動字幕，圖片，文字及背景等等。
3)用photoshop 處理素材，達到給出網頁中圖片標題，並設計出突出自己主題的網站標題。拓展：用photoshop軟件，畫圖軟件，或flash軟件設計自己需要的網頁圖片。4）要求學生會模仿製作出該網頁模板，並能夠根據自己確立的主題製作一個網頁模板。學生自主完成模板仿製，並自主探究設計一個複合自己設計主題的網頁模板。小組內成員可相互交流，教師巡視，隨時解決學生在學習過程中遇到的問題，並注意收集有共性的問題，並適時給以學生以點撥。尤其關注一下學困生。
5）小組選出最佳模板，探究完善此模板，然後以此模板設計網頁。4.評價展示：
作品完成，提交給教師機，自我評價，小組互評，選出小組最佳作品提交展示，師生共同賞析評價，挖掘作品優點，並指出改進之處。培養大家的審美能力，並挖掘大家的創新能力。
師生共同回顧這節課的基礎知識與基本技能，並加強網絡道德意識，注意版權。
在信息技術教學中，必須以新的教學理念和教學理論為指導，根據新的課程標準，探索適合信息技術課堂教學的教與學的新策略和新模式來挖掘學生潛能，提高學生素質。
以前我總認為信息技術課就是教會學生如何操作，課堂中總是採用“教師講，學生聽”的傳統模式，是“學”跟着“教”走，只要“我説你做”就可以了。現在我嘗試着做一些改進，在本課題中圍繞“學生主體、教師主導”的設計理念去設計每個教學環節，積極體現學生的主體作用，努力提高學生的學習效果。
實踐證明我的想法是好的，但是在實踐中難免有疏忽和做的不夠細的地方。比如：由於我的觀察不全面，忽略了個別學生學習中的心理障礙，有些學生的畏難情緒影響到他的整個學習效果；課堂學習氣氛熱烈但不夠和諧。這些都説明了一個問題：我僅僅注重了學生整體主體的體現，而忽略了個體。經過思考，我認為在這節課的教學設計中可以多增加個體展示的機會，特別是那些學習有困難的學生，我應該多關注他們的動態，多幫助他們。
本課的教學目標是掌握使用frontpage製作網頁的基本方法；重點是掌握在網頁中插入文字和圖片的方法；難點在於插入表格規劃網頁的結構。
備課時，發現教材以一個標題，一張圖片以及一篇文章的簡單結構示例，如果完全依照教材進行授課，勢必無法突破難點。於是設計了一個將學生前期製作的環保報刊，利用frontpage軟件製成網頁的環節來幫助學生突破難點。並取學生環保報刊中具典型結構的五份。製作出引導學生分析結構，規劃框架的演示片備用。
課堂以自主探究的模式展開，同學們在以往的學習中已掌握了在word中插入表格、圖片等方法，在frontpage中他們很順利地完成了教材呈現的目標。基本掌握了單張網頁的製作方法。
接下來就是突破難點的訓練。面對演示片呈現出的任務及教材相關提示。此時，問題集中到如何插入一個佈局表格來實現規劃好的結構。而教材上完全沒有提示學生探究frontpage “表格”與word “表格” 功能的異同。少數同學開始試着插入適合自己網頁結構的框架表格，而大部分的同學則完全沒有考慮結構問題，做起直接的搬移，將frontpage當成word來用。直到出現無法將圖片，文字放置到設想位置時，才意識到教材中“frontpage通常用表格來安排網頁中各種內容（文章、圖形等）的版面位置。”這問話的含義是否明確。急着尋求解決的辦法。我便讓哪些意識到要先插入適當結構框架表的學生來説説他們的想法。並及時出示與學生思維一致的演示片，將探究frontpage “表格”功能的提示呈現給他們。同時利用極域教室的功能，向全體同學展示同伴的探究結果，讓學生不同的思緒方式及智慧產生碰撞，相互啟示，順利突破教學難點。
