洪仁忠 胡元闖 吳東吹 李 玲

工業(yè)4.0的興起，移動互聯(lián)網(wǎng)的信息化，普通商品供過于求的時代，出現(xiàn)許多閑置物品，發(fā)展二手商品交易對買賣雙方都有好處，賣家將自己閑置商品進行轉(zhuǎn)賣能獲得一筆收益，買家用最少的錢購買自己想要的商品能節(jié)約資金。另外二手商品在人們生活流通過程中得到反復利用，二手商品交易能夠提高商品的利用率，減少資源的浪費和損耗，對環(huán)境有益符合環(huán)保和國家可持續(xù)發(fā)展要求，所以發(fā)展二手商品交易有著重要的社會意義。

一、網(wǎng)站構(gòu)建相關技術(shù)介紹

（一）環(huán)境搭建

在進行動態(tài)網(wǎng)站構(gòu)建之前，首先要搭建一個適宜的網(wǎng)站構(gòu)建環(huán)境，主要有以下幾點：

1、首先要選擇一門動態(tài)語言，目前國內(nèi)比較流行的互動式網(wǎng)頁編程語言有： PHP、ASP、JSP、CGI、ASP.NET等。而筆者選擇的是PHP。

使用PHP作為作用于服務器端的腳本語言有以下幾點優(yōu)勢：（1）PHP免費，因此不需要投入成本就可以進行服務器端開發(fā)。（2）PHP內(nèi)嵌于HTML標簽中，且語法簡潔、運行速度快、實用性強也較為簡單。（3）PHP可以跨平臺，可以在Windows、Linux、UNIX上運行。

2、數(shù)據(jù)庫的選擇，動態(tài)網(wǎng)頁是基于數(shù)據(jù)庫技術(shù)的，從而大大降低網(wǎng)站維護工作量。因此數(shù)據(jù)庫的選擇就顯得尤為重要。既然筆者已經(jīng)選用PHP就會首選MySQL作為網(wǎng)站數(shù)據(jù)庫就好像使用ASP時會選擇SQL Server或者ACCESS數(shù)據(jù)庫一樣就不進行過多贅述。

3、服務器的選擇，動態(tài)網(wǎng)頁是建立在B/S架構(gòu)上的服務器端腳本程序，瀏覽器端則顯示其在服務器端運行的結(jié)果。本文選用了Apache服務器。動態(tài)語言和服務器數(shù)據(jù)庫相結(jié)合后。WAMP環(huán)境就構(gòu)建完畢了。

（二）構(gòu)建工具選擇

網(wǎng)頁設計相關的工具有Dreamweaver、Flash、Fireworks、Photoshop、Illustrator、CorelDRAW等。

Dreamweaver用來排版布局網(wǎng)頁編寫HTML、CSS、PHP、JavaScript等；Illustrator和CorelDRAW進行矢量繪圖；Flash用來設計精美的網(wǎng)頁動畫，Photoshop和Fireworks用來處理網(wǎng)頁中的圖形圖像。

二、網(wǎng)站設計

動態(tài)網(wǎng)站的設計過程，筆者認為大致能夠分為個步驟：（1）網(wǎng)站定位；（2）確定網(wǎng)站結(jié)構(gòu)；（3）設計網(wǎng)站風格。

（一）網(wǎng)站定位

網(wǎng)站的定位說直白點就是確定網(wǎng)站的內(nèi)容，也就是這個網(wǎng)站的作用。網(wǎng)站定位通常要求策劃人員根據(jù)市場的需求、目標受眾等進行分析定義，從而確定網(wǎng)站用來做什么，提供什么服務或是傳達什么概念。

如構(gòu)建二手網(wǎng)上商店時，對其進行以下幾方面的分析：（1）網(wǎng)站的功能：方便生活，提供二手商品信息；（2）網(wǎng)站的目標群體：在校大學生；（3）自身優(yōu)勢；根植于學校，更易了解需求；（4）競爭對手：確定對手；（5）盈利方式：廣告插入。

通過以上分析，網(wǎng)站的創(chuàng)建就有了一個清楚的目標，方便我們執(zhí)行下去。

（二）確定網(wǎng)站結(jié)構(gòu)

網(wǎng)站結(jié)構(gòu)就是網(wǎng)站所提供服務的一種邏輯表示形式，物理上看，就是網(wǎng)頁菜單和其所指向的內(nèi)容，也就是網(wǎng)站中各網(wǎng)頁之間的層次結(jié)構(gòu)，良好的網(wǎng)站結(jié)構(gòu)有利于對用戶提供一致性的服務，也便與搜索引擎優(yōu)化。構(gòu)建二手網(wǎng)上商店時，層次結(jié)構(gòu)圖如下圖1所示的。

（三）設計網(wǎng)站風格

網(wǎng)站風格的設計就是將網(wǎng)站的內(nèi)容轉(zhuǎn)化成一種視覺的呈現(xiàn)的過程。好的設計風格有助于吸引訪問者的注意力，為訪問者提供更愉快的訪問體驗。

圖1 網(wǎng)站結(jié)構(gòu)圖

三、網(wǎng)站實現(xiàn)與測試

（一）網(wǎng)站實現(xiàn)

網(wǎng)站設計完成后，就開始著手網(wǎng)站的實現(xiàn)了。而每個網(wǎng)站都是由一個個網(wǎng)頁組合構(gòu)成的，所以創(chuàng)建網(wǎng)頁時不要一個一個網(wǎng)頁進行設計，這并不是一個好習慣。隨著網(wǎng)頁和資料的增多，網(wǎng)頁與網(wǎng)頁之間的鏈接容易混亂從而導致鏈接失效問題。因此創(chuàng)建網(wǎng)站時設計人員應創(chuàng)建一個邏輯目錄結(jié)構(gòu)，把網(wǎng)頁中的元素分門別類的存放到子目錄中去。最好能夠?qū)?nèi)容和格式化分離用HTML文件寫內(nèi)容；CSS文件對網(wǎng)頁格式化；而后寫JS文件操作HTML和CSS標記，給網(wǎng)頁增加交互的動態(tài)效果。

在HTML文件中通過語法：

把JS腳本文件導入。至此靜態(tài)的網(wǎng)頁就完成得差不多了，接下來就要編寫PHP文件和創(chuàng)建數(shù)據(jù)庫，再使用mysqli_connect函數(shù)連接MySQL服務器，語法如下：Mysqli mysqli_connect ([string host [, string username [, string passwd[, string dbname [, int port [, string socket]]]]]])

之后通過配置好的Apache服務器進行模擬，重復這幾個環(huán)節(jié)網(wǎng)頁制作階段也進入尾聲。

（二）網(wǎng)站實現(xiàn)

首先可以借助Dreamweaver內(nèi)的一系列測試工具來對網(wǎng)站的鏈接、對不同瀏覽器的兼容性及拼寫進行初步檢查。之后要根據(jù)測試計劃對站點進行系統(tǒng)測試主要包括：（1）功能測試；（2）性能測試；（3）兼容性測試；（4）安全性測試。

特別是在安全性管理上要尤為重視，要預防SQL注入，導致刪除或更改網(wǎng)站信息；也應對會話數(shù)據(jù)進行管理使用Session限制用戶對敏感網(wǎng)頁的訪問以免對網(wǎng)站數(shù)據(jù)造成破壞。

完成之后再進行一系列的集成測試與單元測試，再經(jīng)過人工測試出具測試報告，測試就完成了。

四、網(wǎng)站發(fā)布

（一）申請域名

在互聯(lián)網(wǎng)的世界中，計算機是通過IP地址來相互定位的，在申請?zhí)摂M主機時主機服務商會提供一個IP地址，但IP地址又難于記憶，很少有用戶會通過IP地址去訪問網(wǎng)站，此時就應申請域名了，域名便于記憶又與IP地址一一對應，便于用戶使用。

（二）上傳網(wǎng)站

在申請了域名并購買了虛擬主機空間就要考慮上傳網(wǎng)站了。上傳網(wǎng)站可以通過Dreamweaver中的FTP上傳工具進行上傳，也可以使用XAMPP中的FileZilla進行網(wǎng)站上傳。還能使用CuteFTP進行上傳。至此網(wǎng)站上傳完成。

（三）優(yōu)化、推廣網(wǎng)站

在上傳網(wǎng)站之后，就要考慮網(wǎng)站的優(yōu)化和推廣了。網(wǎng)站優(yōu)化包括對網(wǎng)站的內(nèi)容、布局和程序等多方面進行調(diào)優(yōu)，盡量滿足搜索引擎排名靠前條件，即網(wǎng)站的SEO。進一步測試網(wǎng)站在不同條件下的性能以及安全性，并進行調(diào)優(yōu)。

五、結(jié)論

此文通過對WAMP環(huán)境下的搭建網(wǎng)站，從而對網(wǎng)站的搭建流程有了一定的認識，對HTML、CSS、JavaScript和PHP及MySQL這一傳統(tǒng)搭建網(wǎng)站工具加深了了解，對環(huán)境搭建、構(gòu)建工具選擇、網(wǎng)站的設計實現(xiàn)進行了了解，驗證可行。