網站建設的總流程分析

張志一 耿秀春

Analysis of the General Process of Website Construction

ZHANG Zhi-yi GENG Xiu-chun

摘要：本文根據多年從事網絡程序設計工作和講授計算機專業相關課程的的教學實踐經驗，從需求分析、整體規劃、搜集素材、網頁設計、申請空間、測試發布、維護推廣等七個方面進行詳細的網站建設總流程的闡述。

Abstract： This article expounds the general process of website construction from seven aspects， requirements analysis， overall planning， collecting materials， web design， application space， test release， maintenance promotion based on seven years of experience in network programming and teaching computer science related courses.

關鍵詞：網站;需求分析;規劃;素材;框架;超鏈接

Key words： website;demand analysis;planning;material;framework;hyperlink

中圖分類號：TP393? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 文獻標識碼：A? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 文章編號：1006-4311（2019）32-0249-03

0? 引言

Web的發展日新月異，擁有自己的網站已經成為了一種潮流。隨著大數據、人工智能、虛擬現實等諸多高科技的出現，當今社會對復合型人才的需求會日益增多。伴隨著微信、支付寶、云閃付等便捷支付app的出現，對淘寶、京東等線上維護人才的要求越來越高，熟知網站建設的總流程十分重要。

1? 需求分析

建立網站時，根據企業客戶的需求，了解網站建設的目的、功能模塊、市場調研情況等信息。其中，網站建設的目的尤為重要。有些企業想樹立企業的形象，打響知名度，互聯網的時代推廣宣傳還是很有效果的。有些企業是為了提供更好的產品與服務，客戶可以不受時間地域的限制，方便快捷的獲取自己需要的信息，吸引更多的客戶群體。還有些企業是為了開拓更大的市場，方便發展電子商務，以獲利更多。

2? 整體規劃

2.1 風格

風格是抽象的，在這里是網站的整體形象給瀏覽者的綜合感受。包括標志、版面設計、瀏覽方式、交互性、內容價值、存在意義等諸多因素。例如：瑞麗網站是時尚前衛的，KFC訂餐網站是生動形象的，聯想集團的網站是專業嚴肅的。個人認為，logo一定要放在最顯眼的位置，網頁的色彩要用同一色系的，利用好網頁配色，以突出主題，更能吸引瀏覽者的眼球。

2.2 布局

網站的布局，根據企業用戶需要，構思好網頁的數量，每個網頁顯示的內容，以何種形式展示。

2.3 語言腳本

網頁中的編程語言很多，有PHP、ASP、JavaScript、VBScript等。ASP是微軟公司推出的取代CGI的新技術，基于開放設計環境的Active X技術，使用所有的開發工具來創建和運行交互式的動態網頁，例如物流庫存管理、圖書借閱系統、足球論壇、用戶登錄界面等。它簡單易學，還可以自己定義和制作組件，讓動態網頁無限擴充。還可以利用ADO訪問數據庫，對數據進行處理。鑒于以上優點，個人建議優先考慮ASP腳本語言。

2.4 數據庫平臺

數據庫的種類很多，如SQL Server、Access數據庫、FoxPro數據庫等。SQL功能強大、簡單易學。SQL數據庫的數據體系結構基本上是三級結構，還有數據加密的功能。SQL用戶可以作為獨立的用戶接口，做終端用戶。對于SQL數據中的操作，分為數據定義、數據查詢、數據更新和數據控制四個方面，其中數據安全性的方法是通過對數據庫存取權力的控制來防止非法使用數據中的數據，安全性比較高。個人建議采用SQL數據庫。

3? 搜集素材

3.1 文字資料

和客戶溝通好建設網站的目的后，自己撰寫相關的文字描述，也可網絡中搜索符合網站主題的文本資料，統一匯總到doc或wps文件中。網站中所有網頁需要的文字資料，統一格式，做好標記，以便快速檢索相關信息。

3.2 圖片

3.2.1 BMP格式

BMP采用位映射存儲模式，在Windows環境中運行的處理圖像的軟件均支持這種格式。它不支持文件壓縮，不適用于 Web 頁。

3.2.2 GIF格式

GIF文件是一種無損壓縮格式，其壓縮率大約50%，相關軟件都支持它。GIF最多支持256種色彩的圖像。

3.2.3 JPG格式

JPG是最常用的圖像文件格式，是一種有損壓縮格式，JPEG壓縮技術十分先進，它可以用最少的磁盤空間得到較好的圖像品質。JPG是靈活的格式，支持多種壓縮級別，壓縮比率通常在10：1到40：1之間。它壓縮高頻信息，保留色彩較完整，較適用于網頁設計中，可把文件壓縮到最小，所有的瀏覽器都可以以最快速度打開它，但它不適合顏色少、大區域顏色接近簡單的圖片，適合色彩多的圖片。

3.2.4 AI格式

AI格式可以在CorelDRAW中打開并修改，是一種矢量圖形文件。它和PhotoShop中存儲的psd文件一樣，都是分層文件，每層都作為一個對象，具有各自的屬性。如文字作為對象，其屬性在外觀選項卡，可以設置字符的描邊、填色、不透明度等屬性值。該格式文件方便修改，可以自動匹配最高分辨率輸出，兼容性較好。

3.2.5 PNG格式

PNG格式可以在PhotoShop中打開，并進行編輯處理。可以比GIF格式的文件再縮小30%左右，也是一種新興的無損壓縮圖像格式，還可以兼容所有的瀏覽器，使用廣泛。

根據以上介紹，設計者可以自由選擇圖片格式，在PhotoShop、CorelDRAW軟件中進行圖片的修改，也可直接網絡中搜索合適的圖片，下載直接用。個人建議下載后的圖片，最好還是使用圖像處理軟件進行后期處理，修改為符合網站主題的圖片素材。

3.3 動畫

3.3.1 GIF格式

GIF格式是基于LZW算法的一種無損壓縮模式，相關軟件都支持它。最大的特點，可以在一個GIF文件中存儲多個彩色圖像，當用瀏覽器打開時，它會像是Flash中的逐幀動畫一樣顯示在頁面中。很多初學者，可以利用GIF小軟件，制作出小型的簡單的動畫。

3.3.2 SWF格式

SWF格式是Flash動畫軟件可以打開的，它是一種多媒體文件，可以是聲音、視頻、動畫等的綜合體。瀏覽器想要運行打開，必須安裝Adobe Flash Player IE插件，大部分電腦系統內默認已經安裝，定期進行更新即可。這種格式的文件，在游戲網頁中經常用到。

關于動畫，個人建議采用swf格式，有能力者，可使用Flash軟件，進行符合網站主題的動畫創作。

3.4 視頻

3.4.1 MOV格式

MOV格式是在QuickTime Player軟件中編輯，結合音頻和視頻，用于存儲數字的流式視頻。它是多軌道存儲信息，還不限制數目。它還可以邊下載邊觀看，不必等全部下載完畢才可以觀看。

3.4.2 RM格式

RM格式是RealNetworks公司開發的視頻文件，可以根據網絡數據傳輸速率不同而修改不同的壓縮率比，來實現即時播放。目前，很多網站用來進行重要事件的實況轉播。

3.4.3 FLV格式

FLV是一種流媒體格式，具有文件容量小、下載速度快等優點，適于網絡發展用。如美國的YouTube網站、國內的土豆網、新浪視頻播客等都是使用FLV格式的視頻。

根據實際情況，選擇合適的視頻格式。

3.5 音樂

3.5.1 MP3格式

MP3是利用音頻壓縮技術，將聲音用1：10甚至1：12的壓縮率壓縮成容量較小的文件，可以保持較好的音質。

3.5.2 MIDI格式

mid格式是由MIDI繼承而來。它記錄聲音的信息，然后告訴聲卡如何再現音樂的一組指令。mid文件重放的效果完全依賴聲卡的檔次。

4? 網頁設計

4.1 構建網頁的框架

4.1.1 國字型

最上部分放置網站的標志和導航欄或Banner廣告，頁面中間防止網站的主要部分，下部分放置網站的版權信息和聯系方式等。

4.1.2 T型

頂部放置網站的標志或Banner廣告，頁面下方左側是導航欄菜單，頁面下方右側放置網頁正文等主要內容。

4.1.3 內頁型

一般是用來顯示文章頁面、新聞頁面和注冊頁面等。

4.1.4 左右框架型

左側一般是導航欄鏈接，右側放置網站的主要內容。

4.1.5 上下框架型

上側一般是導航欄鏈接，下側放置網站的主要內容。

4.1.6 綜合框架型

結合上下框架型和左右框架型。

除了以上六種類型，還有封面型、FLASH型等。不就是最適合用戶瀏覽的方式將文字等資源排列在網頁中不同的位置，為客戶提供舒適、友好、簡單的訪問體驗，因此良好的頁面布局的效果，應具備條理清晰、主次分明、色彩對比度適當、布局疏密適當等特點。

一般用表格（table）來布局，來制作網頁的框架，也可運用css+div來實現。

4.2 設置導航欄

每個頁面展示的內容不同，導航欄內容也不相同，位置和信息都是根據企業客戶需求制定即可。導航欄的命名最好是見名之意，可以體現企業的特色，讓用戶迅速搜索到想要了解的信息，讓用戶有很好的體驗。

4.3 頁面內容

根據3收集素材的資料，分網頁編輯，設置對應的格式，添加到合適的位置。

4.4 超鏈接的設置

超鏈接是Web頁面區別于其他媒體的重要特征之一。它的載體可以是文本，也可以是圖片，也可以是圖片的一個或多個區域形成的熱點。它是網站中最重要的組成部分，可以從一個網頁跳轉到另一個網頁，多個網頁因為有了超鏈接才會形成一個網站。

根據企業客戶需求，利用 鏈接文字進行超鏈接的設置。

5? 申請空間

網站制作完成后，注冊一個自己的域名，租用服務器的空間來存儲網站的所有內容。

6? 測試發布

網站發布之前，必須進行縝密的測試，以保證瀏覽正常，達到預期效果。測試的內容大約是租用服務器的性能是否可靠、瀏覽器的兼容性、數據庫的檢索是否正常、超鏈接是否正確、文字資料是否有錯別字、網上下載的素材是否涉及到侵權問題等。

7? 維護推廣

當今社會發展迅速，企業為了適應時代的步伐，也會有所改變。定期對站點內的信息進行更新與維護，做到線上線下信息統一。最重要的是對軟硬件以及數據庫的維護，以免導致信息外泄，造成不必要的損失。

8? 結束語

對于企業來說，網站建設的必要性大體分為三類：發展業務、爭取新客戶和服務老客戶。網站可以全年無休運轉，相當于企業聘請了一個不講報酬、從來不遲到早退、永不知疲倦的銷售員，還永遠開放的商場，讓顧客何時何地都可以了解企業信息。網上還可以留言答疑解惑，也可以在線實時交流，方便售后的服務。對于學校來說，網站的建設更為重要。提高知名度，方便報考的學生更好地了解學校的各方面的信息。對于個體戶來說，可以建立自己的網站，銷售農產品、水果、當地土特產等。了解網站建設的總流程，百益無一害。

參考文獻：

[1]商瑋.電子商務網頁設計與制作[M].北京：中國人民大學出版社，2016.

[2]聶斌，張明遙.HTML+CSS+DIV網頁設計與布局[M].北京：人民郵電出版社，2018.

[3]李曉斌.PHP+MySQL+Dreamweaver網站建設全程揭秘[M].北京：清華大學出版社，2018.

作者簡介：張志一（1980-），男，山東濟南人，中級講師，工學學士，研究方向為計算機科學與技術;耿秀春（1981-），女，山東濟南人，中級講師，理學學士，研究方向為計算機科學與技術。