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

1、網(wǎng)站規(guī)劃以及設(shè)計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ā)目標(biāo)和訪問網(wǎng)站的用戶群，確定網(wǎng)站的主題，并給網(wǎng)站起一個簡練響亮的名字。 注意：貼近學(xué)習(xí)和生活2.網(wǎng)站運行環(huán)境的確定網(wǎng)站環(huán)境包括網(wǎng)站服務(wù)器情況、文件磁盤存儲空間

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

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

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

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

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

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