范文為教學中作為模范的文章，也常常用來指寫作的模板。常常用于文秘寫作的參考，也可以作為演講材料編寫前的參考。范文書寫有哪些要求呢？我們怎樣才能寫好一篇范文呢？這里我整理了一些優(yōu)秀的范文，希望對大家有所幫助，下面我們就來了解一下吧。
網(wǎng)頁設計與制作教學設計篇一
1、讓學生掌握在網(wǎng)頁中插入表格的方法以及表格的修改
2、學會利用表格來規(guī)劃網(wǎng)頁
3、培養(yǎng)學生創(chuàng)新的能力以及動手操作的能力
利用表格來規(guī)劃網(wǎng)頁，從中培養(yǎng)學生的創(chuàng)新能力
一、情境導入
同學們你們善于觀察嗎？老師先考考你們，我們一起來看一組圖片，你們看看在那里看過呢？學校緩臺的窗臺上。你們的觀察能力真的很強啊，對，這些都是我們學校美術的特色作口，盤畫。其實，我們做過很多作品：有手工作品，語文課中的作文、書法等都是作品，這節(jié)課我們以繪畫作口品為例，做一個學習園地網(wǎng)頁，把我們的作品展示到自己的班級網(wǎng)站中，以便我們更好的努力學習?，F(xiàn)在我們就一起來制作吧！
二、新知探究
首先我們來打開上節(jié)課的班級網(wǎng)站，在這個網(wǎng)站中新建一個網(wǎng)頁，并保存成“學習園地”。
教師講解：如何制作學習園地網(wǎng)頁。
1、制作網(wǎng)頁的標題：輸入文字，并設置文字的格式。
2、插入表格：單擊“表格”中的“插入表格”并對表格屬性進行設置。如：行、列的操作，對齊方式等。同時講解什么是行，什么是列，以及單元格的概念。
3、修改表格：調(diào)整表格行高和列寬。
4、在學生學會插入表格的基礎上，來設計網(wǎng)頁，展示作品。并講解在單元格中可以插入圖片、文字。那我們就一起快快去做吧！插入圖片，并在圖片的上面或下面進行圖片的注釋。
5、進一步設置單元格的背景，來美化網(wǎng)頁。
6、設置超鏈接：通過導航欄目，設置文字超鏈接。選中文字，點擊右鍵選擇超鏈接在列表中選擇你要鏈接的網(wǎng)頁，單擊“確定”按鈕。
7、學生在教師的講解后，學生自己動手操作制作網(wǎng)頁。教師進行指導。（伴隨音樂）
三、作品評價
1、生評：從網(wǎng)頁設計上，美觀程度上，知識落實上重點評價。
2、師評：對學生作品進行評價，并對其它學生的評價加以更完整的解釋。
四、總結
我們這節(jié)課主要是利用了表格來設計網(wǎng)頁，以使來美化我們的網(wǎng)頁，通過繪畫作品的展示，學習更多的知識。
網(wǎng)頁設計與制作教學設計篇二
1、知識與技能：
（1）理解框架的概念及用途。
（2）掌握框架網(wǎng)頁的新建、制作、編輯與保存，了解框架的拆分方法。
（3）初步掌握將框架結構與表格布局結合使用來制作網(wǎng)頁。
2、過程與方法：
（1）通過對表格網(wǎng)頁的分析，體驗新知識（框架結構網(wǎng)頁）的優(yōu)點，從而促進其學習新知識。
（2）理解框架的概念與組成，學會分析網(wǎng)站的結構。
3、情感態(tài)度與價值觀：
（1）通過以"人與動物"為主題的框架結構網(wǎng)頁制作活動，了解更多有關人與動物和諧相處的知識，通過故事趣聞，增強學生關注動物的興趣和意識。
（2）能夠將表格與框架結構網(wǎng)頁結合使用，在創(chuàng)作中體驗樂趣。
1、重點：框架的概念、用途， 創(chuàng)建、編輯與保存框架網(wǎng)頁的方法。
2、難點：框架的拆分。
對比教學法、探究學習法、模仿學習法。
整理、歸類相關素材，并按要求擺放。
1、引入
老師展示一組利用表格制作的網(wǎng)頁，要求學生仔細觀察，找出它們的一個共同特點（學生答：網(wǎng)頁上方和左側內(nèi)容都是相同的，僅右下部分內(nèi)容不一樣），并提問如何快捷地制作這種網(wǎng)頁？（學生答：使用復制粘貼快捷地制作）
盡管復制、粘貼能為我們節(jié)省時間，但有沒有更好的方法呢？相同的區(qū)域我們能否只做一遍呢？今天我們要學習的內(nèi)容——框架網(wǎng)頁制作，就能給我們帶來更多便捷。（讓學生明確框架網(wǎng)頁使用的場合）
2、 新授
（1）框架網(wǎng)頁概念
由以上例子入手，再展示一個框架網(wǎng)頁，教師引導學生理解框架網(wǎng)頁的概念
（2）框架網(wǎng)頁的新建與保存
教師要求學生先閱讀教材中的操作步驟，再嘗試進行探究操作。
任務1 創(chuàng)建"橫幅和目錄"結構的框架網(wǎng)頁，新建top和left頁面，并學會保存。
框架結構中的每個框都是一個獨立的選項文件，即網(wǎng)頁文件，因此當框架確定之后，需要為每個框分別指定其網(wǎng)頁文件的來源，可以通過每個框中的"新建網(wǎng)頁"按鈕和"設置初始網(wǎng)頁"按鈕進行選擇。在top和left頁面中，單擊"保存"按鈕，隨即開始保存。
此處為教學難點，可先由框架的概念入手，再針對保存頁面中的藍色部分，教師進行講解，教會學生注意觀察。
學生要理解框架網(wǎng)頁的概念，通過閱讀教材中的內(nèi)容，自學新建框架網(wǎng)頁的操作，初步了解"新建網(wǎng)頁"和"設置初始網(wǎng)頁"兩個按鈕的不同，并認真聆聽教師的講解，注意觀察，按要求模仿操作。
設計意圖：培養(yǎng)學生自主
學習能力，課堂教學難點在教師的講解后模仿操作，有效突破難點。
（3）相關頁面的制作與設置
框架網(wǎng)頁中相關頁面的制作，需要結合表格來布局，插入文字、圖片和交互式按鈕。
任務2 top和left頁面的制作。
要求：
○1top頁面內(nèi)插入1行2列的表格，左邊單元格插入logo圖片，右邊單元格插入banner圖片。
○2 left頁面內(nèi)插入5行1列的表格，在每個單元格內(nèi)依次插入交互式按鈕（共4個），交互式按鈕文字為展示介紹的相關內(nèi)容概括，在第5個單元格內(nèi)插入一個郵箱指示的圖片。
○3調(diào)整表格邊框的粗細。
○4為main區(qū)域設置初始頁面。（該網(wǎng)頁由教師提供現(xiàn)成的）
學生制作相關頁面，同時也是對前面所學內(nèi)容的復習和回顧。老師反饋學生的操作情況，開展比一比、評一評活動，對表現(xiàn)好的學生給予表揚。
（4）框架網(wǎng)頁屬性的設置
創(chuàng)建好框架網(wǎng)頁后，可以根據(jù)實際需要改變框架的屬性。
任務3 調(diào)整框架的大小、設置框架的邊框、設置框架窗口中的滾動條等。
提高任務：框架的拆分。
學生自主探究學習，可向老師尋求幫助。完成設置后請同學示范操作，并說明自己設置的方法和原因。操作基礎扎實的同學完成任務后可進行擴展學習。
3、 總結與評價
老師可以給出一些常見的框架結構應用界面，如web郵箱頁面等，引導學生總結本課內(nèi)容，梳理課堂知識，并讓學生分組，推薦一些優(yōu)秀作品進行全班展示。
設計意圖：開拓學生的視野，使學生了解框架的應用，教會學生要善于總結，要學會學習的方法。
網(wǎng)頁設計與制作教學設計篇三
《h5快速制作網(wǎng)頁》是蘇教版《初中信息技術》8年級第3章《主題網(wǎng)站設計與制作》第2節(jié)《制作網(wǎng)頁》中第1課時的內(nèi)容。h5是指第5代html標記語言，其搭建的站點可方便地應用于pc、android、ios等多種平臺，它為互聯(lián)網(wǎng)內(nèi)容的呈現(xiàn)提供了一種全新的框架和平臺，包括免插件的音視頻、圖像、動畫、本地存儲以及更多酷炫的功能。通俗地說，h5是一種創(chuàng)建網(wǎng)頁的方式，用h5創(chuàng)建的網(wǎng)頁以文字、圖片、動畫、聲音等相結合的富媒體出現(xiàn)，頁面圖文并茂、生動活潑、傳達方便、易于推廣。
本節(jié)課的學習對象是八年級的學生，處于這一年齡段的學生，思維活躍，具備一定的理解能力和較強的自學能力。通過前面的學習，學生已熟練使用wps、photoshop等軟件，也掌握了規(guī)劃設計主題網(wǎng)站的方法。本節(jié)課以ih5軟件工具為平臺，學習用h5快速制作網(wǎng)頁。然而學生從未接觸過ih5，對于陌生軟件的學習，有些畏難情緒，覺得無從下手。但是在日常生活中，他們經(jīng)常能接觸到各種各樣的手機h5網(wǎng)頁，如企業(yè)宣傳、個人簡歷、邀請函、紀念冊等，這些h5網(wǎng)頁給大家?guī)砹巳碌捏w驗，技術本身帶來的新奇感讓學生心生向往。
知識與技能：能列舉h5網(wǎng)頁的特點；掌握在ih5軟件中添加和編輯文字、圖片、動畫等元素的方法以及設置對象屬性的方法，理解舞臺、頁面、對象之間的層級關系。
過程與方法：通過制作校園文化藝術節(jié)邀請函，經(jīng)歷制作h5網(wǎng)頁的基本過程。
情感態(tài)度及價值觀：感悟網(wǎng)頁制作并非難事，軟件使用有共通之處。
（一）創(chuàng)設情境，初認h5
以藝載德、以藝促智，一年一度的校園文化藝術節(jié)又開始了，同學們踴躍報名，比拼才藝。八年級將舉行以“多彩校園，閃亮你我”為主題的匯報演出，充分展示八年級同學的青春活力和精神面貌。
思考：本次演出將要邀請家長參加，你會選擇什么樣的方式來做出邀請呢？（口頭傳達、短信、紙質(zhì)邀請函等）
活動1：體驗“校園文化藝術節(jié)邀請函h5”，初認h5。
（1）二人一組，一位同學在手機瀏覽器中打開；另一位同學在電腦瀏覽器中打開（網(wǎng)址：https://xxxxxx）。瀏覽后回答以下問題：
不同平臺的瀏覽效果是否一致？為什么？
這支h5中具有哪些媒體元素？
用戶能參與其中嗎？
你會用什么方式推廣這支h5？
小結：
（1）h5具有跨平臺、支持多媒體、可交互、易推廣等優(yōu)勢。以上特點使得h5可能成為我們發(fā)出邀請的首選。
（2）“校園文化藝術節(jié)邀請函h5”為何如此吸引人？觀看視頻，思考到底什么是h5？
小結：h5是指第5代html標記語言，也指用h5語言制作的一切數(shù)字產(chǎn)品。通俗地說，h5是一種創(chuàng)建網(wǎng)頁的方式。用h5創(chuàng)建的網(wǎng)頁圖文并茂、生動活潑、傳達方便、易于推廣。
設計意圖：與h5相關的概念性知識抽象、枯燥難懂，如果采用講授法，學生并不容易理解。因此本節(jié)課創(chuàng)設了學生現(xiàn)實生活中的情境，以制作校園文化藝術節(jié)邀請函h5為主題，設計了4個問題，每個問題目標指向明確，容易引起學生的共鳴，激發(fā)學生的思考并得出結論。通過微視頻用通俗易懂的語言幫助學生進一步認識h5，內(nèi)化知識。
（二）根據(jù)需求，規(guī)劃h5
凡事預則立，不預則廢，要制作匯報演出邀請函，首先對每個頁面的內(nèi)容、素材等進行一個簡單規(guī)劃。
活動2：根據(jù)需求，選擇素材，規(guī)劃邀請函。
設計意圖：學生已經(jīng)學習過網(wǎng)站的規(guī)劃，所以容易理解規(guī)劃的重要性。教師通過搭建“規(guī)劃表”這個支架，引導學生根據(jù)制作校園文化藝術節(jié)邀請函的需求，對所要制作的邀請函進行初步的規(guī)劃，幫助學生理清楚每個頁面的內(nèi)容和所需添加的元素。
（三）知識遷移，制作h5
能夠用于開發(fā)h5網(wǎng)頁的工具很多，今天以ih5軟件工具為平臺，學習使用h5快速制作網(wǎng)頁。
活動3：找“共性”，探“個性”，認識ih5軟件。
（1）使用課前申請的賬號，登錄網(wǎng)址：，進入在線編輯平臺。
（2）對比photoshop界面，認識ih5界面，找出相同之處和不同之處。
小結：相同之處：_______________________（菜單欄、工具面板、編輯區(qū)）
不同之處：_______________________（對象樹面板）
（3）比較ps中的圖層面板和ih5中的對象樹面板，思考對象樹面板的作用。
小結：對象樹面板可以用來管理舞臺中的對象，對象樹中的層級關系為：舞臺→頁面→文本、圖片等素材，每個頁面中的對象上層覆蓋下層。
活動4：利用ih5軟件，制作邀請函h5。
（1）觀看操作指導微視頻，自主探究頁面的制作，完成以下問題：
設置背景：選中頁面1，在屬性面板中找到_____________選項，添加背景圖片。
添加文字：選中頁面1，在工具面板中選擇_____________選項。
添加圖片：選中頁面1，在工具面板中選擇_____________選項。
小結：添加文字、圖片的一般步驟：選擇位置—添加對象。
（2）展示學生作品，師生共同分析存在的問題，尋求解決方式。
問題1：首頁、內(nèi)容頁都播放同一素材。
原因分析：素材全部都添加在了舞臺之中，其層級關系在內(nèi)容頁和首頁的上一級。
問題2：內(nèi)容頁沒有顯示內(nèi)容。
原因分析：素材全部都添加在了首頁之中，而不是對應的內(nèi)容頁中。
設計意圖：遷移是人類認知的一個普遍特征，因為新的學習總是建立在原有學習基礎之上。學生原有的知識是photoshop軟件使用，將photoshop和ih5進行對比，引導學生發(fā)現(xiàn)界面組成的“共性”與“個性“，讓學生初步認識對象樹面板，學會利用對象樹面板來管理素材。在制作h5時采用局部“翻轉課堂”的形式，通過高效、簡短的微視頻和幾個思考題，引導學生思考探究；在學生遇到問題和困難時，師生共同分析問題，解決問題。給學生“瑞士奶酪式”知識建構時間，使學生從規(guī)律的獲得到知識的應用有一個過渡和漸進的過程。
（四）自主探究，美化h5
活動5：美化完善邀請函h5。
（1）邀請函中的標題、內(nèi)容文字等選用什么樣的字體、字號合適？如何設置？
（2）如何改變圖片大小，修改圖片的亮度、對比度等？
（3）如何設置元素的動態(tài)效果，使得網(wǎng)頁更生動？
小結：
（1）選中文字或圖片——屬性面板——修改設置。“邀請函”等標題文字字號一般選用大些，宜用飽滿的字體，以達到醒目的作用；內(nèi)容用于提供具體信息，文字字號可以小些。
（2）圖片選用要符合主題，色彩和諧。字體顏色與背景要有一定的對比度。（3）選擇要添加動態(tài)效果的對象——選擇動效命令。注意：設置合理、適度的動態(tài)效果，可以給觀賞者帶來較好的視覺體驗。
設計意圖：對邀請函的美化可分成兩個部分：一是對邀請函中的文字、圖片進行美化，二是合理設置動態(tài)效果。單從技術角度來講，這些操作是比較簡單的，只要學會設置屬性面板即可。但是邀請函的美化不是天馬行空，隨心所欲，還需要一定的藝術欣賞能力。因此首先讓學生帶著問題思考如何設置文字、圖片？設置動效時需要注意的問題？得出一定的結論后，讓學生帶著構思去美化邀請函，以減少學生操作的盲目性。
（五）作品展示，共析h5
活動6：發(fā)布和評價作品。
（1）對于制作好的作品，將其發(fā)布到網(wǎng)上，這樣其他人就可以通過電腦和手機訪問你的作品。請保存當前的網(wǎng)頁并發(fā)布到網(wǎng)上。
（2）同桌之間用發(fā)布的網(wǎng)址或二維碼相互訪問對方的作品。
（3）根據(jù)評價表對同桌的作品進行評價。
（4）根據(jù)同伴及老師意見進一步修改作品。
設計意圖：學生在制作完成邀請函后，進行保存，發(fā)布就可以瀏覽到自己的成品，極大地提高了學生的學習興趣。將學生的作品進行展示，師生共同賞析作品，根據(jù)評價表進行點評，給出建議，然后進一步完善作品。
（六）知識梳理，展望h5
展示思維導圖，梳理本節(jié)課內(nèi)容：
總結利用ih5制作網(wǎng)頁的基本過程：
觀看視頻，結束本課：隨著信息技術的高速發(fā)展，h5可謂是無處不在。h5可以是各種宣傳網(wǎng)頁、在線游戲，甚至戶外大屏中的互動也是h5。在未來5-10年內(nèi)，h5或將會成為移動互聯(lián)網(wǎng)領域的主宰者。
設計意圖：借助思維導圖，將關鍵知識點結構化，清晰形象地呈現(xiàn)出各知識點的脈絡關系，有助于學生從整體上把握知識，完成知識的建構。最后觀看h5應用視頻，了解h5的日常應用，對未來展望，進行情感升華。
網(wǎng)頁設計與制作教學設計篇四
課程編號：
中文名稱：網(wǎng)頁設計與制作
英文名稱：web design and production課程類別：選修課適用專業(yè)：所有專業(yè)
開課學期：20xx—20xx第2學期總學時：24學時總學分：1課程簡介：
本課程突出網(wǎng)頁設計與制作的現(xiàn)代特點，從internet的基礎知識入手，重點介紹html超文本標記語言，以及所見即所得的網(wǎng)頁設計制作工具dreamweaver的基本操作流程。從靜態(tài)頁面到動態(tài)頁面由淺入深的介紹網(wǎng)頁設計與制作全過程。采用案例分析和親自實踐的方式突出、突破課程的重點和難點。并指導每一名選課的同學為自己建一個博客網(wǎng)站，以此提高同學對網(wǎng)頁設計與制作的興趣和愛好。參考書：
1、網(wǎng)頁設計與制作教程，熊前興閔聯(lián)營，科學出版社；
2、網(wǎng)站與網(wǎng)頁設計，張貴明，清華大學出版社；
3、網(wǎng)頁美術設計原理及實戰(zhàn)策略，王曉峰焦燕，清華大學出版社；
4、網(wǎng)站建設典型案例，張梟，清華大學出版社；
網(wǎng)頁和網(wǎng)站是internet的重要組成部分，企業(yè)、公司和機構通過網(wǎng)站來宣傳推介自己的技術和產(chǎn)品，個人發(fā)布主頁展示自己的風采，人們從不同類型的網(wǎng)站來獲取需要的信息。因此，設計與制作網(wǎng)頁已經(jīng)成為計算機應用技術的一個重要方面。本課程的主要教學目的是使學生掌握網(wǎng)頁設計與制作的基礎知識，能運用網(wǎng)頁工具設計和制作常用網(wǎng)頁。
第一章、網(wǎng)頁的基礎知識（1學時）
（1）internet基礎知識
（2）www簡介
（3）網(wǎng)頁制作的技術和工具介紹
第二章、超文本編輯語言html（8學時）
（1）html文件的基本結構
（2）文字和段落標記
（3）列表標記
（4）圖片標記
（5）表格標記
（6）超鏈接標記
（7）表單標記
（8）框架標記
第三章、javascript語言（4學時）
（1）javascript語言簡介
（2）javascript編程基礎
（3）基于對象的javascript語言
（4）javascript程序實例
第四章、層疊樣式表css（1學時）
（1）css概述
（2）css屬性
第五章、可視化網(wǎng)頁設計工具
（1）網(wǎng)頁的基本操作
（2）圖像、表格與超鏈接
（3）表單與框架
（4）添加網(wǎng)頁元素
（5）發(fā)布站點
第六章、動態(tài)網(wǎng)頁設計語言asp（4學時）
（1）asp簡介
（2）vbscript腳本基礎
（3）asp的.內(nèi)置對象
（4）實用文件
第七章、利用ad0訪問數(shù)據(jù)庫（1學時）
（1）數(shù)據(jù)庫的連接
（2）數(shù)據(jù)庫的檢索
（3）數(shù)據(jù)庫的操作
總結復習（1學時）
四、實驗教學內(nèi)容與要求
五、作業(yè)
六、考核方式
期末考核每個同學為自己設計制作一個博客網(wǎng)站。
七、成績評定
1、自制網(wǎng)站（80%）
2、平時考勤、作業(yè)（20%）平時成績分配：
平時考勤5次，每次2分，共占10%作業(yè)5次，每次2分，共占10%
八、執(zhí)行大綱時應注意的問題
根據(jù)學生對課程內(nèi)容的掌握和理解程度會對進度做適當?shù)恼{(diào)整。
網(wǎng)頁設計與制作教學設計篇五
1、知識與技能：
（1）、了解框架結構網(wǎng)頁的概念及在網(wǎng)頁中的作用，了解它與表格網(wǎng)頁的區(qū)別。
（2）、掌握框架結構網(wǎng)頁的建立、框架結構的拆分、框架的刪除等。
（3）、掌握框架中頁面設置及保存的方法，如設置初始網(wǎng)頁按鈕、新建網(wǎng)頁按鈕等。
2、過程與方法：
（1）、能夠區(qū)分框架結構屬性設置與網(wǎng)頁屬性設置的不同點。
（2）、通過框架結構網(wǎng)頁設計，使學生對網(wǎng)頁的整體結構有更進一步的認識。
3、情感態(tài)度與價值觀：
（1）、能夠將表格與框架結構網(wǎng)頁結合使用，在創(chuàng)作中體驗樂趣。
（2）、培養(yǎng)學生網(wǎng)頁設計的審美意識、創(chuàng)新意識。
1、教學重點：
（1）、框架網(wǎng)頁的作用和功能，框架的建立與屬性設置。
（2）、框架中各個頁面之間的關聯(lián)，每個框中頁面的設置方法。
（3）、框架網(wǎng)頁的保存方法。
2、教學難點：
（1）、框架結構網(wǎng)頁中框架屬性與頁面屬性的設置方法。
（2）、理解框架結構的多頁面存儲方法及各頁面之間的關聯(lián)。
1、創(chuàng)設情境、導入新課
（1）、教師展示一組表格制作的網(wǎng)頁，引導學生找出它們的共同特點。并提問如何快捷地制作這種網(wǎng)頁（學生回答：使用復制、粘貼快捷地制作）。
（2）、教師又提問：有沒有更好的方法呢？相同的區(qū)域我們能否只做一遍呢？從而導入新課——框架網(wǎng)頁的制作。
設計意圖：通過對比、比較，引導學生思考，激發(fā)學生學習的樂趣。
2、任務驅動、自主學習
（1）、教師展示一個框架網(wǎng)頁，引導學生理解框架網(wǎng)頁的概念。
（2）、出示任務一：框架網(wǎng)頁的新建與保存。教師要求學生先閱讀教材中的操作步驟，再嘗試完成書本第227頁的實踐學習。
（3）、教師講解框架結構中的每個框都是一個獨立的選項文件，即網(wǎng)頁文件，因此當框架確定之后，需要為每個框分別指定其網(wǎng)頁文件的來源，可以通過每個框中的“新建網(wǎng)頁”按鈕和“設置初始網(wǎng)頁”按鈕進行選擇。
（4）、學生理解框架網(wǎng)頁的概念，通過閱讀教材中的內(nèi)容，自學新建框架網(wǎng)頁的操作，初步了解“新建網(wǎng)頁”和“設置初始網(wǎng)頁”兩個按鈕的不同，并認真聆聽教師的講解，注意觀察，按要求模仿操作。
（5）、出示任務二：相關頁面的制作與設置。教師要求學生先閱讀教材中的操作步驟，再嘗試完成書本第228、229頁的實踐學習。
（6）、學生制作相關頁面，同時也是對前面所學內(nèi)容的復習和回顧。教師反饋學生的操作情況，開展評比活動，對表現(xiàn)好的學生給與表揚。
（7）、出示任務三：框架網(wǎng)頁屬性的設置。學生自主探究學習，有問題可向教師尋求幫助。教師基礎扎實的同學完成任務后可進行拓展學習。
（8）、教師請學生示范操作，并說明自己設置的方法和原因。同時鼓勵做的比較好的學生。
設計意圖：培養(yǎng)學生的自主學習能力，對于課堂教學難點，學生在教師的講解后模仿操作，有效突破難點。
3、展示作品、課堂小結
（1）、教師給出一些常見的框架結構應用界面，如web郵箱頁面等，引導學生總結本課內(nèi)容，并讓學生分組，推進一些優(yōu)秀作品在全班展示。
（2）、教師點評，并鼓勵完成作品比較好的學生。
設計意圖：拓展學生的視野，使學生了解框架的應用方法。展示優(yōu)秀作品鼓勵學生，激發(fā)學生的創(chuàng)作欲望。
1、本節(jié)課是在學習完簡單網(wǎng)頁、表格布局網(wǎng)頁、交互式網(wǎng)頁的基礎上，進一步頁的設計方法。由于學生已經(jīng)具備了一定的網(wǎng)頁設計基礎知識與技能，所以教師可以根據(jù)學生的實際情況，采用更靈活
的教學方法。教師可以簡單介紹框架結構網(wǎng)頁的功能及框架的建立與編輯方法，以及框架屬性設置與網(wǎng)頁屬性設置的方法與區(qū)別。然后由學生根據(jù)教師提供的學案及演示動畫，完成框架網(wǎng)頁設計任務。
網(wǎng)頁設計與制作教學設計篇六
1、知識與技能
（1）了解超級鏈接的含義及鏈接源和鏈接目標的含義，掌握同一站點內(nèi)以及不同站點間網(wǎng)頁超級鏈接的創(chuàng)建方法。
（2）掌握網(wǎng)頁內(nèi)書簽的作用及創(chuàng)建書簽鏈接方法，掌握交互式按鈕、框架網(wǎng)頁內(nèi)超級鏈接的設置方法。
（3）理解熱區(qū)鏈接的含義及創(chuàng)建方法。
2、過程與方法
（1）通過創(chuàng)建網(wǎng)頁超級鏈接的操作，使學生了解網(wǎng)頁中創(chuàng)建超級鏈接的基本方法，破除對網(wǎng)頁鏈接的神秘感。
（2）通過對不同對象設置超級鏈接的操作，使學生總結出操作的規(guī)律，培養(yǎng)學生自主學習與操作的能力。
（3）通過網(wǎng)頁不同的超級鏈接方法，拓展學生思維，創(chuàng)建多種形式的網(wǎng)頁鏈接。
3、情感態(tài)度與價值觀
（1）通過鏈接我國主要自然保護區(qū)網(wǎng)頁，激發(fā)學生熱愛祖國、熱愛自然、熱愛生命的激情。
（2）完成超級鏈接，使學生感受成功的喜悅和快樂。
1、教學重點：
（1）超級鏈接的含義及鏈接源和鏈接目標的含義。
（2）超鏈接的制作方法——給文字、圖片制作超鏈接，制作書簽鏈接，給交互式按鈕制作超鏈接，框架頁面內(nèi)的超鏈接，圖片區(qū)域制作超鏈接等。
2、教學難點
（1）書簽鏈接中名稱及對應鏈接位置的設定。
（2）在框架頁面中制作超鏈接時，目標對象所選擇的顯示窗口形式。
教學方法與教學手段：
任務驅動法、討論探究法、講解與演示法、類比知識遷移法。
教學準備：
"動物——人類的朋友"站點，包括未鏈接的網(wǎng)頁，如歡迎頁、表格頁、框架頁，表單頁等。
教學過程：
1、引入
展示兩個主頁，一個已經(jīng)創(chuàng)建了鏈接，一個沒有創(chuàng)建鏈接，讓學生進行比較并找出區(qū)別，引出本課課題——超級鏈接。
提出：我們在先前的學習中，哪個軟件中的相關操作與它類似？什么是超級鏈接？找一個例子，分析鏈接源和鏈接目標分別是什么？
學生展開交流，通過對比找出不同點，并積極思考，回答老師的問題。
設計意圖：通過對比操作、交流，再輔以知識遷移，明確本節(jié)課教學內(nèi)容。
2、新授
（1）站內(nèi)超級鏈接
引導學生回顧powerpoint中超鏈接的制作方法（教師提示：右擊鏈接源，利用快捷菜單制作超鏈接），輔以教材中的內(nèi)容，讓學生自行探究并完成以下操作：
任務1同一站點內(nèi)不同頁面之間的鏈接
○1制作首頁（歡迎頁）到表格頁的超鏈接。
○2給表格頁內(nèi)交互式按鈕設置超級鏈接，鏈接到相關頁面。
○3給框架頁內(nèi)交互式按鈕設置超級鏈接，鏈接到相關頁面。
教師巡視，及時指導，安排學生示范操作并講解如何制作超鏈接。
交互式按鈕的超鏈接制作要求在框架網(wǎng)頁中演示操作。老師可以提問學生：演示者操作的對嗎？有沒有問題？
引導學生發(fā)現(xiàn)問題：超鏈接制作完成后需要檢驗（保存后預覽）。
教師講解，突破難點，再交由學生操作。
以上是同一站點內(nèi)不同網(wǎng)頁之間的鏈接，有時一個頁面中內(nèi)容過多，需要不斷拖動滾動條實現(xiàn)閱讀，能否實現(xiàn)快速跳轉呢？
任務2同一站點內(nèi)同一頁面內(nèi)的跳轉（鏈接）：在"動物趣聞"頁面內(nèi)制作書簽鏈接。
教師講解：由生活中的書簽引入，介紹"書簽鏈接"的概念，然后再演示如何操作。
提示：書簽鏈接的雙向性問題（返回）。
學生認真聽講后模仿制作，教師巡視進行指導并反饋學生的完成情況。
（2）站間超級鏈接
僅憑我們課堂上制作的這些頁面還不足以詳細介紹我們的主題，此時我們還可以借助超鏈接，鏈接到因特網(wǎng)上的其他網(wǎng)站，以豐富我們的內(nèi)容。
任務3借助熱區(qū)鏈接，為"友情鏈接"頁面制作超鏈接，鏈接我國一些自然保護區(qū)網(wǎng)站。
有了以上基礎，可安排學生自學教材中有關熱區(qū)鏈接的相關內(nèi)容，學生探究操作后教師再安排學生進行演示，輔助以提問的形式檢驗學生的自學情況。
3、總結與評價
開展同學間的互助，檢驗其鏈接完成情況，推薦優(yōu)秀同學做展示。引導學生分類總結本節(jié)課的知識點。
【本文地址：http://mlvmservice.com/zuowen/487086.html】
