网站制作24938.ppt

05 網頁圖片 修改圖片屬性 大小 來源 超連結 文繞圖 替代文字 間距 外框 編輯圖片 05 網頁圖片 製作影像地圖 建立連結區域 修改與刪除 ex05 網頁圖片 開啟 mustknow.htm 插入圖片 ex04.jpg 修改屬性：圖靠右、上下間距 6 開啟 links.htm 製作圓形影像的 hot area 練習調整、修改及刪除 06 超連結 文字超連結 a href=“people.htm”人物/a 預設值 用頁面屬性更改顏色 利用 CSS 變換超連結文字狀態 a:link a:hover a:active a:visited 06 超連結 圖片超連結 **把邊框設為0，就不有藍框了 變換影像的特效 (Rollover) 行為面板 javascript 06 超連結 使用錨點 用於頁面過長，避免不斷捲動頁面 設定錨點 a name=“judge01”人物/a 設定連結 a href=“#judge01”人物/a**加入回到原點的連結 06 超連結 設定外部連結 外部連結 開啟在新視窗：目標設為_blank 設定Email連結: mailto:who@ 檔案下載的連結 **最好能標示檔案類型及大小 ex06 超連結 開啟 links.htm 製作超連結 利用CSS更改連結顏色樣式 開啟 ex00.psd 製作文字特效 選取並輸出為網頁影像 開啟 top.htm 製作 Rollover 的特效 製作圖形連結至各相關網頁 開啟 mustknow.htm 在上方的導覽列及各標題前加錨點 在導覽列製作錨點超連結 在各區塊製作回上方的連結07 多媒體 Flash動畫 插入Flash (.swf) 設定屬性 Flash 按鈕 Flash文字 Flash Video (.flv) 07 多媒體 視訊及聲音 外掛程式 (activeX, plugin) 常見種類： Windows media (.wmv .wma) Real Media (.ra .rm .rmvb) QuickTime (.mov) 07 多媒體 視訊及聲音 下載 (漸進式) vs. 串流 內嵌或外部開啟 07 多媒體 視訊及聲音 Code 非內建 屬性 參數 Real media /resources/samples/embedded.html Windows media /kb/285154 ex07 多媒體 開啟 mustknow.htm 插入一Flash按鈕「回上方」並連結至 #top 開啟 links.htm 插入音樂sample.wav 設定屬性 75x40 * 網站製作與整合 《世新大學 多媒體工作坊》 田美雲 01/30/2007 授課大綱 part1 網站建置的基本 Dreamweaver 2004 的基本操作 建置網站 文字 CSS 圖片 超連結 多媒體 00 網站建置的基本流程 確認主題 功能 設計網頁版面 準備內容元件 進行實作 維護更新 需求評估 規劃內容架構 測試上傳 00 個人網站的製作 規劃網站的內容及功能 傳達資訊 交流分享 展示作品、興趣 … 幾米的官方網站 /default.aspx 00 個人網站的製作 草擬網站架構 結構草圖 00 個人網站的製作 製作平面草圖 00 個人網站的製作 製作 wireframe 版本 可用作初步的測試與修正 00 個人網站的製作 製作圖形介面 設計：Photoshop, Illustrator… 裁切：ImageReady, Firework… 00 個人網站的製作 準備內容及元件 文字、影像、動畫、聲音、視訊… 適用格式 顯示大小或時間長短 檔案大小 Text 文字 圖片 聲音 影像 動畫 ex00 練習圖像切割 用 ImageReady 開啟 ex00 資料夾中的ex00.psd 將 ex00.psd 作適當的裁切 將影像輸出成網頁 top.htm 01 認識DW工作環境 工作區介紹 功能表 插入列 切換網頁編輯模式 編輯區 狀態列 屬性面板 其他功能面板 01 認識DW工作環境 面版操作 偏好設定 一般設定 狀態列：可以模擬下載速度 ex01 認識DW工作環境 啟動 Dreamweaver MX 2004 探索一下 DW 的工作區及各項面板 02 建立網站 在硬碟新增一專案資料夾 元件素材 文件資訊 網頁 在 DW 定義網站 設定網站資料夾 修改網站設定 02 建立網站 網頁的新增： 以網站架構圖為藍圖 新增網頁 新增資料夾：較複雜層次較多的大型網站，可以以資料夾分類 02 建立網站 網頁的儲存與編輯 首頁的命名 index.htm, default.htm, index.asp,