第1-2課時設(shè)計個人網(wǎng)頁

1、第1-2課時 設(shè)計個人網(wǎng)頁教學重點與難點:1、規(guī)劃網(wǎng)頁主題與內(nèi)容2、設(shè)計網(wǎng)頁版面教學過程：（一）導(dǎo)入：我們每個人都有各自的性格、愛好和思想。為了幫助同學們張揚自我、展示自我， 并增進同學之間的相互了解，找到志趣相投的伙伴。咱們學校準備在校園網(wǎng)上開辟一塊 展現(xiàn)學生個人風采的專區(qū)，特向全校學生征集個人網(wǎng)頁作品，優(yōu)秀的網(wǎng)頁作品將放到校 園網(wǎng)上。這節(jié)課開始我們就一起來學習怎么制作個人的網(wǎng)頁。（二）教與學在制作網(wǎng)頁之前，需要進行一系列的規(guī)劃工作。首先要明確制作網(wǎng)頁的目的，確定 網(wǎng)頁標題。然后選擇適當?shù)膬?nèi)容，并完成網(wǎng)頁的版面設(shè)計。、預(yù)習教材P2-7,理解下面內(nèi)容網(wǎng)頁網(wǎng)頁文件實際上只是一個純文本文件，它是用

2、超文本標記語言（ HyperTextMarkup Language,HTML編寫的，由瀏覽器讀取、分析、格式化后便在屏幕上顯示為網(wǎng)頁。所謂超文 本指的是一種文檔組織系統(tǒng)，它使用鏈接來連接相關(guān)文件。你只要在網(wǎng)頁上點擊鼠標右鍵， 選擇菜單中的“查看源文件”，就可以通過“記事本”軟件看到網(wǎng)頁文件的實際內(nèi)容。從中 可以看到，網(wǎng)頁文件是通過各式各樣的標記對頁面上文字的字體、顏色、大小進行描述的， 它還描述了圖片、聲音、視頻等元素的鏈接位置。網(wǎng)頁文件的擴展名通常是html或htm。網(wǎng)頁是一種很好的信息傳播工具，網(wǎng)頁中可以包含文字、圖片、動畫、聲音、視頻等 多種形式的信息。通過制作個人網(wǎng)頁，我們可以發(fā)布多種

3、信息，充分展現(xiàn)自我。常見的網(wǎng)頁 一般包括標題和內(nèi)容兩大部分。（1）網(wǎng)頁標題：網(wǎng)頁標題是對一個網(wǎng)頁所呈現(xiàn)內(nèi)容的高度概括。（2）網(wǎng)頁內(nèi)容：文本和圖片是構(gòu)成網(wǎng)頁內(nèi)容的兩個最基本的元素。除此之外，網(wǎng)頁 內(nèi)容還可以包括動畫、聲音、視頻等元素。網(wǎng)頁是網(wǎng)站的基本構(gòu)件。人們把網(wǎng)站的第一個網(wǎng)頁稱為主頁（Homepage。在主頁上,人們通常會把網(wǎng)站的正式名稱放在標題部位， 另外在主頁底部還會放置網(wǎng)站的一些基本信息， 如制作者、聯(lián)系方式、版權(quán)聲明。一個網(wǎng)站通常由一個主頁和多個與主頁鏈接的網(wǎng)頁組成。 當然，很多簡單的個人網(wǎng)站也可以只有一個網(wǎng)頁。、規(guī)劃網(wǎng)頁主題與內(nèi)容規(guī)劃網(wǎng)頁，首先要明確網(wǎng)頁的制作目的，然后確定網(wǎng)頁標題，

4、最后根據(jù)制作目的確定網(wǎng) 頁中要展示的內(nèi)容。以下以張曉明同學設(shè)計個人網(wǎng)頁的過程為例，展示他設(shè)計網(wǎng)頁的思考過 程。張曉明的個人網(wǎng)頁如下我的方寸世界itt陋明年新缽寸味R主小 I-囪邕落日M£=臉M艮望鼻直華苴岫 n. m. jtii mVU- 4刃IVntb inn. *tEM% *事早早可女卜 及g由心應(yīng)手動耳儺一 1電雪恤曰3£巴*7拉矍生步驟一、確定網(wǎng)頁的制作目的與標題1、分析任務(wù)，明確網(wǎng)頁的制作目的。2、根據(jù)制作目的設(shè)想出一個有個性的標題。張曉明同學希望大家通過網(wǎng)頁了解自己的興趣愛好，為此，他將個人網(wǎng)頁標題定為“我的方寸世界”。步驟二、確定網(wǎng)頁內(nèi)容并收集、整理素材1、根

5、據(jù)網(wǎng)頁的制作目的、確定網(wǎng)頁的主要內(nèi)容。2、圍繞頁面的主要內(nèi)容，通過拍照、網(wǎng)上下載等多種途徑收集圖片等素材，或通過寫作、 繪畫等手段制作相關(guān)素材，并建立分類文件夾管理這些素材。3、整理、分析收集到的素材，確定具體的網(wǎng)頁內(nèi)容，即網(wǎng)頁中放置哪些文本、圖片等素 材。根據(jù)制作目的，張曉明同學確定了網(wǎng)頁的主要內(nèi)容:網(wǎng)頁標題為“我的方寸世界”。介紹自己的個人基本信息，如姓名、性別、生日、愛好和性格。介紹自己的業(yè)余興趣-愛好。分析了收集到的網(wǎng)頁素材后，他確定網(wǎng)頁中需要使用的素材及獲取方式。素材類型素材內(nèi)容獲取素材的方式文本簡單介紹自己的基本信息的文字使用WORD：件制作介紹自己既有愛好的一篇小文章使用WORD

6、：件制作圖片1張自畫像使用畫圖軟件繪制，或手工制作后 掃描成圖片文件5張喜愛的集郵圖片通過因特網(wǎng)下載圖片，或通過拍照 獲得數(shù)碼照片。、設(shè)計網(wǎng)頁版面網(wǎng)頁是供人瀏覽的。網(wǎng)頁版面設(shè)計得好，可以突出內(nèi)容分亮點，讓人賞心悅目。在對 網(wǎng)頁的主題和內(nèi)容進行了規(guī)劃后，還需要做進一步的細化工作，即根據(jù)已確定的網(wǎng)頁內(nèi)容， 對網(wǎng)頁的版面的版面進行設(shè)計，明確網(wǎng)頁中各個組成元素的基本位置。這樣，在制作網(wǎng)頁的 過程中就可以做到心中有數(shù)。步驟一、設(shè)計草案1、瀏覽各類網(wǎng)頁，學習網(wǎng)頁的基本構(gòu)圖，勾畫出網(wǎng)頁的輪廓。2、將已確定需要放置的具體內(nèi)容安排到網(wǎng)頁輪廓圖上。步驟二、確定網(wǎng)頁的版面設(shè)計方案1、分析網(wǎng)頁中各內(nèi)容的重要性，精細不

7、知各內(nèi)容元素。2、標明各元素的位置和各板塊的表現(xiàn)形式。張曉明同學參考了因特網(wǎng)上的各種優(yōu)秀網(wǎng)頁，決定參考上下型布局的網(wǎng)頁，從上到下分別放置網(wǎng)頁標題、個人基本信息、集郵愛好介紹這三個內(nèi)容，并在網(wǎng)頁的最下方放置制作者信息。具體的網(wǎng)頁版面設(shè)計圖詳見教材第7頁。課堂練習及檢測：完成下列學習單1-4學習單1 我的網(wǎng)頁的制作目的： 我的網(wǎng)頁標題：學習單2 我的網(wǎng)頁包括以下主要內(nèi)容: 我確定在網(wǎng)頁中使用的素材:素材典型素材內(nèi)存獲取素材的方式學習單3我的網(wǎng)頁草案:學 習 單4我的網(wǎng)頁版面設(shè)計圖:教學后記：本堂課要求同學們以展示自我風采、增進同學們對自己的了解為目的，設(shè)計一張網(wǎng)頁，確定網(wǎng)頁的內(nèi)容和版面布局。通過學習因特網(wǎng)上的優(yōu)秀網(wǎng)頁布局，以及教師的對張曉明同學的個人網(wǎng)頁的講解，大部分同學都能夠確定自己的網(wǎng)頁制作目的