高雄市立右昌國中(教學網頁設計研習補充教材)word檔下載

  網頁是由很多文字、圖形檔、音樂檔..等所組合而成,當瀏覽網頁時會將所有使用到的文字及圖形檔案依序顯示,這些檔案是個別存在的,不像Word全包在一個副檔名為doc的檔案,下圖是一個完整的網頁所包含的檔案及其使用到的資料。

 

檔案範例清單:

網頁原始檔:index.htm

音樂檔:say_yes.mid

圖形檔:

c01.gif

c02.gif

c03.gif

c04.gif

  :

背景圖:

b01.gif b02.gif

 

圖形檔:w01.gif

網頁原始檔index.htm內容如圖:

   w02.gif      w03.gif      w04.gif

  

網頁設計操作流程:(看範例)

一、執行檔案總管並且在D碟建立名為yc0___的資料夾(選D:->檔案->新增->資料夾)

二、拷貝J碟網頁範例檔案至D碟的yc0___資料夾(挑選檔案->複製->選目的地->貼上)

三、執行Namo後依序由左至右(Enter按行)由上往下放入圖片及文字。

四、網頁的美化方式與Word相似,完成後存yc0___資料夾,檔名index.htm。

五、按登出或開機時輸入帳號yc0___,密碼為身份證字號前6碼及群組ycth。

六、將D碟yc0___資料夾的所有檔案拷貝至網路上的芳鄰->整個網路-> ycth -> ycteacher -> yc0___資料夾。

七、執行瀏覽器IE輸入網址:163.18.135.6/ycth/yc0___,即可看到您的網頁。

左右頁框的網頁設計流程:(看範例)

一、用檔案總管將上個作業的index.htm檔名改為home.htm。

二、執行Namo後選頁框功能表->建新頁框組->選內容和本文。

三、選左側頁框輸入選單文字(如下圖)

四、選右側頁框->選頁框功能表->開啟頁框中的文件->選檔案home.htm。

五、依序設定選取左側頁框選單文字建立超連結,目標頁框選detail。

六、選全部儲存->輸入檔名left.htm->輸入首頁檔名index.htm。

七、將D碟資料夾的所有檔案拷貝至網站,執行瀏覽器IE查看網頁。

 

 

 

 

檔案清單及內容:

範例網頁架構圖:

 

作業:

 

 

 

教材設計:黃源弘