网页安全色.PPT

第2章 網站設計要領 頁面內容佈局 網頁配色概念 網頁安全色 常用網頁影像格式 頁面內容佈局(1) 將導覽按鈕置於左方的頁面佈局 頁面內容佈局(2) 將導覽按鈕置於上方的頁面佈局 頁面內容佈局(3) 應用Flash技術做商品動態展示的頁面 頁面內容佈局(4) 不同商品分類擺設的購物網站 網頁配色概念(1) 冷色系的看起來就非常具有專業的風格 網頁配色概念(2) 暖色系帶給人較為溫馨的感覺 網頁配色概念(3) 顏色對比強烈的配色會帶給人較有活力的感覺 網頁配色概念(4) 配色的過程中，也請注意「網頁配色」與「頁面佈局」的一致性，因為配色只是一種輔助及參考，以「專業」特質為配色效果來看，多多少少要隨著不同的頁面佈局而針對配色效果中的某個顏色來加以修正，如果執著於書籍中的配色方式，有可能會得到反效果也說不定。 所以在配色時要和調整頁面佈局的步驟一起進行，如此才可使得頁面效果更盡善盡美。 網頁安全色 使用於頁面上的顏色值是採用16進位的方式，也就是顏色值範圍會從RGB模式中的(0到255)變為(00到FF)。 以紅色為例，在美工軟體中的顏色值為（255,0,0），不過這是10進位，改成16進位後會變成是（#FF0000）。 圖中就是216色的色票及其顏色值，不過印刷效果多少會螢幕上的顯示結果有點出入，所以還是要以瀏覽器上的顯示結束為主，而這個色票就做為設計時的參考。 JPG JPG格式的影像還支援到全彩的顏色，也因為影像中所能呈現的色彩非豐富，所以只要是屬於風景、人物等需要豐富色彩的網頁影像都是JPG格式。 色彩豐富的全彩JPG影像 GIF(1) 能產生動畫效果是GIF影像的特質之一，它可以在一個檔案之中包含多張影像，然後利用連續的重覆顯示以達到動畫的效果。 GIF格式還有一項JPG所沒有的特性：透明效果，在GIF格式的影像中可以將檔案中的特定的顏色調整為透明，讓GIF影像能夠與網頁的背景完美的融合在一起，也因此雖然GIF格式只有256色，但憑著動畫及透明效果也能在網頁影像中佔有一席之地。 GIF(2) 只有256色的GIF影像 PNG(1) 第一、它也是一種影像壓縮格式，不過它採用的是非破壞性壓縮，所以壓縮之後的檔案容量會比JPG大。 第二、PNG格式也具有全彩顏色的特點，因此使用於像風景之類等需要豐富色彩的圖片也沒有問題。最後它還支援和GIF格式相同的透明效果，可說是除了動畫效果以外幾乎全包含了。 PNG(2) PNG格式也是具有全彩效果 * * * * 2-1 頁面內容佈局 .tw/ 2-1 頁面內容佈局 @圖 .tw 2-1 頁面內容佈局 .tw/movies/lust_caution/main.html 2-1 頁面內容佈局 .tw 2-2 網頁配色概念 / 2-2 網頁配色概念 .tw/ 2-2 網頁配色概念 .tw/ 2-2 網頁配色概念 2-3 網頁安全色 2-3 網頁安全色 2-3 網頁安全色 2-4 常用網頁影像格式 2-4 常用網頁影像格式 2-4 常用網頁影像格式 2-4 常用網頁影像格式 * *