教師培訓(xùn)講義

教師培訓(xùn)講義編者：張燕2004．8第一部分幾個(gè)概念網(wǎng)站：相互互鏈接的的多個(gè)網(wǎng)網(wǎng)頁。網(wǎng)頁：含有有文字、圖圖片、動動畫等并并帶有超超級鏈接接的一組組信息，這這些信息息在一個(gè)個(gè)頁面中中顯示。網(wǎng)頁文件：：網(wǎng)頁儲儲存時(shí)的的電子文文檔，文文件的擴(kuò)擴(kuò)展名為為：.hhtm.hhtmll..aspp.phhp等等。主頁：或首首頁，登登錄網(wǎng)站站后首先先呈現(xiàn)的的主要頁頁面，相相當(dāng)于網(wǎng)網(wǎng)站的總總目錄或或總導(dǎo)航航。網(wǎng)頁是一種種帶有超超鏈接的的電子文文檔（也也叫超文文本）它它可以把把文字、圖圖片、聲聲音、影影像等多多種媒體體有機(jī)地地組合在在一起，并并實(shí)現(xiàn)不不受時(shí)空空限制的的任意跳跳轉(zhuǎn)，眾眾多的網(wǎng)網(wǎng)頁之間間構(gòu)成一一種錯綜綜復(fù)雜的的網(wǎng)狀結(jié)結(jié)構(gòu)。網(wǎng)頁編輯工工具：最著名的：：DreeamWWeavverPPronntPaage其它如：CCuteePaage注意事項(xiàng)要把某個(gè)網(wǎng)網(wǎng)站中涉涉及到的的所有的的信息，放放在同一一個(gè)文件件夾中（稱稱之為站站點(diǎn)文件件夾）。站點(diǎn)文件夾夾中的信信息，要要根據(jù)站站點(diǎn)的結(jié)結(jié)構(gòu)和欄欄目，分分類有序序地存放放。（便便于以后后的查找找、更改改）。網(wǎng)站中所有有的文件件名或子子文件夾夾名，不不要用中中文命名名。（因因?yàn)橛行┬g覽器器不支持持中文名名，會導(dǎo)導(dǎo)致網(wǎng)頁頁不可瀏瀏覽，或或網(wǎng)頁中中元素不不可顯示示）。不要隨意改改變站點(diǎn)點(diǎn)文件夾夾中文件件的位置置。（隨隨意改變變后，網(wǎng)網(wǎng)頁中超超鏈接的的指向就就可能不不對，網(wǎng)網(wǎng)頁或網(wǎng)網(wǎng)頁中的的元素就就不能正正常顯示示，這些些超鏈接接要重做做，才能能正確顯顯示）若要調(diào)整文文件的位位置，必必須在相相應(yīng)的網(wǎng)網(wǎng)頁編輯輯軟件中中，調(diào)整整后，所所涉及的的鏈接，都都會自動動更新。要建立“站站點(diǎn)”的概念念。如：：當(dāng)你在在網(wǎng)頁中中要建一一個(gè)超鏈鏈接指向向一個(gè)音音樂文件件時(shí)，你你要問自自己“我有沒沒有把這這個(gè)音樂樂文件放放入站點(diǎn)點(diǎn)文件夾夾中？”。PronttPagge的特特點(diǎn)：與Woord、PPoweerPoointt一樣，PPronntPaage是是一個(gè)信信息集成成工具。它它的文字字與圖片片的排版版功能，與與Worrd相似似，只是是沒有WWordd那么強(qiáng)強(qiáng)大、直直觀、靈靈活。它它的多媒媒體的集集成功能能與PoowerrPoiint相相似，它它能實(shí)現(xiàn)現(xiàn)多種媒媒體的插插入，能能更加方方便地建建立超級級鏈接，能能更加快快捷地實(shí)實(shí)現(xiàn)頁面面之間的的跳轉(zhuǎn)。網(wǎng)頁的排版版是網(wǎng)頁頁制作的的重點(diǎn)和和難點(diǎn)，尤尤其是主主頁面的的設(shè)計(jì)和和排版。網(wǎng)網(wǎng)頁排版版中用到到最多的的是表格格。第二部分網(wǎng)頁頁制作---復(fù)習(xí)習(xí)準(zhǔn)備：在EE盤上建建立一個(gè)個(gè)文件夾夾，名為為“網(wǎng)頁課課件”，用來來放各個(gè)個(gè)站點(diǎn)。1、新建站站點(diǎn)在“E:\\網(wǎng)頁課課件”中新建一一個(gè)文件件夾（如如：fuuxi）→執(zhí)行“文件//新建（網(wǎng)網(wǎng)頁或站站點(diǎn)）命命令→→在右側(cè)側(cè)的任務(wù)務(wù)窗格中中選擇“空白站站點(diǎn)”，并把把新站點(diǎn)點(diǎn)的位置置指向選選定的站站點(diǎn)文件件夾（EE:\網(wǎng)網(wǎng)頁課件件\fuuxi）。2、打開站站點(diǎn)執(zhí)行行“文件//打開開站點(diǎn)”命令，瀏瀏覽找到到你的站站點(diǎn)文件件夾，打打開。（注意：：我們在在編輯網(wǎng)網(wǎng)頁時(shí)，要要建立站站點(diǎn)的概概念，一一個(gè)網(wǎng)頁頁，若在在該站點(diǎn)點(diǎn)中進(jìn)行行編輯，該站點(diǎn)會自動更新與該網(wǎng)頁相關(guān)的鏈接。相反，在站點(diǎn)外對該網(wǎng)頁進(jìn)行了修改，則會導(dǎo)致跟它要關(guān)的鏈接出錯）3、利用“導(dǎo)航、共共享邊框框、主題題”快速建建立網(wǎng)站站。主要步驟如如下：第一步：新新建一個(gè)個(gè)站點(diǎn)。第二步：進(jìn)進(jìn)入“導(dǎo)航視視圖”，新建建若干個(gè)個(gè)網(wǎng)頁：：如：主主頁、復(fù)復(fù)習(xí)、新新授、練練習(xí)等。第三步：進(jìn)進(jìn)入網(wǎng)頁頁編輯（雙雙擊它），執(zhí)執(zhí)行“格式//共享邊邊框”命令，彈彈出如下下對話框框：設(shè)置好包含含導(dǎo)航按按鈕的共共享邊框框。（最最好設(shè)成成所有網(wǎng)網(wǎng)頁都一一樣，以以形成一一個(gè)統(tǒng)一一的風(fēng)格格；以后后個(gè)別地地方要不不同，可可以進(jìn)行行個(gè)別的的編輯）第四步：編編輯共享享邊框中中的超鏈鏈接執(zhí)行第第三步后后，有頁頁面并沒沒有導(dǎo)航航按鈕，這這時(shí)需要要進(jìn)一步步編輯，如如：雙擊紅線圈圈起來的的部分，可可編輯鏈鏈接欄的的屬性，彈彈出如下下對話框框：設(shè)置導(dǎo)航按按鈕指向向哪里，如如選“父層”，本例例中導(dǎo)航航按鈕會會顯示“首頁”字樣，并并鏈接到到首頁（上上一層）；；若選“同一層層”，本例例會顯示示3個(gè)按按鈕“復(fù)習(xí)”、“新授”、“練習(xí)”，即即同一層層的不同同網(wǎng)頁的的鏈接。編輯導(dǎo)航按按鈕的樣樣式：點(diǎn)點(diǎn)擊上圖圖的“樣式”標(biāo)簽，出出現(xiàn)如下下對話框框：選擇合適的的樣式按按鈕，可可“水平方方向”和“垂直方方向”放置，還還可拖動動，改變變它在網(wǎng)網(wǎng)頁中的的位置。第五步：應(yīng)應(yīng)用主題題（美化化網(wǎng)頁）主題可以應(yīng)應(yīng)用到單單個(gè)頁，也也可以應(yīng)應(yīng)用到站站點(diǎn)中的的所有頁頁。（建議：共共享邊框框和導(dǎo)航航按鈕，不不要太復(fù)復(fù)雜，只只要能實(shí)實(shí)現(xiàn)頁面面之間的的鏈接，越越簡單，出出錯的機(jī)機(jī)會也就就越小，即即使出錯錯了，亦亦比較容容易糾正正），示示例：第六步：編編輯各個(gè)個(gè)頁面并并保存。以以上圖為為例：介介紹簡單單表格的的制作、圖圖片的插插入。第三部分從零做起-----編輯自自己的網(wǎng)網(wǎng)頁基本過程：：構(gòu)思、設(shè)計(jì)計(jì)網(wǎng)站的結(jié)結(jié)構(gòu)：主主題、風(fēng)風(fēng)格、欄欄目、主主色調(diào)等等。新建站點(diǎn)。編輯主頁。編輯各個(gè)子子頁面。建立鏈接，美工、完善。主頁的幾種種常見外外觀結(jié)構(gòu)構(gòu)：版塊型：中中規(guī)中矩矩，整齊齊劃一、講講究精確確對齊；；多運(yùn)用用線條、表表格、不不同的顏顏色塊來來劃分不不同的內(nèi)內(nèi)容、欄欄目。常見有有：“國字型型”（如我我校的首首頁）、“拐角型”（我校的“學(xué)生園地”）優(yōu)點(diǎn)：便于于分門別別類，面面頁的信信息容量量大，便便于瀏覽覽者快速速定位需需要的內(nèi)內(nèi)容。缺點(diǎn)點(diǎn)：看上上去都大大同小異異。很多網(wǎng)站都都采用這這種結(jié)構(gòu)構(gòu)。目錄型：以以目錄的的結(jié)構(gòu)、行行文的方方式來組組織網(wǎng)頁頁內(nèi)容，看看上去就就象一篇篇Worrd文檔檔；這種種結(jié)構(gòu)的的網(wǎng)站，注注重文字字內(nèi)容，頁頁面變化化不大。如：惟存教教育：htttp:://n/信息技術(shù)教教師之家家：htttp:://wwww..gaoopenng.ccom//htttp:://wwww..cgaan.nnet//orgganiise//chiina//asss/wwwffigeerarrt/lleagguerr/藝術(shù)型（隨隨意型）：沒有有固定的的模式。版面不拘一格，講究美工，具有個(gè)性。如：世世紀(jì)美術(shù)術(shù)：htttp::////nodde2//nodde1886/iindeex.hhtmll迪迪斯尼中中國：htttp:://wwww..dissneyy.coom.ccn/童趣趣型的：htttp:://wwww..wjhhtxxx.coom/aanimmalss/inndexx.assp一個(gè)fllashh酷站：：htttp:://m/“20044校本培培訓(xùn)\網(wǎng)網(wǎng)頁模板板\欣賞賞”這個(gè)文文件夾中中的網(wǎng)頁頁都屬于于這一類類型。不管是哪種種結(jié)構(gòu)的的網(wǎng)頁，999%的的都是用用表格來組組織和定定位頁面面中的各各種元素素。下面我們用用具體的的實(shí)例來來學(xué)習(xí)網(wǎng)網(wǎng)頁的制制作。準(zhǔn)備：在“E:\\網(wǎng)頁課課件”中新建建一個(gè)文文件夾“l(fā)iaanxii”。在FrronttPagge中打打開這個(gè)個(gè)文件夾夾。表格的基本本編輯請參閱《FFronntPaage20002實(shí)用用基本教教程》PP1077-1221第第5章。關(guān)鍵鍵操作：：插入表格（并并設(shè)置其其參數(shù)）（PP1100）修改表格（重重設(shè)“表格屬屬性”）（PP1144）行、列的編編輯：插插入、刪刪除單元格的編編輯：單單元格的的屬性（對對齊方式式、寬度度高度、顏顏色等）、拆拆分、合合并首頁實(shí)例一一（簡單單表格）例1：插入入一個(gè)66行2列列的表格格（7550象素素）。布局如如下：左欄圖片標(biāo)題欄各個(gè)欄目主內(nèi)容版權(quán)信息設(shè)置網(wǎng)頁屬屬性（如如背景色色、背景景圖片、背背景音樂樂、邊距距等）把網(wǎng)頁中的的各元素素（文字字、插圖圖、背景景圖等）放放入各個(gè)個(gè)單元格格。圖片放入的的方式有有：（11）作為為單元格格的插圖圖；（22）作為為單元格格（表格格）的背背景圖（以以平鋪的的方式充充滿選中中的單元元格）。（具體操作作：略）從上例可以以看出，制制作一個(gè)個(gè)網(wǎng)頁最最主要的的，一是是素材的的設(shè)計(jì)制制作，二二是版面面的設(shè)計(jì)計(jì)編輯。首頁實(shí)例二二（例22：復(fù)雜雜表格）（拐角型）版面編輯的的原則：：1、從上到到下，多多個(gè)表格格、分塊塊設(shè)計(jì)；；2、以“表格中中套表格格”的方法法，來化簡簡表格（即即不要把把某一個(gè)個(gè)表格做做得太復(fù)復(fù)雜，行數(shù)列列數(shù)過多多）。網(wǎng)頁布局：：1、網(wǎng)頁頭頭部：（2行行2列）網(wǎng)站標(biāo)識圖圖（LOGOO）廣告圖欄目1欄目2欄目3欄目4欄目5欄目62、網(wǎng)頁中中部：（大大表格：：1行22列）公告調(diào)查友情鏈接版塊一版塊二版塊三版塊四3、網(wǎng)頁底底部底部圖片或或分隔線線版權(quán)信息分開設(shè)計(jì)的的另一個(gè)個(gè)優(yōu)點(diǎn)，就就是可以以把網(wǎng)頁頁的頭部部和底部部應(yīng)用（拷拷貝）到到其它子子頁面中中，使各各網(wǎng)頁風(fēng)風(fēng)格統(tǒng)一一，跳轉(zhuǎn)轉(zhuǎn)方便。注意點(diǎn)：頭、中、底底部表格格的寬度度要相同同。（一一般為：：7500或7660象素素）把頭部表格格和底部部表格做做好備份份，以便便子網(wǎng)頁頁用。編輯子網(wǎng)頁頁時(shí)，頭頭部可以以先做個(gè)個(gè)空表格格，空在在那兒。等等頭部表表格中的的導(dǎo)航鏈鏈接做好好后，再再拷貝過過來。第四部分利用用他山之之石(網(wǎng)頁模模板)----做做自己的的網(wǎng)站一、WebbQueest模模板的運(yùn)運(yùn)用。WebQQuesst是網(wǎng)網(wǎng)絡(luò)學(xué)習(xí)習(xí)或網(wǎng)絡(luò)絡(luò)研究性性學(xué)習(xí)的的一種模模式。用WebbQuees模板板做成的的網(wǎng)頁，簡簡潔、有有條理、針針對性強(qiáng)強(qiáng)。例子：“20004校本本培訓(xùn)\\關(guān)于WWebQQuesst\WWebQQuesst學(xué)案案舉例、豐豐富多采采的民族族節(jié)日..htmm”單頁模板的的使用例3：在“E:\\網(wǎng)頁課課件”中建立立一個(gè)文文件夾（如如Webb1）→→拷貝這這個(gè)模板板到weeb1中中→用FrronggtPaage打打開這個(gè)個(gè)站點(diǎn)→→編輯網(wǎng)網(wǎng)頁文件件→保存。幾個(gè)重重點(diǎn)操作作：（1）段落落的編輯輯光標(biāo)指向某某個(gè)自然然段，右右擊→→執(zhí)行行快捷菜菜單中的的“段落”命令，彈彈出以下下對話框框：設(shè)置段落落的縮進(jìn)進(jìn)和行距。Px是象象素的意意思。（1厘米28象素）（2）創(chuàng)建建網(wǎng)頁書書簽a、建立書書簽（這個(gè)內(nèi)容容我們利利用FrronttPagge的幫幫助功能能，來學(xué)學(xué)習(xí)）執(zhí)行“幫助助”菜單中中的“MiccrossofttFrronttPagge的幫幫助”，在彈彈出對話話框中輸輸入關(guān)鍵鍵詞“書簽”，單擊擊“搜索”，就找找到了相相關(guān)的幫幫助內(nèi)容容，如：：右圖，按按上面的的步驟操操作即可可。b、設(shè)設(shè)置超鏈鏈接創(chuàng)建書簽的的目的是是為了在在本頁中中實(shí)現(xiàn)快快速的跳跳轉(zhuǎn)。所所以，一一般會在在目錄或或頁首，建建立一個(gè)個(gè)超鏈接接，指向向剛建的的書簽。2、多頁模模板的使使用方法與“單單頁模板板的使用用”類似。首先把該模模板復(fù)制制到站點(diǎn)點(diǎn)文件夾夾。用FFronntPaage打打開各個(gè)個(gè)頁面進(jìn)進(jìn)行編輯輯，可以以在原來來基礎(chǔ)上上編輯，可可以加入入其它元元素，如如圖片、fflassh等?？煽梢灾孛募ㄒ灰欢ㄒ谠谡军c(diǎn)中中），檢檢查各個(gè)個(gè)超鏈接接無誤。二、一般網(wǎng)網(wǎng)頁模板板的使用用例4：“\\20004校本本培訓(xùn)\\網(wǎng)頁模模板\拐拐角型\\0011”，以“身邊的的行程問問題”為例，把把lefft1中中的網(wǎng)頁頁作為首首頁，lleftt5中的的網(wǎng)頁作作為“過程”欄目的的子頁面面。準(zhǔn)備：在“E：\\網(wǎng)頁課課件”中建立立文件夾夾“xinngchhengg”，把lleftt1中的的所有內(nèi)內(nèi)容拷入入這個(gè)文文件夾，把把lefft5這這個(gè)文件件夾拷入入“xinngchhengg”文件夾夾中，并并把leeft55改名為為“guoocheeng”。主要要操作作：在FronntPaage中中打開“xinngchhengg”這個(gè)站站點(diǎn)。打開inddex..htmml，編輯首頁頁。打開guoocheeng\\inddex..htmml，編編輯過程程子頁。在首頁的左左側(cè)導(dǎo)航航欄中，給給“過程”建立超超鏈接，指指向“guoocheeng\\inddex..htmml”。例5：利用用“20004校本本培訓(xùn)\\網(wǎng)頁模模板\藝藝術(shù)型\\03”這個(gè)模模板，做做一個(gè)班班級主頁頁的首頁頁面。準(zhǔn)備：把“03”這個(gè)文文件夾拷拷入“E：\\網(wǎng)頁課課件”中用FronntPaage打打開033這個(gè)站站點(diǎn)。編輯首頁文文件。主要操作：：1、修改導(dǎo)導(dǎo)航欄文文字。2、再插入入一個(gè)“2行11列”的表格格，第11行插入入首面圖圖片，第第2行輸輸入版權(quán)權(quán)信息，并并設(shè)置一一個(gè)背景景圖片。3、從上到到下，把把所有表表格統(tǒng)一一為：7760象象素寬、居居中。三、利用整整站系統(tǒng)統(tǒng)（靜態(tài)態(tài)的）例6：把“20004校本本培訓(xùn)\\源碼\\整站\\少爺?shù)牡募摇闭麄€(gè)文文件夾拷拷到“E:\\網(wǎng)頁課課件”文件夾夾中。用FronntPaage打開各各個(gè)頁面面進(jìn)行修修改。注：網(wǎng)頁漂漂亮精致致的界面面，大多多是由圖圖片組成成的，所所以網(wǎng)頁頁制作中中美工是是很重要要的。如如本站中中，各欄欄目按鈕鈕都是圖圖片，要要修改欄欄目的文文字，必必須使用用圖片編編輯軟件件。附：網(wǎng)頁制制作推薦薦網(wǎng)站：：網(wǎng)頁制作大大寶庫：：htttp:://wwww..dabbaokku.ccom//全球商業(yè)網(wǎng)網(wǎng)站模板板中心：：htttp:://wwww..sittediiy.ccom//inddex..asppx信心網(wǎng)絡(luò)下下載：htttp:://m/asspdoown//inddex..asppx中國網(wǎng)頁設(shè)設(shè)計(jì)師聯(lián)聯(lián)盟：htttp:///wwww.cc-dww.coom/第五部分圖像處處理-----PPhottoShhop的的簡單使使用一、了解界界面PhotooShoop的各各種操作作命令分分布在以以下三個(gè)個(gè)地方：：1、各各個(gè)下拉拉菜單中中（以文文字體現(xiàn)現(xiàn)）。2、各各個(gè)面板板中（圖圖示+文文字）。3、快快捷菜單單（文字字）。其中的“面面板”用得最最多，最最常用的的面板有有：工具具、選項(xiàng)項(xiàng)、圖層層、歷史史記錄二、例解基基本操作作例1：改變變圖像的的大?。?）縮放放圖像命令：圖圖像\\圖像像大小彈出出如右圖圖的對話話框：輸入入你需要要的尺寸寸：如寬寬度為8000象素素，高度度會按比比例縮放放。若不想按比比例縮放放，只要要把前的的釣去掉掉，即可可。例2：裁剪剪圖像選擇“工具具”面板中中的“”，拖拖動鼠標(biāo)標(biāo)，框住住圖像中中你需要要的部分分，雙擊擊（或敲敲回車）完完成操作作。例3、利用用“選區(qū)”工具，選選取圖像像的某部部分。選區(qū)工具有有2組：：規(guī)則選選區(qū)（橢橢圓和矩矩形）、不不規(guī)則選選區(qū)（1）橢圓圓選區(qū)打開開“例3--1”，分別別做一個(gè)個(gè)羽化和和不羽化化的橢圓圓圖。效效果如下下：（22）磁性性套索打開“例33-2”，把圖圖像中間間橙黃色色部分取取下來，別別建一個(gè)個(gè)圖像，命命名為“橙色背背景圖”。套索的寬度度一般設(shè)設(shè)置為55-100個(gè)象素素。（11厘米為為28象象素）例4、把“橙色背背景圖”中的文文字去掉掉-----“橡皮圖圖章”的使用用。打開開“橙色背背景圖”。“橡皮圖章章”的使用用方法：：第一步步：取樣樣：按住住鍵盤上上的Allt鍵，同同時(shí)鼠標(biāo)標(biāo)點(diǎn)擊文文字附近近的圖像像；第二二步：拷拷貝：放放開Allt鍵，拖拖動鼠標(biāo)標(biāo)，在文文字處涂涂抹。反反復(fù)做這這2步操操作。例5：圖層層的基本本操作（1）修改改網(wǎng)頁中中的導(dǎo)航航按鈕。打開“例55-1..giff”，主要要操作如如下：執(zhí)行“圖像像/模式式/RGGB顏色色”，（ggif圖圖像為索索引顏色色，不能能含有層層）擦除導(dǎo)航條條中原有有的文字字。輸入新的文文字（每每輸入一一次文字字，就自自動產(chǎn)生生一個(gè)層層，這樣樣的層，稱稱為文字字層）拼合所有圖圖層，把把模式重重設(shè)為“索引顏顏色”，文件件另