情境1書法家莊輝個人網(wǎng)站模板效果圖的設計與制作

1、地址:北京百萬莊大街22號 郵編:100037 編輯熱線: (010) 88379739地址:北京百萬莊大街22號 郵編:100037 編輯熱線: (010) 8837973922 :100037 : (010) 88379739情境情境1：書法家莊輝個人網(wǎng)站模板效果圖的設計與制作：書法家莊輝個人網(wǎng)站模板效果圖的設計與制作 第四章第四章 網(wǎng)站的色彩與布局網(wǎng)站的色彩與布局 22 :100037 : (010) 88379739項目展示與項目目標項目展示與項目目標1項目展示與項目目標項目展示與項目目標 22 :100037 : (010) 88379739色彩的基本理論: RGB顏色 網(wǎng)頁顏色主要

2、有網(wǎng)頁顏色主要有3種基本顏色組成的，他們是紅（種基本顏色組成的，他們是紅（Red）、綠（）、綠（Green）、）、藍（藍（Blue），其他的顏色是由這），其他的顏色是由這3種顏色調和而成的。種顏色調和而成的。例如，黃例如，黃=紅紅+綠，紫色綠，紫色=紅紅+藍，白色藍，白色=紅紅+綠綠+藍藍用用3個十六進制數(shù)來表示紅、綠、藍個十六進制數(shù)來表示紅、綠、藍3種顏色的含量，組成一個種顏色的含量，組成一個6位的十六位的十六進制數(shù)，就是進制數(shù)，就是RGB顏色。顏色。例如，紅色為例如，紅色為FF0000，綠色為，綠色為00FF00，黃色為，黃色為FFFF00，白色為，白色為FFFFFF。 關鍵知識點一：色彩

3、的基本理論關鍵知識點一：色彩的基本理論 2. 項目資訊項目資訊22 :100037 : (010) 88379739色彩的基本理論: 色環(huán) 紅 橙 黃 綠 青 藍 紫 紅 2. 項目資訊項目資訊關鍵知識點一：色彩的基本理論關鍵知識點一：色彩的基本理論 22 :100037 : (010) 88379739色彩的基本理論: 顏色的三要素 色相：即是顏色的相貌稱謂，如紅色、橙色、黃色、綠色等。色相：即是顏色的相貌稱謂，如紅色、橙色、黃色、綠色等。純度：也稱飽和度。彩度，是指顏色的鮮艷程度，即顏色的色素含量。如純度：也稱飽和度。彩度，是指顏色的鮮艷程度，即顏色的色素含量。如果純度高，則色彩艷麗，否則

4、顏色淡灰。正紅色、正黃色、正藍色等都是純度果純度高，則色彩艷麗，否則顏色淡灰。正紅色、正黃色、正藍色等都是純度極高的顏色，而灰色則是純度最低的顏色。極高的顏色，而灰色則是純度最低的顏色。明度：也稱亮度，是顏色的明暗程度，是各色相中白色的含量。白色是明明度：也稱亮度，是顏色的明暗程度，是各色相中白色的含量。白色是明度最高的色調，白色的明度為度最高的色調，白色的明度為100%，黑色的明度為，黑色的明度為0%。 關鍵知識點一：色彩的基本理論關鍵知識點一：色彩的基本理論 2. 項目資訊項目資訊22 :100037 : (010) 88379739顏色代表的含義顏色代表的含義 l紅色紅色是一種對視覺器官

5、產(chǎn)生強烈刺激的顏色，在視覺上容易引起注意，在心理上容易引起情緒高昂，能使人產(chǎn)生沖動，憤怒，熱情，活力的感覺。紅色的具體表現(xiàn)是：火、血、心、蘋果、夕陽、婚禮、春節(jié)等。紅色的抽象表現(xiàn)是：熱烈、喜慶、危險、革命、女性等。 l橙色橙色 橙色也是一種對視覺器官產(chǎn)生強烈刺激的一種顏色，由紅色褐黃色組成，比紅色多些明亮的感覺，容易引起注意。橙色的具體表現(xiàn)是：橙子、柿子、桔子、橘子、秋葉、磚頭、面包等。橙色的抽象表現(xiàn)是：快樂、溫情、積極、活力、歡欣，熱烈，溫馨，時尚、食欲等。 l黃色黃色 黃色也是一種對視覺產(chǎn)生明顯刺激的顏色，容易引起注意。黃色的具體表現(xiàn)是：香蕉、檸檬、黃金、蛋黃、帝王等。黃色的抽象表現(xiàn)是：光

6、明、快樂、豪華、注意、活力、色情、快樂，希望，智慧等。 2. 項目資訊項目資訊22 :100037 : (010) 88379739顏色代表的含義顏色代表的含義 l綠色綠色 綠色是對視覺器官的溫和，所以一般人都知道眼睛疲勞的時候，看著綠色有調節(jié)和恢復的作用，介于冷暖兩中色彩的中間，顯得和睦，寧靜，健康，安全的感覺。 它和金黃，淡白搭配，可以產(chǎn)生優(yōu)雅，舒適的氣氛。綠色的具體表現(xiàn)是：草、植物、竹子、森林、公園、地球、安全信號等。綠色的抽象表現(xiàn)是：新鮮、春天、有生命力、和平、安全、年輕、清爽、環(huán)保。 l藍色藍色藍色是對視覺器官的刺激較弱，在光線不足的情況下不易辨認，具有緩和情緒的作用。所以情緒的波動

7、時，看著藍天和海洋，可以讓人心情平靜，它和白色混合，能體現(xiàn)柔順，淡雅，浪漫的氣氛。藍色的具體表現(xiàn)是：水、海洋、天空、游泳。藍色的抽象表現(xiàn)是：穩(wěn)重、理智、高科技、清爽、涼快、自由等。 2. 項目資訊項目資訊22 :100037 : (010) 88379739顏色代表的含義顏色代表的含義 l紫色紫色 紫色由藍色和紅色組成，對視覺器官的刺激正好綜合強弱，形成中性色彩。紫色的具體表現(xiàn)是：葡萄、茄子、紫菜、紫羅蘭、紫丁香等。紫色的抽象表現(xiàn)是：神秘、優(yōu)雅、女性化、浪漫、憂郁等。 l褐色褐色 褐色是橙色中加入了一定比例的藍色或黑色所形成的暗色，對視覺器官刺激較弱。褐色是橙色中加入了一定比例的藍色或黑色所形

8、成的暗色，對視覺器官刺激較弱。褐色的具體表現(xiàn)是：麻布、樹干、木材、皮革、咖啡、茶葉等。褐色的具體表現(xiàn)是：麻布、樹干、木材、皮革、咖啡、茶葉等。褐色的抽象表現(xiàn)是：原始、古老、古典、穩(wěn)重、男性化等。褐色的抽象表現(xiàn)是：原始、古老、古典、穩(wěn)重、男性化等。 2. 項目資訊項目資訊22 :100037 : (010) 88379739l白色白色 白色的自然日光是由多種有色光組成的，白色是光明的顏色。白色的具體表現(xiàn)是：光，白天、白云、雪、兔子、棉花、護士、新娘等。白色的抽象表現(xiàn)是：純潔、干凈、善良、空白、光明、寒冷等。 黑色黑色 黑色對視覺器官的刺激最弱。黑色對視覺器官的刺激最弱。黑色的具體表現(xiàn)是：夜晚、頭

9、發(fā)、木炭、墨、煤等。黑色的具體表現(xiàn)是：夜晚、頭發(fā)、木炭、墨、煤等。黑色的抽象表現(xiàn)是：罪惡、污點、黑暗、恐怖、神秘、穩(wěn)重、科技、高貴、不安全、黑色的抽象表現(xiàn)是：罪惡、污點、黑暗、恐怖、神秘、穩(wěn)重、科技、高貴、不安全、 深沉，神秘，寂靜，悲哀，壓抑等。深沉，神秘，寂靜，悲哀，壓抑等。 l灰色灰色灰色是白色與黑色的組成，對視覺器官刺激微弱?；疑木唧w表現(xiàn)是：金屬、水泥、砂石、陰天、烏云、老鼠等。灰色的抽象表現(xiàn)是：柔和、科技、年老、沉悶、暗淡、空虛、中性、缺乏生命力、中庸、平凡、溫和、謙讓、中立和高雅的感覺。 2. 項目資訊項目資訊關鍵知識點一：色彩的基本理論關鍵知識點一：色彩的基本理論 22 :10

10、0037 : (010) 883797392. 項目資訊項目資訊關鍵知識點二：網(wǎng)頁配色的原則關鍵知識點二：網(wǎng)頁配色的原則 1）強調特色，個性鮮明）強調特色，個性鮮明 2）總體協(xié)調，局部對比）總體協(xié)調，局部對比 22 :100037 : (010) 883797392. 項目資訊項目資訊關鍵知識點二：網(wǎng)頁配色的原則關鍵知識點二：網(wǎng)頁配色的原則 3）遵循藝術規(guī)則，合理搭配）遵循藝術規(guī)則，合理搭配22 :100037 : (010) 883797392. 項目資訊項目資訊關鍵知識點三：網(wǎng)頁的配色方法關鍵知識點三：網(wǎng)頁的配色方法 1）底色與圖形要協(xié)調）底色與圖形要協(xié)調 使用暖色配色的網(wǎng)站 使用冷色配色

11、的網(wǎng)站 2）需要考慮整體色系）需要考慮整體色系22 :100037 : (010) 883797392. 項目資訊項目資訊關鍵知識點三：網(wǎng)頁的配色方法關鍵知識點三：網(wǎng)頁的配色方法 3）善用色彩的調和）善用色彩的調和 4）善用色彩的對比）善用色彩的對比 22 :100037 : (010) 883797392. 項目資訊項目資訊關鍵知識點四：網(wǎng)頁版式布局的要點關鍵知識點四：網(wǎng)頁版式布局的要點 1）實用功能）實用功能網(wǎng)頁內容的主次一定要從網(wǎng)頁的版式上體現(xiàn)出來，網(wǎng)頁設計要突出重點內容。網(wǎng)頁內容的主次一定要從網(wǎng)頁的版式上體現(xiàn)出來，網(wǎng)頁設計要突出重點內容。網(wǎng)頁的導航一定要清晰，這和網(wǎng)頁的版式設計有著非常

12、重要的聯(lián)系。網(wǎng)頁的導航一定要清晰，這和網(wǎng)頁的版式設計有著非常重要的聯(lián)系。網(wǎng)頁的版式布局設計決定了網(wǎng)頁的布局，布局合理和邏輯性也是網(wǎng)頁版式設網(wǎng)頁的版式布局設計決定了網(wǎng)頁的布局，布局合理和邏輯性也是網(wǎng)頁版式設計的要點。計的要點。2）審美功能）審美功能網(wǎng)頁的版式要具有整體性、一致性，總體來講就是統(tǒng)一。網(wǎng)頁的版式要具有整體性、一致性，總體來講就是統(tǒng)一。要合理地劃分整個頁面，安排頁面各組成元素，即分割。要合理地劃分整個頁面，安排頁面各組成元素，即分割。通過合理運用矛盾和沖突，使設計更加富有生機和活力，即對比。通過合理運用矛盾和沖突，使設計更加富有生機和活力，即對比。當然再次也要考慮是功能優(yōu)于形態(tài)？還是形

13、態(tài)優(yōu)于功能？當然再次也要考慮是功能優(yōu)于形態(tài)？還是形態(tài)優(yōu)于功能？22 :100037 : (010) 883797392. 項目資訊項目資訊關鍵知識點五：網(wǎng)頁布局類型的確定方法關鍵知識點五：網(wǎng)頁布局類型的確定方法 1）把內容放入自己喜歡的網(wǎng)頁類型中某科技有限公司網(wǎng)站某科技有限公司網(wǎng)站服務理念服務理念網(wǎng)站動畫網(wǎng)站動畫網(wǎng)站導航網(wǎng)站導航文檔搜索文檔搜索服務動態(tài)服務動態(tài)專家指導專家指導技術研討技術研討關愛社會關愛社會分類顯示分類顯示友情鏈接友情鏈接版權信息版權信息某企業(yè)網(wǎng)站的結構布局圖 22 :100037 : (010) 883797392. 項目資訊項目資訊關鍵知識點五：網(wǎng)頁布局類型的確定方法關鍵知

14、識點五：網(wǎng)頁布局類型的確定方法 1）把內容放入自己喜歡的網(wǎng)頁類型中淮信科技有限公司培訓中心的網(wǎng)站 22 :100037 : (010) 883797392. 項目資訊項目資訊關鍵知識點五：網(wǎng)頁布局類型的確定方法關鍵知識點五：網(wǎng)頁布局類型的確定方法 2）草繪出幾個不同的網(wǎng)頁類型的模板 22 :100037 : (010) 883797392. 項目資訊項目資訊關鍵知識點五：網(wǎng)頁布局類型的確定方法關鍵知識點五：網(wǎng)頁布局類型的確定方法 2）草繪出幾個不同的網(wǎng)頁類型的模板 22 :100037 : (010) 883797392. 項目資訊項目資訊關鍵知識點五：網(wǎng)頁布局類型的確定方法關鍵知識點五：網(wǎng)頁

15、布局類型的確定方法 2）草繪出幾個不同的網(wǎng)頁類型的模板 22 :100037 : (010) 883797392. 項目資訊項目資訊關鍵知識點五：網(wǎng)頁布局類型的確定方法關鍵知識點五：網(wǎng)頁布局類型的確定方法 2）草繪出幾個不同的網(wǎng)頁類型的模板 22 :100037 : (010) 883797392. 項目資訊項目資訊關鍵知識點五：網(wǎng)頁布局類型的確定方法關鍵知識點五：網(wǎng)頁布局類型的確定方法 2）草繪出幾個不同的網(wǎng)頁類型的模板 22 :100037 : (010) 883797393. 項目計劃與決策項目計劃與決策 無名山人作品集（白色） 大小99665 背景褐色國畫效果動畫 大小996185 背

16、景褐色網(wǎng)站導航文字白色背景褐色寬160px書法家作品寬836px，高度可變，作品居中，作品大小440 x*440px，畫布大小480 x*480px（文字白色，背景褐色）版權信息（文字白色，背景褐色）高100 px22 :100037 : (010) 883797394. 項目實施項目實施 水平65px水平250px水平896px水平160px22 :100037 : (010) 883797394. 項目實施項目實施 22 :100037 : (010) 883797394. 項目實施項目實施 a） b） 22 :100037 : (010) 883797394. 項目實施項目實施 22 :100037 : (010) 883797394. 項目實施項目實施 a） b） C） d） e） f） 22 :100037 : (010) 883797394. 項目實施項目實施 22 :100037 : (010) 883797394. 項目實施項目實施 22 :100037 : (010) 883797394. 項目實施項目實施 添加導航文字的效果 22 :100037 : (010) 883797394. 項目實施項目實施 給導航文字添加小方框符號 22 :100037 : (010) 883797394. 項目實施項目實施 22 :100037 : (