網(wǎng)站規(guī)劃以及設計

1、網(wǎng)站規(guī)劃以及設計Company Logo欣賞優(yōu)秀作品欣賞優(yōu)秀作品一、欣賞優(yōu)秀作品：1.虎門銷煙啟示錄2. 觀鳥二、思考以下問題：1.這些網(wǎng)站是怎樣圍繞主題展現(xiàn)內(nèi)容的？2.這些網(wǎng)站提供了哪些欄目及功能？3.網(wǎng)站的鏈接有哪些特色，是否便捷？4.Company Logo一、開發(fā)網(wǎng)站的基本過程一、開發(fā)網(wǎng)站的基本過程Company Logo二、網(wǎng)站的規(guī)劃二、網(wǎng)站的規(guī)劃1.網(wǎng)站主題的確定網(wǎng)站的規(guī)劃從選擇網(wǎng)站的主題開始。網(wǎng)站的選題，就是要根據(jù)網(wǎng)站的開發(fā)目標和訪問網(wǎng)站的用戶群，確定網(wǎng)站的主題，并給網(wǎng)站起一個簡練響亮的名字。 注意：貼近學習和生活2.網(wǎng)站運行環(huán)境的確定網(wǎng)站環(huán)境包括網(wǎng)站服務器情況、文件磁盤存儲空間

2、、網(wǎng)站域名管理等方面。 3.網(wǎng)頁制作工具的選擇主要包括選擇網(wǎng)頁制作工具（Frontpage、Dreamweaver)、圖像處理工具（Photoshop、Fireworks、paintshop）、動畫制作軟件（flash、Ulead gif animator）等。 4.網(wǎng)站開發(fā)任務的管理 (1)任務分工 (2)時間安排Company Logo主要軟件DreamweaverCompany LogoCompany Logo主要軟件Photoshop由Adobe公司推出的專門用于圖形、圖像處理的軟件Photoshop以其強大的功能、集成度高、適用面廣和操作簡便而著稱于世。它不僅提供強大的繪圖工具，還能

3、直接從掃描儀、數(shù)碼相機等設備采集圖像，并對它們進行修改、修復，調(diào)整圖像的色彩、亮度，改變圖像的大小，而且還可以對多幅圖像進行疊加，并增加特殊效果，使現(xiàn)實生活中很難遇見的景像十分逼真地展現(xiàn)。PhotoshopPhotoshop界面界面界面默認打開的面板有：屬性欄、工具欄導航、顏色、圖層：Company LogoPhotoshop入門介紹 效果欣賞Company LogoCompany Logo主要軟件Flash由Macromedia公司開發(fā)設計的多媒體軟件所生成的動畫(.swf)文件非常小，用在網(wǎng)頁設計上不僅可以使網(wǎng)頁更加生動，而且小巧玲瓏下載迅速，使得動畫可以在打開網(wǎng)頁很短的時間里就得以播放。

4、并且把音樂，動畫，聲效，交互方式融合在一起，可以直接嵌入網(wǎng)頁的任一位置，非常方便。1 舞臺(Stage) 2 時間軸窗口 (Timeline) 3 繪圖工具欄 (Drawing Toolbar) 4 標準工具欄 (Standard Toolbar)5 圖庫窗口 (Library Window) 6 控制器面板 (Controller)FLASH工作環(huán)境工作環(huán)境Company Logo西雙版納植物園虛擬瓷都中國金魚FLASH在中國科普博虛擬博物館建設中的應用示例Company Logo三、網(wǎng)站的設計三、網(wǎng)站的設計 網(wǎng)站設計的目的： 把信息以恰當?shù)姆绞浇M織并呈現(xiàn)在網(wǎng)上，設法吸引人們的關注，并為瀏覽

5、者提供方便的訪問。（一）網(wǎng)站結構的設計：設計網(wǎng)站的欄目。 網(wǎng)站的欄目可以有多層，以能夠恰當?shù)伢w現(xiàn)網(wǎng)站主題為好。此外，每個欄目本身應有一個大致的內(nèi)容描述，以表達該欄目的設計思路，充實整個網(wǎng)站的總體結構設計。Company Logo“虎門銷煙啟思錄虎門銷煙啟思錄”網(wǎng)站的結構網(wǎng)站的結構Company Logo“虎門銷煙啟思錄”網(wǎng)站的結構Company Logo三、網(wǎng)站的設計三、網(wǎng)站的設計（二）網(wǎng)頁的版面設計1.風格設計 包括網(wǎng)頁布局的整體造型、色彩的搭配、字體圖片的樣式設置、網(wǎng)站的標志設計等。如：嚴肅莊重、清爽溫馨、深沉厚重、生動活潑、古樸典雅。Company Logo簡潔大方簡潔大方Company

6、 Logo風格風格獨特獨特，構圖巧妙構圖巧妙Company Logo生動活潑生動活潑Company Logo色彩色彩豐富豐富Company Logo濃郁的文化氣息濃郁的文化氣息Company Logo 2.版面布局設計標題信息、欄目信息、內(nèi)容信息、附加信息等，要進行合理的放置，讓人看起來井井有條，主次分明。一般來說： 屏幕中央最能引人注意，屏幕上方緊隨其后，屏幕左右側通常放置不太重要或固定信息，附加信息一般放在最下方。Company Logo常見網(wǎng)頁布局類型布局類型布局類型布局方式布局方式實例實例“國國”字型字型 上面是網(wǎng)站的標題及橫幅廣告，接下來是網(wǎng)站的主要上面是網(wǎng)站的標題及橫幅廣告，接下來

7、是網(wǎng)站的主要內(nèi)容，左右分別列一些小條，中間是主要內(nèi)容，下面內(nèi)容，左右分別列一些小條，中間是主要內(nèi)容，下面是一些網(wǎng)站的信息是一些網(wǎng)站的信息 人民網(wǎng)人民網(wǎng)拐角型拐角型上面是標題廣告，接下來在左側是導航欄，右側是正上面是標題廣告，接下來在左側是導航欄，右側是正文，下面是網(wǎng)站的信息。文，下面是網(wǎng)站的信息。 標題正文型標題正文型上面是標題，下面是正文。上面是標題，下面是正文。 左右框型左右框型左邊是導航欄，右邊是正文。有時最上方會有一個小左邊是導航欄，右邊是正文。有時最上方會有一個小標題。標題。 上下框型上下框型上面是導航欄，下面是正文。上面是導航欄，下面是正文。綜合框架型綜合框架型左右、上下兩種框架結構的結合。左右、上下兩種框架結構的結合。 封面型（封面型（Flash型）型）精美的平面或動畫作為首頁。精美的平