教師培訓講義

1、教師培訓訓講義編者：張張燕 200048第一部分分 幾幾個概念念網(wǎng)站：相相互鏈接接的多個個網(wǎng)頁。網(wǎng)頁：含含有文字字、圖片片、動畫畫等并帶帶有超級級鏈接的的一組信信息，這這些信息息在一個個頁面中中顯示。網(wǎng)頁文件件：網(wǎng)頁頁儲存時時的電子子文檔，文文件的擴擴展名為為：.hhtm .hhtmll .aspp .phhp 等等。主頁：或或首頁，登登錄網(wǎng)站站后首先先呈現(xiàn)的的主要頁頁面，相相當于網(wǎng)網(wǎng)站的總總目錄或或總導航航。網(wǎng)頁是一一種帶有有超鏈接接的電子子文檔（也也叫超文文本）它它可以把把文字、圖片、聲音、影像等等多種媒媒體有機機地組合合在一起起，并實實現(xiàn)不受受時空限限制的任任意跳轉轉，眾多多的網(wǎng)頁頁之間

2、構構成一種種錯綜復復雜的網(wǎng)網(wǎng)狀結構構。網(wǎng)頁編輯輯工具：最著名的的：DrreammWeaaverr ProontPPagee其它如：Cutte PPagee 注意事項項要把某個個網(wǎng)站中中涉及到到的所有有的信息息，放在在同一個個文件夾夾中（稱稱之為站站點文件件夾）。站點文件件夾中的的信息，要要根據(jù)站站點的結結構和欄欄目，分分類有序序地存放放。（便便于以后后的查找找、更改改）。網(wǎng)站中所所有的文文件名或或子文件件夾名，不要用中文命名。（因為有些瀏覽器不支持中文名，會導致網(wǎng)頁不可瀏覽，或網(wǎng)頁中元素不可顯示）。不要隨意意改變站站點文件件夾中文文件的位位置。（隨隨意改變變后，網(wǎng)網(wǎng)頁中超超鏈接的的指向就就可能

3、不不對，網(wǎng)網(wǎng)頁或網(wǎng)網(wǎng)頁中的的元素就就不能正正常顯示示，這些些超鏈接接要重做做，才能能正確顯顯示）若要調整整文件的的位置，必必須在相相應的網(wǎng)網(wǎng)頁編輯輯軟件中中，調整整后，所所涉及的的鏈接，都都會自動動更新。要建立“站點”的概念念。如：當你在在網(wǎng)頁中中要建一一個超鏈鏈接指向向一個音音樂文件件時，你你要問自自己“我有沒沒有把這這個音樂樂文件放放入站點點文件夾夾中？” 。PronntPaage的的特點： 與WWordd、PoowerrPoiint一一樣，PPronntPaage是是一個信信息集成成工具。它的文文字與圖圖片的排排版功能能，與WWordd相似，只只是沒有有Worrd那么么強大、直觀、靈活。

4、它的多多媒體的的集成功功能與PPoweerPoointt相似，它它能實現(xiàn)現(xiàn)多種媒媒體的插插入，能能更加方方便地建建立超級級鏈接，能能更加快快捷地實實現(xiàn)頁面面之間的的跳轉。網(wǎng)頁的排排版是網(wǎng)網(wǎng)頁制作作的重點點和難點點，尤其其是主頁頁面的設設計和排排版。網(wǎng)網(wǎng)頁排版版中用到到最多的的是表格格。第二部分分 網(wǎng)網(wǎng)頁制作作-復復習準備：在在E盤上上建立一一個文件件夾，名名為“網(wǎng)頁課課件”，用來來放各個個站點。1、新建建站點 在在“E:網(wǎng)頁課課件”中新建一一個文件件夾（如如：fuuxi）執(zhí)行“文件/新建（網(wǎng)網(wǎng)頁或站站點）命命令 在右側側的任務務窗格中中選擇“空白站站點”，并把把新站點點的位置置指向選選定的站站

5、點文件件夾（EE:網(wǎng)網(wǎng)頁課件件fuuxi）。2、打開開站點 執(zhí)執(zhí)行“文件/ 打開開站點”命令，瀏瀏覽找到到你的站站點文件件夾，打打開。 （注意意：我們們在編輯輯網(wǎng)頁時時，要建建立站點點的概念念，一個個網(wǎng)頁，若若在該站站點中進進行編輯輯，該站站點會自自動更新新與該網(wǎng)網(wǎng)頁相關關的鏈接接。相反反，在站站點外對對該網(wǎng)頁頁進行了了修改，則則會導致致跟它要要關的鏈鏈接出錯錯）3、利用用“導航、共享邊邊框、主主題”快速建建立網(wǎng)站站。 主要步驟驟如下：第一步：新建一一個站點點。第二步：進入“導航視視圖”，新建建若干個個網(wǎng)頁：如：主主頁、復復習、新新授、練練習等。第三步：進入網(wǎng)網(wǎng)頁編輯輯（雙擊擊它），執(zhí)執(zhí)行“格

6、式/共享邊邊框”命令，彈彈出如下下對話框框：設置好包包含導航航按鈕的的共享邊邊框。（最最好設成成所有網(wǎng)網(wǎng)頁都一一樣，以以形成一一個統(tǒng)一一的風格格；以后后個別地地方要不不同，可可以進行行個別的的編輯）第四步：編輯共共享邊框框中的超超鏈接 執(zhí)行行第三步步后，有有頁面并并沒有導導航按鈕鈕，這時時需要進進一步編編輯，如如：雙擊紅線線圈起來來的部分分，可編編輯鏈接接欄的屬屬性，彈彈出如下下對話框框：設置導航航按鈕指指向哪里里，如選選“父層”，本例例中導航航按鈕會會顯示“首頁”字樣，并并鏈接到到首頁（上上一層）；若選“同一層層”，本例例會顯示示3個按按鈕“復習”、“新授”、“練習”， 即即同一層層的不同同

7、網(wǎng)頁的的鏈接。編輯導航航按鈕的的樣式：點擊上上圖的“樣式”標簽，出出現(xiàn)如下下對話框框：選擇合適適的樣式式按鈕，可可“水平方方向”和“垂直方方向”放置，還還可拖動動，改變變它在網(wǎng)網(wǎng)頁中的的位置。第五步：應用主主題（美美化網(wǎng)頁頁）主題可以以應用到到單個頁頁，也可可以應用用到站點點中的所所有頁。（建議：共享邊邊框和導導航按鈕鈕，不要要太復雜雜，只要要能實現(xiàn)現(xiàn)頁面之之間的鏈鏈接，越越簡單，出出錯的機機會也就就越小，即即使出錯錯了，亦亦比較容容易糾正正），示示例：第六步：編輯各各個頁面面并保存存。 以上圖圖為例：介紹簡簡單表格格的制作作、圖片片的插入入。第三部分分 從零做起編輯自自己的網(wǎng)網(wǎng)頁基本過程程：

8、構思、設設計網(wǎng)站的結結構：主主題、風風格、欄欄目、主主色調等等。新建站點點 。編輯主頁頁。編輯各個個子頁面面。建立鏈接接，美工工、完善善。主頁的幾幾種常見見外觀結結構：版塊型：中規(guī)中中矩，整整齊劃一一、講究究精確對對齊；多運用用線條、表格、不同的的顏色塊塊來劃分分不同的的內(nèi)容、欄目。 常見見有：“國字型型”（如我我校的首首頁）、“拐角型型”（我校校的“學生園園地”）優(yōu)點：便便于分門門別類，面面頁的信信息容量量大，便便于瀏覽覽者快速速定位需需要的內(nèi)內(nèi)容。 缺缺點：看看上去都都大同小小異。很多網(wǎng)站站都采用這這種結構構。目錄型：以目錄錄的結構構、行文文的方式式來組織織網(wǎng)頁內(nèi)內(nèi)容，看看上去就就象一篇篇

9、Worrd文檔檔；這種種結構的的網(wǎng)站，注注重文字字內(nèi)容，頁頁面變化化不大。如：惟存存教育： HYPERLINK htttp:/ htttp:/n/信息技術術教師之之家： HYPERLINK hhttpp:/m/ htttp:/wwww.ggaoppengg.coom/ HYPERLINK httpp:/t/orrgannisee/chhinaa/asss/wwwwffigeerarrt/lleagguerr/ htttp:/wwww.ccgann.neet/oorgaanisse/cchinna/aass/wwwffigeerarrt/lleagguerr/藝術型（隨意型型）：沒有有固定的的模

10、式。版面不拘拘一格，講究美工，具有個性。 如：世紀美美術： HYPERLINK hhttpp:/n/noode22/noode1186/inddex.htmml htttp:/wwww.zzjoll.coom.ccn/nnodee2/nnodee1866/inndexx.httml 迪斯尼尼中國： HYPERLINK htttp:/n/ htttp:/n/ 童童趣型的的： HYPERLINK htttp:/m/annimaals/inddex.aspp htttp:/wwww.wjhhtxxx.coom/aanimmalss/inndexx.assp 一個fflassh酷站站： HYPERLI

11、NK htttp:/m/ htttp:/wwww.eeye44u.ccom/“20004校本本培訓網(wǎng)頁模模板欣欣賞”這個文文件夾中中的網(wǎng)頁頁都屬于于這一類類型。不管是哪哪種結構構的網(wǎng)頁頁，999%的都都是用表表格來組組織和定定位頁面面中的各各種元素素。下面我們們用具體體的實例例來學習習網(wǎng)頁的的制作。準備：在在“E:網(wǎng)頁課課件”中新建建一個文文件夾“l(fā)iaanxii”。在FrronttPagge中打打開這個個文件夾夾。表格的基基本編輯輯 請參閱閱FrronttPagge 220022實用基基本教程程P1107-1211 第55章。 關關鍵操作作：插入表格格（并設設置其參參數(shù)）（PP1100）修改

12、表格格（重設設“表格屬屬性”）（PP1144）行、列的的編輯：插入、刪除單元格的的編輯：單元格格的屬性性（對齊齊方式、寬度高高度、顏顏色等）、拆分、合并首頁實例例一（簡簡單表格格）例1：插插入一個個6行22列的表表格（7750象象素）。布局如如下：左欄圖片標題欄各個欄目目主內(nèi)容版權信息息設置網(wǎng)頁頁屬性（如如背景色色、背景景圖片、背景音音樂、邊邊距等）把網(wǎng)頁中中的各元元素（文文字、插插圖、背背景圖等等）放入入各個單單元格。圖片放入入的方式式有：（11）作為為單元格格的插圖圖；（22）作為為單元格格（表格格）的背背景圖（以以平鋪的的方式充充滿選中中的單元元格）。（具體操操作：略略）從上例可可以看出

13、出，制作作一個網(wǎng)網(wǎng)頁最主主要的，一一是素材材的設計計制作，二二是版面面的設計計編輯。首頁實例例二（例例2：復復雜表格格）（拐拐角型）版面編輯輯的原則則：1、從上上到下，多多個表格格、分塊塊設計； 2、以以“表格中中套表格格”的方法法，來化簡簡表格（即即不要把把某一個個表格做做得太復復雜，行數(shù)列列數(shù)過多多）。網(wǎng)頁布局局：1、網(wǎng)頁頁頭部：（2行行2列）網(wǎng)站標識識圖（LOGGO）廣告圖欄目1欄目2欄目3欄目4欄目5欄目62、網(wǎng)頁頁中部：（大表表格：11行2列列）公告調查友情鏈接版塊一版塊二版塊三版塊四3、網(wǎng)頁頁底部底部圖片片或分隔隔線版權信息息分開設計計的另一一個優(yōu)點點，就是是可以把把網(wǎng)頁的的頭部和

14、和底部應應用（拷拷貝）到到其它子子頁面中中，使各各網(wǎng)頁風風格統(tǒng)一一，跳轉轉方便。注意點：頭、中、底部表表格的寬寬度要相相同。（一一般為：7500或7660象素素）把頭部表表格和底底部表格格做好備備份，以以便子網(wǎng)網(wǎng)頁用。編輯子網(wǎng)網(wǎng)頁時，頭頭部可以以先做個個空表格格，空在在那兒。等頭部部表格中中的導航航鏈接做做好后，再再拷貝過過來。第四部分分 利利用他山山之石(網(wǎng)頁模模板)做做自己的的網(wǎng)站一、WeebQuuestt模板的的運用。 WebbQueest是是網(wǎng)絡學學習或網(wǎng)網(wǎng)絡研究究性學習習的一種種模式。 用WeebQuues模模板做成成的網(wǎng)頁頁，簡潔潔、有條條理、針針對性強強。 例子：“ HYPERL

15、INK 關于于WebbQueest/WebbQueest學學案舉例例/豐富富多采的的民族節(jié)節(jié)日.hhtm20004校本本培訓關于WWebQQuesstWWebQQuesst學案案舉例、豐富多多采的民民族節(jié)日日.httm”單頁模板板的使用用例3：在“E:網(wǎng)頁頁課件”中建立立一個文文件夾（如如Webb1）拷貝這這個模板板到weeb1中中用FrronggtPaage打打開這個個站點編輯網(wǎng)網(wǎng)頁文件件保存。 幾個個重點操操作：（1）段段落的編編輯光標指向向某個自自然段，右右擊 執(zhí)行行快捷菜菜單中的的“段落”命令，彈彈出以下下對話框框： 設置段段落的縮縮進和行距。Px是象象素的意意思。（1厘米28象素）（

16、2）創(chuàng)創(chuàng)建網(wǎng)頁頁書簽a、建立立書簽（這個內(nèi)內(nèi)容我們們利用FFronntPaage的的幫助功功能，來來學習）執(zhí)行“幫幫助”菜單中中的“Miccrossoftt FrronttPagge的幫幫助”，在彈彈出對話話框中輸輸入關鍵鍵詞“書簽”，單擊擊“搜索”，就找找到了相相關的幫幫助內(nèi)容容，如：右圖，按按上面的的步驟操操作即可可。 b、設置超超鏈接創(chuàng)建書簽簽的目的的是為了了在本頁頁中實現(xiàn)現(xiàn)快速的的跳轉。所以，一一般會在在目錄或或頁首，建建立一個個超鏈接接，指向向剛建的的書簽。2、多頁頁模板的的使用方法與“單頁模模板的使使用”類似。首先把該該模板復復制到站站點文件件夾。用用FroontPPagee打開各

17、各個頁面面進行編編輯，可可以在原原來基礎礎上編輯輯，可以以加入其其它元素素，如圖圖片、fflassh等?？梢灾刂孛奈募ㄒ灰欢ㄒ谠谡军c中中），檢檢查各個個超鏈接接無誤。二、一般般網(wǎng)頁模模板的使使用例4：“20004校本本培訓網(wǎng)頁模模板拐拐角型0011”，以“身邊的的行程問問題”為例，把把lefft1中中的網(wǎng)頁頁作為首首頁，lleftt5中的的網(wǎng)頁作作為“過程”欄目的的子頁面面。準備：在在“E：網(wǎng)頁課課件”中建立立文件夾夾“xinngchhengg”，把lleftt1中的的所有內(nèi)內(nèi)容拷入入這個文文件夾，把把lefft5這這個文件件夾拷入入“xinngchhengg”文件夾夾中，并并把le

18、eft55改名為為“guoocheeng”。主要要操操作：在FroontPPagee中打開開“xinngchhengg”這個站站點。打開inndexx.httml，編輯首頁頁。打開guuochhengginndexx.httml，編編輯過程程子頁。在首頁的的左側導導航欄中中，給“過程”建立超超鏈接，指指向“guoocheenginddex.htmml”。例5：利利用“20004校本本培訓網(wǎng)頁模模板藝藝術型03”這個模模板，做做一個班班級主頁頁的首頁頁面。準備：把把“03”這個文文件夾拷拷入“E：網(wǎng)頁課課件”中用FroontPPagee打開003這個個站點。編輯首頁頁文件。主要操作作：1、修改改

19、導航欄欄文字。2、再插插入一個個“2行11列”的表格格，第11行插入入首面圖圖片，第第2行輸輸入版權權信息，并并設置一一個背景景圖片。3、從上上到下，把把所有表表格統(tǒng)一一為：7760象象素寬、居中。三、利用用整站系系統(tǒng)（靜靜態(tài)的）例6：把把“20004校本本培訓源碼整站少爺?shù)牡募摇闭麄€文文件夾拷拷到“E:網(wǎng)頁課課件”文件夾夾中。用FroontPPagee 打開開各個頁頁面進行行修改。注：網(wǎng)頁頁漂亮精精致的界界面，大大多是由由圖片組組成的，所所以網(wǎng)頁頁制作中中美工是是很重要要的。如如本站中中，各欄欄目按鈕鈕都是圖圖片，要要修改欄欄目的文文字，必必須使用用圖片編編輯軟件件。附：網(wǎng)頁頁制作推推薦網(wǎng)站

20、站：網(wǎng)頁制作作大寶庫庫： HYPERLINK htttp:/wwww.dabbaokku.ccom/ htttp:/wwww.dabbaokku.ccom/全球商業(yè)業(yè)網(wǎng)站模模板中心心： HYPERLINK htttp:/wwww.sittediiy.ccom/inddex.asppx htttp:/wwww.ssiteediyy.coom/iindeex.aaspxx信心網(wǎng)絡絡下載： HYPERLINK htttp:/wwww.xxxskky.ccom/asppdowwn/iindeex.aaspxx htttp:/m/asspdoown/inddex.asppx中國網(wǎng)頁頁設計師師聯(lián)盟： HY

21、PERLINK htttp:/wwww.cc-dww.coom/ htttp:/wwww.c-ddw.ccom/第五部分分 圖像像處理PhootoSShopp的簡單單使用一、了解解界面PhottoShhop的的各種操操作命令令分布在在以下三三個地方方： 11、各個個下拉菜菜單中（以以文字體體現(xiàn)）。 22、各個個面板中中（圖示示+文字字）。 33、快捷捷菜單（文文字）。其中的“面板”用得最最多，最最常用的的面板有有：工具具、選項項、圖層層、歷史史記錄二、例解解基本操操作例1：改改變圖像像的大小小（1）縮縮放圖像像 命令：圖像 圖圖像大小小 彈彈出如右右圖的對對話框： 輸輸入你需需要的尺尺寸：如如

22、寬度 為8800象象素，高高度會按按比例縮縮放。若不想按按比例縮縮放，只只要把前前的釣去去掉，即即可。例2：裁裁剪圖像像選擇“工工具”面板中中的“”， 拖拖動鼠標標，框住住圖像中中你需要要的部分分，雙擊擊（或敲敲回車）完完成操作作。例3、利利用“選區(qū)”工具，選選取圖像像的某部部分。選區(qū)工具具有2組組：規(guī)則則選區(qū)（橢橢圓和矩矩形）、不規(guī)則則選區(qū)（1）橢橢圓選區(qū)區(qū) 打打開“例3-1”，分別別做一個個羽化和和不羽化化的橢圓圓圖。效效果如下下： （22）磁性性套索打開“例例3-22”，把圖圖像中間間橙黃色色部分取取下來，別別建一個個圖像，命命名為“橙色背背景圖”。套索的寬寬度一般般設置為為5-110個

23、象象素。（11厘米為為28象象素）例4、把把“橙色背背景圖”中的文文字去掉掉“橡皮圖圖章”的使用用。 打打開“橙色背背景圖”?！跋鹌D圖章”的使用用方法：第一步步：取樣樣：按住住鍵盤上上的Allt鍵，同同時鼠標標點擊文文字附近近的圖像像；第二二步：拷拷貝：放放開Allt鍵，拖拖動鼠標標，在文文字處涂涂抹。反反復做這這2步操操作。例5：圖圖層的基基本操作作（1）修修改網(wǎng)頁頁中的導導航按鈕鈕。打開“例例5-11.giif”，主要要操作如如下：執(zhí)行“圖圖像/模模式/RRGB顏顏色”，（ggif圖圖像為索索引顏色色，不能能含有層層）擦除導航航條中原原有的文文字。輸入新的的文字（每每輸入一一次文字字，就自自動產(chǎn)生生一個層層，這樣樣的層，稱稱為文字字層）拼合所有有圖層，把把模式重重設為“索引顏顏色”，文件件另存一一份