9搭建web課件的網(wǎng)站.ppt

1、1,第9講 課件制作部分搭建web課件的網(wǎng)站,2,創(chuàng)建站點、文件夾 創(chuàng)建站點中的首頁及其他網(wǎng)頁 從首頁開始設(shè)置超鏈接，建立網(wǎng)頁間的聯(lián)系 4. 測試站點,本講主要內(nèi)容,3,創(chuàng)建網(wǎng)站的一般過程,制作web課件的過程，即為創(chuàng)建網(wǎng)站的過程 創(chuàng)建站點、文件夾 創(chuàng)建站點中的首頁及其他網(wǎng)頁 從首頁開始設(shè)置超鏈接，建立網(wǎng)頁間的聯(lián)系 測試站點 發(fā)布站點,4,一、規(guī)劃站點,規(guī)劃目錄結(jié)構(gòu)和鏈接結(jié)構(gòu)，兩者共同構(gòu)成網(wǎng)站“骨架”。,示例：某單位站點的部分欄目,根據(jù)站點欄目,設(shè)置站點目錄,站點的鏈接結(jié)構(gòu),5,網(wǎng)站欄目結(jié)構(gòu)示例,6,站點目錄結(jié)構(gòu),（1） 根據(jù)欄目建立子目錄 （2）為每個欄目建立獨立的圖片目錄 如 img （3

2、）采用正確的命名方式 小寫英文字符、下劃線,xdjs,Index.htm,zhuren,jgsz,gwzz,English,jszx,wlzx,djzx,圖 網(wǎng)站目錄結(jié)構(gòu),7,站點目錄實例,8,站點鏈接結(jié)構(gòu),樹狀結(jié)構(gòu)：以主頁作為網(wǎng)站的“主干”，首頁鏈接指向一級頁面，一級頁面鏈接指向二級頁面。 星狀結(jié)構(gòu)：每個網(wǎng)頁相互之間相互鏈接。瀏覽方便，瀏覽者可以隨時到達其他頁面。 主頁一般采用：分層的樹狀結(jié)構(gòu)與熱點鏈接。,首頁面index.htm設(shè)置的鏈接,9,二、創(chuàng)建站點及站點管理,Dreamweaver 站點由3個部分（或文件夾）組成，具體取決于開發(fā)環(huán)境和所開發(fā)的 Web 站點類型： （1）本地根文件夾

3、存儲用戶正在設(shè)計和處理的文件。 （2）遠程文件夾存儲用于測試、生產(chǎn)和協(xié)作等用途的文件。 （3）測試服務(wù)器文件夾。Dreamweaver 在其中處理動態(tài)頁的文件夾。 目前僅需考慮本地根文件夾,10,新建站點對話框,11,“古代漢語web課件”站點結(jié)構(gòu),12,在站點中創(chuàng)建文件夾、創(chuàng)建主頁,分別創(chuàng)建web課件欄目對應的文件夾，圖片文件夾等 創(chuàng)建站點主頁（首頁） 設(shè)置主頁的文字顏色，背景顏色、鏈接顏色等。 修改頁面屬性,13,創(chuàng)建其他頁面,創(chuàng)建站點首頁中相關(guān)欄目對應的頁面,14,創(chuàng)建頁面間的超鏈接,以主頁為例，創(chuàng)建到其他頁面的超鏈接。 如果每個頁面都要設(shè)置一遍鏈接，將非常麻煩。 簡化的方法一： 統(tǒng)一設(shè)

4、置風格一致的導航條，并將文字超鏈接按照“根目錄相對關(guān)系”設(shè)置。,/index.htm,/intro/intro_index.htm,15,超鏈接的語法, 課件簡介 超鏈接的目標頁面將在哪里顯示 新窗口 父窗口 當前窗口 頂層窗口,16,理解絕對路徑和相對路徑,絕對路徑： 相對路徑： 以文件自己為參照 以站點根目錄為參照 為站點主頁中文字“課件簡介”設(shè)置超鏈接 以下兩種方式均正確,intro/intro_index.htm,/intro/intro_index.htm,17,測試站點,F12 文件在瀏覽器中預覽 測試站點中文字、圖片是否正常顯示，超鏈接是否正常 死鏈接：目標地址不存在 錯鏈接：目標地址不正確,18,其他,標記間的嵌套關(guān)系 所有單標記內(nèi)均不可內(nèi)嵌其他元素。哪些是單標記？ 根據(jù)標記的意義，可以猜測出標記是否可以嵌套其他元素。 轉(zhuǎn)義自符的使用 等顯示在瀏覽器中分別表示為空格、&、符號。,19,小結(jié),創(chuàng)建站點、文件夾 創(chuàng)建站點中的首頁及其他網(wǎng)頁 從首頁開始設(shè)置超鏈接，建立網(wǎng)