網(wǎng)站的開發(fā)流程介紹.doc

HTML教程網(wǎng)站的開發(fā)流程介紹在上一章中，主要介紹了使用Dreamweaver通過可視化操作來實(shí)現(xiàn)網(wǎng)頁中的各種元素，既學(xué)習(xí)了如何使用 Dreamweaver在網(wǎng)頁中設(shè)置頁面標(biāo)題、背景和插入各種對象，又學(xué)習(xí)了使用Dreamweaver來創(chuàng)建表格布局和實(shí)現(xiàn)表單頁面，還研究了框架相關(guān) 知識。另外，為了制作出賞心悅目的網(wǎng)頁，我們還學(xué)習(xí)了在Dreamweaver中如何快速地創(chuàng)建和應(yīng)用樣式表。從本章開始，我們將學(xué)習(xí)網(wǎng)站設(shè)計(jì)和布局技術(shù)，其中重點(diǎn)是熟悉網(wǎng)站的開發(fā)流程，DIV層和表格布局各自的使用場合，以及網(wǎng)站開發(fā)的一些經(jīng)驗(yàn)、技巧；難點(diǎn)是如何進(jìn)行網(wǎng)頁布局。創(chuàng)建一個商業(yè)網(wǎng)站，要做好商業(yè)網(wǎng)站開發(fā)的前期準(zhǔn)備、中期制作和后期的測試發(fā)布工作。前期準(zhǔn)備包括了解網(wǎng)站的業(yè)務(wù)背景、明確網(wǎng)站的設(shè)計(jì)風(fēng)格、確定網(wǎng)站 內(nèi)容等；中期制作主要包括創(chuàng)建站點(diǎn)、制作首頁、制作模板和制作樣式；后期的測試發(fā)布工作包括檢查頁面效果是否美觀、鏈接是否完好、不同瀏覽器的兼容性以及 如何發(fā)布網(wǎng)站。本章和下一章將結(jié)合淘寶網(wǎng)案例逐一介紹這些內(nèi)容。一、需求分析需求分析就是分析客戶的需求是什么。如果投入大量的人力、物力、財(cái)力，開發(fā)出的網(wǎng)站卻沒人要，那所有的投入都是徒勞，因此，網(wǎng)站前期的需求分析是相當(dāng)重要的。需求分析之所以重要，就因?yàn)樗哂心康男浴⒎较蛐?、決策性，它在網(wǎng)站開發(fā)的過程中具有舉足輕重的地位，大家一定要對需求分析具有足夠的重視。在一個 大型商業(yè)網(wǎng)站的開發(fā)中，它的作用要遠(yuǎn)遠(yuǎn)大于直接設(shè)計(jì)或編碼。簡言之，需求分析的任務(wù)就是解決“做什么”的問題，就是要全面地理解客戶的各項(xiàng)要求，并且能夠 準(zhǔn)確、清晰地表達(dá)給參與項(xiàng)目開發(fā)的所有成員，保證開發(fā)過程按照客戶的需求去做，而不是為技術(shù)而遷就需求。1.客戶需求(1) 業(yè)務(wù)背景做任何事情之前，要明確的是為什么要做這件事情，網(wǎng)站建設(shè)也不例外，要分析、理解、頒會客戶的需求，這就要求網(wǎng)站開發(fā)項(xiàng)目經(jīng)理對網(wǎng)站的業(yè)務(wù)背景有較好的理解和把握。不同的業(yè)務(wù)背景有不同的需求，不同的需求導(dǎo)致做出來的網(wǎng)站千差萬別。不過，根據(jù)網(wǎng)站的主題、題材、客戶需求和客戶企業(yè)的業(yè)務(wù)背景，可以把網(wǎng)站大致上分為不同的類別。下面就是美國個人電腦雜志(PC Magazine)把網(wǎng)站分為以下10類。 網(wǎng)上求職類。 網(wǎng)上聊天即時信息ICQ類。 網(wǎng)上社區(qū)討論郵件列表類。 信息技術(shù)類。 網(wǎng)頁網(wǎng)站開發(fā)類。 娛樂類。 旅行類。 參考資訊類。 家庭教育類。 生活時尚類。這些分類僅供我們參考，但同時也提醒我們，建設(shè)網(wǎng)站不要建設(shè)“面面俱到”型的，可能導(dǎo)致“面面不到”，而是要建設(shè)專業(yè)性強(qiáng)的、主題鮮明的網(wǎng)站。每個大類都可以繼續(xù)細(xì)分，比如娛樂類再分為體育電影音樂等小類，體育小類又可以按運(yùn)動形式分為足球、籃球、排球、乒乓球等。同時，各個題材相聯(lián) 系和交叉結(jié)合可以產(chǎn)生新的題材，例如足球加討論就是足球論壇、旅游加社區(qū)就是旅游社區(qū)等。這么多種類，如何選擇？可以遵循如下原則，第一、主題要小而精 煉；第二、題材最好是自己熟悉的；第三、題材不要太濫。下面我們就以淘寶網(wǎng)案例為例來分析商務(wù)網(wǎng)站的業(yè)務(wù)背景。WANGYEXX.COM從大的方面講：中國現(xiàn)在上網(wǎng)的人越來越多，還有廣大人民的消費(fèi)水平越來越高、消費(fèi)能力越來越強(qiáng)；此外，網(wǎng)上交易是一種發(fā)展趨勢，并且在歐美一些國家 得到成功的應(yīng)用。從小的方面說：如果阿里巴巴公司原來主要是通過店面、郵購等方式銷售產(chǎn)品或服務(wù)，或者公司有很多本地之外的潛在客戶可以挖掘，出于這方面 的業(yè)務(wù)背景，建立在線商務(wù)網(wǎng)站是非常合適的，因此，阿里巴巴就著手創(chuàng)建了淘寶網(wǎng)，這不僅降低了運(yùn)營成本，而且為顧客帶來了實(shí)惠和便利，還能增加銷售量、吸 引更多的潛在客戶。在線商務(wù)網(wǎng)站為廣大客尸提供在線商品展示、在線商品購買、交互服務(wù)和管理的平臺，借助電子商務(wù)軟件，客戶便可以不受時間、空間的限制使 用銀行卡在線訂貨和購買。從商業(yè)模式上看，“在線商務(wù)網(wǎng)站”不同于“網(wǎng)上商城”的概念，后者是為商家出租或免費(fèi)提供“網(wǎng)絡(luò)空間”的形式。從營銷模式上看， 網(wǎng)站是一種有力的營銷媒介。網(wǎng)站的建設(shè)是一個不斷修改、不斷完善、循序漸進(jìn)的過程，如果您想從網(wǎng)絡(luò)中受益，那就趕快行動吧！當(dāng)初創(chuàng)建淘寶網(wǎng)的目標(biāo)是建立全球最大最活躍的網(wǎng)上貿(mào)易市場，讓天下沒有難做的生意，而且淘寶網(wǎng)是一個目前比較火爆的網(wǎng)上在線商務(wù)網(wǎng)站，如圖1所示， 可以看出淘寶網(wǎng)具有在線商務(wù)網(wǎng)站的典型優(yōu)點(diǎn)。第一、體現(xiàn)了在線銷售的方便性；第二、體現(xiàn)了在線服務(wù)的及時性?？傊?，方便、及時是在線購物網(wǎng)站的主要特點(diǎn)。圖1 淘寶網(wǎng)主頁(2) 設(shè)計(jì)風(fēng)格在掌握了網(wǎng)站的業(yè)務(wù)背景之后，就可以明確網(wǎng)站的設(shè)計(jì)風(fēng)格。網(wǎng)站的風(fēng)格是指站點(diǎn)給人留下的整體印象。這個“整體印象”包括站點(diǎn)的標(biāo)志、色彩、字體、標(biāo)語和版面布局、瀏覽方式、交互性、文字、語氣、內(nèi)容價(jià)值、 存在意義、站點(diǎn)榮譽(yù)等諸多因素。如：搜狐網(wǎng)站看上去就是平易近人的，迪斯尼則是生動活潑的，IBM是專業(yè)嚴(yán)肅的，這些都是網(wǎng)站給人們留下的不同感受。風(fēng)格是獨(dú)特的，是站點(diǎn)不同于其他網(wǎng)站的地方?；蛘呱?，或者技術(shù)，或者交互方式都能讓瀏覽者分辨出網(wǎng)站的獨(dú)有特色。例如黑客網(wǎng)站、游戲網(wǎng)站一般都是黑色調(diào)，這種黑色調(diào)能反映出此類網(wǎng)站的神秘和誘人之處。通過網(wǎng)站的外表、內(nèi)容、文字、交流可以概括出一個站點(diǎn)的個性、情緒。是溫文儒雅還是執(zhí)著熱情？是活潑易變還是放任不羈的？是“豪放派”還是“婉約派”？要樹立好的網(wǎng)站風(fēng)格，請參照以下幾個方面： 合理的網(wǎng)頁布局。 讓網(wǎng)站logo盡可能地出現(xiàn)在每個頁面的頁眉中。 將文字、鏈接、圖片、背景、邊框等盡量與主色調(diào)一致。 突出字體特色。在關(guān)鍵的標(biāo)題、菜單、圖片里使用統(tǒng)一的字體和顏色。 使用特效，讓網(wǎng)頁看起來生動活潑。 網(wǎng)站主題鮮明、整體實(shí)用性強(qiáng)、內(nèi)容切合度好等。像淘寶網(wǎng)具有主題鮮明，色彩亮麗、簡潔明快、時尚生活的設(shè)計(jì)風(fēng)格。(3) 網(wǎng)站內(nèi)容一個網(wǎng)站應(yīng)該具備什么樣的功能，采取什么樣的表現(xiàn)形式，并沒有一個統(tǒng)一的模式。不同形式的網(wǎng)站其內(nèi)容也千差萬別。因此，網(wǎng)站中的內(nèi)容應(yīng)該根據(jù)客戶的需求，企業(yè)的業(yè)務(wù)背景確定。對于網(wǎng)站的表現(xiàn)形式，應(yīng)根據(jù)網(wǎng)站的設(shè)計(jì)風(fēng)格來確定。下面我們就以淘寶網(wǎng)為例，來簡單地介紹一下淘寶網(wǎng)的主要內(nèi)容，其主要內(nèi)容如下：公司簡介、商品分類、商品展示、價(jià)格信息、商品搜索、網(wǎng)上訂單、會員注冊、客戶服務(wù)等。2.確認(rèn)需求經(jīng)過細(xì)致的需求捕獲活動之后，我們就可以開始著手制作網(wǎng)站，不過，不要急！我們在真正制作網(wǎng)站之前，最好讓美工或UI（User Interface，用戶界面）設(shè)計(jì)人員將需求捕獲活動的結(jié)果加以適當(dāng)?shù)姆治?，然后設(shè)計(jì)一個用戶可以直接感知的靜態(tài)的網(wǎng)站樣板，也就是要做網(wǎng)站的靜態(tài)圖片 版。方便客戶與開發(fā)人員就網(wǎng)站系統(tǒng)的業(yè)務(wù)背景、設(shè)計(jì)風(fēng)格、網(wǎng)站內(nèi)容達(dá)成共識，并建立需求變更制度與流程，方便后期的制作與完善。二、網(wǎng)站制作經(jīng)過需求分析階段之后，我們就可以正式制作網(wǎng)站。網(wǎng)站的制作主要包括創(chuàng)建站點(diǎn)、制作首頁、制作模板和制作樣式。創(chuàng)建站點(diǎn)能很好地管理我們的網(wǎng)頁文件 和文件夾，所以在網(wǎng)站制作階段創(chuàng)建站點(diǎn)是我們首先要考慮的問題。首頁是一個網(wǎng)站的門面，是一個網(wǎng)站的靈魂，因此，首頁制作的好壞是一個網(wǎng)站成功的關(guān)鍵所 在。制作模板便于設(shè)計(jì)出具有統(tǒng)一風(fēng)格的網(wǎng)站，并且模板的運(yùn)用能為網(wǎng)站的更新和維護(hù)帶來極大的方便，為開發(fā)出優(yōu)秀的網(wǎng)站奠定了基礎(chǔ)。樣式表是一個很神奇的東 西，它能把網(wǎng)頁制作得更加絢麗多彩，使網(wǎng)頁呈現(xiàn)不同的外觀。當(dāng)網(wǎng)站有多個頁面時，修改頁面鏈接的樣式表文件即可同時修改多個頁面的外觀，從而大大地提高工 作效率，減少工作量。三、測試網(wǎng)頁測試網(wǎng)頁主要從3個方面著手，第一、頁面的效果是否美觀；第二、頁面中的鏈接是否完好；第三、是最重要的也是最煩的一點(diǎn)，就是要兼容不同的瀏覽器 （如Intemet Explorer、Mozilla Firefox等）。對于網(wǎng)頁是否美觀，仁者見仁，智者見智，那怎么辦呢？不過有章可循，可以從頁面整體視覺效果、美工設(shè)計(jì)、頁面布局、內(nèi)容實(shí)力、親和力 等方面進(jìn)行檢查。對于鏈接是否完好，可以使用Dreamweaver里的“檢查鏈接”命令來檢查，詳細(xì)的檢查步驟請參照第7章。對于兼容不同瀏覽器，也可 以使用Dreamweaver來檢查，在網(wǎng)頁學(xué)習(xí)網(wǎng)本系列教程下一章將詳細(xì)介紹。四、發(fā)布網(wǎng)站網(wǎng)站設(shè)計(jì)好了，經(jīng)測試之后，就可以放在服務(wù)器上發(fā)布，這樣，能讓更多的人知道您的網(wǎng)站。發(fā)布網(wǎng)站有兩種方式，一種是本地發(fā)布，即通過本地計(jì)算機(jī)來完成，在Windows操作系統(tǒng)中，一般通過IIS來構(gòu)建本地Web發(fā)布平臺，這種發(fā)布方 式只能讓局域網(wǎng)中的用戶訪問您的站點(diǎn)；另一種是遠(yuǎn)程發(fā)布，即登錄到Internet上，然后利用有些Internet服務(wù)商提供的個人網(wǎng)絡(luò)空間來真實(shí)地發(fā) 布自己所建的網(wǎng)站，不過，這種發(fā)布方式要先申請一個域名和虛擬主機(jī)，申請成功后I