「班级网页制作研习」.doc

「班級網頁製作研習」 ＊步驟說明 一、於個人電腦中建立網頁資料夾 1.於個人電腦→D槽(磁碟機)中新增資料夾(按滑鼠右鍵新增→選資料夾選項)→命名為「班級」web，例如：高一1班就取名為「高一1web」 2.於「班級」web資料夾中，新增資料夾→命名為「班級」，例如：高一1班就取名為「高一1」 3.於「班級」資料夾中，新增資料夾→命名為「img」，用以存放照片及圖片(大小限制為400*300) 二、修改照片及圖片大小 1.開啟PhotoImpact 2.「檔案」→「開啟….」，將要處理的照片及圖片，全部或分批開啟於PhotoImpact，可運用Ctrl及Shift選取多個檔案，按下開啟，如下圖： 3.於「視窗」→「批次管理員….」，批次處理多個檔案，如下圖： 4.類別選擇「格式」，指令選擇「影像大小」，然後按「全選」，再按「確定」，如下圖： 5.出現「影像大小調整」視窗，於「使用者自訂」選擇「像素」為單位，將寛度設為400，高度設為300，按確定(若無法修改為400*300，請將「等比例」選項取消勾選) 6.再次開啟「批次管理員….」，類別選擇「網路」，指令選擇「影像最佳化程式」，然後按「全選」，再按「確定」，如下圖： 7.出現「影像最佳化程式」視窗，於「模式」選擇「標準最佳化」，按另存新檔，將檔案依序存於「班級」web→「班級」→「img」資料夾中，如此圖片及照片處理已完成，如下圖： 三、班級網頁製作 1.開啟IE瀏覽器，於網址處輸入：，按Enter，選擇「web班級網頁」資料夾，將「研習用」資料夾按滑鼠右鍵，選「複製到資料夾」將「研習用」資料夾複製到桌面上 2.開啟桌面之「研習用」資料夾→網頁素材，從img01~11中選擇一個資料夾，將該資料夾內之圖檔全部複製到「班級」web→「班級」→img中 3.開啟桌面之「研習用」資料夾，將「■首頁.htm」檔案複製到「班級」web→「班級」中 4.開啟Microsoft FrontPage 5.「檔案」→「開啟舊檔」，開啟「班級」web→「班級」中之「■首頁.htm」，版面分配如下圖： 6.對著標題(welcome)X圖按滑鼠右鍵選擇「圖片內容」，在「一般」頁面→「圖片來源：」按下「瀏覽」按鈕，從「班級」web→「班級」→img中選取Welcome圖片，如下圖： 7.其他X圖可依上個步驟方式，依序置換為正確的圖案，完成後如下圖： 8.修改「網頁標題」及「背景圖」請於頁面上按滑鼠右鍵，選擇「網頁內容」項目，「一般」頁面下可修改「標題」，「背景」頁面→格式設定將「背景圖片」項目打勾，按下「瀏覽」按鈕，從「班級」web→「班級」→img中選取背景圖片，完成後如下圖： 9.mail圖示連結：對著mail圖示按右鍵選擇「超連結」項目，於「建立超連結」頁面→URL右方圖示中，按下mail圖示按鈕，輸入e-mail，按確定→確定即可，如下圖： 10.將其他文字作修改後，按下「檔案」→「儲存檔案」，將檔案儲存於「班級」web資料夾中 11.目前規劃6個單元，分別為：■首頁、親師聯絡簿、學生作品、榮譽榜、活動翦影及資源分享，目前■首頁已完成，其他網頁將依首頁版面作修改 12.親師聯絡簿網頁製作：將「welcome」標題圖案刪除(delete)，輸入文字：親師聯絡簿，反白文字，字型大小選取6(24pt)，加粗體，並更改文字顏色，刪除中間照片如下圖： 13.將左右兩邊之兩個儲存格合併，並於合併後之儲存格處按滑鼠右鍵，選擇儲存格內容 14.於「儲存格內容」頁面中，將「指定寬度」選擇「依百分比」，數字改為「6」，另一邊依此方式將「指定寬度」設定為「6」如下圖：而中間部分設定為「88」，「垂直對齊方式」設定為「靠上」 15.插入表格：於中間之儲存格插入表格，從「表格」→插入→表格，出現「插入表格」頁面，將欄設定為「1」，按確定，如下圖： 16.插入圖片：本例要在表格之第一個儲存格中插入一個項目圖示，在要插入圖片處點一下滑鼠左鍵，從「插入」→圖片→從檔案…於「班級」web→「班級」→img中選取項目圖片，如下圖： 17.依序輸入聯絡事項及輸入日期，下次若需增加項目，可點選第一個儲存格，從「表格」→插入→列或欄，選擇「列」，位置選擇「選項上方」，即可於上方新增一列，項目圖示則用複製方式複製於新增列中如下圖： 18.最重要的事情─另存新檔，從「檔案」→另存新檔，將名稱改為「親師聯絡簿.htm」，按「儲存」。其他網頁也是依照上述方法修改而成，並分別儲存為「學生作品.htm」、「榮譽榜.htm」、「活動翦影.htm」及「資源分享.htm」，當然，這些單元名稱不一定要如此命名，單元項目可依需要增加或減少 19.連結：以製作「資源分享.htm」為例，如下圖，若要新增Yahoo奇摩的連結，首先將Yahoo奇摩反白，對著反白