最新網(wǎng)頁設計與制作教學設計 網(wǎng)頁設計制作教案(3篇)

字號:

    作為一位無私奉獻的人民教師,總歸要編寫教案,借助教案可以有效提升自己的教學能力。那么問題來了,教案應該怎么寫?以下是小編收集整理的教案范文,僅供參考,希望能夠幫助到大家。
    網(wǎng)頁設計與制作教學設計 網(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)頁美術(shù)設計原理及實戰(zhàn)策略,王曉峰焦燕,清華大學出版社;
    4、網(wǎng)站建設典型案例,張梟,清華大學出版社;
    網(wǎng)頁和網(wǎng)站是internet的重要組成部分,企業(yè)、公司和機構(gòu)通過網(wǎng)站來宣傳推介自己的技術(shù)和產(chǎn)品,個人發(fā)布主頁展示自己的風采,人們從不同類型的網(wǎng)站來獲取需要的信息。因此,設計與制作網(wǎng)頁已經(jīng)成為計算機應用技術(shù)的一個重要方面。本課程的主要教學目的是使學生掌握網(wǎng)頁設計與制作的基礎知識,能運用網(wǎng)頁工具設計和制作常用網(wǎng)頁。
    第一章、網(wǎng)頁的基礎知識(1學時)
    (1)internet基礎知識
    (2)www簡介
    (3)網(wǎng)頁制作的技術(shù)和工具介紹
    第二章、超文本編輯語言html(8學時)
    (1)html文件的基本結(jié)構(gòu)
    (2)文字和段落標記
    (3)列表標記
    (4)圖片標記
    (5)表格標記
    (6)超鏈接標記
    (7)表單標記
    (8)框架標記
    第三章、javascript語言(4學時)
    (1)javascript語言簡介
    (2)javascript編程基礎
    (3)基于對象的javascript語言
    (4)javascript程序?qū)嵗?BR>    第四章、層疊樣式表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ù)庫的操作
    總結(jié)復習(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)頁設計與制作教學設計 網(wǎng)頁設計制作教案篇二
    1、知識與技能:
    (1)理解框架的概念及用途。
    (2)掌握框架網(wǎng)頁的新建、制作、編輯與保存,了解框架的拆分方法。
    (3)初步掌握將框架結(jié)構(gòu)與表格布局結(jié)合使用來制作網(wǎng)頁。
    2、過程與方法:
    (1)通過對表格網(wǎng)頁的分析,體驗新知識(框架結(jié)構(gòu)網(wǎng)頁)的優(yōu)點,從而促進其學習新知識。
    (2)理解框架的概念與組成,學會分析網(wǎng)站的結(jié)構(gòu)。
    3、情感態(tài)度與價值觀:
    (1)通過以"人與動物"為主題的框架結(jié)構(gòu)網(wǎng)頁制作活動,了解更多有關人與動物和諧相處的知識,通過故事趣聞,增強學生關注動物的興趣和意識。
    (2)能夠?qū)⒈砀衽c框架結(jié)構(gòu)網(wǎng)頁結(jié)合使用,在創(chuàng)作中體驗樂趣。
    1、重點:框架的概念、用途, 創(chuàng)建、編輯與保存框架網(wǎng)頁的方法。
    2、難點:框架的拆分。
    對比教學法、探究學習法、模仿學習法。
    整理、歸類相關素材,并按要求擺放。
    1、引入
    老師展示一組利用表格制作的網(wǎng)頁,要求學生仔細觀察,找出它們的一個共同特點(學生答:網(wǎng)頁上方和左側(cè)內(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)建"橫幅和目錄"結(jié)構(gòu)的框架網(wǎng)頁,新建top和left頁面,并學會保存。
    框架結(jié)構(gòu)中的每個框都是一個獨立的選項文件,即網(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)頁中相關頁面的制作,需要結(jié)合表格來布局,插入文字、圖片和交互式按鈕。
    任務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、 總結(jié)與評價
    老師可以給出一些常見的框架結(jié)構(gòu)應用界面,如web郵箱頁面等,引導學生總結(jié)本課內(nèi)容,梳理課堂知識,并讓學生分組,推薦一些優(yōu)秀作品進行全班展示。
    設計意圖:開拓學生的視野,使學生了解框架的應用,教會學生要善于總結(jié),要學會學習的方法。
    網(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)通過對不同對象設置超級鏈接的操作,使學生總結(jié)出操作的規(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)在框架頁面中制作超鏈接時,目標對象所選擇的顯示窗口形式。
    教學方法與教學手段:
    任務驅(qū)動法、討論探究法、講解與演示法、類比知識遷移法。
    教學準備:
    "動物——人類的朋友"站點,包括未鏈接的網(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)快速跳轉(zhuǎn)呢?
    任務2同一站點內(nèi)同一頁面內(nèi)的跳轉(zhuǎn)(鏈接):在"動物趣聞"頁面內(nèi)制作書簽鏈接。
    教師講解:由生活中的書簽引入,介紹"書簽鏈接"的概念,然后再演示如何操作。
    提示:書簽鏈接的雙向性問題(返回)。
    學生認真聽講后模仿制作,教師巡視進行指導并反饋學生的完成情況。
    (2)站間超級鏈接
    僅憑我們課堂上制作的這些頁面還不足以詳細介紹我們的主題,此時我們還可以借助超鏈接,鏈接到因特網(wǎng)上的其他網(wǎng)站,以豐富我們的內(nèi)容。
    任務3借助熱區(qū)鏈接,為"友情鏈接"頁面制作超鏈接,鏈接我國一些自然保護區(qū)網(wǎng)站。
    有了以上基礎,可安排學生自學教材中有關熱區(qū)鏈接的相關內(nèi)容,學生探究操作后教師再安排學生進行演示,輔助以提問的形式檢驗學生的自學情況。
    3、總結(jié)與評價
    開展同學間的互助,檢驗其鏈接完成情況,推薦優(yōu)秀同學做展示。引導學生分類總結(jié)本節(jié)課的知識點。