網頁設計的一般步驟.ppt

1、第1章 網頁設計的一般步驟,在學習制作網頁的各種軟件之前，首先要了解網頁設計的一般步驟。這將有助于總體上把握網頁設計的流程。網頁設計的一般步驟包括：需求分析、制作頁面效果圖、切圖、制作靜態(tài)Web頁面、添加程序、發(fā)布Web站點、推廣和維護等幾個方面。下面將逐一對各個步驟進行講解。,1.1 需求分析,1Internet Internet的中文名稱是“互聯網”或者“國際互聯網”。它來源于美國國防部高級研究計劃局DARPA（Defense Advanced Research Projects Agency）的前身ARPA建立的ARPAnet，是由各種不同類型和規(guī)模的計算機網絡（包括局域網、地域網，以及

2、大規(guī)模的廣域網等）構成的全球范圍的計算機網絡。在Internet中的各個計算機之間，可以方便地交換信息。,1.1 需求分析,2域名 域名是用來標識Internet上相應資源的一個名稱。在Internet中有成千上萬的計算機，為了標識每臺計算機，為每臺計算機分配了一個地址，這個地址就叫做計算機的IP地址。IP地址是由二進制數來表示的，長32位。由于IP地址難于記憶和書寫，所以在Internet中使用一種字符型的地址來標識各種資源，這個字符型的地址就叫做域名。,1.1 需求分析,3空間 空間是指用來存放制作好的網站的磁盤空間。在發(fā)布網站時，可以使用提供相應服務的公司的空間，也可以使用自己計算機上的

3、空間。其區(qū)別在于穩(wěn)定性和速度存在著差異。 一般在提供網站建設服務的公司中，需求分析的部分會有相應的人員負責，網頁設計人員只需要分析需求人員提供的文檔，并和需求人員具體溝通，即可完成這個部分工作。,1.2 制作頁面效果圖,1制作效果圖的軟件 用來制作效果圖的軟件并沒有明確的規(guī)定，可以使用各種圖形制作和處理的軟件?，F在通常使用的軟件是Photoshop（關于使用Photoshop的內容，將在后面的章節(jié)中詳細講解）和Fireworks。在制作效果圖時，使用的軟件對最終效果并沒有影響，所以一般只需要精通一種軟件即可。,1.2 制作頁面效果圖,制作好的效果圖可以保存成各種格式，其中主要包括GIF格式、J

4、PEG格式、PNG格式等。各個圖片格式之間的區(qū)別，將在后面的章節(jié)中詳細講解。 下面是一個制作完成的效果圖的示例，其顯示效果如圖所示（關于該效果圖的詳細制作過程，將在后面的章節(jié)中詳細講解）。,完成后的效果圖,1.3 制作Flash動畫,在網頁中使用的多媒體內容主要為Flash動畫。因為Flash動畫內容可以在頁面中直接使用（在瀏覽器中也可以屏蔽Flash動畫內容的顯示），而其他的多媒體內容都需要在客戶端安裝相應的播放器來支持。,1.4 切圖,在制作靜態(tài)頁面之前，要對效果圖進行切片。切片的目的是制作頁面中使用的修飾圖片。 對效果圖進行切片，可以在Photoshop（或者與之相關聯的軟件ImageR

5、eady）中進行，也可以在Fireworks中進行。下面是一個在Photoshop中切圖的示例，其顯示效果如圖所示。,1.5 制作靜態(tài)Web頁面,靜態(tài)Web頁面是指使用HTML等語言制作的，不能和服務器進行交互的頁面。制作靜態(tài)Web頁面，是為了使網頁制作的分工更加明確。 制作靜態(tài)頁面時，通常使用的軟件是Dreamweaver。制作的靜態(tài)頁面一般是HTML頁面，文件的后綴名為.html。制作完成后的HTML頁面，可以直接在IE等瀏覽器中查看其顯示效果。,1.6 添加程序,添加程序的目的是使頁面能夠和服務器中的資源進行交互，一般要涉及對數據庫的操作。添加程序后的頁面處理和顯示信息的效率會更高，更加

6、容易維護。 根據使用的程序語言不同，網頁中使用的程序可以分為ASP程序、ASP.NET程序、JSP程序、PHP程序等。使用不同的程序，對完成網頁的功能并不影響。,1.7 發(fā)布Web站點,客戶對網頁的所有功能和頁面都確認后，就可以正式發(fā)布制作好的站點了。發(fā)布站點的過程就是將本地的站點文件上傳到購買或者設定的空間上去。通常使用FlashFXP等上傳下載軟件來完成。,1.8 推廣和維護,網站的推廣和維護也是網站建設中相當重要的部分。針對站點的性質和不同的需求，推廣和維護的方法也不盡相同。其中推廣的方法包括百度、Google等搜索引擎上的推廣、相關論壇推廣、郵件推廣等。維護的情形要視站點的復雜程度和規(guī)模，指定專人或請制作站點的公司一并維護。,1.9 專家總結,在具體學習網頁制作技巧之前，總體地了解站點的制作步驟，有助于了解使用軟件制作網頁在整個站點制作中的位置，同