網(wǎng)站畢業(yè)設(shè)計(jì)論文的優(yōu)秀文檔

1、網(wǎng)站畢業(yè)設(shè)計(jì)論文的_優(yōu)秀文檔 湖南現(xiàn)代物流職業(yè)技術(shù)學(xué)院畢業(yè)設(shè)計(jì)題 目 洛楓公司網(wǎng)站建設(shè)_系 部 物流信息系專 業(yè)電 子 商 務(wù)班 級(jí)電商1002班 姓 名 喻奇 指導(dǎo)教師 歐陽紅巍2012年12月09日摘 要 隨著計(jì)算機(jī)、網(wǎng)絡(luò)與通訊技術(shù)的發(fā)展,internet 在人們的生活、學(xué)習(xí)和工作的位置越來越重要,通過發(fā)布屬于公司的 web 站點(diǎn)宣傳推廣公司產(chǎn)品或開展公關(guān)活動(dòng)已成為一種趨勢(shì)。電子商務(wù)的發(fā)展使得企業(yè)管理模式和貿(mào)易模式發(fā)生了很大的改變,企業(yè)在發(fā)展和壯大自己的同時(shí)也非常的注重其自身信息化和商業(yè)化程度的提高,企業(yè)網(wǎng)站便成為一個(gè)企業(yè)展示自我和對(duì)外貿(mào)易的重要平臺(tái)。企業(yè)門戶性網(wǎng)站的建設(shè)和管理水平,直接影

2、響企業(yè)的網(wǎng)絡(luò)形象,擁有一個(gè)設(shè)計(jì)美觀、功能全面的門戶性網(wǎng)站,已經(jīng)成為企業(yè)網(wǎng)絡(luò)化建設(shè)的一個(gè)重要內(nèi)容。而web設(shè)計(jì)的健康發(fā)展依靠web標(biāo)準(zhǔn)的采用,沒有web標(biāo)準(zhǔn)就不會(huì)有真正的可訪問性和連貫的設(shè)計(jì)。不用web標(biāo)準(zhǔn),就跟不上時(shí)代。在這樣的標(biāo)準(zhǔn)時(shí)代,人們需要網(wǎng)頁更加容易擴(kuò)展,適合自動(dòng)數(shù)據(jù)交換,使其更加規(guī)整。而css,則實(shí)現(xiàn)了頁面內(nèi)容與樣式分離。鑒于web標(biāo)準(zhǔn),本論文著重對(duì)div+css布局與公司網(wǎng)站頁面實(shí)現(xiàn)進(jìn)行了分析;同時(shí)根據(jù)公司網(wǎng)站的需求,采用div+css實(shí)現(xiàn)了企業(yè)網(wǎng)站網(wǎng)頁的設(shè)計(jì),具體實(shí)現(xiàn)了公司首頁、公司簡介、公司文化、最新動(dòng)態(tài)、產(chǎn)品展示、蟲害知識(shí)、招聘信息、服務(wù)承諾、聯(lián)系我們、在線留言功能,系統(tǒng)功能

3、符合公司網(wǎng)站的需求?！娟P(guān)鍵詞】 企業(yè)網(wǎng)站 網(wǎng)頁設(shè)計(jì) 網(wǎng)站建設(shè)前 言 當(dāng)今世界已進(jìn)入信息時(shí)代,internet成為21世紀(jì)最受關(guān)注的行業(yè)之一,它的飛速發(fā)展和全球范圍的普及應(yīng)用正在給人類生活帶來革命性變化。網(wǎng)絡(luò)技術(shù)的發(fā)展也取得了巨大的成就,為網(wǎng)站開發(fā)提供了很好的技術(shù)支持。網(wǎng)站已經(jīng)成為現(xiàn)階段眾多企業(yè)不可或缺的網(wǎng)絡(luò)營銷平臺(tái),互聯(lián)網(wǎng)應(yīng)用規(guī)模正在不斷擴(kuò)大。其中,特別是中小型企業(yè),對(duì)于網(wǎng)絡(luò)平臺(tái)搭建的需求相當(dāng)?shù)钠惹?。各大門戶網(wǎng),企業(yè)網(wǎng)都在web2.0的標(biāo)準(zhǔn)上,采用div+css來布局.長沙市洛楓有害生物防治用品有限公司為拓展網(wǎng)絡(luò)銷售市場(chǎng),實(shí)施公司品牌宣傳,擬建立一個(gè)以公司宣傳和產(chǎn)品推廣為主要目的的企業(yè)網(wǎng)站。針

4、對(duì)該公司的需求,本課題設(shè)計(jì)了一個(gè)滿足其要求的信息發(fā)布類網(wǎng)站。本網(wǎng)站旨在宣傳公司形象及其產(chǎn)品推介。本網(wǎng)站主要實(shí)現(xiàn)以下幾方面功能:企業(yè)宣傳,發(fā)布企業(yè)相關(guān)信息,展示企業(yè)品牌形象,展示企業(yè)產(chǎn)品,實(shí)現(xiàn)產(chǎn)品推介、在線交流,從而需要對(duì)本網(wǎng)站的進(jìn)行設(shè)計(jì)和制作。 在網(wǎng)站設(shè)計(jì)過程中主要是采用dreamweaver制作,通過將6html語言、div+css布局和dreamweaver工具軟件整合應(yīng)用,結(jié)合photoshop軟件進(jìn)行網(wǎng)站圖片素材處理,從而實(shí)現(xiàn)網(wǎng)站的制作和建設(shè)。 論文詳細(xì)論述了一個(gè)基于公司網(wǎng)站開發(fā)的設(shè)計(jì)過程。在技術(shù)上,采用了 dreamweaver網(wǎng)站開發(fā)工具,以 html的超大功能結(jié)合 javascr

5、ipt 的客戶端語言,這樣的構(gòu)造有利于對(duì)網(wǎng)站系統(tǒng)開發(fā)。其中,最主要的就是介紹和展示div+css在網(wǎng)頁中的作用和魅力。 本文實(shí)現(xiàn)了公司首頁、公司簡介、公司文化、最新動(dòng)態(tài)、產(chǎn)品展示、蟲害知識(shí)、招聘信息、服務(wù)承諾、聯(lián)系我們、在線留言功能,系統(tǒng)基本符合公司網(wǎng)站的需求。論文組織如下:首先闡述了該網(wǎng)站建設(shè)的研究背景、意義以及網(wǎng)站建設(shè)的一般流程及其原則,然后進(jìn)行網(wǎng)站需求分析,接下來詳細(xì)介紹網(wǎng)站設(shè)計(jì)技術(shù):dreamweaver、photoshop制作工具、html語言、div+css、javascript代碼、淘寶客基本知識(shí),其次介紹了網(wǎng)站總體規(guī)劃以及網(wǎng)站頁面的實(shí)現(xiàn)。目錄前 言2第一章 緒論41.1 網(wǎng)站建

6、設(shè)的研究背景41.2 網(wǎng)站建設(shè)的一般流程及其原則5第二章 網(wǎng)站需求分析82.1 需求分析活動(dòng)92.2 用戶調(diào)查活動(dòng)92.3 市場(chǎng)調(diào)研10第三章 網(wǎng)站設(shè)計(jì)工具113.1 dreamweaver制作工具113.2 adobe photoshop軟件工具123.3 html語言123.4 div+css133.5 javascript代碼133.6 淘寶客15第四章 網(wǎng)站總體規(guī)劃174.1 網(wǎng)站首頁設(shè)計(jì)174.2 網(wǎng)站內(nèi)容設(shè)計(jì)174.3 網(wǎng)站功能設(shè)計(jì)184.4 網(wǎng)站結(jié)構(gòu)設(shè)計(jì)184.5 網(wǎng)站頁面可視化設(shè)計(jì)184.6 網(wǎng)站風(fēng)格184.7 網(wǎng)站的欄目和版塊設(shè)計(jì)19第五章 網(wǎng)站頁面實(shí)現(xiàn)205.1 網(wǎng)站功能分

7、析205.2 首頁設(shè)計(jì)205.3 內(nèi)頁設(shè)計(jì)235.4 部分技術(shù)實(shí)現(xiàn)32總 結(jié)35致 謝36參考文獻(xiàn)37第一章 緒論 隨著21世紀(jì)的到來,人們更深切地感受到計(jì)算機(jī)在生活和工作中的作用越來越重要,越來越多的職業(yè)需要具有計(jì)算機(jī)應(yīng)用技能型人才。掌握計(jì)算機(jī)是職業(yè)的需要,更是事業(yè)發(fā)展的需要。網(wǎng)頁設(shè)計(jì)與制作是計(jì)算機(jī)能力的具體表現(xiàn),本章主要介紹網(wǎng)站建設(shè)的研究背景和網(wǎng)站建設(shè)的一般流程及其原則。1.1 網(wǎng)站建設(shè)的研究背景 如今,互聯(lián)網(wǎng)對(duì)企業(yè)來說已經(jīng)不再是新鮮的事物了,大多數(shù)的企業(yè)都已經(jīng)建立了自己的網(wǎng)站。隨著互聯(lián)網(wǎng)的快速發(fā)展,網(wǎng)絡(luò)已成為人們生活的一部分。電子商務(wù)、網(wǎng)絡(luò)營銷已不再只是被炒做的概念,人們對(duì)其的認(rèn)識(shí)也越來

8、越深刻。不僅僅是大企業(yè)需要網(wǎng)站來開展電子商務(wù),中小企業(yè)一樣也迫切需要自己的企業(yè)網(wǎng)站用以實(shí)現(xiàn)宣傳和聯(lián)系客戶等許多傳統(tǒng)媒介無法完成的目標(biāo)。搭建網(wǎng)站模型需要各方面的資訊,而如何在網(wǎng)頁上正確明晰地表達(dá)企業(yè)的資訊,使企業(yè)達(dá)到建站的目的,對(duì)建設(shè)好企業(yè)網(wǎng)站是有非常大的意義的。可以說,有正確的建站思路再配合下文所講的具有普遍性的建站原理才能創(chuàng)造出真正的企業(yè)網(wǎng)站,而不是只在技術(shù)上苦苦追求完美,堆砌出華麗卻沒有實(shí)際意義的工藝品。 電子商務(wù)是一種新興的、處于發(fā)展過程中的現(xiàn)代商務(wù)方式,從95年來得到了迅速發(fā)展,顯現(xiàn)了巨大的現(xiàn)代商業(yè)價(jià)值。1997年歐洲、美國、新加坡等許多國家政府發(fā)表了電子商務(wù)發(fā)展綱要,其目的是引導(dǎo)全球

9、電子商務(wù)的自由競爭和健康發(fā)展,大力推動(dòng)電子商務(wù)的實(shí)踐。本國政府的發(fā)展綱要也將在近期出臺(tái),促進(jìn)本國企業(yè)適應(yīng)國際化的發(fā)展、參與國際競爭。有理由相信,在21世紀(jì),電子商務(wù)將逐漸成為社會(huì)生活的主要方式,也將成為數(shù)字化社會(huì)的基礎(chǔ)。 電子商務(wù)活動(dòng)是通過公共計(jì)算機(jī)通信網(wǎng)絡(luò)進(jìn)行商務(wù)活動(dòng)的現(xiàn)代方式,該方式將突破傳統(tǒng)商務(wù)在時(shí)間、地域上的限制,成為方便、快捷、安全可靠的新興電子化商務(wù)活動(dòng)模式。電子商務(wù)使現(xiàn)代商務(wù)活動(dòng)具有安全、可靠、快速、明確和方便的特點(diǎn),通過國際互聯(lián)網(wǎng)絡(luò)人們可隨時(shí)隨地開展電子商務(wù)活動(dòng)。由于電子商務(wù)涉及社會(huì)、經(jīng)濟(jì)、金融、法律以及生活等許多方面,故存在一定的困難和問題。其健康發(fā)展一方面要求人們的工作生活

10、方式、思想觀念和管理方法都將有根本的變革;另一方面國家宏觀控制和管理需要對(duì)電子商務(wù)進(jìn)行立法和規(guī)范;再者技術(shù)安全上必須完善可靠。電子商務(wù)的發(fā)展將逐步改變?nèi)藗兊纳罴肮ぷ鞣绞?原來面對(duì)面談判、紙上交流的管理與商務(wù)活動(dòng)方式逐步變成了由計(jì)算機(jī)遠(yuǎn)距離操作完成的數(shù)字化活動(dòng)方式。沒有了時(shí)間、空間和人為條件上的限制,人們的生活和工作將變得方便、靈活和自如。特別在獲取信息、傳輸信息、各種服務(wù)活動(dòng)、付款、送貨方式等方面將有根本的變化。任何合法組織和公司甚至個(gè)人通過在國際互聯(lián)網(wǎng)絡(luò)上建立自己的站點(diǎn)都可成為全球化的信息發(fā)布者;信息的獲取具有了廣泛的內(nèi)容和選擇性;貿(mào)易、商務(wù)活動(dòng)中的商品認(rèn)識(shí)、合同談判、交易都通過國際互聯(lián)網(wǎng)

11、信息和網(wǎng)絡(luò)軟件完成。企業(yè)行政管理將進(jìn)入電子化辦公方式,金融服務(wù)中的支票、柜臺(tái)、保險(xiǎn)、投資、企業(yè)銀行業(yè)務(wù)和家庭銀行業(yè)務(wù)將搬到網(wǎng)絡(luò)上進(jìn)行。數(shù)字化電子貨幣的使用與發(fā)展為人們進(jìn)行跨地域的商務(wù)金融活動(dòng)提供了方便條件。人類將不可避免地習(xí)慣與計(jì)算機(jī)共存,適應(yīng)電子商務(wù)時(shí)代的數(shù)字化生存。電子商務(wù)也完全改變了人們當(dāng)今的商務(wù)方式,由于沒有了時(shí)間和空間的限制,人們可以在家中處理各種業(yè)務(wù)。1.2 網(wǎng)站建設(shè)的一般流程及其原則 1、網(wǎng)站建設(shè)流程 一個(gè)網(wǎng)站的成功與否與網(wǎng)站制作前的規(guī)劃有著極為重要的關(guān)系。為使網(wǎng)站能夠達(dá)到預(yù)期的目的,滿足用戶要求,不僅需要在網(wǎng)站建設(shè)過程中與用戶方進(jìn)行良好的溝通與交流,更重要的是要遵循網(wǎng)站建設(shè)流程

12、,只有這樣,才能做到既不浪費(fèi)時(shí)間也能提高效率,又能保證網(wǎng)站的科學(xué)性、嚴(yán)謹(jǐn)性。一般將網(wǎng)站設(shè)計(jì)過程分為以下幾個(gè)階段: a、對(duì)網(wǎng)站需求的分析 首先要明確網(wǎng)站制作的目的和具體要求是什么,進(jìn)行網(wǎng)站的功能定位,從而確定網(wǎng)站制作類型。 b、根據(jù)需求來規(guī)劃設(shè)計(jì) 確定網(wǎng)站類型后,在正是建站前需要對(duì)網(wǎng)站進(jìn)行一系列的規(guī)劃與設(shè)計(jì)。網(wǎng)站規(guī)劃主要包括網(wǎng)站的類型選擇、主題設(shè)計(jì)、風(fēng)格設(shè)計(jì)、內(nèi)容設(shè)計(jì)、版面布局設(shè)計(jì)以及網(wǎng)站策劃書的撰寫等。網(wǎng)站規(guī)劃對(duì)網(wǎng)站建設(shè)起到計(jì)劃和指導(dǎo)作用,對(duì)網(wǎng)站的內(nèi)容和維護(hù)起到定位作用。這一環(huán)節(jié)的有無和好壞,不僅直接影響網(wǎng)站的整體效果,而且是網(wǎng)站發(fā)布后能否成功運(yùn)行的主要因素。 c、確認(rèn)好設(shè)計(jì)之后進(jìn)行美工操作、

13、網(wǎng)站制作 經(jīng)過精心設(shè)計(jì)的網(wǎng)站規(guī)劃方案最終要通過網(wǎng)頁表現(xiàn)出來,制作網(wǎng)頁是將網(wǎng)站規(guī)劃付諸實(shí)施的主要任務(wù)。在制作頁面前要考慮到網(wǎng)站的風(fēng)格和功能,要根據(jù)所建網(wǎng)站的特點(diǎn)做充分準(zhǔn)備,使網(wǎng)站的基本格調(diào)符合用戶的要求,使網(wǎng)站的功能滿足用戶的使用需求。 2、 網(wǎng)站建設(shè)原則 a、網(wǎng)站第一原則: 目的性 任何一個(gè)網(wǎng)站,首先必須具有明確的目的和目標(biāo)群體。網(wǎng)站是面對(duì)客戶、供應(yīng)商、消費(fèi)者還是全部? 主要目的是為了介紹企業(yè)、宣傳某種產(chǎn)品還是為了試驗(yàn)電子商務(wù)? 如果目的不是唯一的,還應(yīng)該清楚的列出不同目的的輕重關(guān)系。建站包括類型的選擇、內(nèi)容功能的籌備、界面設(shè)計(jì)等各個(gè)方面都受到目的性的直接影響, 因此目的性是一切原則的基礎(chǔ)。建

14、站的目的應(yīng)該是經(jīng)過成熟考慮的, 包含幾大要素:目的應(yīng)該是明確定義的,而不是籠統(tǒng)地說要做一個(gè)平臺(tái)、 要弄電子商務(wù), 應(yīng)該清楚主要希望誰來瀏覽,具體要做到哪些內(nèi)容, 提供怎樣的服務(wù),達(dá)到什么樣是效果。在當(dāng)前的資源環(huán)境下能夠?qū)崿F(xiàn)的, 而不能脫離了自身的人力、物力、互聯(lián)網(wǎng)基礎(chǔ)以及整個(gè)外部環(huán)境等因素盲目制定目標(biāo), 尤其是對(duì)外部環(huán)境的考慮通常容易被忽略,結(jié)果只能成為美好的一廂情愿。如果目標(biāo)比較龐大,應(yīng)該充分考慮各部分的輕重關(guān)系和實(shí)現(xiàn)的難易度, 想要一步登天的做法通常會(huì)導(dǎo)致投入過大且缺少頭緒,不如分清主次循序漸進(jìn)。在充分考慮了目的和目標(biāo)群體的特點(diǎn)以后, 再來選擇建站類型, 并相應(yīng)的安排適當(dāng)?shù)男畔?nèi)容和功能服

15、務(wù)。 b、網(wǎng)站第二原則: 專業(yè)性 信息內(nèi)容應(yīng)該充分展現(xiàn)企業(yè)的專業(yè)特性對(duì)外介紹企業(yè)自身,最主要的目的是向外界介紹企業(yè)的業(yè)務(wù)范圍、性質(zhì)和實(shí)力,從而創(chuàng)造更多的商機(jī)。在這里包括:應(yīng)該完整無誤的表述企業(yè)的業(yè)務(wù)范圍 產(chǎn)品、服務(wù)及主次關(guān)系、應(yīng)該詳細(xì)的介紹企業(yè)的地址、性質(zhì)、聯(lián)系方式、提供企業(yè)的年度報(bào)表、則有助于瀏覽者了解企業(yè)的經(jīng)營狀況、方針和實(shí)力。 c、網(wǎng)站第三原則: 實(shí)用性 網(wǎng)站提供的功能服務(wù)應(yīng)該是切合瀏覽者實(shí)際需求,并且符合企業(yè)特點(diǎn)。網(wǎng)站提供的功能服務(wù)必須保證質(zhì)量,包括:每個(gè)服務(wù)必須有清晰定義的流程,每個(gè)步驟需要什么條件、產(chǎn)生什么結(jié)果、由誰來操作、如何實(shí)現(xiàn)等都應(yīng)該是清晰無誤的,實(shí)現(xiàn)功能服務(wù)的程序必須是正確

16、的、健壯的、能夠及時(shí)響應(yīng)的、能夠應(yīng)付預(yù)想的、同時(shí)請(qǐng)求服務(wù)數(shù)峰值的。需要人工操作的功能服務(wù)應(yīng)該設(shè)有常備人員和相應(yīng)責(zé)權(quán)制度。用戶操作的每一個(gè)步驟完成后,應(yīng)該被提示當(dāng)前處于什么狀態(tài)。當(dāng)功能較多的時(shí)候應(yīng)該清楚的定義相互之間的輕重關(guān)系,并在界面上和服務(wù)響應(yīng)上加以體現(xiàn)。 d 、網(wǎng)站第四原則: 層次性 條理清晰的結(jié)構(gòu),表現(xiàn)為網(wǎng)站的板塊劃分的合理性,這里需要注意:板塊的劃分應(yīng)該有充分的依據(jù)并且是容易理解的。不同板塊的內(nèi)容盡量做到?jīng)]有交叉重復(fù)內(nèi)容,共性較多的內(nèi)容應(yīng)盡量劃分到同一板塊。在最表層盡量減少劃分的板塊數(shù)量, 通常控制在 4 6 之間比較合適。劃分后的結(jié)構(gòu)層次不宜過深, 通常不超5層為佳。在安排層次的時(shí)候

17、要充分考慮用戶操作, 比較常用的信息內(nèi)容、功能服務(wù)應(yīng)該盡量放到更淺的層次以減少用戶點(diǎn)擊次數(shù)。信息內(nèi)容的獲取和功能服務(wù)的過程都應(yīng)該盡量將所需要進(jìn)行的步驟控制在 3 5 步以內(nèi),不得不需要更多的步驟的時(shí)候應(yīng)該有明確的提示。 e、 網(wǎng)站第五原則: 藝術(shù)性 網(wǎng)頁創(chuàng)作本身已經(jīng)成了一種獨(dú)特的藝術(shù),要達(dá)到吸引眼球的目的,再結(jié)合界面設(shè)計(jì)的相關(guān)原理,形成了一種獨(dú)特的藝術(shù),這使得企業(yè)網(wǎng)站的設(shè)計(jì)應(yīng)該滿足:遵循基本的圖形設(shè)計(jì)原則,符合基本美學(xué)原理和排版原則。對(duì)于主題和次要對(duì)象的處理符合排版原理。全站的設(shè)計(jì)作為一個(gè)整體, 應(yīng)該具有整體的一致性。整體視覺效果特點(diǎn)鮮明:頁面版式結(jié)構(gòu);用色;線條和構(gòu)圖; 配圖的精細(xì)、觀程度;

18、 元素風(fēng)格;整體氣氛表達(dá);字體選用。整體風(fēng)格同企業(yè)形象相符合, 適于目標(biāo)對(duì)象的特點(diǎn)。第二章 網(wǎng)站需求分析 網(wǎng)站是企業(yè)向用戶和網(wǎng)民提供信息的一種方式,是企業(yè)開展電子商務(wù)的基礎(chǔ)設(shè)施和信息平臺(tái)。企業(yè)的網(wǎng)址被稱為“網(wǎng)絡(luò)商標(biāo)”,也是企業(yè)無形資產(chǎn)的組成部分,而網(wǎng)站則是反映企業(yè)形象和文化的重要窗口。 一個(gè)網(wǎng)站項(xiàng)目的確立是建立在各種各樣的需求之上的。這種需求往往來自于客戶的實(shí)際需求。由于網(wǎng)站需要面對(duì)不同層次的用戶,因此網(wǎng)站項(xiàng)目的負(fù)責(zé)人對(duì)用戶需求的理解,在很大程度上決定了此類網(wǎng)站開發(fā)項(xiàng)目的成敗。如何更好地了解、分析、明確用戶需求,并且能夠準(zhǔn)確、清晰地以文檔的形式表達(dá)給參與項(xiàng)目開發(fā)的每個(gè)成員,保證開發(fā)過程按照用戶

19、需求進(jìn)行,是每個(gè)網(wǎng)站開發(fā)項(xiàng)目管理者需要面對(duì)的問題。需求分析工作是網(wǎng)站建設(shè)中重要的一步,也是決定性的一步。只有通過需求分析,才能把網(wǎng)站功能的總體概念描述為具體的網(wǎng)站功能描述書,從而奠定網(wǎng)站開發(fā)的基礎(chǔ)。需求分析的目的是完整、準(zhǔn)確地描述用戶的需求,跟蹤用戶需求的變化,將用戶的需求準(zhǔn)確地反映到系統(tǒng)的分析和設(shè)計(jì)中,并使系統(tǒng)的分析、 設(shè)計(jì)與用戶的需求保持一致。 長沙市洛楓有害生物防治用品有限公司是一家專業(yè)從事白蟻、蟑螂、老鼠、蚊蠅、螞蟻、跳蚤、臭蟲、蜱等病媒生物防治及產(chǎn)品銷售的專業(yè)公司。該公司本著 “以人為本、誠信服務(wù)、口碑相傳、永續(xù)經(jīng)營”的服務(wù)原則,推崇“誠信、高效、安全、環(huán)?！钡目叵x理念,以改善和保護(hù)

20、人們的生活環(huán)境、自然環(huán)境為目的。 該公司為拓展網(wǎng)絡(luò)銷售市場(chǎng),實(shí)施公司品牌宣傳,擬建立一個(gè)以公司宣傳和產(chǎn)品推廣為主要目的的企業(yè)網(wǎng)站。針對(duì)該公司的需求,本課題設(shè)計(jì)了一個(gè)滿足其要求的信息發(fā)布類網(wǎng)站。本網(wǎng)站旨在宣傳公司形象及其產(chǎn)品推介。本網(wǎng)站主要實(shí)現(xiàn)以下幾方面功能:企業(yè)宣傳,發(fā)布企業(yè)相關(guān)信息,展示企業(yè)品牌形象,展示企業(yè)產(chǎn)品,實(shí)現(xiàn)產(chǎn)品推介、在線交流。與此同時(shí)借助了淘寶客的使用,點(diǎn)擊產(chǎn)品展示中的圖片,就可以鏈接到淘寶旗艦店,從而可以進(jìn)行產(chǎn)品的購買。 在網(wǎng)站設(shè)計(jì)過程中主要是采用dreamweaver制作,通過將html語言、div+css布局、javascript代碼,結(jié)合photoshop軟件進(jìn)行網(wǎng)站圖片

21、素材處理,從而實(shí)現(xiàn)網(wǎng)站的制作和建設(shè)。2.1 需求分析活動(dòng) 需求分析活動(dòng)其實(shí)本來就是一個(gè)和客戶交流,引導(dǎo)客戶能夠正確的將自己的實(shí)際需求用較為適當(dāng)?shù)募夹g(shù)語言進(jìn)行表達(dá),以明確項(xiàng)目的實(shí)現(xiàn)。這個(gè)過程中也同時(shí)包含了對(duì)要建立的網(wǎng)站基本功能和模塊的確立和策劃活動(dòng)?；顒?dòng)包括以下幾個(gè)部分: 1、與公司的負(fù)責(zé)人員進(jìn)行需求分析討論。 2、編寫網(wǎng)站開發(fā)項(xiàng)目描述書(初稿) 文檔。 3、網(wǎng)站開發(fā)項(xiàng)目描述書(初稿) 進(jìn)行反復(fù)討論和修改,確定網(wǎng)站開發(fā)項(xiàng)目描述書正式文檔。 4、需求分析中需要編寫的文檔主要是網(wǎng)站開發(fā)項(xiàng)目描述書,它基本上是整個(gè)需求分析活動(dòng)的結(jié)果性文檔,也是開發(fā)工程中項(xiàng)目成員主要可供參考的文檔。為了更加清楚的描述網(wǎng)站

22、開發(fā)項(xiàng)目描述書,往往還需要編寫用戶調(diào)查報(bào)告和市場(chǎng)調(diào)研報(bào)告文檔來輔助說明。各種文檔最好有一定的規(guī)范和固定格式,以便增加可閱讀性和方便閱讀者快速理解文檔內(nèi)容 。 為了建設(shè)符合公司要求的企業(yè)網(wǎng)站,本人去了公司進(jìn)行了公司資料的收集,和相關(guān)人員進(jìn)行了溝通,了解了其網(wǎng)站需實(shí)現(xiàn)的功能,并在次基礎(chǔ)上對(duì)于網(wǎng)站的定位達(dá)成了共識(shí)。2.2 用戶調(diào)查活動(dòng) 在需求分析的過程中,往往有很多模棱兩可的用戶需求,這個(gè)時(shí)候就需要調(diào)查用戶的實(shí)際情況,明確用戶需求。一個(gè)比較理想化的用戶調(diào)查活動(dòng)需要用戶的充分配合,而且還有可能需要對(duì)調(diào)查對(duì)象進(jìn)行必要的培訓(xùn)。所以調(diào)查的計(jì)劃安排如時(shí)間、地點(diǎn)、參加人員、調(diào)查內(nèi)容,都需要雙方的共同認(rèn)可。調(diào)查的

23、形式可以是:發(fā)需求調(diào)查表、開需求調(diào)查座談會(huì)或者現(xiàn)場(chǎng)調(diào)研 。 調(diào)查的內(nèi)容主要如下: 1、網(wǎng)站當(dāng)前以及日后可能出現(xiàn)的功能需求。 2、客戶對(duì)網(wǎng)站的性能的要求和可靠性的要求。 3、確定網(wǎng)站維護(hù)的要求。 4、網(wǎng)站的實(shí)際運(yùn)行環(huán)境。 5、網(wǎng)站頁面總體風(fēng)格以及美工效果。 6、主頁面和次級(jí)頁面數(shù)量,是否需要多種語言版本、內(nèi)容管理及錄入任的分配等。 7、各種頁面特殊效果及其數(shù)量。 8、項(xiàng)目完成時(shí)間及進(jìn)度。 9、明確項(xiàng)目完成后的維護(hù)責(zé)任。 調(diào)查結(jié)束以后,需要編寫用戶調(diào)查報(bào)告 。編寫用戶調(diào)查報(bào)告的要點(diǎn)是: 1、調(diào)查概要說明:網(wǎng)站項(xiàng)目的名稱;用戶單位;參與調(diào)查人員;調(diào)查開始終止的時(shí)間;調(diào)查的工作安排。 2、調(diào)查內(nèi)容說明

24、:用戶的基本情況;用戶的主要業(yè)務(wù);信息化建設(shè)現(xiàn)狀;網(wǎng)站當(dāng)前和將來潛在的功能需求、需求、可靠性需求、實(shí)際運(yùn)行環(huán)境;用戶對(duì)新網(wǎng)站的期望等。 3、調(diào)查資料匯編:將調(diào)查得到的資料分類匯總(如調(diào)查問卷,會(huì)議記錄等等)。 4、界面設(shè)計(jì)。2.3 市場(chǎng)調(diào)研 市場(chǎng)調(diào)研活動(dòng)內(nèi)容通過市場(chǎng)調(diào)研活動(dòng),清晰的分析相似網(wǎng)站的性能和運(yùn)行情況?？梢允贡救烁忧宄臉?gòu)想出網(wǎng)站的大體架構(gòu)。但是由于實(shí)際中時(shí)間、經(jīng)費(fèi)、公司能力所限,市場(chǎng)調(diào)研覆蓋的范圍有一定的局限性,在調(diào)研市場(chǎng)同類網(wǎng)站的時(shí)候,應(yīng)盡可能調(diào)研到所有比較出名和優(yōu)秀的同類網(wǎng)站。應(yīng)該了解同類網(wǎng)站的使用環(huán)境與用戶的差異點(diǎn)、類似點(diǎn),同類產(chǎn)品所定義的用戶詳細(xì)需求。市場(chǎng)調(diào)研的重點(diǎn)應(yīng)該放在

25、主要競爭對(duì)手的作品或類似網(wǎng)站作品的有關(guān)信息上。 市場(chǎng)調(diào)研可以包括下列內(nèi)容: 1 、市場(chǎng)中同類網(wǎng)站作品的確定。 2、調(diào)研作品的使用范圍和訪問人群。 3、調(diào)研產(chǎn)品的功能設(shè)計(jì)(主要模塊構(gòu)成,特色功能,性能情況等等)。 4、簡單評(píng)價(jià)所調(diào)研的網(wǎng)站情況。調(diào)研的目的是明確并且引導(dǎo)用戶需求。對(duì)市場(chǎng)同類產(chǎn)品調(diào)研結(jié)束后,應(yīng)該撰寫市場(chǎng)調(diào)研報(bào)告 。 第三章 網(wǎng)站設(shè)計(jì)工具3.1 dreamweaver制作工具 dreamweaver是在網(wǎng)頁設(shè)計(jì)與制作領(lǐng)域中用戶最多、應(yīng)用最廣、功能最強(qiáng)大的軟件,隨著dreamweaver 8的發(fā)布,更堅(jiān)定dreamweaver在該領(lǐng)域的地位。它集網(wǎng)頁設(shè)計(jì)、網(wǎng)站開發(fā)和站點(diǎn)管理功能于一身,具

26、有可視化、支持多平臺(tái)和跨瀏覽器的特性,是目前網(wǎng)站設(shè)計(jì)、開發(fā)、制作的首選工具。 1、靈活的編寫方式dreamweaver具有靈活編寫網(wǎng)頁的特點(diǎn),不但將世界一流水平的“設(shè)計(jì)”和“代碼”編輯器合二為一,而且在設(shè)計(jì)窗口中還精化了源代碼,能幫助用戶按工作需要定制自己的用戶界面。 2、可視化編輯界面dreamweaver是一種所見即所得的html編輯器,可實(shí)現(xiàn)頁面元素的插入和生成?；蛞暬庉嫮h(huán)境大量減少了代碼的編寫,同時(shí)亦保證了其專業(yè)性和兼容性,并且可以對(duì)內(nèi)部的html編輯器和任何第三方的html編輯器進(jìn)行實(shí)時(shí)的訪問。無論用戶習(xí)慣手工輸入html源代碼還是使用可視化的編輯界面,dreamweaver都能提

27、供便捷的方式使用戶設(shè)計(jì)網(wǎng)頁和管理網(wǎng)站變得更容易。 3、功能更多的css支持?css可視化設(shè)計(jì)、css檢查工具 4、動(dòng)態(tài)跨瀏覽器驗(yàn)證當(dāng)保存時(shí)系統(tǒng)自動(dòng)檢查當(dāng)前文檔的跨瀏覽器有效性,可以指定何種瀏覽器為測(cè)試用瀏覽器,同時(shí)系統(tǒng)自動(dòng)檢驗(yàn)以確定頁面有沒有目標(biāo)瀏覽器不支持的tags或css結(jié)構(gòu)。動(dòng)態(tài)跨瀏覽器有效性檢查功能可以自動(dòng)核對(duì)tags和css規(guī)則是否適應(yīng)目前的主瀏覽器。 5、強(qiáng)大的web站點(diǎn)管理功能 6、內(nèi)建的圖形編輯引擎 7、dreamweaver的集成特性dreamweaver 8、繼承了fireworks、flash和shockwave的集成特性,可以在這些web創(chuàng)作工具之間自由地切換,輕松地創(chuàng)

28、建美觀實(shí)用的網(wǎng)頁。 9、豐富的媒體支持能力可以方便地加入java、flash、shockwave、activex以及其他媒體。dreamweaver具有強(qiáng)大的多媒體處理功能,在設(shè)計(jì)dhtml和css方面表現(xiàn)得極為出色,它利用javascript和dhtml語言代碼輕松地實(shí)現(xiàn)網(wǎng)頁元素的動(dòng)作和交互操作。dreamweaver還提供行為和時(shí)間線兩種控件來產(chǎn)生交互式響應(yīng)和進(jìn)行動(dòng)畫處理。9、超強(qiáng)的擴(kuò)展能力dreamweaver還支持第三方插件,任何人都可以根據(jù)自己的需要擴(kuò)展dreamweaver的功能,并且可以發(fā)布這些插件。3.2 adobe photoshop軟件工具 photoshop 8.0是目前

29、最流行的圖形、圖像編輯設(shè)計(jì)軟件,在數(shù)碼影像處理、圖像編輯合成、廣告設(shè)計(jì)、封面設(shè)計(jì)、美術(shù)繪畫、網(wǎng)頁設(shè)計(jì)等領(lǐng)域都被廣泛地應(yīng)用。 1、文字處理更加方便 2、增加的圖層集使圖層管理更有序。 3、新增圖像功能:圖像的剪切和剪裁更加方便。 4、將所有工具的選項(xiàng)板改進(jìn)為工具選項(xiàng)欄放置在工作區(qū)頂部,方便先項(xiàng)參數(shù)的設(shè)置。 5、為了更方便地用路徑繪畫,改進(jìn)增加了幾何形狀工具,通過選擇工具的不同工作模式,可創(chuàng)建路徑、幾何形狀或幾何填充區(qū),使得矢量繪圖功能得到了加強(qiáng)。3.3 html語言 html(hypertext mark-up language)即超文本標(biāo)記語言或超文本鏈接標(biāo)示語言,是目前網(wǎng)絡(luò)上應(yīng)用最為廣泛的語

30、言,也是構(gòu)成網(wǎng)頁文檔的主要語言。html文本是由html命令組成的描述性文本,html命令可以說明文字、圖形、動(dòng)畫、聲音、表格、鏈接等。html的結(jié)構(gòu)包括頭部(head)、主體(body)兩大部分,其中頭部描述瀏覽器所需的信息,而主體則包含所要說明的具體內(nèi)容。 html文檔制作不是很復(fù)雜,且功能強(qiáng)大,支持不同數(shù)據(jù)格式的文件鑲?cè)?這也是盛行的原因之一,其主要特點(diǎn)如下: 1、簡易性,html版本升級(jí)采用超集方式,從而更加靈活方便。 2、可擴(kuò)展性,html語言的廣泛應(yīng)用帶來了加強(qiáng)功能,增加標(biāo)識(shí)符等要求,html采取子類元素的方式,為系統(tǒng)擴(kuò)展帶來保證。 3、平臺(tái)無關(guān)性。雖然pc機(jī)大行其道,但使用mac

31、等其他機(jī)器的大有人在,html可以使用在廣泛的平臺(tái)上,這也是盛行的另一個(gè)原因。 3.4 div+css div+css是網(wǎng)站標(biāo)準(zhǔn)中常用術(shù)語之一,div+css 是一種網(wǎng)頁的布局方法,這一種網(wǎng)頁布局方法有別于傳統(tǒng)的html網(wǎng)頁設(shè)計(jì)語言中的表格定位方式,真正地達(dá)到了w3c內(nèi)容與表現(xiàn)相分離。html語言自html4.01以來,不再發(fā)布新版本,原因就在于html語言正變得越來越復(fù)雜化、專用化。xhtml語言是一種可以將html語言標(biāo)準(zhǔn)化,用xhtml語言重寫后的html頁面可以應(yīng)用許多xml應(yīng)用技術(shù)。使得網(wǎng)頁更加容易擴(kuò)展,適合自動(dòng)數(shù)據(jù)交換,并且更加規(guī)整。在xhtml網(wǎng)站設(shè)計(jì)標(biāo)準(zhǔn)中,不再使用表格定位技術(shù)

32、,而是采用div+css的方式實(shí)現(xiàn)各種定位。以下是div+css的特點(diǎn)簡介: 1、 符合w3c標(biāo)準(zhǔn)。微軟等公司均為w3c支持者。這一點(diǎn)是最重要的,因?yàn)檫@保證您的網(wǎng)站不會(huì)因?yàn)閷砭W(wǎng)絡(luò)應(yīng)用的升級(jí)而被淘汰。 2、 支持瀏覽器的向后兼容,也就是無論未來的瀏覽器大戰(zhàn),勝利的是ie7或者是火狐,您的網(wǎng)站都能很好的兼容。 3、 搜索引擎更加友好。相對(duì)與傳統(tǒng)的table, 采用div+css技術(shù)的網(wǎng)頁,對(duì)于搜索引擎的收錄更加友好。 4、 樣式的調(diào)整更加方便。內(nèi)容和樣式的分離,使頁面和樣式的調(diào)整變得更加方便。 現(xiàn)在yahoo,msn等國際門戶網(wǎng)站,網(wǎng)易,新浪等國內(nèi)門戶網(wǎng)站,和主流的web2.0網(wǎng)站,均采用div

33、+css的框架模式,更加印證了div+css是大勢(shì)所趨。 5、 css的極大優(yōu)勢(shì)表現(xiàn)在簡潔的代碼,對(duì)于一個(gè)大型網(wǎng)站來說,可以節(jié)省大量帶寬,而且眾所周知,搜索引擎喜歡清潔的代碼。 6、 表現(xiàn)和結(jié)構(gòu)分離,在團(tuán)隊(duì)開發(fā)中更容易分工合作而減少相互關(guān)聯(lián)性。3.5 javascript代碼 javascript是一種基于對(duì)象和事件驅(qū)動(dòng)并具有相對(duì)安全性的客戶端腳本語言。同時(shí)也是一種廣泛用于客戶端web開發(fā)的腳本語言,常用來給html網(wǎng)頁添加動(dòng)態(tài)功能,比如響應(yīng)用戶的各種操作。它最初由網(wǎng)景公司的brendan eich設(shè)計(jì),是一種動(dòng)態(tài)、弱類型、基于原型的語言,內(nèi)置支持類。javascript是sun公司的注冊(cè)商標(biāo)

34、。ecma國際以javascript為基礎(chǔ)制定了ecmascript標(biāo)準(zhǔn)。javascript也可以用于其他場(chǎng)合,如服務(wù)器端編程。完整的javascript實(shí)現(xiàn)包含三個(gè)部分:ecmascript,文檔對(duì)象模型,字節(jié)順序記號(hào)。 netscape公司在最初將其腳本語言命名為livescript。在netscape在與sun合作之后將其改名為javascript。javascript最初受java啟發(fā)而開始設(shè)計(jì)的,目的之一就是“看上去像java”2,因此語法上有類似之處,一些名稱和命名規(guī)范也借自java。但javascript的主要設(shè)計(jì)原則源自self和scheme3.javascript與java

35、名稱上的近似,是當(dāng)時(shí)網(wǎng)景為了營銷考慮與sun公司達(dá)成協(xié)議的結(jié)果。為了取得技術(shù)優(yōu)勢(shì),微軟推出了jscript來迎戰(zhàn)javascript的腳本語言。為了互用性,ecma國際(前身為歐洲計(jì)算機(jī)制造商協(xié)會(huì))創(chuàng)建了ecma-262標(biāo)準(zhǔn)(ecmascript)?，F(xiàn)在兩者都屬于ecmascript的實(shí)現(xiàn)。盡管javascript作為給非程序人員的腳本語言,而非作為給程序人員的編程語言來推廣和宣傳,但是javascript具有非常豐富的特性。 javascript代碼能夠具有交互性,能夠包含更多活躍的元素,就有必要在網(wǎng)頁中嵌入其它的技術(shù)。如:javascript、vbscript、document objec

36、t model(dom,文檔對(duì)象模型)、layers和cascading style sheets(css,層疊樣式表),這里主要講javascript。那么javascript是什么東東?javascript就是適應(yīng)動(dòng)態(tài)網(wǎng)頁制作的需要而誕生的一種新的編程語言,如今越來越廣泛地使用于internet網(wǎng)頁制作上。javascript是由 netscape公司開發(fā)的一種腳本語言,或者稱為描述語言。在html基礎(chǔ)上,使用javascript可以開發(fā)交互式web網(wǎng)頁。javascript的出現(xiàn)使得網(wǎng)頁和用戶之間實(shí)現(xiàn)了一種實(shí)時(shí)性的、動(dòng)態(tài)的、交互性的關(guān)系,使網(wǎng)頁包含更多活躍的元素和更加精彩的內(nèi)容。運(yùn)行用j

37、avascript編寫的程序需要能支持javascript語言的瀏覽器。netscape公司 navigator 3.0以上版本的瀏覽器都能支持javascript程序,微軟公司internet explorer 3.0以上版本的瀏覽器基本上支持javascript。微軟公司還有自己開發(fā)的javascript,稱為jscript。javascript和jscript基本上是相同的,只是在一些細(xì)節(jié)上有出入。 javascript短小精悍,又是在客戶機(jī)上執(zhí)行的,大大提高了網(wǎng)頁的瀏覽速度和交互能力。 同時(shí)它又是專門為制作web網(wǎng)頁而量身定做的一種簡單的編程語言。 javascript 使網(wǎng)頁增加互動(dòng)

38、性。javascript 使有規(guī)律地重復(fù)的html文段簡化,減少下載時(shí)間。javascript 能及時(shí)響應(yīng)用戶的操作,對(duì)提交表單做即時(shí)的檢查,無需浪費(fèi)時(shí)間交由cgi 驗(yàn)證。javascript 的特點(diǎn)是無窮無盡的,只要你有創(chuàng)意。3.6 淘寶客 淘寶客是指通過互聯(lián)網(wǎng)幫助淘寶賣家推廣商品,并按照成交效果獲得傭金的人或者集體(可以是個(gè)人、網(wǎng)站、團(tuán)體、公司)。 1、組成模式 在淘寶客中,有淘寶聯(lián)盟、賣家、淘客以及買家四個(gè)角色,他們每個(gè)都是不可缺失的一環(huán),如圖所示。 圖 3.1 淘寶聯(lián)盟組成模式 (1)淘寶聯(lián)盟:一個(gè)推廣平臺(tái),幫助賣家推廣產(chǎn)品;幫助淘客賺取利潤,每筆推廣的交易抽取10%的服務(wù)費(fèi)用。 (2

39、)賣家:傭金支出者,他們提供自己需要推廣的商品到淘寶聯(lián)盟,并設(shè)置每賣出一個(gè)產(chǎn)品愿意支付的傭金。 (3)淘寶客:傭金賺取者,他們?cè)谔詫毬?lián)盟中找到賣家發(fā)布的產(chǎn)品,并且推廣出去,當(dāng)有買家通過自己的推廣鏈接成交后,那么就能夠賺到賣家提供的傭金(其中一部分需要作為淘寶聯(lián)盟的服務(wù)費(fèi))。 (4)買家:就是單純的購買者。2、發(fā)展歷程 2009年1月12日起,國內(nèi)網(wǎng)絡(luò)營銷平臺(tái)“淘客推廣平臺(tái)”正式更名為淘寶客,意味著大淘寶戰(zhàn)略實(shí)施后,原淘客推廣平臺(tái)與淘寶交易平臺(tái)的進(jìn)一步整合的完成! 2010年3月19日消息,基于淘寶客的“淘寶聯(lián)盟”已悄然成型,淘寶網(wǎng)將在近日針對(duì)中小站長以及網(wǎng)絡(luò)合作伙伴推出這一平臺(tái)。所有用戶都可以

40、自由申請(qǐng)加入淘寶聯(lián)盟,當(dāng)通過注冊(cè)申請(qǐng)后,即可成為一名“淘寶客”。 目前淘寶客的推廣是一種按成交計(jì)費(fèi)的推廣模式,淘寶客只要從淘寶客推廣專區(qū)獲取商品代碼,任何買家(包括您自己)經(jīng)過您的推廣(鏈接、個(gè)人網(wǎng)站,博客或者社區(qū)發(fā)的帖子)進(jìn)入淘寶賣家店鋪完成購買后,就可得到由賣家支付的傭金。 3、具體形式 淘寶客推廣目前主要可以分成如下2大類: (1)擁有獨(dú)立平臺(tái)的專業(yè)淘寶客:這類淘寶客精通網(wǎng)站技術(shù),搭建專業(yè)的平臺(tái),如淘寶客返利網(wǎng)站(惠集網(wǎng),返利,等)、獨(dú)立博客、商品導(dǎo)購平臺(tái)、用戶分享網(wǎng)站(美麗說)等來吸引客戶,賺取一定的傭金。 (2)自由的淘寶客:這類淘寶客沒有固定的推廣方式,不管技術(shù)還是實(shí)力都不是很雄厚

41、,主要論壇、博客、sns平臺(tái),或者微博、郵件、q群等作為推廣方式。很適合大眾新手。 第四章 網(wǎng)站總體規(guī)劃 隨著互聯(lián)網(wǎng)的普及和發(fā)展, 電子商務(wù)成為企業(yè)和商家的最終選擇,它具有開放性、國際性、實(shí)時(shí)性、互動(dòng)性和低成本的特點(diǎn),越來越受到企業(yè)的青睞。而企業(yè)要實(shí)現(xiàn)電子商務(wù)活動(dòng)則必須依賴于電子商務(wù)網(wǎng)站。所謂電子商務(wù)網(wǎng)站是企業(yè)開展電子商務(wù)的基礎(chǔ)設(shè)施和信息平臺(tái),是實(shí)施電子商務(wù)的公司或商家與服務(wù)對(duì)象的交互頁面,是電子商務(wù)系統(tǒng)運(yùn)轉(zhuǎn)的承擔(dān)者和表現(xiàn)者。無論是什么樣的企業(yè),電子商務(wù)網(wǎng)站都是企業(yè)在互聯(lián)網(wǎng)平臺(tái)上與客戶交流的一個(gè)窗口,是買賣雙方信息交流與傳遞的渠道,是企業(yè)宣傳其形象,展示其產(chǎn)品與服務(wù)的平臺(tái)。電子商務(wù)網(wǎng)站的設(shè)計(jì)是

42、否合理,功能是否齊全,用戶使用是否方便,安全是否得到保障是企業(yè)實(shí)現(xiàn)電子商務(wù)成敗的關(guān)鍵。4.1 網(wǎng)站首頁設(shè)計(jì) 首頁設(shè)計(jì)是一個(gè)網(wǎng)站成功與否的關(guān)鍵。是否能夠吸引瀏覽者留在站點(diǎn)上,是不是能夠促使瀏覽者繼續(xù)點(diǎn)擊進(jìn)入,全憑首頁設(shè)計(jì)的效果。所以,首頁的設(shè)計(jì)和制作必須高度重視。從根本上說,首頁就是全站內(nèi)容的目錄,也是一個(gè)索引。但不能只是簡單地羅列目錄,要設(shè)計(jì)好一個(gè)首頁,必須做好以下幾方面的工作:一是要確定好首頁的功能模塊,如網(wǎng)站名稱、主菜單、新聞、友情鏈接、版權(quán)等;二是要設(shè)計(jì)好首頁的版面,在網(wǎng)站功能模塊確定后,要開始設(shè)計(jì)首頁的版面;三是首頁的內(nèi)容要緊扣主題,不要太過繁雜;四是要確保首頁能夠快速安全訪問;五是首

43、頁的結(jié)構(gòu)要簡單清晰;六是首頁的色彩搭配要合理,不要使用過多的顏色?？傊?首頁的規(guī)劃應(yīng)該是:主題鮮明而富有特色、內(nèi)容精煉而新穎、結(jié)構(gòu)簡單而清晰、訪問安全而快速、功能完善而易用、 布局合理而高雅、色彩鮮明而和諧,具有親和力和吸引力,能夠留住以前的訪問者和不斷吸引新的訪問者。4.2 網(wǎng)站內(nèi)容設(shè)計(jì) 信息內(nèi)容是網(wǎng)站的核心與靈魂,是網(wǎng)站最根本的要素。如果說網(wǎng)站架構(gòu)是骨架, 那么網(wǎng)站內(nèi)容就是血和肉,是瀏覽者了解企業(yè)的關(guān)鍵。 在確定網(wǎng)站內(nèi)容時(shí),第一, 要保證網(wǎng)站的內(nèi)容要新穎、精煉、專業(yè)、準(zhǔn)確、真實(shí); 第二,雖然圖像、聲音和視頻信息能夠比普通文本提供更豐富和更直接的信息,產(chǎn)生更大的吸引力,但由于目前網(wǎng)絡(luò)速度的限

44、制文本字符可提供較快的瀏覽速度,因此,圖像和多媒體信息的使用要適中。另外減少文件數(shù)量和大小也是必要的。第三,網(wǎng)站內(nèi)容要及時(shí)更新,經(jīng)常維護(hù)更新,給用戶提供最新的信息,是網(wǎng)站增加吸引力的重要手段。4.3 網(wǎng)站功能設(shè)計(jì) 在進(jìn)行網(wǎng)站功能設(shè)計(jì)時(shí),首先要知道網(wǎng)站的具體內(nèi)容,所以網(wǎng)站的功能和網(wǎng)站所提供的內(nèi)容息息相關(guān)。在進(jìn)行企業(yè)網(wǎng)站功能設(shè)計(jì)時(shí)應(yīng)該進(jìn)行網(wǎng)站需求分析,網(wǎng)站功能的設(shè)計(jì)取決于網(wǎng)站的目標(biāo)和規(guī)模,所以在進(jìn)行網(wǎng)站功能設(shè)計(jì)時(shí),首先要確定網(wǎng)站的目標(biāo)和規(guī)模,在此基礎(chǔ)上再?zèng)Q定網(wǎng)站應(yīng)該具有哪些功能,從而才能符合網(wǎng)站實(shí)際需求。4.4 網(wǎng)站結(jié)構(gòu)設(shè)計(jì) 為了實(shí)現(xiàn)信息的有效傳遞,使訪問者方便快速地查找所需要的信息,也為了便于網(wǎng)

45、站正式運(yùn)行后網(wǎng)站的更新和維護(hù),網(wǎng)站結(jié)構(gòu)設(shè)計(jì)十分重要。網(wǎng)站的結(jié)構(gòu)包括網(wǎng)站的目錄結(jié)構(gòu)和網(wǎng)站的鏈接結(jié)構(gòu)。規(guī)劃合理的目錄結(jié)構(gòu)對(duì)于網(wǎng)站所有者來說,可以在以后的內(nèi)容更新和維護(hù)中,節(jié)省大量的時(shí)間和精力。目錄結(jié)構(gòu)是一個(gè)容易忽略的問題,很多網(wǎng)站都是未經(jīng)規(guī)劃,隨意創(chuàng)建目錄和子目錄。目錄結(jié)構(gòu)的好壞,對(duì)瀏覽者并沒有什么太大的影響,但是對(duì)于站點(diǎn)本身的上傳維護(hù)、未來的內(nèi)容擴(kuò)充和移植有著重要的影響。4.5 網(wǎng)站頁面可視化設(shè)計(jì) 頁面可視化設(shè)計(jì)主要包括頁面組織效果、頁面色調(diào)效果、頁面版式設(shè)計(jì)、頁面美術(shù)設(shè)計(jì)等幾方面內(nèi)容。在頁面組織過程中,可以運(yùn)用對(duì)比與調(diào)和、對(duì)稱與平衡、節(jié)奏與韻律以及留白等手段。在網(wǎng)頁配色中,還應(yīng)該注意:一是不要

46、將所有顏色都用到,盡量控制在三種色彩以內(nèi);二是背景和前景的對(duì)比盡量要大,絕對(duì)不要用花紋繁復(fù)的圖案作背景,以便突出主要文字內(nèi)容。對(duì)于版面布局的設(shè)計(jì),應(yīng)當(dāng)重視如下原則:加強(qiáng)視覺效果,加強(qiáng)文字圖案的可視度和可讀性;統(tǒng)一感的視覺;新鮮和個(gè)性是布局的最高境界。4.6 網(wǎng)站風(fēng)格 網(wǎng)站的整體風(fēng)格是人們最希望掌握,也是最難以掌握的。其難點(diǎn)在于沒有一個(gè)固定的模式可以參照和模仿。如果要設(shè)計(jì)和普通網(wǎng)站有區(qū)別的站點(diǎn),則必須要研究網(wǎng)站的整體風(fēng)格。風(fēng)格是抽象的,是指站點(diǎn)的整體形象給瀏覽者的綜合感受;風(fēng)格是獨(dú)特的,是一個(gè)站點(diǎn)不同于其他網(wǎng)站的地方,或者色彩、或者技術(shù)、或者交互性; 風(fēng)格是有人性的,通過網(wǎng)站的外表、內(nèi)容、文字和

47、交流,可以概括一個(gè)網(wǎng)站的個(gè)性。4.7 網(wǎng)站的欄目和版塊設(shè)計(jì) 設(shè)計(jì)網(wǎng)站的中心工作之一, 就是設(shè)置網(wǎng)站的欄目和版塊。欄目的實(shí)質(zhì)是網(wǎng)站的大綱索引,索引應(yīng)該將網(wǎng)站的主體明確地顯示出來。在制定欄目的時(shí)候,要仔細(xì)考慮,合理安排。一般的網(wǎng)站欄目安排要注意以下幾方面:一是緊扣主題;二是設(shè)立一個(gè)最近更新或網(wǎng)站指南欄目; 三是設(shè)定一個(gè)可以雙向交流的欄目;四是設(shè)計(jì)一個(gè)下載或常見問題解答欄目。版塊比欄目的概念要大一些,每個(gè)版塊都有自己的欄目。例如,網(wǎng)易的站點(diǎn)分新聞、體育、財(cái)經(jīng)、娛樂、教育等版塊,每個(gè)版塊下面還有各自的主欄目。一般的個(gè)人站點(diǎn)內(nèi)容少,只有主欄目就夠了。根據(jù)以上幾點(diǎn),設(shè)計(jì)了網(wǎng)站的整體結(jié)構(gòu):網(wǎng)站的前臺(tái)頁面包括

48、公司首頁、公司簡介、公司文化、最新動(dòng)態(tài)、產(chǎn)品展示、蟲害知識(shí)、招聘信息、服務(wù)承諾、聯(lián)系我們、在線留言等。圖4.1網(wǎng)站總體結(jié)構(gòu)圖第五章 網(wǎng)站頁面實(shí)現(xiàn) 有了網(wǎng)站設(shè)計(jì)的基礎(chǔ),企業(yè)網(wǎng)站的需求,技術(shù)的支持等一系列的準(zhǔn)備之后就可以開始設(shè)計(jì)一個(gè)網(wǎng)站了,下面就說說長沙洛楓有害生物防治有限公司企業(yè)網(wǎng)站的頁面實(shí)現(xiàn)。5.1 網(wǎng)站功能分析 將要做的是一個(gè)公司網(wǎng)站,該公司是一家專業(yè)從事白蟻、蟑螂、老鼠、蚊蠅、螞蟻、跳蚤、臭蟲、蜱等病媒生物防治及產(chǎn)品銷售的專業(yè) pco公司。因此建設(shè)網(wǎng)站的目的主要有兩個(gè):一是使瀏覽者或潛在的客戶迅速了解公司,這就要求網(wǎng)站的文字要簡練,盡量減少大篇幅的文字?jǐn)⑹?項(xiàng)目效果圖要精彩,當(dāng)然網(wǎng)頁的頁面

49、效果也要漂亮,以使瀏覽者或潛在的客戶感覺到公司的實(shí)力和品牌;二是使瀏覽者或潛在的客戶迅速了解及熟悉公司的相關(guān)產(chǎn)品。 建立公司網(wǎng)站要有一個(gè)清晰的網(wǎng)站布局。比如說,導(dǎo)航條要不要?很多人說那東西人人在做,就顯得太俗沒個(gè)性,難顯示出新潮。但導(dǎo)航條之所以有那么多人在用,是因?yàn)樗o瀏覽者一個(gè)明確的布局,便利人們查找本身所需的信息。從某種角度上說,大家都在用的東西就說明它確實(shí)被大家所接受。要清楚網(wǎng)站做出來是給每一個(gè)人普通用戶看的。網(wǎng)站還要經(jīng)常更新,給人以新意。 網(wǎng)站的前臺(tái)頁面包括公司首頁、公司簡介、公司文化、最新動(dòng)態(tài)、產(chǎn)品展示、蟲害知識(shí)、招聘信息、服務(wù)承諾、聯(lián)系我們、在線留言等。5.2 首頁設(shè)計(jì) 有了基于準(zhǔn)

50、備之后的網(wǎng)站策劃,就可以開始進(jìn)行頁面設(shè)計(jì)了,頁面設(shè)計(jì)主要包括創(chuàng)意、色彩和版式三個(gè)方面。創(chuàng)意會(huì)使網(wǎng)頁在眾多的競爭對(duì)手中脫穎而出;色彩可以使網(wǎng)頁獲得生命的力量;板式則是和用戶溝通的核心,所以這三者缺一不可。 一般的網(wǎng)站都需要這樣一些版塊站名稱、廣告區(qū),導(dǎo)航區(qū)、新聞區(qū)、友情鏈接和版權(quán)等版塊。這些版塊又可以稱之為模塊。選擇哪些模塊,實(shí)現(xiàn)哪些功能是否需要添加其他模塊都是首頁設(shè)計(jì)制作時(shí)首先需要確定的,下面就開始具體的首頁設(shè)計(jì)制作工作。 1、網(wǎng)站首頁結(jié)構(gòu) 根據(jù)需求可以知道,版面布局采用的是 css 定位、層、和表格等技術(shù),css 可以很方便地修改網(wǎng)頁的格式、減小網(wǎng)頁的體積、輕松增加網(wǎng)頁的特殊效果,用 css

51、 固定好每個(gè)區(qū)域要放置的內(nèi)容后,再附加用層或表格;頁面結(jié)構(gòu)是 logo 于整個(gè)頁面的頭部, 然后是 banner 和導(dǎo)航條,中間是網(wǎng)頁的主要內(nèi)容,最底層是版權(quán)。 這種結(jié)構(gòu)既美觀又符合人們的瀏覽習(xí)慣。 圖 5.1 頁面布局圖 2、風(fēng)格定位 打開一個(gè)網(wǎng)站,給用戶留下第一印象的既不是網(wǎng)站豐富的內(nèi)容,也不是網(wǎng)站合理的版面布局,而是網(wǎng)站的色彩。色彩對(duì)人的視覺效果非常明顯,一個(gè)網(wǎng)站設(shè)計(jì)成功與否,在某種程度上取決于色彩的運(yùn)用和搭配。因?yàn)榫W(wǎng)頁設(shè)計(jì)屬于一種平面效果設(shè)計(jì),在排除立體圖形、動(dòng)畫效果之外,在平面圖上,色彩的沖擊力是最強(qiáng)的,它很容易給用戶留下深刻的印象。因此,在設(shè)計(jì)網(wǎng)頁時(shí),必須要高度重視色彩的搭配。 本

52、網(wǎng)站的搭配主色為:白、淡藍(lán)、綠、三種顏色。白色代表純潔、純真、樸素、神圣、明快。淡藍(lán)色代表熱情、活潑、熱鬧、溫暖、幸福、吉祥。綠色代表心情平靜,心曠神怡,安詳嫻靜,心情很安定、舒適,充分代表了一個(gè)企業(yè)應(yīng)有的氣質(zhì)和形象。給客戶留下深刻的印象。 3、頁頭設(shè)計(jì) 網(wǎng)站的頁頭主要分為兩個(gè)部分。一是logo,logo是一張公司的標(biāo)志圖,直接放置在頭部容器左側(cè),調(diào)整好位置;二是導(dǎo)航條,網(wǎng)站導(dǎo)航條因?yàn)橛辛Ⅲw感效果,因此它需要脫離文本流,因此在控制樣式的時(shí)候要用定位,相對(duì)于文本流的定位。網(wǎng)站的導(dǎo)航欄目可以讓用戶對(duì)網(wǎng)站的內(nèi)容及信息一目了然。導(dǎo)航分為:公司首頁、公司簡介、公司文化、最新動(dòng)態(tài)、產(chǎn)品展示、蟲害知識(shí)、招聘信息、服務(wù)承諾、聯(lián)系我們、在線留言。 4、banner