1、<p>　　專 科 生 畢 業(yè) 論 文</p><p>　　題 目： 企業(yè)網(wǎng)站分析與設(shè)計(jì) </p><p>　　院 系： 高等職業(yè)技術(shù)學(xué)院 </p><p>　　專 業(yè)： 計(jì)算機(jī)網(wǎng)絡(luò)技術(shù) </p><p><b>　　目錄</b><

2、;/p><p><b>　　摘要I</b></p><p><b>　　前 言II</b></p><p>　　第1章 開發(fā)企業(yè)網(wǎng)站的目標(biāo)和解決的問題1</p><p>　　1.1 網(wǎng)站開發(fā)背景1</p><p>　　1.2 用戶需求1</p><

3、p>　　1.2.1現(xiàn)代社會(huì)市場(chǎng)經(jīng)濟(jì)的發(fā)展導(dǎo)向圖1</p><p>　　1.2.2 解析2</p><p>　　1.2.3 關(guān)聯(lián)2</p><p>　　1.3 可行性研究分析3</p><p>　　第2章 采用的開發(fā)工具4</p><p>　　2.1 photoshop4</p><

4、p>　　2.2 Dreamweaver7</p><p>　　第3章 本網(wǎng)站的網(wǎng)頁(yè)結(jié)構(gòu)與功能9</p><p>　　3.1 網(wǎng)頁(yè)整體結(jié)構(gòu)9</p><p>　　3.1.1 注釋10</p><p>　　3.1.2 HTC/索愛/金立獨(dú)立版塊結(jié)構(gòu)圖10</p><p>　　3.2 網(wǎng)站的功能11<

5、;/p><p>　　第4章 網(wǎng)頁(yè)詳細(xì)界面設(shè)計(jì)12</p><p>　　4.1 網(wǎng)站開發(fā)環(huán)境與運(yùn)行環(huán)境12</p><p>　　4.2 網(wǎng)站首頁(yè)設(shè)計(jì)12</p><p>　　4.3子塊模塊界面設(shè)計(jì)15</p><p>　　4.3.1 諾基亞主頁(yè)界面設(shè)計(jì)及結(jié)構(gòu)15</p><p>　　4.3.

6、2 三星主頁(yè)界面設(shè)計(jì)及結(jié)構(gòu)17</p><p>　　4.3.3 黑莓主頁(yè)設(shè)計(jì)及結(jié)構(gòu)22</p><p>　　第5章 存在的問題及說明25</p><p>　　5.1網(wǎng)站設(shè)計(jì)總結(jié)25</p><p><b>　　5.2后記26</b></p><p><b>　　參考文獻(xiàn)27&

7、lt;/b></p><p><b>　　附錄28</b></p><p><b>　　企業(yè)網(wǎng)站分析設(shè)計(jì)</b></p><p>　　摘要：企業(yè)網(wǎng)站建設(shè)是根據(jù)企業(yè)現(xiàn)有需求分析結(jié)合未來需求分析</p><p>　　收集相關(guān)的企業(yè)資料（詳情留意附件資料表），結(jié)合企業(yè)本身的實(shí)際情況，提出相關(guān)聯(lián)的解

8、決方案。通過網(wǎng)站系統(tǒng)功能集成（請(qǐng)留意附件輔助功能表）與設(shè)計(jì)布局來實(shí)現(xiàn)網(wǎng)站在現(xiàn)實(shí)生活中的實(shí)際應(yīng)用。</p><p><b>　　前言</b></p><p>　　國(guó)內(nèi)互聯(lián)網(wǎng)發(fā)展起源于1995年，最具有里程碑意義的一年是1997年。從1997年到2011年，我國(guó)的網(wǎng)民從62萬到5.3億，增長(zhǎng)大概是800多倍。在這個(gè)競(jìng)爭(zhēng)激烈的數(shù)字化信息時(shí)代，企業(yè)建立自己的網(wǎng)站已經(jīng)刻不容緩。

9、無論大、中、小型企業(yè)，都決不能被時(shí)代所淘汰，所以，建設(shè)網(wǎng)站是企業(yè)把握時(shí)代脈搏，衡量企業(yè)是否跟上時(shí)代的標(biāo)準(zhǔn)。精明的經(jīng)營(yíng)者懂得并擅于用最先進(jìn)的媒體--互聯(lián)網(wǎng)，樹立企業(yè)形象，宣傳企業(yè)產(chǎn)品。企業(yè)建立網(wǎng)站，是企業(yè)在網(wǎng)絡(luò)時(shí)代的企業(yè)舞臺(tái)中展現(xiàn)自身實(shí)力和尋求發(fā)展的重要途徑。企業(yè)通過簡(jiǎn)單幽雅、特點(diǎn)鮮明的網(wǎng)頁(yè)來表達(dá)自己的產(chǎn)品信息和服務(wù)，并及時(shí)、全面的接受用戶的信息查詢和信息反饋。</p><p>　　在業(yè)務(wù)員走訪拜訪客戶的過程中，經(jīng)

10、常會(huì)遇到很多企業(yè)老總都在糾結(jié)一個(gè)問題，企業(yè)網(wǎng)站建設(shè)對(duì)我有什么意義呢？針對(duì)這一點(diǎn)，我覺得：企業(yè)網(wǎng)站建設(shè)，不僅能夠很好的樹立企業(yè)新形象，而且網(wǎng)站本身能容納的信息量大，方便及時(shí)大批量的更新信息，是一般的宣傳冊(cè)所不能及的。另外，中小企業(yè)網(wǎng)站建設(shè)也是新時(shí)代的要求，建立網(wǎng)站不僅能夠給客戶一個(gè)強(qiáng)烈的印象，還能夠提高企業(yè)的知名度與品牌， 例如搜狐、新浪、網(wǎng)易等，他們就是很好地借助互聯(lián)網(wǎng)，把他們的品牌做到過億人民幣之巨。</p><p

11、>　　更重要的是企業(yè)網(wǎng)站建設(shè)對(duì)擴(kuò)展往來業(yè)務(wù)有很大的幫助?？梢岳镁W(wǎng)絡(luò)資源，以最低的價(jià)格把自己的產(chǎn)品信息放到世界的每一個(gè)角落，讓全世界所有的客戶能夠通過網(wǎng)站，了解企業(yè)，認(rèn)識(shí)企業(yè)；可以利用互聯(lián)網(wǎng)無時(shí)空限制，隨時(shí)隨地的實(shí)現(xiàn)溝通；可以與客戶互動(dòng)往來，專人值守，提供信息服務(wù)，讓客戶客觀的了解企業(yè)的服務(wù)與產(chǎn)品，通過直接對(duì)話，達(dá)到促進(jìn)感情的作用；可以超越時(shí)空的實(shí)現(xiàn)雙向溝通，讓不同地域的客戶通過網(wǎng)站與你取得聯(lián)系，有效的留住產(chǎn)生了購(gòu)買沖動(dòng)的客戶，增

12、加了成功的概率；可以可以幫助企業(yè)尋找潛在客戶，而宣傳冊(cè)卻無能為力；也可以幫助企業(yè)提高效率、減少中間環(huán)節(jié)、規(guī)范管理、降低管理成本。另外，互聯(lián)網(wǎng)的應(yīng)用首先是傳統(tǒng)軟件應(yīng)用的延伸，為企業(yè)分布式管理提供了很大的幫助。而那么多有利于您企業(yè)發(fā)展的優(yōu)勢(shì)，您還在猶豫什么呢？</p><p>　　開發(fā)企業(yè)網(wǎng)站的目標(biāo)和解決的問題</p><p>　　1.1 網(wǎng)站開發(fā)背景</p><p>

13、　　互聯(lián)網(wǎng)短短在中國(guó)發(fā)展了十多年的時(shí)間，可伴隨著中國(guó)良好的市場(chǎng)環(huán)境以及龐大的網(wǎng)民資源，目前為止，中國(guó)互聯(lián)網(wǎng)占GDP比重達(dá)5.5% 全球位居第三。</p><p>　　隨著中國(guó)互聯(lián)網(wǎng)的普及以及我國(guó)網(wǎng)民數(shù)量的不斷增加，網(wǎng)絡(luò)在很大程度上改變著我們的生活。網(wǎng)絡(luò)加快了人們獲得信息的速度；網(wǎng)絡(luò)改變了人們的交流方式，使得與陌生人交流成為可能；網(wǎng)絡(luò)使得天涯變成近鄰；網(wǎng)絡(luò)同時(shí)也成為了企業(yè)實(shí)現(xiàn)資源共享，產(chǎn)品往來的一個(gè)公共性認(rèn)可平臺(tái)。

14、</p><p><b>　　1.2 企業(yè)需求</b></p><p>　　1.2.1現(xiàn)代社會(huì)市場(chǎng)經(jīng)濟(jì)的發(fā)展導(dǎo)向圖：</p><p><b>　　1.2.2 解析</b></p><p>　　紅色：70年代，80年代，我國(guó)的經(jīng)濟(jì)相對(duì)滯后，生產(chǎn)型的企業(yè)相對(duì)比較的少，競(jìng)爭(zhēng)不是太激烈。那個(gè)時(shí)候，企業(yè)只負(fù)責(zé)

15、生產(chǎn)產(chǎn)品，更多的客戶都是主動(dòng)通過各種渠道來聯(lián)系企業(yè)，有的甚至因?yàn)橐粋€(gè)項(xiàng)目，親自奔赴很遠(yuǎn)的地方。最終達(dá)成協(xié)議代理，經(jīng)銷，批發(fā)該公司的產(chǎn)品。通過各種途徑把產(chǎn)品帶到消費(fèi)者的手中。</p><p>　　黑色：隨著社會(huì)經(jīng)濟(jì)的發(fā)展，同類別企業(yè)越來越多，企業(yè)與企業(yè)之間的競(jìng)爭(zhēng)也越來越大，作為代理商、經(jīng)銷商、批發(fā)商、消費(fèi)者掌握的選擇權(quán)越來越大，慢慢的由被動(dòng)變?yōu)榱酥鲃?dòng)。企業(yè)為了更好的適應(yīng)市場(chǎng)經(jīng)濟(jì)的變動(dòng)，不斷的招聘業(yè)務(wù)人員到全國(guó)各地做

16、業(yè)務(wù)（尋求各地的經(jīng)銷商，代理商，批發(fā)商，甚至直接帶給消費(fèi)者）。因此，隨著互聯(lián)網(wǎng)的發(fā)展，企業(yè)網(wǎng)站建設(shè)成為了企業(yè)樹立企業(yè)形象，對(duì)外宣傳的最佳途徑。</p><p><b>　　1.2.3 關(guān)聯(lián)</b></p><p>　　招聘業(yè)務(wù)人員，不僅需要支付大筆的福利、補(bǔ)貼、提成、薪酬，還必須全方位的考慮業(yè)務(wù)人員的綜合能力以及業(yè)務(wù)素質(zhì)及相關(guān)聯(lián)不確定因數(shù)的出現(xiàn)。企業(yè)網(wǎng)站建設(shè)很好的解決

17、了這一個(gè)矛盾。利用互聯(lián)網(wǎng)的無地域性，可以很好的把你的產(chǎn)品帶到世界的任何一個(gè)角落，無形中給你挖掘潛在的客戶。</p><p>　　1.3 可行性研究分析</p><p>　　企業(yè)建立網(wǎng)站是社會(huì)發(fā)展的必然趨勢(shì)，如果一個(gè)大企業(yè)連網(wǎng)站都沒有或者做得很差，給客戶的印象是：這不是一個(gè)現(xiàn)代企業(yè)，是一個(gè)跟不上形勢(shì)的企業(yè)。如果網(wǎng)站做得好，給客戶的感覺是：這企業(yè)領(lǐng)導(dǎo)意識(shí)先進(jìn)，技術(shù)走在前列，管理科學(xué)化智能化，顧

18、客感覺完全不同，信任度也提高很多。另外，企業(yè)網(wǎng)站的建設(shè)，還可以提高企業(yè)分布式管理體系的力度；擴(kuò)展事業(yè)版圖的范圍；加強(qiáng)客戶與企業(yè)間的雙向溝通；為企業(yè)節(jié)省不必要的成本支出；增加客戶的忠誠(chéng)度；第一時(shí)間把最新的產(chǎn)品反饋給消費(fèi)者；互聯(lián)網(wǎng)二次傳播的性質(zhì)更大化的使企業(yè)產(chǎn)品得到了全方位的宣傳等等。因此，企業(yè)建立網(wǎng)站勢(shì)在必行。</p><p><b>　　采用的開發(fā)工具</b></p><

19、p>　　2.1 photoshop</p><p><b>　　軟件簡(jiǎn)介</b></p><p>　　Photoshop是Adobe公司旗下最為出名的圖像處理軟件之一。多數(shù)人對(duì)于PHOTOSHOP的了解僅限于“一個(gè)很好的圖像編輯軟件”，并不知道它的諸多應(yīng)用方面，實(shí)際上，Photoshop的應(yīng)用領(lǐng)域很廣泛的，在圖像、圖形、文字、視頻、出版各方面都有涉及。 　　。&

20、lt;/p><p><b>　　平面設(shè)計(jì)</b></p><p>　　平面設(shè)計(jì)是PHOTOSHOP應(yīng)用最為廣泛的領(lǐng)域，無論是我們正在閱讀的圖書封面，還是大街上看到的招帖 、海報(bào)，這些具有豐富圖像的平面印刷品，基本上都需要PHOTOSHOP軟件對(duì)圖像進(jìn)行處理。</p><p><b>　　修復(fù)照片</b></p>

21、<p>　　PHOTOSHOP具有強(qiáng)大的圖像修飾功能。利用這些功能，可以快速修復(fù)一張破損的老照片，也可以修復(fù)人臉上的斑點(diǎn)等缺陷。隨著數(shù)碼電子產(chǎn)品的普及，圖形圖像處理技術(shù)逐漸被越來越多的人所應(yīng)用，如美化我們的照片、制作個(gè)性化的影集、修復(fù)已經(jīng)損毀的圖片等。</p><p><b>　　廣告攝影</b></p><p>　　廣告攝影作為一種對(duì)視覺要求非常嚴(yán)格的工

22、作，其最終成品往往要經(jīng)過PHOTOSHOP的修改才能得到滿意的效果。廣告的構(gòu)思與表現(xiàn)形式是密切相關(guān)的，有了好的構(gòu)思接下來則需要通過軟件來完成它，而大多數(shù)的廣告是通過圖像合成與特效技術(shù)來完成的。通過這些技術(shù)手段可以更加準(zhǔn)確的表達(dá)出廣告的主題。</p><p><b>　　包裝設(shè)計(jì)</b></p><p>　　包裝作為產(chǎn)品的第一形象最先展現(xiàn)在顧客的眼前，被成為“無聲的銷售

23、員”，只有在顧客被產(chǎn)品包裝吸引并進(jìn)行查閱后，才會(huì)決定會(huì)不會(huì)購(gòu)買，可見包裝設(shè)計(jì)是非常重要的。 圖像合成和特效的運(yùn)用使得產(chǎn)品在玲瑯滿目的貨架上越發(fā)顯眼，達(dá)到吸引顧客的效果，如圖所示為幾款優(yōu)秀的包裝設(shè)計(jì)。</p><p><b>　　插畫設(shè)計(jì)</b></p><p>　　Photoshop使很多人開始采用電腦圖形設(shè)計(jì)工具創(chuàng)作插圖。電腦圖形軟件功能使他們的創(chuàng)作才能得到了更大的

24、發(fā)揮，無論簡(jiǎn)潔還是繁復(fù)綿密，無論傳統(tǒng)媒介效果，如油畫、水彩、版畫風(fēng)格還是數(shù)字圖形無窮無盡的新變化、新趣味，都可以更方便更快捷地完成。</p><p><b>　　影像創(chuàng)意</b></p><p>　　影像創(chuàng)意是PHOTOSHOP的特長(zhǎng)，通過PHOTOSHOP的處理 可以將原本風(fēng)馬牛不相及的對(duì)象組合在一起，也可以使用“貍貓換太子”的手段使圖像發(fā)生面目全非的巨大變化。添加

25、圖片讓人更了解PS能從事哪方面的工作</p><p><b>　　藝術(shù)文字</b></p><p>　　當(dāng)文字遇到PHOTOSHOP處理，就已經(jīng)注定不再普通。利用PHOTOSHOP可以使文字發(fā)生各種各樣的變化， 并利用這些藝術(shù)化處理后的文字為圖像增加效果。利用Photoshop對(duì)文字進(jìn)行創(chuàng)意設(shè)計(jì)，可以使文字變得更加美觀，個(gè)性極強(qiáng)，使得文字的感染力大大的加強(qiáng)了。<

26、;/p><p><b>　　網(wǎng)頁(yè)制作</b></p><p>　　網(wǎng)絡(luò)的普及是促使更多人需要掌握PHOTOSHOP的一個(gè)重要原因。因?yàn)樵谥谱骶W(wǎng)頁(yè)時(shí)PHOTOSHOP是必不可少的網(wǎng)頁(yè)圖像處理軟件。</p><p><b>　　建筑效果圖后期修飾</b></p><p>　　在制作建筑效果圖包括許多三維場(chǎng)景

27、時(shí)，人物與配景包括場(chǎng)景的顏色常常需要在PHOTOSHOP中增加并調(diào)整。</p><p><b>　　繪畫</b></p><p>　　由于PHOTOSHOP具有良好的繪畫與調(diào)色功能，許多插畫設(shè)計(jì)制作者往往使用鉛筆繪制草稿，然后用PHOTOSHOP填色的方法來繪制插畫。 　　</p><p>　　除此之外，近些年來非常流行的像素畫也多為設(shè)計(jì)師使用

28、PHOTOSHOP創(chuàng)作的作品。動(dòng)漫設(shè)計(jì)近年來十分的盛行，有越來越多的愛好者加入動(dòng)漫設(shè)計(jì)的行列，Photoshop軟件的強(qiáng)大功能使得它在動(dòng)漫行業(yè)有著不可取代的地位，從最初的形象設(shè)定到最后渲染輸出，都離不開它。如圖1-25所示為著名的動(dòng)漫設(shè)計(jì)作品。</p><p><b>　　繪制或處理三維帖圖</b></p><p>　　在三維軟件中，如果能夠制作出精良的模型，而無法為

29、模型應(yīng)用逼真的帖圖，也無法得到較好的渲染效果。實(shí)際上在制作材質(zhì)時(shí)，除了要依靠軟件本身具有材質(zhì)功能外，利用PHOTOSHOP可以制作在三維軟件中無法得到的合適的材質(zhì)也非常重要。</p><p><b>　　婚紗照片設(shè)計(jì)</b></p><p>　　當(dāng)前越來越多的婚紗影樓開始使用數(shù)碼相機(jī)，這也使得婚紗照片設(shè)計(jì)的處理成為一個(gè)新興的行業(yè)。</p><p&g

30、t;<b>　　視覺創(chuàng)意</b></p><p>　　視覺創(chuàng)意與設(shè)計(jì)是設(shè)計(jì)藝術(shù)的一個(gè)分支，此類設(shè)計(jì)通常沒有非常明 顯的商業(yè)目的，但由于他為廣大設(shè)計(jì)愛好者提供了廣闊的設(shè)計(jì)空間，因此越來越多的設(shè)計(jì)愛好者開始了學(xué)習(xí)PHOTOSHOP，并進(jìn)行具有個(gè)人特色與風(fēng)格的視覺創(chuàng)意。 視覺設(shè)計(jì)給觀者以強(qiáng)大的視覺沖擊力，引發(fā)觀者的無限聯(lián)想，給讀者視覺上以極高的享受。這類作品制作的主要工具當(dāng)屬Photoshop&

31、lt;/p><p><b>　　圖標(biāo)制作</b></p><p>　　雖然使用PHOTOSHOP制作圖標(biāo)在感覺上有些大材小用，但使用此軟件制作的圖標(biāo)的確非常精美。</p><p><b>　　界面設(shè)計(jì)</b></p><p>　　界面設(shè)計(jì)是一個(gè)新興的領(lǐng)域，已經(jīng)受到越來越多的軟件企業(yè)及開發(fā)者的重視，雖然暫

32、時(shí)還未成為一種全新的職業(yè)，但相信不久一定會(huì)出現(xiàn)專業(yè)的界面設(shè)計(jì)師職業(yè)。在當(dāng)前還沒有用于做界面設(shè)計(jì)的專業(yè)軟件，因此絕大多數(shù)設(shè)計(jì)者使用的都是該軟件。 　　</p><p><b>　　功能特色</b></p><p>　　從功能上看，該軟件可分為圖像編輯、圖像合成、校色調(diào)色及特效制作部分等。 圖像編輯是圖像處理的基礎(chǔ)，可以對(duì)圖像做各種變換如放大、縮小、旋轉(zhuǎn)、傾斜、鏡像、透視

33、等。也可進(jìn)行復(fù)制、去除斑點(diǎn)、修補(bǔ)、修飾圖像的殘損等。這在婚紗攝影、人像處理制作中有非常大的用場(chǎng)，去除人像上不滿意的部分，進(jìn)行美化加工，得到讓人非常滿意的效果。 　</p><p>　　圖像合成則是將幾幅圖像通過圖層操作、工具應(yīng)用合成完整的、傳達(dá)明確意義的圖像，這是美術(shù)設(shè)計(jì)的必經(jīng)之路；該軟件提供的繪圖工具讓外來圖像與創(chuàng)意很好地融合，成為可能使圖像的合成天衣無縫。 </p><p>　　

34、校色調(diào)色是該軟件中深具威力的功能之一，可方便快捷地對(duì)圖像的顏色進(jìn)行明暗、色偏的調(diào)整和校正，也可在不同顏色進(jìn)行切換以滿足圖像在不同領(lǐng)域如網(wǎng)頁(yè)設(shè)計(jì)、印刷、多媒體等方面應(yīng)用。 　　</p><p>　　特效制作在該軟件中主要由濾鏡、通道及工具綜合應(yīng)用完成。包括圖像的特效創(chuàng)意和特效字的制作，如油畫、浮雕、石膏畫、素描等常用的傳統(tǒng)美術(shù)技巧都可藉由該軟件特效完成。而各種特效字的制作更是很多美術(shù)設(shè)計(jì)師熱衷于該軟件的研究的原因。

35、 　　</p><p>　　2010年最新版本Adobe Photoshop CS4除了包含Adobe Photoshop CS3的所有功能外，還增加了3D和視頻流、動(dòng)畫、深度圖像分析等。 　　</p><p>　　2.2 Dreamweaver</p><p>　　Dreamweaver是由Macromedia公司所開發(fā)的著名網(wǎng)站開發(fā)工具。它使用所見即所得的接口，

36、亦有HTML編輯的功能。它現(xiàn)在有Mac和Windows系統(tǒng)的版本。隨Macromedia被Adobe收購(gòu)后，Adobe也開始計(jì)劃開發(fā)Linux版本的Dreamweaver了。 Dreamweaver軟件有很多的優(yōu)點(diǎn)。1.制作效率</p><p>　　Dreamweaver可以用最快速的方式將Fireworks，F(xiàn)reeHand，或Photoshop等檔案移至網(wǎng)頁(yè)上。使用檢色吸管工具選擇熒幕上的顏色可設(shè)定最接近的網(wǎng)

37、頁(yè)安全色。對(duì)于選單，快捷鍵與格式控制，都只要一個(gè)簡(jiǎn)單步驟便可完成。Dreamweaver能與您喜愛的設(shè)計(jì)工具，如Playback Flash，Shockwave和外掛模組等搭配，不需離開Dreamweaver便可完成，整體運(yùn)用流程自然順暢。除此之外，只要單擊便可使Dreamweaver自動(dòng)開啟Firework或Photoshop來進(jìn)行編輯與設(shè)定圖檔的最佳化。</p><p><b>　　2.網(wǎng)站管理&l

38、t;/b></p><p>　　使用網(wǎng)站地圖可以快速制作網(wǎng)站雛形、設(shè)計(jì)、更新和重組網(wǎng)頁(yè)。改變網(wǎng)頁(yè)位置或檔案名稱，Dreamweaver 會(huì)自動(dòng)更新所有鏈接。使用支援文字、HTML碼、HTML屬性標(biāo)簽和一般語(yǔ)法的搜尋及置換功能使得復(fù)雜的網(wǎng)站更新變得迅速又簡(jiǎn)單。</p><p><b>　　3.控制能力</b></p><p>　　Dream

39、weaver是唯一提供Roundtrip HTML、視覺化編輯與原始碼編輯同步的設(shè)計(jì)工具。它包含HomeSite和BBEdit等主流文字編輯器。幀(frames)和表格的制作速度快的令您無法想像。進(jìn)階表格編輯功能使您簡(jiǎn)單的選擇單格、行、欄或作未連續(xù)之選取。甚至可以排序或格式化表格群組，Dreamweaver 支援精準(zhǔn)定位，利用可輕易轉(zhuǎn)換成表格的圖層以拖拉置放的方式進(jìn)行版面配置。所見即所得 Dreamweaver成功整合動(dòng)態(tài)式出版視覺編輯

40、及電子商務(wù)功能，提供超強(qiáng)的支援能力給Third-party廠商，包含ASP， Apache，BroadVision， Cold Fusion，iCAT， Tango與自行發(fā)展的應(yīng)用軟體。當(dāng)您正使用Dreamweaver在設(shè)計(jì)動(dòng)態(tài)網(wǎng)頁(yè)時(shí)，所見即所得的功能，讓您不需要透過瀏覽器就能預(yù)覽網(wǎng)頁(yè)。夢(mèng)幻樣版和XML Dreamweaver將內(nèi)容與設(shè)計(jì)分開，應(yīng)用于快速網(wǎng)頁(yè)更新和團(tuán)隊(duì)合作網(wǎng)頁(yè)編輯。建立網(wǎng)頁(yè)外觀的樣版，指定可編輯或不可編輯的部份，內(nèi)容提供

41、者可直接編輯以樣式為主的內(nèi)容卻不會(huì)不小心改變既定之樣式。您也可以使用樣版正確地輸入或輸出XML內(nèi)容。 全方位的</p><p>　　本網(wǎng)站的網(wǎng)頁(yè)結(jié)構(gòu)與功能</p><p>　　3.1 網(wǎng)頁(yè)整體結(jié)構(gòu)</p><p><b>　　3.1.1 注釋</b></p><p>　　由于Blackberry 、諾基亞 、三星為獨(dú)立設(shè)

42、計(jì)版塊，因此，結(jié)構(gòu)在后面獨(dú)立顯示</p><p>　　3.1.2 索愛 、HTC 、金立獨(dú)立版塊結(jié)構(gòu)圖</p><p><b>　　3.2 網(wǎng)站的功能</b></p><p>　　楚雄誠(chéng)信通數(shù)碼商行網(wǎng)站建設(shè)，主要為了實(shí)現(xiàn)線上產(chǎn)品宣傳，企業(yè)形象展示，企業(yè)咨詢信息共享，以及客戶與企業(yè)達(dá)成互動(dòng)。因此針對(duì)以上需求，網(wǎng)站設(shè)計(jì)了咨詢頻道、公司介紹、新品了解

43、、合作伙伴、聯(lián)系方式、在線咨詢、成功案例、產(chǎn)品介紹、解決方案模塊。主要是為了把企業(yè)的信息更好的展示給客戶，無形中挖掘潛在的客戶。另外，由于經(jīng)營(yíng)的產(chǎn)品種類繁多，因此網(wǎng)站還涉及了步步高、Blackberry、三星、HTC、諾基亞、LG、索愛、iphone、摩托羅拉、oppo、金立、</p><p>　　HTC模塊，主要是為了更好的把商行的經(jīng)營(yíng)的部分顯著產(chǎn)品第一時(shí)間帶到消費(fèi)者的眼角，最終實(shí)現(xiàn)線下交易。為了更好的使客戶與

44、企業(yè)形成互動(dòng)，網(wǎng)站還加入了TQ客服系統(tǒng)，用戶可以通過QQ即時(shí)通訊，阿里旺旺，MSN與企業(yè)第一時(shí)間取得聯(lián)系。</p><p><b>　　網(wǎng)頁(yè)詳細(xì)界面設(shè)計(jì)</b></p><p>　　4.1 網(wǎng)站開發(fā)環(huán)境與運(yùn)行環(huán)境</p><p>　　4.1.1 網(wǎng)站開發(fā)環(huán)境</p><p>　　操作系統(tǒng)：Windows 7 。</

45、p><p>　　軟件開發(fā)環(huán)境：Photoshop C4 與Macromedia Dreamweaver 8</p><p>　　4.1.2 網(wǎng)站開發(fā)環(huán)境</p><p>　　硬件環(huán)境：Pentium 133以上, 32M RAM, 4.3G HD</p><p>　　軟件環(huán)境：支持中文的Windows2000、Windows 2003、Windo

46、ws XP各</p><p><b>　　種版本操作平臺(tái)。</b></p><p>　　4.2 網(wǎng)站首頁(yè)設(shè)計(jì)</p><p><b>　　網(wǎng)站首頁(yè)效果圖一</b></p><p><b>　　網(wǎng)站首頁(yè)效果圖二</b></p><p>　　網(wǎng)站首頁(yè)設(shè)計(jì)一共

47、采用了47個(gè)圖層</p><p><b>　　設(shè)計(jì)步驟：</b></p><p>　　1、新建像素為800*600圖層，填充前景色為暗紅色。</p><p>　　2、新建圖層，添加蒙版，進(jìn)行漸變填充。</p><p>　　3、創(chuàng)建色階并對(duì)其進(jìn)行調(diào)整，不透明度為50%。</p><p>　　4、選擇

48、圖像調(diào)整曲線，達(dá)到合適的亮度為止。</p><p>　　5、快捷鍵Ctrl+R調(diào)出標(biāo)尺工具，根據(jù)一定的比例關(guān)系，在網(wǎng)站中合理的布置標(biāo)線。</p><p>　　6、在圖層面板新建圖層，點(diǎn)擊進(jìn)入路徑面板，新建路徑，并相應(yīng)的繪制六邊形，繪制完成以后，點(diǎn)擊將路徑載入選區(qū)，然后點(diǎn)擊圖層面板，將路徑填充為白色，再對(duì)圖層進(jìn)行投影設(shè)置。</p><p>　　7、復(fù)制圖層，然后按住C

49、trl+T 改變圖形大小，為了不使圖形失真，請(qǐng)按住shift鍵。</p><p>　　8、在圖形內(nèi)部，根據(jù)大小的不同，鍵入相關(guān)聯(lián)的文字，并對(duì)文字進(jìn)行投影。</p><p>　　9、調(diào)整標(biāo)線的比例，新建圖層，點(diǎn)擊進(jìn)入路徑面板，新建路徑，根據(jù)一定的比例繪制出路徑并載入選區(qū)，然后點(diǎn)擊圖層面板，進(jìn)行漸變填充。</p><p>　　10、再新建圖層，點(diǎn)擊路徑面板，新建路徑，更

50、具一定的比例繪制出路徑并載入選區(qū)，點(diǎn)擊圖層面板，進(jìn)行漸變填充。</p><p>　　11、根據(jù)找到的素材，合適的布局。</p><p>　　12、新建圖層，根據(jù)相關(guān)的比例進(jìn)行選區(qū)，然后填充圖層，并對(duì)圖層進(jìn)行漸變，添加相應(yīng)的文字信息。</p><p>　　13、對(duì)網(wǎng)站實(shí)現(xiàn)動(dòng)畫，根據(jù)更改不同圖層出現(xiàn)的順序，最終顯示動(dòng)態(tài)顯示。效果如上圖所示：</p><

51、;p>　　14、對(duì)圖片進(jìn)行切片，并進(jìn)行web保存，保存圖片與HTML完成photoshop中網(wǎng)站布局的制作。</p><p>　　15、將生成的HTML網(wǎng)頁(yè)在Dreaveweaver 8中顯示，把進(jìn)行切片的圖片文字刪除，填充相同的顏色，輸入相同的文字，并進(jìn)行CSS樣式套用，并給相關(guān)文字進(jìn)行鏈接。</p><p>　　<MARQUEE scrollAmount=3 behavio

52、r=alternate></p><p>　　公告欄：本商行所出售的產(chǎn)品全屬原裝正品，以價(jià)格打開市場(chǎng)，以品質(zhì)贏得客戶。凡是已經(jīng)成為了我商行的會(huì)員，下次購(gòu)物憑借會(huì)員卡可以享受八折的優(yōu)惠！</p><p>　　</MARQUEE></p><p>　　16、制作左右滾動(dòng)字體，代碼如上所示：</p><p>　　17、制作網(wǎng)站導(dǎo)航

53、。添加行為，設(shè)置行為屬性。</p><p>　　<SCRIPT LANGUAGE="JavaScript" src=http://float2006.tq.cn/floatcard?adminid=9359105&sort=0 ></SCRIPT></p><p>　　18、制作客服系統(tǒng)，代碼如上所示：</p><p&

54、gt;　　4.3子塊模塊界面設(shè)計(jì)</p><p>　　4.3.1 諾基亞主頁(yè)界面設(shè)計(jì)及結(jié)構(gòu)</p><p><b>　　諾基亞主頁(yè)結(jié)構(gòu)：</b></p><p>　　由于該板塊為設(shè)計(jì)展示板塊，所涉及的內(nèi)容受版權(quán)保護(hù)，因此沒有做過多的鏈接，詳細(xì)的內(nèi)容請(qǐng)?jiān)L問諾基亞官網(wǎng)，本設(shè)計(jì)模塊僅供參考，部分線路不通。因此所帶來的不便，盡請(qǐng)?jiān)彛?lt;/p>

55、;<p><b>　　諾基亞主頁(yè)界面圖：</b></p><p><b>　　設(shè)計(jì)步驟：</b></p><p>　　1、新建像素為1000*580的畫布，填充顏色為淡藍(lán)色。</p><p>　　2、新建圖層，進(jìn)行角度漸變。</p><p>　　3、新建圖層，點(diǎn)擊路徑面板，新建路徑，根

56、據(jù)一定的比例繪制如圖所示的路徑，將路徑載入選區(qū)，返回圖層，進(jìn)行漸變填充。</p><p>　　4、利用選區(qū)工具繪制選區(qū)，填充選區(qū)為藍(lán)色，并通過磁性套索工具對(duì)不要的部分進(jìn)行刪除。</p><p>　　5、合理添加已經(jīng)準(zhǔn)備好的圖片，文字信息，并對(duì)文字進(jìn)行投影，發(fā)光。</p><p>　　6、對(duì)圖片進(jìn)行切片，并進(jìn)行web保存，保存圖片與HTML完成photoshop中網(wǎng)站

57、布局的制作。</p><p>　　7、將生成的HTML網(wǎng)頁(yè)在Dreaveweaver 8中顯示，給網(wǎng)站進(jìn)行集中，填充背景色為藍(lán)色，給網(wǎng)站的內(nèi)容進(jìn)行圖片鏈接。</p><p>　　<SCRIPT LANGUAGE="JavaScript" src=http://float2006.tq.cn/floatcard?adminid=9359105&sort=0

58、></SCRIPT></p><p>　　8、制作客服系統(tǒng)，代碼如上所示：</p><p>　　4.3.2 三星主頁(yè)界面設(shè)計(jì)及結(jié)構(gòu)</p><p><b>　　三星主頁(yè)結(jié)構(gòu)：</b></p><p><b>　　三星頁(yè)面展示：</b></p><p><

59、;b>　　三星咨詢頁(yè)面展示</b></p><p><b>　　本店三星頁(yè)面展示</b></p><p><b>　　三星游戲頁(yè)面展示</b></p><p><b>　　三星品質(zhì)展示頁(yè)</b></p><p>　　三星頁(yè)面展示設(shè)計(jì)步驟：</p>

60、<p>　　1、新建像素為1000*700的畫布，新建圖層，給圖層進(jìn)行漸變，然后調(diào)整曝光度。</p><p>　　2、調(diào)出標(biāo)尺工具，根據(jù)合適的比例，進(jìn)行布局，然后調(diào)用選區(qū)工具，進(jìn)行5次選區(qū)，分別填充的顏色由上到下為黑色，白色，淡紅色，白色，橘紅色。</p><p>　　新建圖層，點(diǎn)擊進(jìn)入路徑面板，新建路徑，根據(jù)標(biāo)尺調(diào)整的比例繪制路徑，本次繪制的路徑一共有4個(gè)，在這里咱們就不分類

61、介紹。繪制往常以后分別載入選區(qū)，點(diǎn)擊圖層面板，對(duì)相對(duì)應(yīng)的選區(qū)進(jìn)行顏色填充。</p><p>　　分別選中相應(yīng)版塊選區(qū)，對(duì)選區(qū)進(jìn)行漸變填充，本次繪制的選區(qū)有3個(gè)，由于方法相同，就不分類介紹了。</p><p>　　將準(zhǔn)備好的素材進(jìn)行摳圖，添加于網(wǎng)站，并進(jìn)行合理的布局，部分外加投影，外發(fā)光效果。</p><p>　　新建圖層，進(jìn)行兩次漸變填充。</p>&

62、lt;p>　　根據(jù)已經(jīng)準(zhǔn)備好的素材，對(duì)網(wǎng)站進(jìn)行合理的布局，并添加主題文字，文字的效果設(shè)置為投影，內(nèi)發(fā)光。</p><p>　　本子頁(yè)設(shè)計(jì)的時(shí)候?yàn)樽稍儼鎵K，因此，我們只添加文字信息。</p><p>　　對(duì)圖片進(jìn)行切片，并進(jìn)行web保存，保存圖片與HTML完成photoshop中網(wǎng)站布局的制作。</p><p>　　在Dreamweave 8中打開在photos

63、hop中生成的網(wǎng)頁(yè)，對(duì)整個(gè)網(wǎng)頁(yè)進(jìn)行居中，改變網(wǎng)頁(yè)的背景色，并對(duì)部分圖片進(jìn)行熱點(diǎn)鏈接。</p><p>　　<SCRIPT LANGUAGE="JavaScript" src=http://float2006.tq.cn/floatcard?adminid=9359105&sort=0 ></SCRIPT></p><p>　　11、制作客

64、服系統(tǒng)，代碼如上所示。</p><p>　　三星游戲展示面設(shè)計(jì)步驟：</p><p>　　由于1-7的步驟同三星咨詢展示頁(yè)面制作是一樣的，這里我們就不進(jìn)行重復(fù)描述了。</p><p>　　新建圖層，選擇選區(qū)工具，繪制合理的選區(qū)，填充為黑色，然后新建圖層，對(duì)圖層進(jìn)行選區(qū)填充白色，投影，然后復(fù)制，并進(jìn)行合理的布局。</p><p>　　根據(jù)準(zhǔn)備好

65、的素材，進(jìn)行合理的填充，然后給文字進(jìn)行投影。</p><p>　　接下來的步驟與三星咨詢8-11是類似的，我們就不單獨(dú)介紹了。</p><p>　　另外，三星品質(zhì)，本店三星頁(yè)面展示的設(shè)計(jì)與三星游戲大同小異，采用的方法，以及設(shè)計(jì)的步驟我們這在里也就不單獨(dú)介紹了。</p><p>　　4.3.3 黑莓主頁(yè)設(shè)計(jì)及結(jié)構(gòu)</p><p><b&

66、gt;　　黑莓主頁(yè)結(jié)構(gòu)：</b></p><p><b>　　黑莓主頁(yè)展示：</b></p><p><b>　　設(shè)計(jì)步驟：</b></p><p>　　1、新建像素為800*1200畫布，新建圖層，填充圖層的顏色為暗紅色。</p><p>　　2、新建圖層，對(duì)圖層進(jìn)行邊緣模糊，再新建一

67、個(gè)圖層，選擇選區(qū)，填充顏色為白色。</p><p>　　3、新建圖層，選擇選區(qū)工具進(jìn)行選區(qū)，填充顏色為黑色，投影，內(nèi)發(fā)光。</p><p>　　4、新建圖層，選擇選區(qū)工具選區(qū)，填充顏色為白色，投影，外發(fā)光，同樣再次選擇選區(qū)工具填充顏色為黑色。</p><p>　　5、根據(jù)已經(jīng)準(zhǔn)備好的素材進(jìn)行合理的添加，選擇文字輸入工具，添加橫排文字，添加完畢給文字投影，外發(fā)光。&l

68、t;/p><p>　　6、添加產(chǎn)品信息，以及黑莓簡(jiǎn)介信息，添加完畢，外加投影，內(nèi)發(fā)光。</p><p>　　7、對(duì)圖片進(jìn)行切片，并進(jìn)行web保存，保存圖片與HTML完成photoshop中網(wǎng)站布局的制作。</p><p>　　8、將生成的HTML網(wǎng)頁(yè)在Dreaveweaver 8中顯示，給網(wǎng)站進(jìn)行集中，填充背景色為暗紅色，給網(wǎng)站的內(nèi)容進(jìn)行圖片鏈接。</p>

69、<p>　　<SCRIPT LANGUAGE="JavaScript" src=http://float2006.tq.cn/floatcard?adminid=9359105&sort=0 ></SCRIPT></p><p>　　9、制作客服系統(tǒng)。代碼如上所示：</p><p><b>　　存在的問題及說明<

70、;/b></p><p><b>　　5.1軟件設(shè)計(jì)總結(jié)</b></p><p>　　企業(yè)網(wǎng)站建設(shè)的目的最終是給競(jìng)爭(zhēng)對(duì)手，給客戶，給自己看的。因此，在企業(yè)網(wǎng)站建設(shè)的工程中，對(duì)制作網(wǎng)站的要求也比較的高，因此我們必須首先考慮下面幾點(diǎn)：</p><p><b>　　企業(yè)的未來需求</b></p><p&

71、gt;　　做網(wǎng)站的目的是為了給企業(yè)解決實(shí)際的問題。因此，我們?cè)谥谱骶W(wǎng)站前必須通過溝通的形式來了解企業(yè)現(xiàn)有的情況，以及企業(yè)領(lǐng)導(dǎo)人對(duì)企業(yè)未來可能出現(xiàn)的情況的預(yù)測(cè)。一次性全方位的來開發(fā)網(wǎng)站。</p><p><b>　　網(wǎng)站的布局</b></p><p>　　合理的網(wǎng)站布局能給人第一眼就知道，你這個(gè)網(wǎng)站是做什么的？主要提供的又是什么？另外，還可以給客戶一種賞心悅目的感覺，第

72、一時(shí)間找到他想要的東西，以此來提高客戶的忠誠(chéng)度。</p><p><b>　　網(wǎng)站的美工</b></p><p>　　網(wǎng)站的美工也就好像一個(gè)人穿衣服一樣。合理的衣服搭配，能夠把給人一種心理順暢的感覺。同樣，如果一個(gè)網(wǎng)站，內(nèi)容做的很好很全面，可給人一看上去就沒質(zhì)感的話，它依然不是一個(gè)好的網(wǎng)站。</p><p><b>　　網(wǎng)站的創(chuàng)新點(diǎn)&

73、lt;/b></p><p>　　隨著互聯(lián)網(wǎng)的發(fā)展，模板站也越來越多。很多企業(yè)在網(wǎng)站建設(shè)的過程中，都慢慢的顧忌一個(gè)問題，我做出來的網(wǎng)站會(huì)和別人一樣嗎？居于這樣問題的考慮，我們?cè)诮o企業(yè)建設(shè)網(wǎng)站的過程中必須依據(jù)企業(yè)的企業(yè)文化來制定相應(yīng)的版塊，功能以及美工。</p><p><b>　　網(wǎng)站的功能</b></p><p>　　不同性質(zhì)的企業(yè)所涉

74、及到的網(wǎng)站功能是不一致的，就比如：圖片發(fā)布系統(tǒng)，新聞發(fā)布系統(tǒng)，這些是公用的系統(tǒng)。小型的企業(yè)一般這兩項(xiàng)功能就能滿足需求，論壇系統(tǒng)，視頻發(fā)布系統(tǒng)，會(huì)員登錄系統(tǒng)，在線咨詢系統(tǒng)，企業(yè)調(diào)查系統(tǒng)等。這些系統(tǒng)可以根據(jù)企業(yè)的規(guī)模以及實(shí)際的需求來進(jìn)行開發(fā)。</p><p><b>　　5.2 后記</b></p><p>　　本次設(shè)計(jì)的最終目的，是居于photoshop對(duì)企業(yè)網(wǎng)站布局進(jìn)

75、行設(shè)計(jì)開發(fā)，然后居于Dreamweaver實(shí)現(xiàn)部分超鏈，導(dǎo)航功能。在本次設(shè)計(jì)中基本上實(shí)現(xiàn)了一個(gè)簡(jiǎn)單的企業(yè)對(duì)外宣傳網(wǎng)站。</p><p>　　通過本次網(wǎng)站的設(shè)計(jì)開發(fā)，對(duì)網(wǎng)站設(shè)計(jì)有了進(jìn)一步的認(rèn)識(shí)。以前在使用photoshop的過程中，看了很多這方面的書籍，可每次制作都不知道從什么地方下手，制作出來的網(wǎng)頁(yè)或者是圖片總達(dá)不到自己想要的效果?，F(xiàn)在在制作的過程中，慢慢的意識(shí)到思緒是很重要的。我們?cè)陂_發(fā)一個(gè)網(wǎng)站的過程中，必須提

76、前對(duì)網(wǎng)站有一個(gè)比較明確的定位；必須提前在網(wǎng)站制作之前布局網(wǎng)站的結(jié)構(gòu)；必須提前搜集相關(guān)的資料。這樣的話，你在制作的過程中不斷能節(jié)省時(shí)間，另外。利用準(zhǔn)備的素材因材施教，比起苦思冥想是要好很多的。</p><p>　　通過本次企業(yè)網(wǎng)站的設(shè)計(jì)開發(fā)，我基本上熟練的掌握了photoshop，Dreamweaver?？梢允褂孟嚓P(guān)工具制作出漂亮的圖片，設(shè)計(jì)漂亮的網(wǎng)站界面。</p><p>　　另外，由于知

77、識(shí)，經(jīng)驗(yàn)等很多方面不足的原因，網(wǎng)站的很多地方還有必要完善，就比如：在線咨詢理論上是要實(shí)現(xiàn)互動(dòng)交流，或者是實(shí)現(xiàn)留言的功能；咨詢頻道，產(chǎn)品介紹等欄目這樣制作不利于后期的更新。</p><p>　　在本次企業(yè)網(wǎng)站設(shè)計(jì)開發(fā)中，我感謝指導(dǎo)老師對(duì)我的關(guān)心與幫助，由于制作時(shí)間、個(gè)人知識(shí)有限，網(wǎng)站本身還存在很大的問題。希望指導(dǎo)老師批評(píng)指正，再次萬分感謝！</p><p>　　不過我相信，在以后的不斷努力中

78、，我們慢慢的攻克asp、jsp、php網(wǎng)站制作的盲區(qū)。最終制作中是個(gè)完整的動(dòng)態(tài)企業(yè)網(wǎng)站。</p><p><b>　　參考文獻(xiàn)：</b></p><p>　　1）、新視角文化行 曹培強(qiáng)、吳春艷、孫焱編著 （photoshop cs2平面</p><p>　　設(shè)計(jì)實(shí)戰(zhàn)-從入門到精通）人民郵電出版社</p><p>　　2）

79、、劉艷麗 主編 （網(wǎng)頁(yè)設(shè)計(jì)與制作使用教程第二版） 高等教育出版</p><p><b>　　社</b></p><p><b>　　3）、百度百科</b></p><p><b>　　4）、百度文庫(kù)</b></p><p>　　附錄1：企業(yè)網(wǎng)站建設(shè)所需提供資料表</p&g