資源簡介

第2節 制作網站——創建網站 制作首頁
【教學目標】
知識與技能目標
認識Dreamweave軟件窗口的基本結構，并與Flash軟件進行比較。
理解站點的意義，學會建立、刪除站點。
掌握制作簡單網頁的方法，能夠排版、編輯文字與圖片。
能夠靈活設置網頁屬性，如背景、背景音樂等。
掌握網頁設計中圖片、水平線的插入方法及屬性設置。
掌握保存網頁的方法，了解保存網頁與普通文檔的異同，進一步理解建立網站的意義。
過程與方法
通過欣賞動物站點和聯系實際上網體驗，幫助學生理解網站、網頁、首頁三者之間的關系；通過比較，及圖文描述，幫助學生認識Dreamweaver軟件；通過具體的任務，使學生在實踐中，掌握建立站點的方法理解其意義，然后通過教師講演，以及學生自學探究的多種方法，引導學生完成首頁制作，體會網頁制作的一般內容和操作方法，并學會歸納。
情感態度與價值觀
（1）通過對比，使學生了解軟件學習的一般方法及規律，提高學生學習信息技術的信心；
（2）通過創建網站和設計首頁，掌握對象屬性的設置方法，初步體驗成功的快樂；
（3）通過自主探究，讓學生學會學習，體會學習的樂趣；
（4）通過創建“動物——人類的朋友”網站，使學生樹立人與動物和諧相處，珍愛、善待和保護動物的觀念。
【教學重點】
站點的建立與刪除；設計簡單網頁的基本方法，如文字、圖片的插入與編輯；設置網頁屬性的一般方法等。
【教學難點】
網頁的保存、網頁中對象屬性的設置。
【教學方法】
任務驅動教學法、講演式教學法，自主探究教學法。
【課時安排】
2課時
【教學過程】
教學環節 教師活動 學生活動 設計意圖
（第1課時）
一、導入 根據網站制作過程：整體規劃——>收集資料——>制作——>編輯調試——>網站發布與維護，我們已經完成了前面兩個階段，從今天這節課開始，我們將以“動物——人類的朋友”主題網站為實例，來具體學習如何制作一個網站。 在瀏覽器中呈現“動物——人類的朋友”網站內容。 明確 欣賞網站成品。 開門見山。
二、新授 準備階段 【網站、網頁、首頁的關系？】 提問：我們登錄任意一個網站，輸入網址，首先看到的頁面永遠是那一個，想要瀏覽站點其他頁面可以通過超鏈接進行切換。這個首先看到的頁面是……？ 首頁——訪問網站時看到的第一個頁面通常稱為這個網站的首頁或主頁。（文件名一般為index.html或default.html） 網頁——一個超文本標識語言（HTML）描述的文檔，它包括文本、圖像、聲音和動畫信息。我們通過瀏覽器在網上所看到的每個畫面都是網頁。 網站——一般可以理解為按照某個目的規劃的多個網頁的集合，其外部表現與一個普通的文件夾相似，網頁之間彼此鏈接，訪問者能利用超級鏈接看到每頁的內容。 【認識Dreamweaver】 請結合Flash軟件窗口組成，比較DW軟件，認識DW軟件窗口組成？ 2、講演DW軟件特別之處 （詳見課本P61頁的相關描述） “創建網站”階段 【任務1】 在D盤根目錄下創建一個名為“dongwu”的站點 （提示：請參考課本P62-63實踐學習步驟） 注： 1、建立站點的目的：在于方便網頁的管理、瀏覽及發布，便于網站存儲位置的移動和網站維護。 2、建議在d:\dongwu站點下新建一個名為images的子文件夾，用于存放后期制作中將要用到的外部素材文件。 3、“管理站點”功能：編輯、復制、刪除、導出、導入等，要刪除已有站點，有多種方法，如可以運用此管理功能中的“刪除”命令。 聯系實際上網過程，結合老師呈現的“動物——人類的朋友”站點內容，加以思考、理解和歸納。 結合學案或課本圖示，對比Flash軟件，自主學習，初步認識新軟件，再在老師的介紹下對軟件的特別之處作進一步認識。 學生在教師引導下，結合課本步驟，完成此項操作，并加以理解。 理論知識部分，教師引導學生聯系上網實踐經驗，再借助成品網站，幫助學生加以理解。 引導學生，比較學習，更容易認清DW軟件的窗口布局和功能特色。 提醒學生在此實踐中認真體會網站的概念和作用，以及站點文件夾和普通文件夾的區別。
三、小結 網站、網頁、首頁的關系 2、Dreamweaver軟件窗口 3、建立站點 結合學案文件自己小結。 梳理歸納。
四、探究 問題： 本校機房裝有還原卡，下節課我們啟動DW軟件就看不到今天建立和編輯的站點了，那么該如何解決這個問題呢？ 提示：注意“管理站點”對話框中的“導入”和“導出”命令。 嘗試操作、理解，以備后續每節課操作使用。 導出文件建議存放于桌面，與計算機中的應用程序的快捷方式圖標類比，幫助學生理解。 這一步雖是探究，但也是有還原功能的機房環境，后續接著編輯制作網站的必要操作。
（第2課時）
一、復習導入 根據“學案.doc ”文件，師生簡單回顧上節課知識。 回顧
二、“制作首頁”階段 （首頁樣圖詳見“學案.doc”文件） 【操作步驟】（詳見課本P63-67） 第1步：啟動軟件，導入站點（dongwu.ste關聯文件），建立空白頁，并以“index.html”為文件名保存至D:\dongwu站點目錄下 (
（
完整演示視頻
）
) 第2步：制作首頁標題 第3步：插入水平線 第4步：插入網站標志圖 第5步：文字輸入與排版 第6步：設置網頁背景圖片 第7步：添加網頁的背景音樂 第8步：插入“Enter”GIF動畫和“進入下一頁”的文字 第9步：再次保存網頁 【自學后的反思與歸納】 網站標志（LOGO）：LOGO將具體的事物、事件和抽象的精神理念通過特殊的圖形固定下來，使人們自然產生聯想。 網頁屬性、水平線屬性、圖片屬性的設置方法。（引入對象不同，屬性也不同，所以屬性設置的窗口內容也不同） 文字的編輯與排版： ①在Dreamweaver中文字的段落排版需要通過CSS樣式或用HTML語言代碼來進行，用戶可以在“WPS文字”中排版，再利用Dreamweaver“編輯——>選擇性粘貼”命令來完成。 ②Dreamweaver中空格的方法：直接使用空格鍵是不行的，需先切換到全角中文輸入法狀態，按一次空格鍵即空一個字符；或者Ctrl+Shift+Space，按一下是空一個字節，要空兩個字符的位置就要連擊四下。 網頁的保存：網站制作過程中，所有的網頁都必須保存到該站點文件夾下，且涉及到的所有外部素材，如圖片、動畫、聲音、視頻等文件，必須存放到此站點文件夾下，或存放到此站點文件夾下的某個特定的子文件夾中（使用過程中軟件也會提示），如：我們可以根據提示，將所有用到的外部圖片全部保存至事先建立的“images”子文件夾中，另外，無論是網頁還是素材，其文件名最好用英文或漢語拼音命名。 教師講演后學生模仿完成，并理解。 以下步驟，學生任選課本圖文步驟或演示視頻，自學完成，并在實踐中深入體會和理解。 學生在實踐過程中尤其是任務完成后，務必對“自學后的反思與歸納”的幾點做進一步地閱讀和理解。 整個首頁制作，流程已經相當明晰，主要問題是網站的第一次導入操作，以及文字的編輯，圖片等外部素材的保存……一系列普通網頁的基本操作方法。 可以說完成了整個首頁的制作，也就對普通網頁的基本制作方法大致掌握了。 在此過程中，教師要注意放手，盡量給學生自己動手探究操作的時間和空間，在恰當的時候，適時地進行要點的提示、歸納即可，且切忌面面俱到，有些注意點，只要學生實踐過，自然就了然了，無需再強調。
三、本課小結 1、導入站點 2、制作首頁 根據學案小結。 歸納梳理。
教學后記

展開更多......

收起↑