一、復習,網站開發的一般過程：,1、基本概念2、網站的需求分析(目標、對象、投入等)3、確定網站的主題4、確定網站的名稱5、選擇網頁制作工具,新課引入,網站設計是將網站由藍圖變為現實的第一個步驟，是搭建網站整體結構的過程，它可以使接下來的工作更加有的放矢。那我們到底如何來對網站進行設計呢？,網站實例欣賞,網站名稱：,網站主題：展示、推廣中學生文學原創作品，提供華語文學愛好者交流的平臺,欄目設置,網站名稱：,網站主題：一個學生研究小組對泰山石刻歷史和保護為課題主題研究成果展示。,欄目設置,網站實例欣賞,第一、欄目設置,網站的制作就好比寫一篇文章，首先要擬好提綱，文章才能主題明確，層次清晰，所以，主題選好后，網站設計的第一步要設置欄目。下面以制作“機器人做學玩”網站為例。,“機器人做學玩”網站的欄目設置,欄目設置需注意：,（1）要緊扣主題，盡可能刪除與主題無關的欄目（2）盡可能將網站最有吸引力的內容列在欄目上（3）盡可能方便訪問者的瀏覽和查詢。如：設置“本站指南”或“網站地圖”欄目可以幫助初訪者快速找到他們想要的內容,任務一：設置網站的欄目。要求：填寫“任務文檔.doc”中的任務一中的表格。,第二、版面設計,網海茫茫，能夠吸引我們眼球的只有那些有特色的網頁，大量的網頁引不起網民的興趣，究其原因，站點內容是否豐富是其中一個方面，而網頁的版面設計是否精美也是重要因素之一。版面結構是指將不同元素巧妙排列的方式，合理的版面結構能夠使瀏覽者清楚、容易地理解作品傳達的信息。布局就是以最適合瀏覽的方式將圖片和文字排放在頁面的不同位置。網頁要呈現的內容很多，如何合理地放置信息，使之井井有條、主次分明是版面布局需要考慮的問題。,常見頁面布局樣式(第一種),參考示例,主菜單以及橫條網站標志+廣告條,顯示內容,主菜單,常見頁面布局樣式(第二種),主菜單,主要內容,友情鏈接等,參考示例,常見頁面布局樣式(第三種),頁面布局像一張宣傳海報，以一張精美圖片作為頁面的設計中心，菜單欄目自由擺放。,參考示例,怎樣設計版面？,一般來說，網頁版面布局可按創意草案、粗略布局、最后定案三個步驟來進行。下面我們來看“機器人做學玩”網站的版面布局圖：,第三、樹立網站整體風格,第一步：設計、制作一個網站的標志（logo）,標志可以是中文、英文字母，可以是符號、圖案，可以是動物或者人物等。標志的設計創意來自你網站的名稱和內容。一般來說，設計標志有這樣幾種方法：（1）選擇與網站主題有關的，并具有代表性的人或物，用它們為設計藍本，加以卡通化和藝術化。如搜狐網站的狐貍尾巴（2）對于專業性的網站，可以是本專業有代表的物品作為標志，比如中國銀行的銅板標志。（3）最常用和最簡單的方式是用自己網站的中文或英文名稱作標志。采用不同的字體、字母的變形與組合，可以很容易制作出自己的標志。如：“機器人做學玩”網站標志。,R是機器人“robot”第一個字母，R分割成兩部分，上面是“做”的英文單詞do的首字母D，下部分可看成“人”字，蘊涵制作機器人的意思,LOGO欣賞,任務二：完成任務文檔中的任務二和任務三。,第二步：設計網站的標準色彩,網站的標志、標題、主菜單和主色塊文字的鏈接色彩盡量使用標準色彩；圖片的主色彩、背景色、邊框等盡量使用標準色彩同色系的色彩，這樣給人以整體統一的感覺。我們來瀏覽一些網站是如何運用色彩樹立風格的：,藍色調為主，加上白色和紅色，強調權威與真實,橙色為主，白色為輔，具有輕快、時尚的效果,第二步：設計網站的標準色彩,紅色為主，產生熱情、活力的感覺、充滿歡樂氣氛,綠色為主，白色為輔，產生舒適、優雅、適于閱讀的氣氛,網站的標志、標題、主菜單和主色塊文字的鏈接色彩盡量使用標準色彩；圖片的主色彩、背景色、邊框等盡量使用標準色彩同色系的色彩，這樣給人以整體統一的感覺。,第二步：設計網站的標準色彩,網站色彩設計的總體原則“總體協調，局部對比”。一個網站的標準色彩不超過3種，太多則使人眼花繚亂。至于其它色彩，也可以作為點綴和襯托，決不能喧賓奪主。,色彩太多、跟主色調不協調,黃顏色，眼睛容易疲勞、不在同一色系,第三步：設計網站的標準字體,設計網站的標準字體，指在關鍵的標題、主菜單、圖片里使用統一的標準字體。一般網頁默認的字體是宋體。各種字體大都具有各自不同的性格，如黑體字凝重、宋體字端莊、隸書飄逸、楷體淡雅等等。體現專業可以用粗仿宋體，體現設計精美可以用廣告體，體現親切隨意可以用手寫體等。,以上三個方面，標志、色彩和字體，是一個網站樹立整體形象的關鍵，設計并完成這幾步，相信你的網站整體形象已經有了一個很大的提高。,簡潔大方,風格獨特，構圖巧妙,生動活潑,色彩豐富,濃郁的文化氣息,任務三：完成任務文檔中的任務四。,第四、收集素材,“內容為王”依然是網站成功的關鍵，沒有豐富的內容就不可能讓瀏覽者覺得對自己有用，如果內容空洞，無論頁面制作得如何精美，仍然不會有多少瀏覽者。在收集素材的過程中要注意以下三個方面：1、要注意對收集來的素材分類。2、文件名要易懂易記