一(yī) 網站策劃設計階段

1 策劃構思及設計流程

1.1 了解客戶需求
創建網站結構示意圖。

1.2 網站策劃：
1.2.1 按照功能對網站欄目分(fēn)類。
1.2.2 欄目要表達的中(zhōng)心思想和主題。
1.2.3 網站頁面基調。

1.3 網站結構規劃，
1.3.1 确定制作網站要采取的技術。
1.3.2 制作網站頁面布局草圖。

1.4 準備必要的素材:
1.4.1 包括圖片
1.4.2 動畫
1.4.3 文字資(zī)料

2 網站設計初樣制作
2.1 網站頁面設計 利用用戶提供的圖片和參照網址，使用photoshop設計出網站頁面樣式。
2.2 頁面樣式采集 使用ImageReady切割圖片爲網頁大(dà)小(xiǎo)，并保證圖片質量，用來和用戶溝通設計樣式。

二 網站創建

1 建立站點：

1.1 使用DreamWear工(gōng)具建立站點。
1.2 新建站點目錄結構。
1.2.1 Image文件夾。用來存放(fàng)站點中(zhōng)的圖片。
1.2.2 Style文件夾。用來存CSS樣式表文件。
1.2.3 Html文件夾。 用來放(fàng)置Html文件。
1.2.4 Flash文件夾。用來放(fàng)置動畫文件。
1.2.5 temp文件夾。 用來存放(fàng)臨時文件。
(注釋：如果網站過大(dà)，可以根據欄目分(fēn)類把Html文件夾按照功能劃分(fēn)，并且子目錄存放(fàng)對應功能的 Image,Style,flash,temp文件。)

2 創建樣式表：
樣式表分(fēn)類：
2.1 元素樣式：
2.1.1 Body樣式
2.1.2 表樣式。
1 單元格樣式
2.1.3 表單樣式
1 List元素樣式
2 Select元素樣式
3 input元素樣式
4 Check元素樣式
5 Textarea元素樣式
6 p樣式
7 a樣式
2.2 類樣式： 根據功能命名并填充
2.3 ID樣式： #加上表識符聲明的Html元素ID的樣式
2.4 僞元素、僞類樣式：
2.4.1 僞類：
1 僞類定義：
對元素進行分(fēn)類是基于特征, 當用戶和文檔進行交互時一(yī)個元素可以獲取或者失去(qù)一(yī)個僞類
2 僞類類型：
:link用在爲訪問的連接上。
:visited用在已經訪問過的連接上。
:active用于獲得焦點（比如，被點擊）的連接上。
:hover hover用于鼠标光标置于其上的連接。
:after after用于顯示緊跟在元
素後面的内容 content。

3 僞類用途： Menu菜單，超鏈接
2.4.2 僞元素：
1 僞元素定義：
僞元素是創造關于文檔語言能夠指定的文檔樹(shù)之外(wài)的抽象。
例如文檔語言不能提供訪問元素内容第一(yī)字或者第一(yī)行的機制。
僞元素允許設計師引用它們，否則這是難以辦到的。
僞元素還提供樣式設計師給在源文檔中(zhōng)不存在的内容分(fēn)配樣式。
2 僞元素類型： :first-line，:first-letter，:before，:after。
3 僞元素用途： 文檔語言對象。
3 制作網站首頁
3.1 導入樣式表
3.2 設置頁面标題
3.3 設置頁面屬性
3.4 制作頭部表格
3.5 制作公告欄

4 制作正文表格
4.1 左側欄制作。(一(yī)般包括：1 業務指南(nán)；2站内搜索；3 頁面導航等)
4.2 制作Banner
4.3 制作新聞區
4.4 友情鏈接區

5 制作尾部版權 尾部導航

6 調整頁面
6.1 表格與表格之間合理布局
6.2 層與層之間合理布局

7 制作網站模闆

7.1 創建模闆
7.1. 1 将首頁另存爲模闆
7.1.2 創建模闆可編輯區，并保存
7.2 使用庫
7.2.1 把模闆中(zhōng)的menu表格建成庫文件，共給其它頁面使用
7.2.2 把頁腳文件建成庫文件

8 應用模闆創建子欄目(功能欄所在的頁面是二級頁面)
8.1 從模闆新建網頁
8.2 編輯可編輯區
9 應用模闆制作三級頁面(功能欄頁面中(zhōng)的子頁面爲三級頁面)

三級頁面要以二級頁面爲基準而建立三 開(kāi)發網站中(zhōng)需要注意的問題

1 準備相關素材
1.1 網站模闆
1.2 CSS樣式
1.3 動畫(Flash,Swish2.0)
1.4 圖片(photoshop)

2 定制CSS樣式

3 如果更新頁面布局，請更新網頁模闆

本文引用于網絡，如有侵權請聯系我(wǒ)(wǒ)們删除，謝謝。