畢業(yè)論文-雙利皇陶瓷廠的網(wǎng)頁(yè)設(shè)計(jì)與上傳

第第頁(yè)共16頁(yè)畢業(yè)設(shè)計(jì)設(shè)計(jì)課題：雙利皇陶瓷廠的網(wǎng)頁(yè)設(shè)計(jì)與上傳系別：專業(yè)：班級(jí)：姓名：學(xué)號(hào)：指導(dǎo)老師：完成時(shí)間：2016年4月1日目錄電子商務(wù)與網(wǎng)頁(yè)設(shè)計(jì)……………41.1企業(yè)應(yīng)用網(wǎng)頁(yè)的價(jià)值和意義…………………41.2電子商務(wù)與網(wǎng)頁(yè)設(shè)計(jì)…………42.網(wǎng)頁(yè)設(shè)計(jì)與制作的流程（以深圳福田區(qū)雙利皇陶瓷廠為例）…52.1首頁(yè)的建設(shè)流程…………52.1.1確定首頁(yè)主圖…………52.1.2收集首頁(yè)素材…………52.1.3明確首頁(yè)排版與布局…………52.2首頁(yè)色彩設(shè)計(jì)……………62.2.1確定首頁(yè)主色調(diào)…………72.2.2色彩的搭配…………72.3首頁(yè)制作的內(nèi)容…………72.3.1banner的制作…………72.3.2對(duì)整個(gè)頁(yè)面進(jìn)行排版……………………82.3.3根據(jù)客戶要求進(jìn)行修改…………………93.網(wǎng)頁(yè)發(fā)布的流程（以深圳福田區(qū)雙利皇陶瓷廠為例）…………93.1網(wǎng)頁(yè)切圖…………93.2上傳圖片…………103.3效果預(yù)覽，進(jìn)行修改調(diào)整…………………103.4發(fā)布完成…………11網(wǎng)頁(yè)設(shè)計(jì)與發(fā)布的發(fā)展策略……………………124.1網(wǎng)頁(yè)設(shè)計(jì)與發(fā)布的不足……………………124.2網(wǎng)頁(yè)設(shè)計(jì)與發(fā)布的發(fā)展策略………………12結(jié)論…………………14致謝…………………15參考文獻(xiàn)……………16摘要隨著時(shí)代的發(fā)展，如今的電子信息產(chǎn)業(yè)正在經(jīng)受著一個(gè)巨大的挑戰(zhàn)，如何足不出戶的就可以將自己的產(chǎn)品向外部推廣，擴(kuò)大銷路？人們的生活水平越來(lái)越高，越來(lái)越多的網(wǎng)購(gòu)出現(xiàn)在我們的生活中，那么在這個(gè)新興科技飛速發(fā)展的時(shí)代里，網(wǎng)頁(yè)的設(shè)計(jì)制作與發(fā)布給多少個(gè)企業(yè)家?guī)?lái)了希望。由于我現(xiàn)在的實(shí)習(xí)工作與網(wǎng)頁(yè)設(shè)計(jì)相關(guān)，所以當(dāng)時(shí)選擇論題的時(shí)候就選擇了網(wǎng)頁(yè)設(shè)計(jì)，本篇論文主要結(jié)合了自己的實(shí)習(xí)實(shí)際經(jīng)歷闡述了網(wǎng)頁(yè)設(shè)計(jì)制作與發(fā)布的一些流程和實(shí)際操作，并對(duì)自己的網(wǎng)頁(yè)設(shè)計(jì)制作與發(fā)布制定了發(fā)展計(jì)劃。關(guān)鍵詞：網(wǎng)頁(yè)設(shè)計(jì)；網(wǎng)頁(yè)建設(shè)；第1章電子商務(wù)與網(wǎng)頁(yè)設(shè)計(jì)1.1企業(yè)應(yīng)用網(wǎng)頁(yè)的價(jià)值和意義在網(wǎng)絡(luò)時(shí)代，企業(yè)網(wǎng)上的形象即網(wǎng)站的形象，是十分重要的。它的定位與網(wǎng)頁(yè)設(shè)計(jì)直接影響著企業(yè)在網(wǎng)絡(luò)電子商務(wù)應(yīng)用推廣中的成敗，企業(yè)的知名度和實(shí)力往往與其企業(yè)網(wǎng)站的設(shè)計(jì)制作水平成正比，建設(shè)一個(gè)與自身形象相稱或者更新穎的網(wǎng)站，是當(dāng)前時(shí)代必不可少的選擇。下面來(lái)講述一下雙利皇陶瓷廠應(yīng)用網(wǎng)頁(yè)的原因：第一，網(wǎng)頁(yè)是通過(guò)視覺(jué)元素的引人注目而實(shí)現(xiàn)信息內(nèi)容的傳達(dá)，利用網(wǎng)絡(luò)推廣企業(yè)，宣傳企業(yè)的產(chǎn)品或者服務(wù)，從而提高企業(yè)的知名度；第二，企業(yè)網(wǎng)站可以發(fā)布企業(yè)最新動(dòng)態(tài)與產(chǎn)品，將企業(yè)的各方面情況可以展現(xiàn)給客戶，可快速傳遞企業(yè)信息，可降低企業(yè)的媒體宣傳成本或營(yíng)銷成本；

第三，通過(guò)企業(yè)網(wǎng)站的網(wǎng)絡(luò)營(yíng)銷，使你的潛在客戶方便地找到你，產(chǎn)生直接的營(yíng)銷價(jià)值；

第四，通過(guò)企業(yè)網(wǎng)站訪客的流量分析，可分析潛在客戶的購(gòu)買行為與關(guān)注對(duì)象，從而快速調(diào)整企業(yè)營(yíng)銷方向與產(chǎn)品更新等；

第五，通過(guò)在線的企業(yè)網(wǎng)站，可以直接與客戶進(jìn)行線上的交流（如留言，線上客服），最快地反饋問(wèn)題，提高企業(yè)與客戶的溝通效率。1.2電子商務(wù)與網(wǎng)頁(yè)設(shè)計(jì)電子商務(wù)是一種依托現(xiàn)代信息技術(shù)和網(wǎng)絡(luò)技術(shù)，集金融電子化、管理信息化、商貿(mào)信息網(wǎng)絡(luò)化為一體。電子商務(wù)在互聯(lián)網(wǎng)的基礎(chǔ)上，突破傳統(tǒng)的時(shí)空觀念，縮小了生產(chǎn)、流通、分配、消費(fèi)之間的距離，為制造者、銷售者和消費(fèi)者提供了能更好地滿足各自需求的好機(jī)會(huì)。電子商務(wù)中的資金周轉(zhuǎn)為電子商務(wù)時(shí)代的來(lái)臨，徹底改變了傳統(tǒng)的企業(yè)經(jīng)營(yíng)類型。許多非信息產(chǎn)業(yè)的企業(yè)也投入了之中，商業(yè)電子化這樣的趨勢(shì)在未來(lái)將繼續(xù)蓬勃發(fā)展，而網(wǎng)頁(yè)是通過(guò)視覺(jué)元素的引人注目而實(shí)現(xiàn)信息內(nèi)容的傳達(dá)，利用網(wǎng)絡(luò)推廣企業(yè)，宣傳企業(yè)的產(chǎn)品或者服務(wù)，所以這時(shí)候企業(yè)需要一個(gè)這樣的“櫥窗”來(lái)向消費(fèi)者推廣，提高知名度。網(wǎng)站設(shè)計(jì)要能充分吸引訪問(wèn)者的注意力，讓訪問(wèn)者產(chǎn)生視覺(jué)上的愉悅感。因此在網(wǎng)頁(yè)創(chuàng)作的時(shí)候就必須將網(wǎng)站的整體設(shè)計(jì)與網(wǎng)頁(yè)設(shè)計(jì)的相關(guān)原理緊密結(jié)合起來(lái)。網(wǎng)站設(shè)計(jì)是將策劃案中的內(nèi)容、網(wǎng)站的主題模式，以及結(jié)合自己的認(rèn)識(shí)通過(guò)藝術(shù)的手法表現(xiàn)出來(lái)。第2章網(wǎng)頁(yè)設(shè)計(jì)的流程2.1首頁(yè)的建設(shè)流程2.1.1確定首頁(yè)主圖產(chǎn)品展示圖片是展示網(wǎng)店產(chǎn)品形象的重要窗口，而且一張產(chǎn)品圖片會(huì)引發(fā)一系列連鎖反應(yīng)，一個(gè)網(wǎng)頁(yè)的制作最主要的目的就是提高產(chǎn)品的銷量，所以一個(gè)網(wǎng)頁(yè)的靈魂也就是在于產(chǎn)品的圖片，由此得出網(wǎng)頁(yè)設(shè)計(jì)中產(chǎn)品圖片的選擇很重要，正所謂：“細(xì)節(jié)決定成敗”。每一個(gè)成功的案例都離不開(kāi)案例中的每個(gè)小細(xì)節(jié)，成功的網(wǎng)店也同樣離不開(kāi)經(jīng)營(yíng)過(guò)程的每一小步。一張質(zhì)量過(guò)關(guān)的圖片帶來(lái)的反應(yīng)是提升網(wǎng)店的效益。2.1.2收集首頁(yè)素材任何事情前期都要有準(zhǔn)備工作，就像你要建一棟房子，前提工作就是要準(zhǔn)備好所有的材料，例如：紅磚、水泥、沙石等。制作網(wǎng)頁(yè)也是如此，需要收集網(wǎng)頁(yè)所需的材料，先瀏覽一些同行的網(wǎng)頁(yè)設(shè)計(jì)，相比挑選出比較優(yōu)秀的一些元素，再加上自己的一些想法，并且結(jié)合當(dāng)前的流行趨勢(shì)，設(shè)計(jì)出一個(gè)網(wǎng)頁(yè)。2.1.3明確首頁(yè)排版與布局網(wǎng)頁(yè)設(shè)計(jì)作為一種視覺(jué)語(yǔ)言，要講究編排和布局。雖然主頁(yè)的設(shè)計(jì)不等同于平面設(shè)計(jì)。但它們有許多相近之處，應(yīng)充分加以利用和借鑒。板式設(shè)計(jì)通過(guò)文字圖形的空間結(jié)合，表達(dá)出和諧與美。特別要處理好以下幾個(gè)關(guān)系：1.頁(yè)面之間的關(guān)系2.頁(yè)面內(nèi)的秩序關(guān)系3.內(nèi)容的關(guān)系。想要給客戶帶來(lái)最佳的視覺(jué)感受，整體的排版和布局很重要。網(wǎng)站建設(shè)是否成功、頁(yè)面設(shè)計(jì)是否合理與美觀，這往往取決于整體網(wǎng)站的排版布局，一個(gè)科學(xué)合理的布局可以提升網(wǎng)站的檔次，提高訪問(wèn)者的閱讀興趣，可以將網(wǎng)站管理者要發(fā)布的信息更好的展示出來(lái)，雙利皇陶瓷廠采用板塊分明的排版方式，每個(gè)板塊劃分的都很清楚，這樣可以讓顧客第一眼就能找到要找的產(chǎn)品。有時(shí)候一家生產(chǎn)型企業(yè)，他所提供產(chǎn)品的名稱、類別、型號(hào)、價(jià)格、功能介紹不一樣的編排給瀏覽者帶來(lái)的感受就不一樣，主要是讓顧客擁有一個(gè)流暢的視覺(jué)體驗(yàn)，從而方便他對(duì)產(chǎn)品的了解，促成最后的購(gòu)買交易。 2.2首頁(yè)色彩設(shè)計(jì)色彩依附于物體作用于認(rèn)知感官，色彩最容易被人所感受到，因此色彩稱為網(wǎng)頁(yè)設(shè)計(jì)中的第一要素，是能直接決定網(wǎng)頁(yè)設(shè)計(jì)的的好壞。顏色可刺激人的視覺(jué)，產(chǎn)生興奮感，增進(jìn)食欲，感到溫暖，心平氣和。色動(dòng)力學(xué)研究者認(rèn)為，紅色會(huì)使人產(chǎn)生興奮感，比如，可口可樂(lè)官網(wǎng)的紅色配色方案就給人帶來(lái)一種置身于炎熱夏天的慵懶感，正是這種感覺(jué)令訪客產(chǎn)生喝可樂(lè)的欲望。據(jù)資料顯示，多數(shù)的用戶會(huì)因?yàn)樵愀獾木W(wǎng)站配色而一去不返。用戶在訪問(wèn)你的站點(diǎn)時(shí)，首要關(guān)注的是你的品牌的顏色。如果他們無(wú)法從眾多的色彩中分辨出你的主色調(diào)，你就該考慮重新設(shè)計(jì)配色方案了。合適的配色方案至關(guān)重要，我相信這個(gè)道理大家都懂。根據(jù)用戶喜好確定顏色使得讀者更聽(tīng)你的，聽(tīng)起來(lái)不可思議，但不論對(duì)錯(cuò)，這一直是所有設(shè)計(jì)師的工作目標(biāo)：向讀者發(fā)出信號(hào)，并希望得到反饋。如果你了解色彩心理學(xué)原理，又能找到適合用戶的配色方案，那么你的網(wǎng)站離成功又近了一步。雙利皇陶瓷廠采用深紅色為主色調(diào)，蛋黃色作為背景來(lái)制作完成。2.2.1確定首頁(yè)主色調(diào)客戶要求使用深色系以便于突出產(chǎn)品的高檔次，雙利皇陶瓷廠采用了深紅色作為主色調(diào)。2.2.2色彩的搭配想要做出高檔次的網(wǎng)頁(yè)效果，自然離不開(kāi)黃色，所以采用黃色和深紅色搭配的方式來(lái)完成這個(gè)頁(yè)面設(shè)計(jì)。2.3首頁(yè)制作的內(nèi)容2.3.1banner的制作Banner設(shè)計(jì)其實(shí)是我們接觸互聯(lián)網(wǎng)工作后，最常見(jiàn)一種工作,banner的核心使命其實(shí)是吸引用戶關(guān)注，然后被點(diǎn)擊。Banner的主旨就是主題明確，突出關(guān)鍵內(nèi)容，抓住用戶眼球。所以，一個(gè)很好的網(wǎng)站，banner起到的作用是不容忽視的，它能代表一個(gè)專題頁(yè)面，用它來(lái)表意一些活動(dòng)，引導(dǎo)眾多用戶來(lái)進(jìn)行參與。所以banner需要花心思來(lái)設(shè)計(jì)，才能把要表達(dá)的東西通過(guò)一張圖好好的表現(xiàn)出來(lái)。從構(gòu)成上講，一個(gè)Banner是由“背景、主視覺(jué)和標(biāo)題文字”三部分組成，要讀一個(gè)人的喜怒哀樂(lè)，只要讀其五官即可。在一個(gè)banner里面，標(biāo)題文字起著五官一樣的作用，所以個(gè)人覺(jué)得文字才是整個(gè)banner的主角。所以對(duì)于文字的處理，顯得尤為重要，不要小看任何一個(gè)你認(rèn)為可能很簡(jiǎn)單就能做到的事情，細(xì)節(jié)決定成敗。在我剛剛接到需求的時(shí)候，我首先分析他的重點(diǎn)詞、字，想要表達(dá)什么，分析好了后可以在紙上畫(huà)下草稿，在大腦里有個(gè)大概的視覺(jué)效果，想法多的話可以畫(huà)幾版不一樣的，最后根據(jù)草稿定一個(gè)定稿，接下來(lái)就可以找素材著手做了。雙利皇陶瓷廠這5張banner都是主推款，首先要選好圖片，其次是文字盡量凸顯出產(chǎn)品特性，再次是背景也要融入產(chǎn)品情景。2.3.2對(duì)整個(gè)頁(yè)面進(jìn)行排版主要板塊已經(jīng)確定下來(lái)了，下面做的就是把這些素材板塊結(jié)合起來(lái)，根據(jù)主次來(lái)排列，把這些信息全部放在一起組合成一個(gè)網(wǎng)頁(yè)。2.3.3根據(jù)客戶要求進(jìn)行修改一般情況下做好的網(wǎng)頁(yè)要先給客戶看一下，審核下，客戶會(huì)給出意見(jiàn)，例如產(chǎn)品圖片位置、屬性之類的信息需要調(diào)整，結(jié)合客戶給的建議再去修改，通過(guò)客戶意見(jiàn)就可以準(zhǔn)備下一步了。第3章網(wǎng)頁(yè)發(fā)布的流程（以深圳福田區(qū)雙利皇陶瓷廠為例）3.1網(wǎng)頁(yè)切圖在ps中新建切片，一個(gè)產(chǎn)品建一個(gè)切片，這樣到時(shí)候有利于上傳產(chǎn)品以及添加產(chǎn)品鏈接。3.2上傳圖片上傳圖片時(shí)新建一個(gè)相冊(cè)，以這個(gè)產(chǎn)品的名字來(lái)命名，需要注意上傳的圖片和洗一張圖片之間有空格，記得要去掉。3.3效果預(yù)覽，進(jìn)行修改調(diào)整3.4發(fā)布完成第4章網(wǎng)頁(yè)設(shè)計(jì)與發(fā)布的發(fā)展策略4.1網(wǎng)頁(yè)設(shè)計(jì)與發(fā)布的不足（一）頁(yè)面設(shè)計(jì)不夠美觀大多數(shù)企業(yè)網(wǎng)站因頁(yè)面設(shè)計(jì)不美觀而導(dǎo)致改版。網(wǎng)站具備了提升產(chǎn)品形象、促進(jìn)產(chǎn)品銷售、替身品牌形象、體現(xiàn)企業(yè)實(shí)力、傳播品牌文化等諸多功能。形象簡(jiǎn)陋、缺乏設(shè)計(jì)思想，沒(méi)有個(gè)性的網(wǎng)站已經(jīng)不能滿足需求。如果不重視或過(guò)分注重外在的視覺(jué)效果，就可能適得其反。（二）界面板塊設(shè)置混亂

主要表現(xiàn)在欄目設(shè)置有重疊或者欄目名稱意義不明確，容易造成混淆，使得用戶難以發(fā)現(xiàn)需要的信息。如果網(wǎng)站毫無(wú)章法的安排大量?jī)?nèi)容，沒(méi)有明確的導(dǎo)航會(huì)導(dǎo)致瀏覽者轉(zhuǎn)移站點(diǎn)，企業(yè)因客戶無(wú)法快速找到所需信息從而導(dǎo)致客戶流失。4.2網(wǎng)頁(yè)設(shè)計(jì)與發(fā)布的發(fā)展策略在數(shù)字時(shí)代占主導(dǎo)地位的社會(huì)媒體，文化基因和觀眾越來(lái)越短的注意力，趨勢(shì)已經(jīng)成為網(wǎng)絡(luò)生活的一部分。那么我們?nèi)绾巫尵W(wǎng)頁(yè)設(shè)計(jì)與發(fā)布跟上時(shí)代的步伐，讓它走向更成熟的階段呢？綜上所述，網(wǎng)頁(yè)設(shè)計(jì)與發(fā)布需要注意以下幾點(diǎn)：1、滿足用戶需求，以客戶為宗旨；2、確定網(wǎng)頁(yè)的整體風(fēng)格用戶在訪問(wèn)網(wǎng)站時(shí)產(chǎn)生的對(duì)網(wǎng)頁(yè)整體的第一印象謂之網(wǎng)頁(yè)的風(fēng)格，也可以說(shuō)是網(wǎng)頁(yè)的“靈魂”。網(wǎng)頁(yè)風(fēng)格包含多個(gè)元素，如版面設(shè)計(jì)、網(wǎng)站標(biāo)志、瀏覽方式等等，這些元素需要在用戶訪問(wèn)網(wǎng)站的第一眼就能夠確定；3、建立清晰的視覺(jué)層次網(wǎng)站就如同一張企業(yè)名片，而網(wǎng)頁(yè)則是名片上的具體內(nèi)容。制作精美的名片能讓人迅速記住名片所傳達(dá)的信息，同樣地，精美的網(wǎng)站也能夠在較短的時(shí)間內(nèi)給訪問(wèn)者傳達(dá)企業(yè)信息。那么，要如何做才能夠讓網(wǎng)站能夠快速抓住用戶眼球呢？這就需要在網(wǎng)頁(yè)設(shè)計(jì)的主題色上琢磨了。一般情況下，遵循現(xiàn)有的傳統(tǒng)顏色搭配就可以了。比如說(shuō)，科技類的多以銀灰色為主，醫(yī)療健康類的一般以綠色為主。網(wǎng)頁(yè)色彩搭配好了，整個(gè)網(wǎng)站的視覺(jué)層次會(huì)清晰明朗起來(lái)，網(wǎng)站的價(jià)值會(huì)上升一個(gè)高度；4、網(wǎng)頁(yè)設(shè)計(jì)要合理布局結(jié)構(gòu)層次明確的網(wǎng)頁(yè)能夠清晰地傳達(dá)出想要傳達(dá)的信息，也能夠讓整個(gè)網(wǎng)站在結(jié)構(gòu)上顯得整潔大方、不落俗套。這就要求在設(shè)計(jì)網(wǎng)頁(yè)時(shí)，把網(wǎng)頁(yè)分為網(wǎng)頁(yè)的頭部、網(wǎng)頁(yè)的身體部分和網(wǎng)頁(yè)的底部三部分，并按照從上至下的順序來(lái)完成網(wǎng)頁(yè)的布局工作；5、多去收集素材，不斷充實(shí)素材庫(kù)；6、不斷關(guān)注網(wǎng)頁(yè)設(shè)計(jì)的流行趨勢(shì)，跟上網(wǎng)頁(yè)流行的趨勢(shì)；7、需要掌握網(wǎng)頁(yè)設(shè)計(jì)的一般流程，熟練網(wǎng)頁(yè)設(shè)計(jì)與發(fā)布的流程操作，不斷熟練操作，加快設(shè)計(jì)與發(fā)布的速度，大大地提高效率。結(jié)論網(wǎng)頁(yè)作為一種新的視覺(jué)表現(xiàn)形式，它的發(fā)展雖然沒(méi)有多長(zhǎng)時(shí)間，卻兼容了傳統(tǒng)的平面設(shè)計(jì)的特征，又具備其所沒(méi)有的優(yōu)勢(shì)，成為今后信息交流的一個(gè)非常有影響的途徑。網(wǎng)頁(yè)設(shè)計(jì)是一種去綜合性設(shè)計(jì)，它所涉及的范圍非常的廣泛，當(dāng)然也離不開(kāi)一定的科學(xué)技術(shù)發(fā)展。在本文中只從頁(yè)面設(shè)計(jì)與制作上傳的角度進(jìn)行了一些闡述與分析。好的網(wǎng)頁(yè)設(shè)計(jì)除應(yīng)先考慮內(nèi)容上的精益求精外，其次就是對(duì)內(nèi)容合理有效的視覺(jué)編排，這樣才可以吸引讀者的視線，從而給公司帶來(lái)效益。致謝時(shí)光的流逝也許是客觀的，然而流逝的快慢卻是一種主觀的感受。通過(guò)這一階段的努力，我的畢業(yè)論文終于完成了。這意味著大學(xué)生活即將結(jié)束。站在畢業(yè)的門檻上回首往昔奮斗和辛勞，成為絲絲的記憶甜美與歡笑也都?jí)m埃落定。在大學(xué)階段我在學(xué)習(xí)上和思想上都受益非淺，這除了自身的努力外與各位老師、同學(xué)、家人和朋友的關(guān)心、支持和鼓勵(lì)是分不開(kāi)的。在本論文的寫(xiě)作過(guò)程中，我的導(dǎo)師許老師傾注了大量的心血，從選題到開(kāi)題報(bào)告，從寫(xiě)作提綱，都一遍又一遍地指出每稿中的具體問(wèn)題，嚴(yán)格把關(guān)、循循善誘，在此我向許老師表示衷心的感謝。同時(shí)