《應(yīng)用表格布局網(wǎng)頁結(jié)構(gòu)》教學(xué)設(shè)計(jì)

1、學(xué)習(xí)必備歡迎下載應(yīng)用表格布局網(wǎng)頁結(jié)構(gòu)教學(xué)設(shè)計(jì)一、教學(xué)目標(biāo)知識(shí)與技能： 1、了解表格在網(wǎng)頁設(shè)計(jì)中的作用。2、能夠根據(jù)網(wǎng)頁的內(nèi)容，正確布局表格的結(jié)構(gòu)。3、掌握網(wǎng)頁中表格的制作方法，能夠在單元格中正確插入文字和圖片，掌握表格屬性的設(shè)置方法以及單元格的修飾與編輯方法。過程與方法： 通過觀看優(yōu)秀網(wǎng)站表格布局， 動(dòng)手設(shè)計(jì)表格等環(huán)節(jié)， 幫助學(xué)生進(jìn)一步了解表格的作用、 功能以及網(wǎng)頁設(shè)計(jì)方法的多樣性， 培養(yǎng)學(xué)生的發(fā)散思維能力； 通過學(xué)生自主地編輯和修飾表格等環(huán)節(jié)， 培養(yǎng)學(xué)生自主探究學(xué)習(xí)的能力。情感、態(tài)度與價(jià)值觀：1、提高學(xué)生自學(xué)和探究的能力，培養(yǎng)學(xué)生應(yīng)用表格布局網(wǎng)頁結(jié)構(gòu)的興趣。2、提高學(xué)生語言表達(dá)能力，學(xué)會(huì)客觀

2、的評(píng)價(jià)作品。二、教學(xué)重點(diǎn)與難點(diǎn)重點(diǎn)：了解表格在網(wǎng)頁設(shè)計(jì)中的重要作用 掌握插入、編輯表格以及表格，單元格的屬性設(shè)置方法。難點(diǎn)：表格的嵌套表格，單元格，網(wǎng)頁屬性的設(shè)置三、教學(xué)方法講解演示教學(xué)法，小組合作學(xué)習(xí)法，自主探究學(xué)習(xí)法四、教學(xué)設(shè)計(jì)說明本節(jié)課是初中信息技術(shù)（下冊(cè)）20XX年 7 月第一版第 11 單元設(shè)計(jì)主題網(wǎng)站第二節(jié)的內(nèi)容，教學(xué)面向的是初二年級(jí)的學(xué)生，該年齡段的學(xué)生已具備了一定的信息素養(yǎng) ，掌握了基本的信息技術(shù)知識(shí)和技能。學(xué)習(xí)必備歡迎下載初中的學(xué)生喜歡新、奇、特的事物，接受能力和理解能力比較快。而直觀、醒目的網(wǎng)站示例圖片則可以培養(yǎng)學(xué)生對(duì)于本課題的興趣， 但是學(xué)生對(duì)于如何應(yīng)用表格布局網(wǎng)頁結(jié)構(gòu)的

3、操作是比較模糊的。因此本節(jié)課充分地發(fā)揮學(xué)生了的積極性，讓學(xué)生隨著學(xué)案所設(shè)置的環(huán)節(jié)， 探究完成一個(gè)又一個(gè)的應(yīng)用表格過程。 而學(xué)案則是在尊重學(xué)生解決問題的思維過程方式的基礎(chǔ)上設(shè)置的， 注重學(xué)生的學(xué)習(xí)體驗(yàn)和情感的體驗(yàn)。 整節(jié)課以學(xué)生為主體、 教師為主導(dǎo)的架構(gòu)下， 搭建以生為本的情景學(xué)習(xí)平臺(tái)，幫助學(xué)生自學(xué)、交流討論、深入探究，以不斷的完成應(yīng)用表格布局網(wǎng)頁結(jié)構(gòu)的過程為手段，一步步完成學(xué)習(xí)任務(wù)。五、教學(xué)過程課前將素材和網(wǎng)站站點(diǎn)發(fā)送到桌面，指導(dǎo)學(xué)生解壓縮。并帶領(lǐng)學(xué)生熟悉本節(jié)課所要制作的網(wǎng)頁的素材。（一）設(shè)置情境，引入課題師：我們知道，地球是人類賴以生存的家園，然而，近幾年來，地球的環(huán)境卻越來越惡劣：全球性氣

4、候變暖、暴雨、雪災(zāi)等災(zāi)難性天氣頻繁出現(xiàn)，給我們的生活帶來嚴(yán)重威脅。因此，我們每一位同學(xué)，都有責(zé)任去保護(hù)環(huán)境，那么我們應(yīng)該如何去保護(hù)環(huán)境呢？我想首先是宣傳環(huán)保、 倡導(dǎo)環(huán)保。那上一節(jié)課呢我們已經(jīng)建立了以環(huán)保為主題的站點(diǎn)， 學(xué)習(xí)制作了網(wǎng)站的歡迎頁。 今天這節(jié)課， 我們將一起學(xué)習(xí)制作網(wǎng)站的主頁面來宣傳環(huán)保， 那如何來設(shè)計(jì)主頁面呢？首先我們先來欣賞幾個(gè)著名網(wǎng)站的主頁。（播放課件）師：你們能看出這些是哪些網(wǎng)站的主頁嗎？生：網(wǎng)易，新浪，搜狐師：很好，它們分別是網(wǎng)易、新浪、搜狐的主頁面。我們知道這些網(wǎng)站的主頁面包含的內(nèi)容都相當(dāng)豐富， 但給我們的視覺感受卻是繁多而不雜亂，緊湊而不單調(diào)。這些頁面設(shè)計(jì)是如何做到這一

5、點(diǎn)的呢？師：我們以搜狐主頁面為例， （呈現(xiàn)搜狐主頁面的圖片），來探究一下如何設(shè)計(jì)網(wǎng)站的主頁面。首先這一頁面的左上角有一張的搜狐的 LOGO 圖片，使我們一眼能認(rèn)出這是搜狐頁面。 在圖片的右邊呢， 是網(wǎng)站中的導(dǎo)航， 通過導(dǎo)航鏈接到其它的頁面。下面的主體部分，分成了幾個(gè)區(qū)域，我把它標(biāo)示出來，這樣我們學(xué)習(xí)必備歡迎下載不難看出，中間部分，是一些小信息的鏈接。上面這一部分以廣告信息為主，下半?yún)^(qū)域分成了四個(gè)部分，分別是新聞，娛樂，體育以及廣告圖片。通過標(biāo)示，我們會(huì)發(fā)現(xiàn)這呈現(xiàn)出來的其實(shí)就是一張表格的摸樣（可啟發(fā)學(xué)生回答）。師：因此，使用表格來布局網(wǎng)頁結(jié)構(gòu)，是使頁面清晰緊湊，整潔大方的簡便有效的方法。 那今天

6、這節(jié)課， 我們就一起來學(xué)習(xí)應(yīng)用表格布局網(wǎng)頁結(jié)構(gòu)，也做出這樣一張頁面出來。設(shè)計(jì)意圖：所選的網(wǎng)頁學(xué)生都比較熟悉，師分析頁面，呈現(xiàn)本節(jié)課的課題，激發(fā)學(xué)生的學(xué)習(xí)興趣。（二）新課學(xué)習(xí)環(huán)節(jié)一：根據(jù)素材，小組合作設(shè)計(jì)表格。師：課前同學(xué)們已經(jīng)熟悉了素材。 既然我們要應(yīng)用表格布局網(wǎng)頁結(jié)構(gòu)， 那就要先進(jìn)行設(shè)計(jì)。師：剛才同學(xué)們也欣賞了搜狐等網(wǎng)站的主頁面的表格布局。師：下面呢，請(qǐng)同學(xué)們拿起筆在老師提供的紙上來設(shè)計(jì)表格。 以相鄰的四個(gè)同學(xué)為一個(gè)小組， 對(duì)照素材，討論交流，在紙上畫出你們將要制作的頁面的表格布局，并對(duì)表格中將要添加的內(nèi)容進(jìn)行標(biāo)示。學(xué)生以小組為單位，設(shè)計(jì)表格。師：很多小組已經(jīng)完成了， 下面我們挑選一些小組的

7、同學(xué)到前面來展示一下你們的設(shè)計(jì)，并簡要說明你們的頁面布局。其他同學(xué)注意看，注意聽，看看有沒有值得借鑒的地方應(yīng)用到自己小組設(shè)計(jì)的表格中去。展示幾個(gè)小組所設(shè)計(jì)的表格設(shè)計(jì)意圖：以小組為單位動(dòng)手設(shè)計(jì)表格可以培養(yǎng)學(xué)生的合作探究能力。 讓學(xué)生通過交流討論后設(shè)計(jì)表格， 可以集結(jié)多人的智慧，讓輕松的氛圍中設(shè)計(jì)出表格。環(huán)節(jié)二：動(dòng)手實(shí)踐，編輯表格師：同學(xué)們都已經(jīng)將表格設(shè)計(jì)好了， 下面我們就來動(dòng)手實(shí)踐， 將表格在網(wǎng)頁中繪制出來。師：首先，請(qǐng)同學(xué)們打開 FrontPage ，從文件菜單中打開站點(diǎn)“ huanbao”，并新建一個(gè)頁面。學(xué)習(xí)必備歡迎下載師：那如何來繪制表格呢？請(qǐng)同學(xué)們參照學(xué)案， 先嘗試看看如何插入表格？（

8、學(xué)生探究）生根據(jù)學(xué)案，自己先探究完成表格的插入師：哦，這里提供了一個(gè)專門供表格使用的菜單。 我們這邊可以使用表格菜單，打開表格對(duì)話框，就涉及到添加的表格是幾行幾列的了。這里呢，老師有一個(gè)建議：暫且以最多行，最多列來計(jì)算表格的行列數(shù)。舉個(gè)例子，請(qǐng)同學(xué)們注意看老師這里的一張表格樣例。同學(xué)們數(shù)數(shù)看，這里的表格是幾行幾列。生： 9 行 5 列（學(xué)生思考）師：同學(xué)們可以很清楚地看出，9 行，那列數(shù)呢？我們這里暫且以最多列計(jì)算。生：5 列師：同學(xué)們的表格也是這樣的。 請(qǐng)同學(xué)們根據(jù)你所設(shè)計(jì)的表格的行列數(shù)插入表格。師：表格插入好了以后，同學(xué)們，我們一起來看一下，這個(gè)插入的表格跟我們?cè)趫D紙上設(shè)計(jì)的表格一樣嗎？生

9、：不一樣師：哪里不一樣？生：插入的表格是分成若干個(gè)等分的小單元格，而我們?cè)趫D紙上設(shè)計(jì)的表格中有很多不等分的小格子。師：那這里呢，就要對(duì)表格進(jìn)行編輯了。因?yàn)閯倓偽覀兪前凑兆疃嘈校疃嗔衼碛?jì)算的，那這里只需要對(duì)多余的單元格進(jìn)行合并。師：那如何對(duì)單元格進(jìn)行合并呢？同學(xué)們有沒有學(xué)過在 word 里編輯表格（如果有，可實(shí)現(xiàn)知識(shí)的遷移；如果沒有的話，老師送一把萬能鑰匙右擊法），請(qǐng)同學(xué)們編輯表格。（與學(xué)生互動(dòng)，嘗試讓學(xué)生講解操作）師：每一個(gè)小組的同學(xué)要互相幫助，幫助沒有完成的同學(xué)對(duì)表格進(jìn)行編輯。師總結(jié)：我們剛剛通過表格菜單欄，打開表格對(duì)話框，插入表格。在對(duì)表格進(jìn)行編輯時(shí)，是按照最多行，最多列計(jì)算的。還可以采

10、用其他的計(jì)數(shù)方法，同學(xué)們可以根據(jù)個(gè)人情況靈活運(yùn)用。學(xué)習(xí)必備歡迎下載設(shè)計(jì)意圖：讓學(xué)生根據(jù)本小組設(shè)計(jì)的表格布局，插入表格， 再對(duì)表格進(jìn)行編輯，注重了學(xué)生在課堂中主體性的體現(xiàn)。在編輯表格時(shí)，可以通過以前所學(xué)的WORD中表格的編輯方法，從而實(shí)現(xiàn)知識(shí)的遷移。環(huán)節(jié)三：根據(jù)設(shè)計(jì)，填充表格內(nèi)容師：表格編輯好了以后， 一張空表就完成了。 下面就要開始填充表格內(nèi)容 （展示我的表格填充完成的效果） 。我們這里的內(nèi)容， 跟據(jù)素材，主要是圖片和文字。那上一節(jié)課呢， 我們已經(jīng)學(xué)會(huì)了在首頁中添加文字和圖片了， 那這里的添加方法和前面是一樣的， 不同的是，這里需要將圖片和文字添加到對(duì)應(yīng)的單元格中， 所以在插入之前， 一定要先

11、定好位。 下面請(qǐng)同學(xué)們根據(jù)素材和自己的設(shè)計(jì)添加表格內(nèi)容，可參考學(xué)案。學(xué)案中，也提供了文字和圖片填充到表格中的方法。學(xué)生動(dòng)手填充表格內(nèi)容，使網(wǎng)頁更立體豐富。教師觀察學(xué)生操作，講解表格的嵌套師：在老師剛剛巡視過程中， 發(fā)現(xiàn)有些同學(xué)采用了這樣的表格布局， 將按鈕圖片放在 LOGO圖片的右邊，這里的按鈕圖片有五張，我們?cè)趺磳?shí)現(xiàn)它們的放置呢？學(xué)生思考師：這里呢，老師教給大家一個(gè)方法， 可以在這個(gè)單元格中再插入一個(gè)表格， 5 行 1 列，這樣就可以將 5 按鈕圖片均勻地相對(duì)固定地放在這個(gè)單元格中。這就是表格的嵌套。感興趣的同學(xué)可以根據(jù)需要嘗試添加。設(shè)計(jì)意圖：學(xué)生配合學(xué)案填充表格內(nèi)容， 體會(huì)在表格在 Fro

12、ntPage 中的作用：定位對(duì)象環(huán)節(jié)四：最后修飾，美化表格和單元格師：同學(xué)們已經(jīng)學(xué)會(huì)應(yīng)用自己的設(shè)計(jì)的表格布局網(wǎng)頁結(jié)構(gòu)， 那同學(xué)們想不想你們的頁面更漂亮呢？生：想。（躍躍欲試）師：哦，下面我們就來美化我們的網(wǎng)頁。請(qǐng)同學(xué)們說說看，我們可以從哪些方面對(duì)頁面進(jìn)行美化呢？（拋出問題）生：字體 學(xué)習(xí)必備歡迎下載生：單元格里的顏色等師：那這里呢，老師提供一個(gè)操作，右擊我們看到有三個(gè)屬性，分別是網(wǎng)頁屬性、單元格屬性以及表格屬性。 同學(xué)們可以選擇不同的屬性， 打開相應(yīng)的對(duì)話框，美化頁面。學(xué)生調(diào)整表格屬性，美化頁面組中完成得較快的同學(xué)幫助本組其他同學(xué)完成表格的編輯。設(shè)計(jì)意圖：讓學(xué)們動(dòng)手美化頁面， 使學(xué)生掌握表格屬

13、性的設(shè)置方法以及單元格的修飾方法與編輯方法。環(huán)節(jié)五：探究實(shí)踐師：下面請(qǐng)同學(xué)們預(yù)覽你們的網(wǎng)頁， 有沒有發(fā)現(xiàn)頁面上有表格邊框， 那同學(xué)們剛才看我們搜狐等網(wǎng)站的主頁面的時(shí)有沒有邊框?。可簺]有師：如何將邊框去掉呢？請(qǐng)同學(xué)們探究看看。（可配合學(xué)案）師提示：可選擇右擊，打開表格屬性對(duì)話框，對(duì)邊框的粗細(xì)進(jìn)行設(shè)置師讓探究出來的同學(xué)上前演示并講解制作方法。師：請(qǐng)同學(xué)們繼續(xù)完成你們主頁面的制作，并注意保存。學(xué)生進(jìn)一步練習(xí)，師巡視指導(dǎo)。設(shè)計(jì)意圖：應(yīng)用表格布局網(wǎng)頁結(jié)構(gòu)的基本操作已經(jīng)掌握了， 因此師讓學(xué)生做進(jìn)一步的探究，如如何去除表格的邊框使頁面更自然美觀， 培養(yǎng)學(xué)生的探究精神。對(duì)于表格的嵌套，可以讓學(xué)生根據(jù)需要自主

14、探究實(shí)現(xiàn)。環(huán)節(jié)六：作品展示，進(jìn)行評(píng)價(jià)師：通過對(duì)表格進(jìn)行設(shè)計(jì)，編輯，填充，修飾等操作，同學(xué)們都已經(jīng)制作完成了一張用表格布局的保護(hù)環(huán)境的主頁面。 下面呢，我們一起來看看同學(xué)們的作品。請(qǐng)制作者呢， 談?wù)勀愕脑O(shè)計(jì)特點(diǎn)以及制作流程。 其他同學(xué)們也可以提出自己的建議和意見。師總結(jié)。設(shè)計(jì)意圖：展示部分同學(xué)的作品，首先自身先說說特點(diǎn)，其他同學(xué)做點(diǎn)評(píng)。可以培養(yǎng)學(xué)生客觀的評(píng)價(jià)作品的能力。（三）總結(jié)學(xué)習(xí)必備歡迎下載本節(jié)課我們應(yīng)用表格制作完成了保護(hù)環(huán)境的主頁面。通過實(shí)踐操作， 我們發(fā)現(xiàn)布局網(wǎng)頁結(jié)構(gòu)其實(shí)并不難。正如“耳聞不如目見，目見不如足踐”。正如保護(hù)環(huán)境其實(shí)離我們也不遙遠(yuǎn)。從不亂扔紙屑，保持機(jī)房整潔，節(jié)約每一滴水，

15、每一度電這樣的小事做起， 我們就能為保護(hù)環(huán)境做出一份貢獻(xiàn)，成為保護(hù)地球的小衛(wèi)士。教學(xué)反思課堂教學(xué)展評(píng)活動(dòng)結(jié)束了， 我在響水中學(xué)開設(shè)的課題為初中信息技術(shù)下冊(cè)第 11 章第二節(jié)應(yīng)用表格布局網(wǎng)頁結(jié)構(gòu)，現(xiàn)將本課教育教學(xué)實(shí)踐中的再認(rèn)識(shí)和再思考反思如下：一、選取課題，自主探究接到課題時(shí)，考慮到最近環(huán)境問題造成的災(zāi)難頻發(fā)， 將網(wǎng)站的主題確定為環(huán)境保護(hù)。通過“環(huán)境保護(hù)” 網(wǎng)站的制作，培養(yǎng)學(xué)生宣傳環(huán)保， 倡導(dǎo)環(huán)保的意識(shí)，并將這種意識(shí)在日常的行為中體現(xiàn)出來。 在教學(xué)流程的設(shè)置上， 從設(shè)計(jì)表格制作表格（插入和編輯）填充表格內(nèi)容修飾應(yīng)用表格制作的網(wǎng)頁著手，真正做到學(xué)生為主體，教師為主導(dǎo)的教學(xué)模式。同時(shí)，給學(xué)生提供了學(xué)

16、案，方便學(xué)生更好地發(fā)揮小組合作能力和自主探究能力。 在教學(xué)內(nèi)容得選擇上， 因?yàn)楸竟?jié)內(nèi)容需要 2-3 節(jié)課的課時(shí)。所以在教學(xué)內(nèi)容的選擇上將 Flash 等動(dòng)態(tài)對(duì)象的制作放到下一節(jié)課講解。 本節(jié)課的重點(diǎn)側(cè)重于讓學(xué)生通過本節(jié)課的學(xué)習(xí)能夠?qū)W會(huì)使用表格完成一張網(wǎng)頁的制作。二、表格示例的講解（不足之處）在本節(jié)課的講解過程中，表格的設(shè)計(jì)部分花的時(shí)間比我想象的多。學(xué)生一開始不知道從何入手。 我分析了兩個(gè)原因： 一是學(xué)生對(duì)于信息技術(shù)課可能更習(xí)慣于模仿學(xué)習(xí)，讓他們動(dòng)手自己設(shè)計(jì)有一定的難度。 二是我在課前沒有考慮到將一個(gè)表格示例放在屏幕上供學(xué)生參考， 之前考慮到更多地是希望學(xué)生自己設(shè)計(jì)， 有自己的創(chuàng)意想法。 我在講

17、解時(shí)應(yīng)該帶著學(xué)生將示例分析一下， 并在提供給學(xué)生的學(xué)案上添加一個(gè)設(shè)計(jì)的簡單的表格示例。三、表格嵌套的講解在講解表格嵌套時(shí)， 本想用自己設(shè)計(jì)的一個(gè)示例講解。 在課堂教學(xué)中， 巡視過程中有一個(gè)同學(xué)就遇到了需要通過表格嵌套才能解決的問題。 這樣對(duì)于這部學(xué)習(xí)必備歡迎下載分的講解，形成了發(fā)現(xiàn)問題，分析問題，解決問題的流程，對(duì)于學(xué)生來講，這樣的方式更有利于他們的理解和應(yīng)用。四、學(xué)生情況分析對(duì)于本節(jié)課來說， 學(xué)生是初學(xué)者。 而且從本節(jié)課的課堂完成效果來說， 學(xué)生基本的素養(yǎng)都具備， 他們都能參與到課堂教學(xué)中， 共同解決自主探究中發(fā)現(xiàn)的問題。但對(duì)于學(xué)生來講，還是更習(xí)慣于教師講解，學(xué)生模仿的模式。這也是最后課堂作品沒能達(dá)到的理想化的其中一個(gè)原因。五、同行聽課的借鑒由于客觀原因， 25 日上午只聽了鹽都的一位老師上的最后一節(jié)與我同課題的課