1、1電子商務（6）電子商務網站的建設2第六講 電子商務網站的建設第一節 Web頁設計與制作第二節電子商務網站的策劃第三節電子商務網站的實施3第一節 Web頁設計與制作一、 HTML語言二、 Web頁設計語言三、 Web頁編輯制作 4一、 HTML語言HTML是用于World Wide Web的語言，Web上的每個網站都用HTML顯示有關信息 一般來說，HTML文檔包含兩種類型的信息：標記信息和內容信息 HTML標記通常是英文詞匯（如塊引用）或縮略語（如p代表Paragraph）注意：標記是成雙出現的。如,則必須以另一個標記將它關閉。注意“blockquote”前的斜杠，那就是關閉標記與打開標記的

2、區別。5一、 HTML語言HTML語言標記1. 標識html文檔的開始結束2. 描述html文檔相關信息的標志對，在標題欄中顯示3. 是html文檔的主體部分，包含一系列標志對，如表示新的段落，創建一個回車換行等等 設置背景顏色 設置文本顏色 （rrggbb是用6個十六進制數表示顏色，或者用html語言定義的常量名表示顏色 black，white，green，yellow等）6一、 HTML語言實例藍色文本紅色背景，藍色文本7二、 Web頁設計語言Web頁的設計主要涉及的語言有HTML語言、Java語言、JavaScript和VBScript等 1Java SUN公司推出的一種編程語言，也是一

3、個平臺（虛擬機和應用程序界面），Java非常適合于企業網絡和Internet環境，現已成為Internet中最受歡迎的編程語言之一。 特點：簡單、面向對象、可分布、可解釋、強壯、安全性、結構化、輕便、功能強大、多線程、動態。 8 2JavaScript 一種腳本語言 JavaScript是由Netscape公司開發的一種腳本語言，用來開發交互式網頁，除了可以增加頁面的交互性、完成一些初步功能外，還可以節省瀏覽者的訪問時間和網絡流量 JavaScript與JAVA語言差異 JavaScript不是JAVA的替代語言 JavaScript源代碼無須編譯 JavaScript無須特殊開發環境 93V

4、BScriptVBScript是由微軟公司開發的腳本語言，基于visual basic，目前只能在Windows環境下的瀏覽器運行4CGICGI代表通用網關接口（Common Gateway Interface）大部分的CGI被用來解釋處理來自表單的輸入信息，并在服務器產生相應的處理，或將相應的信息反饋給瀏覽器。 5XMLXML是一種擴展性標識語言，允許自己來創造html中的標簽 XML可直接在Internet上使用XML應支持廣泛的不同類型的應用XML應與SGML兼容10三、Web頁編輯制作 1 Web頁面瀏覽Web時所看到的文件稱為Web頁面，Web頁面是使用HTML語言建立的 2 Web

5、 頁面制作工具 Web 頁面制作工具分成二類：一類是即見即所得，如：Netscape Navigator Golden Microsoft expression web 2007DreamWaver等。 另一類是文本編輯類，如Hotdog、Homesite、Webedit等11Adobe公司是Web開發工具市場的領頭羊，旗下的網頁三劍客：Dreamweaver、flash、fireworks Dreamweaver應用于網頁開發flash應用于動畫制作 fireworks處理網頁圖片，制作GIF動畫Photoshop，Adobe reader等是Adobe的主要產品 3Web頁編輯制作受到制約

6、條件：空間和速度制作網頁的步驟：使用軟件建立網站框架；在Web頁面的單個頁面中填加各種信息資料；修改細節的HTML語言源程序；在頁面之間加入鏈接；測試及發布 12第二節 電子商務網站的策劃一、電子商務網站的規劃二、電子商務網站的設計三、網站模版設計 13一、電子商務網站的規劃（一）確定電子商務網站的服務對象（二） 確定網站目標（三）確定網站評價系統14（一）電子商務網站的服務對象新浪網的服務對象是誰？如何定位的？服務對象可能是： 供應商、顧客（大客戶、政府部門、一般顧客）網站資源有限，必須整合聚焦服務如何識別網站的服務對象？ 確定訪問者范圍 確定訪問者目的 分為內部訪問者和外部訪問者15外部訪

7、問者（企業）訪問對象 潛在客戶、供應商、政府、其它組織和個人 競爭者、投資者、債權者客戶：了解產品信息、訂購、反饋供應商：了解公司產品計劃、分析庫存競爭者：了解公司戰略和經營情況過客：值得訪問信息（針對潛在客戶）16內部訪問者（企業）經常被忽略，僅限于參與建設部門按照價值鏈和業務流程確定制造部：了解客戶對產品評價研究部：了解客戶的偏好市場部：利用反饋信息制定特別促銷方案財務部：了解客戶定貨和回款情況采購部：了解客戶對產品（原料）評價17如何確定訪問目的討論會（類似市場調查）借鑒同行成熟網站網上測試識別不同目的的重要性（主要目的、次要目的）識別訪問目的背后的潛在需求18（二）確定網站目標（1/2

8、）公司的任務或目標（Why） 嘗試性、補充（輔助）、轉型（戰略調整）網站的近期目標與遠期目標（海爾） 信息查詢-產品展示和訂購-網上交易- 網上經營管理（數字化企業，與內部信息系統整合）網站訪問者 根據不同階段確定不同訪問對象，以訂購為例，分為組織和個人。根據地域、經濟、文化，以及年齡、性別、收入等細分（Dell分為大、中、小企業客戶）19確定網站目標（2/2）確定為訪問者提供的信息 時效性：及時更新（國內網站很少更新） 準確性：明確無誤（多為非專業人員制作） 豐富性：詳細真實（多媒體） 相關性：增加信息使用效果（相關鏈接） 便捷性：使用方便，按顧客導向 可行性：考慮成本/效益，信息成本最低2

9、0（三）確定網站評價系統明確競爭者網站特點建立評價站點的規則 頁面下載時間、頁面大小，布局，內容 訪問者評價（訪問量）評價分析 持續不斷跟蹤，建立評價系統（利用第三方監測系統）21二、電子商務網站的設計（一） 確定網站的內容和功能（二） 確定網站的裝飾風格（三） 確定網站的導航系統22（一）確定網站的內容分為靜態和動態靜態內容一般、常規信息：公司的歷史、文化等修改較少，初期建設注意規劃動態內容公司產品和服務有關信息，促銷信息經常修改，保持網站的吸引力和作用23確定網站的功能分為主要功能和輔助功能主要功能信息發布、網上交易（海爾）輔助功能配合主要功能而設置的。如客戶注冊管理(8848)功能確定原

10、則內容與功能統一，功能滿足顧客需求(如取消訂單)24（二）確定網站的裝飾風格形式服從內容與功能組織性裝飾、功能性裝飾和可視性裝飾組織性裝飾：按照小組、系統的結構安排站點功能，如子站點安排布局、顏色基調（整體）功能性裝飾：方便顧客利用功能，如功能、內容的布局安排（局部）可視性裝飾：起著美化界面，如用圖形等（部件）25（三）確定網站導航系統分全局導航和局部導航全局導航 出現在每個網站，連接主要大塊（子站點） 形式：固定鏈接橫條局部導航 出現在相關頁面，便于相關頁面跳轉 形式：主題列表、選項菜單、相關條目導航系統保持一致；能快速回頁首26三、網站模板設計（一）制作網站的布局網格（二）設計網站的框架

11、（三）設計網站的頁面模型27（一）制作網站的布局網格布局網格是描述網頁的模板內容是最重要的因素 所有主要部分的頁面形式應該很相似 必需考慮的其他元素包括：商標、廣告和贊助、導航、頁標題、頂端圖形、腳標（包括版權） 28(二) 設計網站的框架建立網站的統一的整體結構和整體外觀設計網站的框架以與修飾風格或網站結構基本原理結合 設計網站框架并不是絕對必要的 29（三）設計網站的頁面模型網頁模板確定幾種最主要的一般性頁面作為模板不同模板頁面應相似，同一模板應一致考慮元素：商標、廣告和贊助、導航、頁標題、頂端圖形、腳標（包括版權）設計頁面模型利用現有Web設計工具設計模型，并進行測試和最終確定。30第三

12、節 電子商務網站的實施一、電子商務網站的實施方式二、電子商務網站的域名申請三、電子商務網站的準備 四、電子商務網站的開發 五、電子商務網站的維護六、電子商務網站的推廣 31一、電子商務網站的實施方式外包、租借和自建32（一）外 包全權委托外部專業化公司提供一攬子解決方案，并且實施特點速度快，利用專業化服務，如上海書城采用IBM Net.Commerce V3的解決方案，2個月完成定制方案，可以要求提供針對企業實際的方案節省開發費用，可以節省1/3獲得專業化服務，如網上支付、物流服務缺點 外包使企業失去對自身業務的控制力，外包的網站所實現的功能可能會和企業所需要的有差異，而且企業完全熟悉網站的操

13、作并開始業務需要磨合時間。33（二）租 借利用電子商務服務站點（ASP、BSP）提供空間建設站點。企業只需要提供有關材料，維護、收款以及物流配送由門戶站點負責。網上商城Http:/ 操作步驟：填寫用戶資料，獲取用戶代碼和密碼，交納保證金商人門戶網站Http:/特點：簡單、快捷、廉價缺點：大眾化、不支持企業想要的視覺效果，只有幾種可選擇的方式，沒有獨立的IP和域名，缺乏發展空間34（三）自行建設外包適合非技術類的大中企業，租借適合中小企業或者試探性大中企業自行建設適合大企業，技術力量雄厚。需要有經驗、時間和大預算。優勢是可以建立獨特的有競爭力的功能。自行建設時應充分利用現有的開放的平臺，并在此基

14、礎上進行開發。如：IBM、HP、Intel、Microsoft等35二、電子商務網站的域名申請（一）域名的命名（二）域名的申請36（一）域名的命名與企業已有商標或企業名稱具有相關性簡單易記易用，3-8個字符多個域名：出現申請類似的域名，如Sohu、Sohoo國際性：以英語單詞為準,china與拼音民族性：符合民族特點，如Sina與支那37（二）域名申請獨立域名、子域名如： .cn英文域名與中文域名國際域名與國內域名管理單位：InterNic、Cnnic申請：直接到管理單位申請，代理申請如：中國新網（http:/www.chinaDNS.com）38CNNIC域名注冊申請表 （CN1 共1頁 R

15、EV 5.0）1、申請選擇：()注冊()變更()注銷郵政編碼：2、域名申請目的理由和用途： 商業應用電話：3、域 名：傳真：4、域名申請單位電子郵件： 名稱（中文）：6、技術聯系人 （英文）： 查詢號：ZS6-CN （拼音）：7、承辦人 單位名稱縮寫： 查詢號：ZS6-CN 單位負責人：8、繳費聯系人通訊地址（中文）： 查詢號：ZS6-CN39 （英文）：9、域名服務器郵政編碼： 主域名服務器名：單位所在地點：主域名服務器IP地址: 485、域名管理聯系人主域名服務器機型：Intel Pentium III 450查詢號：主域名服務器操作系統：BSD/OS姓名（中文）：主域名服務器放置地點：北

16、京 （英文）：輔域名服務器名：單位名稱（中文）：輔域名服務器IP地址: 02 （英文）：輔域名服務器機型Intel PentiumIII 450通訊地址（中文）：輔域名服務器操作系統：BSD/OS （英文）：輔域名服務器放置地點：北京與此域名有關的一切法律責任由申請單位一方承擔。申請單位（蓋章） 單位負責人簽章或簽字年 月 日40三、電子商務網站建設的準備（一）Web服務器建設（二）準備網站資料（三）選擇網站開發工具41（一）Web服務器建設（1/2）涉及到架設網絡、安裝服務器，租用通信網絡方式：架設專用網絡、整體托管、虛擬主機托管、租用網頁空間、委托服務商代理架設專用網絡，自己架設通信網絡，

17、速度快，費用昂貴，大型企業專業開發用整機托管，將服務器托管到IDC，遠程維護虛擬主機托管，邏輯上獨立，物理上共享，用戶可以擁有獨立的WWW、E-mail、FTP服務器42Web服務器建設（2/2）如何選擇ISP（虛擬主機托管）速度。存放位置（國內/國外），網絡連接速度服務。E-mail信箱、數據庫開發能力，支持CGI、支持加密傳輸，流行管理軟件、頁面訪問統計； 域名注冊、網站寄存、策劃、設計、制作、維護價格。空間，服務內容，服務質量租借網頁空間，申請子域名（虛擬域名），可自行上載網頁。委托服務商代理。類似于BSP，包括商務代理43（二）準備網站資料根據站點內容和功能規劃選定材料策劃網站整體形象

18、，統籌安排網頁公司簡介、產品資料（圖片、價格）增殖服務信息資料（相關產品技術資料、市場行情信息）材料類型：文字、圖像、動畫、聲音、影視等44（三）選擇網站開發工具網頁設計工具：Microsoft visual studio圖像處理工具：Adobe的Photoshop聲音、影視處理軟件交互式動態頁面設計工具，如微軟的ASP開發系統，支持CGI的Perl開發系統動態網頁請專業人員設計靜態網頁可以由企業內部人員設計45四、電子商務網站的開發（一）電子商務網站開發的組織機構 （二）電子商務網站的組成（三）電子商務網站的開發管理（四）電子商務網站的測試（五）電子商務網站的發布46（一）電子商務網站開發的

19、組織機構1/2外包開發方式，組織結構無須變動，只需指定有關人員負責與專業公司協調對于小型企業自行建設。可設網絡管理員職務，工作權限類似雜志編輯。具有預算、規劃、溝通、協調能力，同時具有一定技術知識對于大型企業，可設立網絡資源管理部門。（Web/Internet Resource Executive）47電子商務網站開發的組織機構2/2WIRE合格人選條件優秀的處理人際關系的能力較廣的網絡和電子商務知識一定的商業知識經得起考驗的項目管理和協調能力有效的配合高層管理階層的工作能同時擔任領導者和促進者兩種角色優秀的傾聽意見、吸取有用信息的能力48（二）電子商務網站的組成企業電子商務網站組成主要包括：

20、主頁、企業信息、新聞頁面、產品服務、幫助、相關虛擬社區等。主頁 導航型：企業站點結構信息，簡潔，多層次 內容展示型：展示主要內容，豐富，一步到位 視覺效果：分為文本型和圖片型。文本型追求簡潔、快速，輔以圖片；圖片型美觀、較慢49（1）電子商務網站主頁/首頁企業名稱、標志、網站圖標（Logo）等CIS要素企業站點的網址企業站點的導航系統企業產品和/或服務最新的信息、有關新聞企業的聯系方式如E-mail、電話、傳真等相關站點的鏈接50（2）電子商務網站新聞頁面包括企業最新信息：產品和/或服務的最新信息，如品種、價格、實現方式等等新項目的進行情況企業的內部變動情況行業的最新動態相關行業情況及時更新維

21、護，企業重要公關形象步驟：收集資料-制作標準新聞稿件-轉換為Web頁51（3）電子商務網站產品服務頁面企業在線業務的關鍵所在產品/服務目錄。提供相關信息，盡可能詳細，采用多媒體形式展示，虛擬現實訪問者、客戶評價。BBS以及代表性評價在線訂購和支付。定制訂購，方便、安全、自動。 如提供購物藍（車）等形象訂購系統、選取系統、配送系統、支付系統（如貨款、運費、手續費計算）產品相關信息，產品使用小常識設計組織時盡量簡潔，按產品線/品牌分類52（4）電子商務網站企業信息頁面對公眾（客戶、投資等）發布企業的公開信息發布信息包括：發展歷程、企業大事記組織架構、業務范圍合作伙伴、發展計劃財務信息（上市公司）最

22、好圖文并茂，采用多媒體方式展示53（5）電子商務網站幫助頁面方便用戶在繁雜的Web頁面快速找到信息信息方面幫助站點結構圖（Site Map）：展示主要鏈接站點內容搜索電子商務活動方面幫助在線訂購、定制規則（Wizard）在線支付方式和具體方法物流配送方式，網站內容搜索54（6）電子商務網站虛擬社區培養訪問者忠誠度。交流購物體驗，增加人氣，建立訪問者之間的群體關系提供功能個人電子信箱 公告欄（BBS）在線聊天室（Chat） 在線實時通信（ICQ，OCIQ）電子虛擬社區的建立選擇獨具特色的話題，一般與企業的產品、服務、經營方式相關。如雅寶的“我的 Yabuy 經歷”選擇合適的論壇主持人，積極，引導

23、55（7）電子商務網站頁面設計原則站點頁面的設計和開發要與企業CIS系統中的VI相一致使用模板和風格表來確保網站整體形象的統一，并簡化開發和以后的維護工作盡量使用成熟的技術，并使用多種瀏覽器進行檢驗，確保使用不同的瀏覽器瀏覽時沒有太大反差精簡頁面，提高訪問速度（8秒原則）盡量為訪問者和在線購物者提供方便56（1）瀑布法規劃需求分析概要設計詳細設計代碼調試維護瀑布法（三）電子商務網站的開發管理57（2）螺旋法統計風格和頁面（可視）后臺設計（不可視）循環信息結構設計結構設計第二版信息結構第二版結構跟蹤維護內部文字組織螺旋法58（四）電子商務網站的測試發布前完成鏈接測試（空鏈、錯鏈）兼容性測試（不同版本瀏覽器使用）版面測試（不同版面，1024*768為主流）語言測試（簡體、繁體）腳本語言測試下載速度59（五）電子商務網站的發布站點發布就是將設計好網頁存放到Web服務器E-mail方式，委托發布FTP 方式，遠程直接發布 Cute FTP 3.5WWW方式，遠程直接發布 FrontPage60五、電子商務網站的維護保持鏈接的有效性及時更換信息，根據信息性質不同確定更換頻率，保持信息的時效性 最好是規劃、落實到具體部門，與業務整合在一起保持頁面內容和拼寫正確，維護企業形象維持與訪問者的良好關系，及時反饋（E-mail，BBS）61六、