网页制作教学讲义.doc

Namowebeditor 網頁製作教學講義 蔡承憲教師生活照片(最多6個)v 一、架構圖我的家庭聚會照片自 傳家人介紹首頁芸的家兄 弟生活花絮姊 妹我的爸爸爸爸我的榮譽好站報報v 二、建立專屬網站(先於C槽新建一個資料夾，螢幕解析度設為800*600)1. 開啟Namo【檔案】【專案】【網站精靈】2. 在網站模版中選擇【班級首頁】【下一步】3. 輸入網站名稱、電子郵件以及著作權資訊 【下一步】4. 選擇佈景主題(可點【檢視佈景主題】放大預覽) 【下一步】5. 【瀏覽】(選擇一開始建立的資料夾) 完成v 三、開啟檔案1. 【檔案】【專案】【開啟專案】點選Namo檔【開啟】2. 出現網站管理員視窗3. 可從網站管理員的【結構】標籤中，用滑鼠拖曳移動檔案的連結位置，點選檔案按下滑鼠右鍵選擇【內容】改變檔案的標題4. 選擇要編輯的網頁並點滑鼠兩下進入編輯v 四、利用按鈕精靈修改按鈕(主標題與按鈕列) 如要還原，需依同樣的步驟改回(有些情況無法改回) 如果新增的檔案要套用相同的布景主題，請將網站的架構設計好再一起改變文字格式(否則全部都會被改回成原始的字型)1. 在主標題上點滑鼠兩下修改主標題內容【修改影像】2. 【修改影像形狀】選取主標題【下一步】點選想要的圖案【下一步】3. 可編輯文字的內容、字型、大小、顏色(填充)以及圖案的大小等4. 【下一步】【確定】【確定】v 五、儲存檔案1. 【檔案】【儲存檔案】2. 【檔案】【專案】【儲存專案】v 六、開啟新檔1. 在網站管理員的視窗中點選【檔案】【新建】【新文件】2. 輸入適當的名稱後，直接點滑鼠兩下進入編輯v 七、選擇佈景主題套用至新檔案1. 【格式】【變更佈景主題】【是】【是】2. 選擇想要套用的佈景主題(只能先套用背景，主標題與按鈕列必須手動加入) 【套用】3. 點選現行的檔案【確定】4. 插入一欄一列的表格5. 【插入】【佈景主題元件】【主標題】(利用按鈕精靈修改主標題)6. 選取表格【表格】【表格內容】選擇框線隱藏【確定】v 八、新增文件至導覽樹1. 到網站管理員的【結構】標籤中，點選要加入新文件的檔案2. 按滑鼠右鍵點選新增至導覽樹插入既有的文件3. 選取檔案【確定】v 九、從導覽樹中移除文件1. 到網站管理員的【結構】標籤中，點選要移除的檔案2. 按滑鼠右鍵點選從導覽樹移除v 十、在專案中刪除檔案1. 到網站管理員的【專案】標籤中點選要刪除的檔案(可按右鍵查看檔案內容)2. 【檔案】【刪除】【是】v 新增水平子項按鈕(要連結至新增的網頁)從導覽樹增加後於母網頁建立一欄一列的表格插入佈景主題元件 導覽列選擇子項、水平、使用按鈕確定若母網頁原本已有其他水平子項按鈕即直接從導覽樹增加即可v 加入新網頁的垂直與水平導覽列(要連結回母網頁)垂直：插入佈景主題元件導覽列選擇第一層、包括首頁、垂直、使用按鈕確定水平：建立一欄一列的表格插入佈景主題元件導覽列選擇水平層級、水平、使用按鈕確定 下方水平：插入佈景主題元件導覽列選擇第一層、包括首頁、水平、使用文字確定v 十一、更改背景顏色或圖案1. 【格式】【文件內容】點外觀標籤2. 在色彩的項目下修改背景的顏色(此時背景影像選項的內容必須清空才能顯現出所修改後的背景顏色)3. 或在背景影像按下瀏覽選擇喜歡的背景圖案【開啟】【確定】v 十二、加入背景音樂1. 【格式】【文件內容】點樣式標籤2. 在背景聲音按下瀏覽選擇wav或midi聲音檔3. 選擇重複次數即可v 十三、新增文字與設定文字格式1. 可直接輸入文字2. 利用滑鼠將文字反白【格式】【字型】選擇字型、顏色、大小v 十四、新增影像1. 可直接在圖像框點兩下，於影像路徑中瀏覽所要的圖片2. 或點【插入】【影像】【從檔案】於影像路徑中瀏覽所要的圖片3. 背景透明化：點選圖片【插入】【影像】【設定透明顏色】點工具列上的設定透明的顏色用滑鼠點影像的白色背景確定v 十五、建立文字或圖片的超連結1. 將文字反白或直接在圖片上按滑鼠右鍵2. 選擇超連結3. 在URL瀏覽要連結的網頁4. 選擇目標頁框的種類【確定】v 十六、走馬燈1. 點工具列上的圖示插入小區塊2. 在小區塊中輸入文字3. 在小區塊的控制點上按滑鼠兩下，出現小區塊內容對話框4. 【Scrip精靈】【走馬燈】【下一步】5. 點按捲動方向(靠左)、可見長度(填滿到小區塊) 【完成】v 十七、時鐘1. 建立三欄一列的表格2. 在第一格與第三格中輸入文字後，將插入點移入第二格3. 【插入】【Scrip】【Scrip精靈】【時鐘】【下一步】4. 選擇喜愛的格式【完成】5. 調整及隱藏表格格線v 十八、發佈專案1. 到網站管理員按下【工具】【網站設定值】【新增】2. 填入網站名稱、主機、目錄(填入/)、使用者名稱(