一、教學目標
1.能夠為網(wǎng)頁中的文本和圖像設置超鏈接。
2.通過教師演示、自主探究等方法,提高觀察和動手操作的能力。
3.在探究設置超鏈接的過程中,能夠感受到網(wǎng)頁制作的樂趣,提高學習的積極性。
二、教學重難點
【重點】網(wǎng)頁中文本和圖像的超鏈接設置。
【難點】網(wǎng)頁中圖像超鏈接的靈活設置。
三、教學過程
(一)導入新課
教師通過多媒體展示制作完成的“沈陽簡介”網(wǎng)站,讓學生觀察在網(wǎng)站首頁上和之前制作的首頁有哪些區(qū)別?學生會發(fā)現(xiàn)有些文字下方出現(xiàn)了下劃線,顏色也不同。教師演示鼠標單擊首頁中的帶有下劃線的文字和網(wǎng)頁中的圖片,讓學生觀察出現(xiàn)了什么變化?學生發(fā)現(xiàn)頁面跳轉到了另一個頁面。教師繼而引導學生思考:當點擊頁面上的文本或圖片時,怎么跳轉到其他頁面呢?網(wǎng)頁之間的聯(lián)系應該如何建立呢?從而引入本節(jié)課的學習。
(二)新課講授
1.建立文本超鏈接
教師激發(fā)學生思考:如果想要為網(wǎng)頁中的文本設置超鏈接,首先應該做什么?【選中文本】教師表揚學生反應迅速,并進行演示操作,選中文字“地理環(huán)境”后,利用“屬性”面板,在“鏈接”右側選擇文件“地理環(huán)境.html”,在“目標”下拉列表中選擇“_blank”選項,創(chuàng)建文本鏈接。演示完成后讓學生觀察文字“地理環(huán)境”的變化。【文字變成了藍色,文字下方出現(xiàn)下劃線】
教師布置任務:嘗試自己完成文本超鏈接的設置,實現(xiàn)單擊“地理環(huán)境”能夠跳轉到“地理環(huán)境.html”頁面。學生操作過程中,教師加以巡視,并提示學生:完成后可以通過單擊“在瀏覽器中預覽/調試”按鈕,在瀏覽器中預覽設置的超鏈接效果,查看是否設置成功。學生操作完成后,教師拋出問題:_blank的作用是什么?_blank和_self的區(qū)別是什么?教師讓學生嘗試修改目標中的選項,操作完成后指定學生回答?!臼褂胈blank,是在新的窗口中顯示頁面,使用_self,是在當前網(wǎng)頁窗口中顯示頁面,不會打開新的窗口】教師表揚學生操作認真,回答的準確。
教師激發(fā)學生思考:有沒有其他的方法可以為文本設置超鏈接?教師布置任務:讓學生閱讀課本,自行探究,為文本“風土人情”設置超鏈接,鏈接到“風土人情.html”頁面。學生操作結束后指定學生說出操作要點?!具x中后,在“常用”插入欄中,點擊“超級鏈接”按鈕,在彈出的對話框中,設置鏈接的目標文檔,并在“目標”下拉列表中選擇_blank選項】教師評價學生歸納總結能力強,思路清晰。
2.創(chuàng)建圖像鏈接
教師提問:如果想要為沈陽簡介中的太陽鳥建筑圖片設置超鏈接,是否和文字設置的方法一樣呢?教師布置任務:按照設置文本超鏈接的方法嘗試自主操作,實現(xiàn)單擊圖片后跳轉到“太陽鳥介紹.html”頁面。學生操作過程中教師進行巡視指導,完成后教師根據(jù)學生操作情況進行總結:如果是對整個圖像建立鏈接,和文字設置方法一樣。
教師拋出問題:如果想要為圖像的部分區(qū)域設置超鏈接,怎樣進行設置?教師組織學生以小組為單位進行討論和操作,將太陽鳥區(qū)域設為鏈接區(qū)域,鏈接到“太陽鳥介紹.html”頁面。討論后由小組代表演示及講解操作要點?!具x中圖像,在屬性面板中找到橢圓形熱點工具,在圖像上拖動,選中太陽鳥區(qū)域,并設置鏈接的目標文檔和目標】教師評價學生操作很熟練,并解釋:這屬于熱點鏈接,單擊設置的鏈接區(qū)域,從而跳轉到相應頁面。圖像屬性欄中的“替換”中可以寫明圖片的含義,當圖片無法顯示的時候,替換中的文字就會顯示出來。教師讓學生繼續(xù)完善對圖像鏈接的設置。
(三)鞏固提高
在學生了解了如何為文字和圖像設置超鏈接后,教師布置任務:學生獨立操作,將首頁中的其他欄目以及圖片設置對應的超鏈接。操作完成后同桌兩人進行相互展示,在瀏覽器中預覽是否能夠實現(xiàn)正確的跳轉。
(四)小結作業(yè)
小結:教師提問為文字設置超鏈接的兩種方式。根據(jù)學生的回答點評學生對知識掌握得牢固。
作業(yè):思考為網(wǎng)頁中圖片設置熱點鏈接,可以設置兩個熱點區(qū)域嗎?
四、板書設計