选择背景材质.PPT

快速製作網頁 本章提要 18-1 建立網頁 18-2 製作網頁背景 18-3 加入 HTML 文字物件 18-4 儲存網頁 18-5 製作影像地圖 18-6 製作網頁相簿 以 PhotoImpact 製作的網頁 18-1 建立網頁 開新網頁 Web 內容 開新網頁 請執行『檔案/開新檔案/開新網頁』命令, 開啟開新網頁交談窗。 開新網頁 版面設定區：設定標題及編碼方式。 開新網頁 頁面大小區：可在此區設定網頁大小。 開新網頁 建立背景區：勾選建立背景可選擇背景為色彩或是影像。 選擇背景材質 開啟 Web 背景影像交談窗後, 可以從預設材質中, 選擇自己喜愛的材質當背景, 或是使用背景設計師自行對內建材質做編修, 也可以用現成圖片來當背景。 Web 內容 完成開新網頁設定後, 接著我們要宣告網頁的標題、作者、關鍵字...等相關資訊。請按下開新網頁交談窗中的細節鈕, 開啟 Web 內容交談窗。 Web 內容 Web 內容 標題：顯示在瀏覽器標題列左上角之標題文字。 作者：不填寫此欄位不影響網頁各項功能, 只是做為辨識用的資訊。 關鍵字：輸入與網頁內容相關的文字, 這樣其他人才能藉由搜尋引擎找到該網頁 (關鍵字與關鍵字間, 請以逗號做分隔)。 Web 內容 描述：敘述網頁的內容, 同樣是辨識用的資訊, 通常都只是作者記錄給自己看的訊息, 以方便日後修改。 「我的最愛」圖示：選擇一個具有代表性的圖示, 當其他瀏覽者將你的網頁加入到我的最愛時, 可在我的最愛中看到此代表性的圖示 (此功能只適用於 Internet Explorer)。 Web 內容 編碼：讓瀏覽器能夠顯示網頁的正確語系, 若您製作的網頁是中文, 那麼就要選擇繁體中文 (Big5), 否則網頁中可能會出現亂碼。 18-2 製作網頁背景 百寶箱中的網頁背景 背景設計師 個人化背景 DIY 百寶箱中的網頁背景 執行『工作區/面板/百寶箱』命令, 可以由填充圖庫中取得背景材質來使用。 百寶箱中的網頁背景 這樣就完成材質取得了, 接下來你只要將這張圖片儲存起來, 就能夠直接應用到網頁中做背景, 瀏覽器會自動將這個背景方塊並排, 填滿整個網頁, 而且並排交接處不會有接縫, 使用內建材質就是有這樣的好處。 華麗眩目的材質混合 填充圖庫中的材質混合項目, 裡面的材質也很適合拿來做為網頁背景, 不過材質混合項目內的縮圖無法直接拉曳出來成為圖片, 您必須先按下開新影像鈕建立出一張新圖片 (尺寸不用太大, 約 160 × 120 像素或 320 × 200 像素即可), 再將材質拉曳入新圖片中。 華麗眩目的材質混合 華麗眩目的材質混合 淡化背景 在選擇背景的同時, 必須注意到網頁背景圖片最好不要太花俏, 以免造成頁面文字閱讀的困難, 若堅持背景要用複雜圖片, 那麼就將整張基底影像轉成物件 (取消勾選保留基底影像), 然後調整物件的透明度, 把圖片淡化到可以突顯網頁內容的程度即可。 淡化背景 背景設計師 針對內建的背景材質, 若仍有需要改變的地方, 可使用 PhotoImpact 所提供的背景設計師直接修改內建的圖片。請執行『網路/背景設計師』命令來開啟： 背景設計師 背景設計師 A.產生影像方式：選擇產生新的並排方塊, 會建立一個獨立的圖檔。套用至影像項目, 是對開啟的圖片做更改, 所以必須在有開啟圖片的情況下, 才可勾選此項。 B.方格大小：設定圖片尺寸大小。 C.模式：選擇圖片類型。 D.背景類型：改變圖片類型的花紋。 E.調色盤：調整圖片顏色。 F.屬性：調整各項屬性值。 個人化背景 DIY 在使用自己準備的圖片製作背景時, 必須注意到, 除非圖片經過準確的安排製作, 否則接縫問題是難以避免的。 個人化背景 DIY 請先執行『檔案/開啟舊檔』命令, 開啟自己準備的照片 (練習檔 18-01.jpg), 並使用工具面板內的標準選取工具在圖片中拉曳出一個選取區。 個人化背景 DIY 執行『網路/建立無接縫並排影像』命令, 於交談窗中調整影像合併參數。 個人化背景 DIY 按下預覽鈕, 可預覽調整參數後的圖片合併情形, 預覽中按下滑鼠左鈕可停止預覽, 按下確定鈕後儲存就可以拿來做為背景了。 影像位移 有時候您可能覺得網頁背景的並排效果太過死板, 這時可以利用影像位移功能, 將影像中的物件變更位置, 使背景看起來更為自然。 影像位移 請開啟一個新的網頁, 選擇練習檔 18-02.jpg 做為背景, 並按下確定鈕。 影像位移 執行『網路/影像位移』命令開啟影像位移交談窗, 在預覽視窗中, 拉曳圖片到左上角的位置後, 按下確定鈕完成位移。 影像位移 影像位移 最後執行『檔案/儲存 Web/存成 HTML』 命令, 儲存完畢後開啟存檔的網頁。 18-3 加入 HTML 文字物件 在 P