【正文】 書簽鏈接方法，掌握交互式按鈕、框架網(wǎng)頁內(nèi)超級(jí)鏈接的設(shè)置方法。互相欣賞作品可以讓學(xué)生來檢測(cè)自己的學(xué)習(xí)成果，知道彼此之間的差距。讓學(xué)生在掌握操作技術(shù)的基礎(chǔ)上對(duì)網(wǎng)頁布局和顏色搭配有進(jìn)一步的認(rèn)識(shí)，在此基礎(chǔ)上形成對(duì)學(xué)生審美觀的培養(yǎng)。先完成自己的作品并與同學(xué)進(jìn)行交流和溝通。學(xué)生：自主學(xué)習(xí)、互相協(xié)作，也可以參考教師已下傳上操作方法或正確樣例。設(shè)計(jì)意圖：通過網(wǎng)頁實(shí)例的導(dǎo)入，將課堂氣氛調(diào)節(jié)得比較活躍，讓學(xué)生更容易進(jìn)入學(xué)習(xí)狀態(tài)，為以下的學(xué)習(xí)做好鋪墊。）以任務(wù)驅(qū)動(dòng)的方式查漏補(bǔ)缺，使教學(xué)內(nèi)容合理流動(dòng)，水到渠成。這對(duì)于學(xué)生以后的進(jìn)一步學(xué)習(xí)很有幫助。教師重點(diǎn)在導(dǎo)，學(xué)生重點(diǎn)在實(shí)踐與創(chuàng)新。同時(shí)對(duì)學(xué)生網(wǎng)頁的創(chuàng)作能力、網(wǎng)頁布局和色彩搭配能力進(jìn)行激發(fā)與培養(yǎng)。而關(guān)于HTML 和講授網(wǎng)頁布局的過程時(shí)，有必要要教師先演示一下，這也是本節(jié)課的重難點(diǎn)。難點(diǎn)：網(wǎng)頁的合理布局和色彩搭配。六、教學(xué)設(shè)計(jì)收集資料，激發(fā)興趣。在授課中我安排了多次的動(dòng)手制作活動(dòng)，制作難度由淺入深，旨在通過學(xué)生自己動(dòng)手動(dòng)腦，形成自主探究進(jìn)而創(chuàng)作的能力。在此基礎(chǔ)上，教師進(jìn)一步設(shè)置了拓展問題，讓學(xué)生設(shè)計(jì)自己的網(wǎng)頁，并通過簡(jiǎn)單網(wǎng)頁的制作體會(huì)html的具體含義。（3）第三關(guān)：挑戰(zhàn)任務(wù)：展翅高飛，自由創(chuàng)作在學(xué)習(xí)制作完第二個(gè)環(huán)節(jié)后，引導(dǎo)學(xué)生進(jìn)入“網(wǎng)頁達(dá)人”的環(huán)節(jié)，本環(huán)節(jié)主要講解網(wǎng)頁的布局等知識(shí)，由教師演示常見的網(wǎng)頁布局格式，并簡(jiǎn)單的給學(xué)生進(jìn)行點(diǎn)評(píng)和原理分析。（2）學(xué)生自己推薦：認(rèn)為自己作品好的學(xué)生可以舉手向老師推薦。課后探究實(shí)踐教師給出提示，引導(dǎo)學(xué)生自主學(xué)習(xí)，充分挖掘他們的學(xué)習(xí)潛力設(shè)計(jì)意圖：讓學(xué)生在課后有思考問題的空間，進(jìn)一步激發(fā)他們學(xué)習(xí)frontpage的興趣。情感態(tài)度與價(jià)值觀（1）通過鏈接我國(guó)主要自然保護(hù)區(qū)網(wǎng)頁，激發(fā)學(xué)生熱愛祖國(guó)、熱愛自然、熱愛生命的激情。教學(xué)過程：引入展示兩個(gè)主頁，一個(gè)已經(jīng)創(chuàng)建了鏈接，一個(gè)沒有創(chuàng)建鏈接，讓學(xué)生進(jìn)行比較并找出區(qū)別，引出本課課題——超級(jí)鏈接。老師可以提問學(xué)生：演示者操作的對(duì)嗎？有沒有問題？引導(dǎo)學(xué)生發(fā)現(xiàn)問題：超鏈接制作完成后需要檢驗(yàn)（保存后預(yù)覽）。有了以上基礎(chǔ)，可安排學(xué)生自學(xué)教材中有關(guān)熱區(qū)鏈接的相關(guān)內(nèi)容，學(xué)生探究操作后教師再安排學(xué)生進(jìn)行演示，輔助以提問的形式檢驗(yàn)學(xué)生的自學(xué)情況。制作網(wǎng)頁的標(biāo)題：輸入文字，并設(shè)置文字的格式。進(jìn)一步設(shè)置單元格的背景，來美化網(wǎng)頁。網(wǎng)頁制作教學(xué)設(shè)計(jì)3一、課程基本信息課程編號(hào)：中文名稱：網(wǎng)頁設(shè)計(jì)與制作英文名稱：Web Design and Production課程類別：選修課適用專業(yè)：所有專業(yè)開課學(xué)期：20xx—20xx第2學(xué)期總學(xué)時(shí)：24學(xué)時(shí)總學(xué)分：1課程簡(jiǎn)介：本課程突出網(wǎng)頁設(shè)計(jì)與制作的現(xiàn)代特點(diǎn)，從Internet的基礎(chǔ)知識(shí)入手，重點(diǎn)介紹HTML超文本標(biāo)記語言，以及所見即所得的網(wǎng)頁設(shè)計(jì)制作工具Dreamweaver的基本操作流程。七、成績(jī)?cè)u(píng)定自制網(wǎng)站（80%）平時(shí)考勤、作業(yè)（20%）平時(shí)成績(jī)分配：平時(shí)考勤5次，每次2分，共占10%作業(yè)5次，每次2分，共占10%八、執(zhí)行大綱時(shí)應(yīng)注意的問題根據(jù)學(xué)生對(duì)課程內(nèi)容的掌握和理解程度會(huì)對(duì)進(jìn)度做適當(dāng)?shù)恼{(diào)整。但是在日常生活中，他們經(jīng)常能接觸到各種各樣的手機(jī)H5網(wǎng)頁，如企業(yè)宣傳、個(gè)人簡(jiǎn)歷、邀請(qǐng)函、紀(jì)念冊(cè)等，這些H5網(wǎng)頁給大家?guī)砹巳碌捏w驗(yàn)，技術(shù)本身帶來的新奇感讓學(xué)生心生向往。瀏覽后回答以下問題：不同平臺(tái)的瀏覽效果是否一致？為什么？這支H5中具有哪些媒體元素？用戶能參與其中嗎？你會(huì)用什么方式推廣這支H5？小結(jié)：（1）H5具有跨平臺(tái)、支持多媒體、可交互、易推廣等優(yōu)勢(shì)。（二）根據(jù)需求，規(guī)劃H5凡事預(yù)則立，不預(yù)則廢，要制作匯報(bào)演出邀請(qǐng)函，首先對(duì)每個(gè)頁面的內(nèi)容、素材等進(jìn)行一個(gè)簡(jiǎn)單規(guī)劃。小結(jié)：相同之處：_______________________（菜單欄、工具面板、編輯區(qū)）不同之處：_______________________（對(duì)象樹面板）（3）比較PS中的圖層面板和iH5中的對(duì)象樹面板，思考對(duì)象樹面板的作用。問題1：首頁、內(nèi)容頁都播放同一素材。（四）自主探究，美化H5活動(dòng)5：美化完善邀請(qǐng)函H5。單從技術(shù)角度來講，這些操作是比較簡(jiǎn)單的，只要學(xué)會(huì)設(shè)置屬性面板即可。（4）根據(jù)同伴及老師意見進(jìn)一步修改作品。網(wǎng)頁制作教學(xué)設(shè)計(jì)5教學(xué)目標(biāo)知識(shí)與技能：靈活運(yùn)用添加超鏈接和在網(wǎng)頁中插入表格方法，根據(jù)網(wǎng)頁內(nèi)容進(jìn)行頁面布局，完善網(wǎng)頁,掌握網(wǎng)頁布局的技能和技巧。此部分教學(xué)內(nèi)容在整個(gè)網(wǎng)頁設(shè)計(jì)知識(shí)體系中處于綜合處理信息的重要部分。利用信息技術(shù)中計(jì)算機(jī)技術(shù)進(jìn)行網(wǎng)頁設(shè)計(jì)，實(shí)現(xiàn)教學(xué)目標(biāo)，完成讓世界各地的人實(shí)現(xiàn)“網(wǎng)上游古都”。［出示課題］今天我們就圍繞“西安七日游”，在主頁中利用表格規(guī)劃設(shè)計(jì)旅游行程，本節(jié)課的課題是《“黃金周”—規(guī)劃網(wǎng)上西安七日游》學(xué)生明確本節(jié)課課題，初步了解任務(wù)。學(xué)生共同研究選組長(zhǎng),并協(xié)調(diào)分配好任務(wù).鍛煉學(xué)生自主協(xié)調(diào)分工能力。）學(xué)生根據(jù)角色分工，按小組形式開始完善網(wǎng)站。學(xué)生間相互交流探討。悠久的歷史積淀和豐富的人文資源，使西安居中國(guó)六大古都之首，是世界四大文明古都之一，著名的旅游中心城市。2．關(guān)鍵環(huán)節(jié)提煉利用信息技術(shù)創(chuàng)設(shè)情境，播放一段自拍的錄像，內(nèi)容大體是：一位外國(guó)友人，想要來中國(guó)四大古都之一“西安”旅游，但想要自助游，想借助因特網(wǎng)，先在網(wǎng)上了解一下西安，并參考一下旅游行程。通過利用信息技術(shù)規(guī)劃規(guī)劃網(wǎng)上西安七日游，對(duì)西安七個(gè)主要景點(diǎn)的介紹，讓世界了解西安，每個(gè)學(xué)生在共同完成“網(wǎng)上游古都”網(wǎng)站作品后，讓每個(gè)學(xué)生都有完成任務(wù)和宣傳中國(guó)源遠(yuǎn)流長(zhǎng)的文明歷史的成就感，并感到自豪。學(xué)生在積極的參與、體驗(yàn)、研究并在已有知識(shí)經(jīng)驗(yàn)的支持下，自主能動(dòng)地探索，實(shí)現(xiàn)知識(shí)的再創(chuàng)造。過程與方法：（1）、能夠區(qū)分框架結(jié)構(gòu)屬性設(shè)置與網(wǎng)頁屬性設(shè)置的不同點(diǎn)。（2）、理解框架結(jié)構(gòu)的多頁面存儲(chǔ)方法及各頁面之間的關(guān)聯(lián)。（3）、教師講解框架結(jié)構(gòu)中的每個(gè)框都是一個(gè)獨(dú)立的選項(xiàng)文件，即網(wǎng)頁文件，因此當(dāng)框架確定之后，需要為每個(gè)框分別指定其網(wǎng)頁文件的來源，可以通過每個(gè)框中的“新建網(wǎng)頁”按鈕和“設(shè)置初始網(wǎng)頁”按鈕進(jìn)行選擇。教師基礎(chǔ)扎實(shí)的同學(xué)完成任務(wù)后可進(jìn)行拓展學(xué)習(xí)。四、教學(xué)反思：本節(jié)課是在學(xué)習(xí)完簡(jiǎn)單網(wǎng)頁、表格布局網(wǎng)頁、交互式網(wǎng)頁的基礎(chǔ)上，進(jìn)一步頁的設(shè)計(jì)方法。（2）理解框架的概念與組成，學(xué)會(huì)分析網(wǎng)站的結(jié)構(gòu)。（讓學(xué)生明確框架網(wǎng)頁使用的場(chǎng)合）新授（1）框架網(wǎng)頁概念由以上例子入手，再展示一個(gè)框架網(wǎng)頁，教師引導(dǎo)學(xué)生理解框架網(wǎng)頁的概念（2）框架網(wǎng)頁的新建與保存教師要求學(xué)生先閱讀教材中的操作步驟，再嘗試進(jìn)行探究操作。任務(wù)2 top和left頁面的制作。任務(wù)3 調(diào)整框架的大小、設(shè)置框架的邊框、設(shè)置框架窗口中的滾動(dòng)條等。二、教學(xué)重點(diǎn)、能在指定位置建立只有一個(gè)網(wǎng)頁的站點(diǎn)（難點(diǎn)）、能在頁面中插入文字、圖片、水平線、掌握頁面文件與圖片的保存（難點(diǎn)）三、學(xué)情分析學(xué)生已經(jīng)學(xué)習(xí)了 WORD、POWERPOINT 與上網(wǎng)瀏覽信息，對(duì)計(jì)算機(jī)的基本操作（WORD 中文檔的編輯，網(wǎng)頁的瀏覽等）比較熟練。打開主頁，瀏覽頁面，這是老師做的一個(gè)導(dǎo)學(xué)課件，將幫助大家完成學(xué)習(xí)任務(wù)。學(xué)生上機(jī)操作，在指定位置建立自己站點(diǎn)、請(qǐng)先做好的學(xué)生當(dāng)小老師，輔導(dǎo)其它學(xué)生。二、突出重點(diǎn)，及時(shí)點(diǎn)評(píng)張?jiān)?老師在引導(dǎo)學(xué)生進(jìn)行學(xué)習(xí)、操作后，就主動(dòng)地去觀察和發(fā)現(xiàn)學(xué)生中出現(xiàn)的問題，甚至于課前對(duì)可能出現(xiàn)的問題，也進(jìn)行有預(yù)見性地準(zhǔn)備；發(fā)現(xiàn)問題及時(shí)點(diǎn)評(píng)。第四篇：“網(wǎng)頁的制作”教學(xué)設(shè)計(jì)《網(wǎng)頁的制作》教學(xué)設(shè)計(jì)山東省昌樂二中 滕學(xué)梅【學(xué)情分析】，學(xué)生進(jìn)行了網(wǎng)站的規(guī)劃與設(shè)計(jì)，還沒有就網(wǎng)頁制作真正著手練習(xí)，對(duì)Frontpage的使用比較陌生，但是已經(jīng)有word等軟件的操作基礎(chǔ)，很多基本的操作可以遷移過來。二、指導(dǎo)與點(diǎn)撥（3分鐘），觀察其網(wǎng)頁布局（如圖），引導(dǎo)學(xué)生嘗試使用表格對(duì)網(wǎng)頁進(jìn)行版面設(shè)計(jì)。七、完善提升：（5分鐘），進(jìn)一步完善自己的作品； ，將新學(xué)到的操作嘗試一遍。三、教學(xué)重點(diǎn)：能在指定位置建立只有一個(gè)網(wǎng)頁的站點(diǎn)（難點(diǎn)）能在頁面中插入文字、圖片、水平線掌握頁面文件與圖片的保存（難點(diǎn)）四、教學(xué)難點(diǎn)：在教學(xué)中，一方面采用比較教學(xué)的方法，促進(jìn)學(xué)生知識(shí)的遷移；另一方面，提供學(xué)生一個(gè)導(dǎo)學(xué)課件，讓學(xué)生根據(jù)這個(gè)網(wǎng)絡(luò)環(huán)境下的課件自己探索學(xué)習(xí)，以滿足不同層次學(xué)生的需求。制作網(wǎng)頁時(shí)，必須在網(wǎng)頁視圖中編輯頁面。請(qǐng)學(xué)生繼續(xù)完成自己的主頁，有能力的同學(xué)完成提高篇六、小結(jié)：展示學(xué)生作品，教師與學(xué)生共同評(píng)價(jià) 請(qǐng)學(xué)生總結(jié)今天的學(xué)習(xí)內(nèi)容：建立包含一個(gè)頁面的站點(diǎn)，主頁的設(shè)計(jì)與保存。預(yù)覽窗口：瀏覽器中出現(xiàn)的效果，與PowerPoint中的“放映幻燈片”類似。問題1：網(wǎng)站是不是就是網(wǎng)頁？用自己的語言描述一下網(wǎng)站的概念（網(wǎng)站包含多個(gè)網(wǎng)頁，通過超鏈接把不同的頁面鏈接起來）問題2：網(wǎng)頁是不是就是主頁？(第一個(gè)頁面稱為主頁,網(wǎng)站設(shè)計(jì)者可以確定哪一個(gè)是主頁,主頁的文件名一般為：,主頁也是網(wǎng)頁)設(shè)計(jì)網(wǎng)站一般必須經(jīng)過兩個(gè)步驟，首先是在計(jì)算機(jī)里做好，然后發(fā)布在internet上，讓所有的人訪問瀏覽?！窘虒W(xué)反思】，適時(shí)指導(dǎo)很重要，但教師一人肯定不能照顧全體學(xué)生，所以充分發(fā)揮學(xué)習(xí)小組的“技術(shù)顧問”的作用很關(guān)鍵。（素材發(fā)到桌面“基本功練習(xí)”文件夾中）與word中的操作類似，注意遷移 ：（1）先獨(dú)立練習(xí)（參考導(dǎo)學(xué)案的“操作導(dǎo)航”）；嘗試一遍后可與組內(nèi)同學(xué)小聲交流，解決疑難問題；（2）每組的“技術(shù)顧問”完成任務(wù)后可下座指導(dǎo)；（3）完成后相互檢查超鏈接的效果。，接受能力不同，可以充分發(fā)揮各小組“技術(shù)顧問”的作用，幫助指導(dǎo)組內(nèi)其他成員，共同完成學(xué)習(xí)任務(wù)。張?jiān)?老師在點(diǎn)評(píng)建成的網(wǎng)站時(shí)，重點(diǎn)若再突出些，介紹再清楚些，效果會(huì)更好。點(diǎn)評(píng)：教學(xué)課題 “ 網(wǎng)頁制作 ” 作為初中階段的最后一部分內(nèi)容，難度較大，教學(xué)的深度較難掌握。制作網(wǎng)頁時(shí)，必須在網(wǎng)頁視圖中編輯頁面普通窗口：鼠標(biāo)在閃動(dòng)，可編輯、修改頁面，所見即所得的方式預(yù)覽窗口：瀏覽器中出現(xiàn)的效果，與 PowerPoint 中的 “ 放映幻燈片 ” 類似。每位學(xué)生必須完成基本任務(wù)，有能力的學(xué)生還可以完成提高篇的學(xué)習(xí)，以充分發(fā)揮學(xué)生的積極性與自主性。學(xué)生自主探究學(xué)習(xí)，可向老師尋求幫助。○2 left頁面內(nèi)插入5行1列的表格，在每個(gè)單元格內(nèi)依次插入交互式按鈕（共4個(gè)），交互式按鈕文字為展示介紹的相關(guān)內(nèi)容概括，在第5個(gè)單元格內(nèi)插入一個(gè)郵箱指示的圖片?？蚣芙Y(jié)構(gòu)中的每個(gè)框都是一個(gè)獨(dú)立的選項(xiàng)文件，即網(wǎng)頁文件，因此當(dāng)框架確定之后，需要為每個(gè)框分別指定其網(wǎng)頁文件的來源，可以通過每個(gè)框中的“新建網(wǎng)頁”按鈕和“設(shè)置初始網(wǎng)頁”按鈕進(jìn)行選擇。（2）能夠?qū)⒈砀衽c框架結(jié)構(gòu)網(wǎng)頁結(jié)合使用，在創(chuàng)作中體驗(yàn)樂趣。教師可以簡(jiǎn)單介紹框架結(jié)構(gòu)網(wǎng)頁的功能及框架的建立與編輯方法，以及框架屬性設(shè)置與網(wǎng)頁屬性設(shè)置的方法與區(qū)別。同時(shí)鼓勵(lì)做的比較好的學(xué)生。（5）、出示任務(wù)二：相關(guān)頁面的制作與設(shè)置。并提問如何快捷地制作這種網(wǎng)頁（學(xué)生回答：使用復(fù)制、粘貼快捷地制作）。情感態(tài)度與價(jià)值觀：（1）、能夠?qū)⒈砀衽c框架結(jié)構(gòu)網(wǎng)頁結(jié)合使用，在創(chuàng)作中體驗(yàn)樂趣。更注重學(xué)生個(gè)性培養(yǎng)和創(chuàng)新智能的開發(fā)。但個(gè)別學(xué)生沒有認(rèn)識(shí)到合作學(xué)習(xí)的重要意義，自主