洪仁忠 胡元闖 吳東吹 李 玲

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

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

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

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

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

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

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

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

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

網(wǎng)頁(yè)設(shè)計(jì)相關(guān)的工具有Dreamweaver、Flash、Fireworks、Photoshop、Illustrator、CorelDRAW等。

Dreamweaver用來(lái)排版布局網(wǎng)頁(yè)編寫(xiě)HTML、CSS、PHP、JavaScript等；Illustrator和CorelDRAW進(jìn)行矢量繪圖；Flash用來(lái)設(shè)計(jì)精美的網(wǎng)頁(yè)動(dòng)畫(huà)，Photoshop和Fireworks用來(lái)處理網(wǎng)頁(yè)中的圖形圖像。

二、網(wǎng)站設(shè)計(jì)

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

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

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

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

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

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

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

（三）設(shè)計(jì)網(wǎng)站風(fēng)格

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

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

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

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

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

在HTML文件中通過(guò)語(yǔ)法：

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

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

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

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

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

完成之后再進(jìn)行一系列的集成測(cè)試與單元測(cè)試，再經(jīng)過(guò)人工測(cè)試出具測(cè)試報(bào)告，測(cè)試就完成了。

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

（一）申請(qǐng)域名

在互聯(lián)網(wǎng)的世界中，計(jì)算機(jī)是通過(guò)IP地址來(lái)相互定位的，在申請(qǐng)?zhí)摂M主機(jī)時(shí)主機(jī)服務(wù)商會(huì)提供一個(gè)IP地址，但I(xiàn)P地址又難于記憶，很少有用戶會(huì)通過(guò)IP地址去訪問(wèn)網(wǎng)站，此時(shí)就應(yīng)申請(qǐng)域名了，域名便于記憶又與IP地址一一對(duì)應(yīng)，便于用戶使用。

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

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

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

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

五、結(jié)論

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