網店裝修(共73張)課件

1、第一章網店裝修入門基礎第1頁，共73頁。（一）網店裝修需要注意的問題1、什么是網店裝修2、為什么要進行網店裝修3、新手店鋪裝修的誤區(qū)第2頁，共73頁。、什么是網店裝修網店裝修就是：在淘寶、易趣、拍拍等網店平臺允許的結構范圍內，盡量通過圖片、程序模板等讓店鋪更加美觀。注：“普通店鋪”結構很固定，只能做一點裝飾，功能性不強?！巴仭弊杂啥确浅４螅δ芤埠軓?，關鍵看自己的創(chuàng)意和技術。第3頁，共73頁。、為什么要進行網店裝修第一：新手基本上都沒有銷售信譽，拿什么讓買家相信你 不是騙子呢？第二：經過裝修的網站會給買家留下一個好印象。第三：裝修網店時，要注意整體搭配。第四：網店商品雖然非常重要，但是絕對不

2、能忽視裝修。第五：好的裝修會增加顧客在網店停留的時間。第4頁，共73頁。第5頁，共73頁。第6頁，共73頁。、新手店鋪裝修的誤區(qū)1、店鋪名稱過于簡潔2、欄目分類太多3、圖片大小適中4、存放圖片的空間速度太慢5、動畫過多6、寶貝名字過長7、店鋪裝修的色彩搭配8、頁面設計過于復雜第7頁，共73頁。1、店鋪名稱過于簡潔第8頁，共73頁。2、欄目分類太多第9頁，共73頁。3、圖片大小適中第10頁，共73頁。而網店欄目的規(guī)劃，其實就是對網店內容的高度提煉。對于網店的店招來說，必須是放在店鋪的最上方，用來說明經營項目，是招攬顧客的牌子。注：“普通店鋪”結構很固定，只能做一點裝飾，功能性不強。從店標的設計到

3、主頁的風格，再到寶貝頁面，應采用同一色系，最好有同樣的設計元素，讓網店有整體感。 導航使用的簡單性。需要注意的是，小字號字體容易產生整體感和精致感，但可讀性差。（一）網店裝修需要注意的問題導航應該能給買家提供咨詢信 息，它如同應該問詢處、咨詢部，當瀏覽者有需要的時候，能為使用者提供導航。減少Flash和大圖片的使用，過多文字描述，以便搜索引擎更容易收錄網店，讓買家更容易找到所需商品。（d）圖文搭配，重點突出網店欄目策劃對于網店的成敗有著非常直接的關系，網店欄目兼具以下兩個功能，二者缺一不可。讓瀏覽者清楚的了解自己所處的位置等。4、存放圖片的空間速度太慢 去測試下你存放圖片空間的去服務 器速度是

4、否正常，并且服務器是否有誤區(qū)第11頁，共73頁。5、動畫過多 將店鋪布置的像動畫片一樣閃閃發(fā)光，能閃的地方都閃起來：店標、公告、寶貝分類、甚至寶貝的圖片、浮動圖片。6、寶貝名字過長 將寶貝名字、分類名字取得過長，這樣做的好處是被搜索到關鍵詞的可能性增大。但是太長的寶貝名字將無法在列表中完整顯示。 其實只要把寶貝的特性、范圍等描述清楚，再適當的加入廣告詞，就可以了。第12頁，共73頁。7、店鋪裝修的色彩搭配 色彩的應用原則是“總體協(xié)調，局部對比”，也就是說網店頁面的整體色彩效果應該是和諧的，只有局部的、小范圍的地方可以有一些強烈的色彩對比。8、頁面設計過于復雜 旺鋪裝修切忌繁雜，不要把旺鋪設計成

5、門戶類網站。第13頁，共73頁。第二章網店裝修審美準則第14頁，共73頁。1、網店的風格網店的風格是指網店界面給買家的直觀感受，買家在瀏覽的過程中所感受到的店主品味、藝術氣氛、人的心境等。第15頁，共73頁。第16頁，共73頁。為此： 裝修店鋪首先要確定店鋪的主題，以此來定位商品特色和店鋪裝修的風格。然后根據店鋪的商品特色進行素材收集、圖片處理，以及店鋪招牌、促銷區(qū)、分類導航區(qū)的設計，這樣一步一步就可以完成整個店鋪的裝修了。第17頁，共73頁。2、網店審美的通用原則（a）特色鮮明 一個網店的用色必須要有自己獨特的風格，這樣才能顯得個性鮮明，給瀏覽者留下深刻的印象。（b）搭配合理 網店頁面設計雖

6、然屬于平面設計范疇，但它又與其他平面設計不同，它在遵循藝術規(guī)律的同時，還要考慮人的生理特點。（c）講究藝術性 網店裝修設計也是一種藝術活動，因此它必須遵循藝術規(guī)律，在考慮到網店本身特點的同時，按照內容決定形式原則，大膽進行藝術創(chuàng)新，從而設計出既符合網店要求，又有一定藝術特色的網店。第18頁，共73頁。3、網店裝修的一般流程在店鋪正式開業(yè)之后，和傳統(tǒng)店鋪一樣，為了能正常營業(yè)、吸引顧客，需要對店鋪進行相應的裝修，主要包括：a 取一個好店名b 確定裝修風格c 注重修飾細節(jié)第19頁，共73頁。a 取一個好店名網店取名也是很有學問的。一個有特色的店名不僅能使買家記住你，還能使買家對你的店鋪產生好感，促使

7、交易并成為你的忠實客戶。網店店名會在一定程度上影響網店的訪問量。以“淘寶”為例，淘寶網目前有搜索店鋪、搜索寶貝功能，所以說店名以易記為取名原則，以便讓買家在搜索時盡快找到。第20頁，共73頁。b 確定裝修風格 網頁設計風格要與主營產品相符。針對不同的消費群體有不同的主題模板。一般來說，插畫風格、時尚可愛、桃心、花邊等風格適合女裝類店鋪。而黑白搭配、有金屬質感的設計風格更適合男性商品店鋪。 網店的整體風格要一致。從店標的設計到主頁的風格，再到寶貝頁面，應采用同一色系，最好有同樣的設計元素，讓網店有整體感。第21頁，共73頁。 c 注重修飾細節(jié) 對淘寶網店進行裝修設計，必須了解淘寶 對自定義店鋪的

8、規(guī)定。 對普通店鋪來說，可以發(fā)揮的空間有：店鋪公告、寶貝分類、店標、論壇頭像、簽名、寶貝描述等。除此之外，還有計數器、背景音樂、掛件、歡迎歡送圖片、掌柜在線時間、營業(yè)時間、聯系方式等。第22頁，共73頁。第二章網店頁面的元素與布局第23頁，共73頁。網店欄目和頁面設計策劃1、為什么要進行策劃2、網店的欄目策劃3、網店的頁面策劃第24頁，共73頁。 1、為什么要進行策劃 專業(yè)的網店策劃，可以帶來以下幾個好處第25頁，共73頁。a 避免日后返工，提高運營效率很多網店店主不是IT行業(yè)人士，總是在不斷地修改網店頁面。所以，為了避免以后不停地返工修改網店頁面，事先對網店的各個環(huán)節(jié)進行細致的策劃是非常重要

9、的。第26頁，共73頁。 b 避免重復燒錢，節(jié)約運營成本 當網店設計好之后，為什么總是沒有買家？即使花很多錢去推廣，到最后也沒有留住買家。那是因為網店的各個環(huán)節(jié)，尤其是用戶的體驗環(huán)節(jié)定位出了問題。所以店鋪做出來之后，總是無法留住買家。因此，如果想節(jié)省網店推廣的錢，那就仔細反省一下網店自身的定位，做好網店的策劃。第27頁，共73頁。c 避免投資浪費，提高成功幾率 在開始網店之前，一定要做一次細致地策劃，如市場的考察、贏利模式的研究、網店的定位。只有進行了專業(yè)的思考和策劃，才可以使投資人的錢不白花，避免投資浪費。第28頁，共73頁。d 避免教訓，成功運營 策劃網店時，不但要策劃網店的具體內容欄目，

10、更多的時候要策劃網店的市場定位、運營模式、運營成本等重要的運用環(huán)節(jié)。第29頁，共73頁。 2、網店的欄目策劃 網店欄目策劃的重要性常被忽略。其實。網店欄目策劃對于網店的成敗有著非常直接的關系，網店欄目兼具以下兩個功能，二者缺一不可。第30頁，共73頁。所謂文字的圖形化，即把文字作為圖形元素來表現，同時又強化了原有的功能。針對不同的消費群體有不同的主題模板。因此，一些重要的商品一般可以安排在這個部位，在視覺中心以外的地方就可以安排那些稍微次要的內容，這樣在頁面上就突出了重點，做到主次有別。顧名思義，店招是一個店鋪的招牌。顧名思義，店招是一個店鋪的招牌。圖片的好壞直接關系到交易的成敗，一張好的商品

11、圖片能向買家傳遞很多東西，起碼應該能反映出商品的類別、款式、顏色、材質等基本信息。旺鋪裝修切忌繁雜，不要把旺鋪設計成門戶類網站。這里對大家來說可操作的內容是最多的，需要注意的是要使描述具有層次性，條理清楚，各個部分經歷獨立。在買家打開頁面的第一瞬間，讓買家直觀地感受到網店所要傳遞的理念及特征。7、店鋪裝修的色彩搭配它是每家店鋪必備的欄目。5、數碼 6、家電在同一頁面中，字體種類少，版面雅致，有穩(wěn)重感；（1）第一張圖片是該商品的整體效果，通過整體圖片買家可以對商品有一個總體了解。當網店設計好之后，為什么總是沒有買家？即使花很多錢去推廣，到最后也沒有留住買家。 a 提綱摯領，點題明義 所謂的“提綱

12、”就是網店的欄目。而網店欄目的規(guī)劃，其實就是對網店內容的高度提煉。用最簡練的語言提煉出網店中每一個部分的內容，清晰地告訴買家有哪些信息和功能。第31頁，共73頁。b 指引迷途，清晰導航 除了“提綱”的作用之外，網店欄目還應該為瀏覽者提供清晰直觀的指引，幫助買家方便地找到所需的商品。 網店欄目的導航作用，通常包括以下兩種情況：第32頁，共73頁。 （a）頂部導航 它可以幫助買家快速找到所需欄目。通常來說，頂部導航的位置是固定的，以減少瀏覽者查找的時間。第33頁，共73頁。（b）產品欄目導航 一般產品欄目導航在頁面的左側，也就是寶貝分類。產品分類越清晰越好，通過單擊分類可以快速找到相應的產品信息。

13、第34頁，共73頁。 3、網店的頁面策劃 網店頁面是網店銷售商品的最終表現層，也是買家訪問網店的直接接觸層。對于頁面設計的評估，最有發(fā)言權的是網店的買家，好的網店策劃者要善于從買家的瀏覽行為中捕捉買家的意見。 第35頁，共73頁。網店策劃者在做頁面策劃時應該遵循以下原則（a）符合客戶心理的網店特點及行業(yè)屬性 在買家打開頁面的第一瞬間，讓買家直觀地感受到網店所要傳遞的理念及特征。如頁面色彩、圖片、布局等。（b）符合買家的瀏覽習慣 根據頁面內容的重要性進行排序，讓買家用最少的光標移動，找到所需信息。第36頁，共73頁。（c）符合買家的使用習慣 根據網絡買家的習慣，將店鋪最有特色的商品放置于醒目的位

14、置，便于買家的查找及實用。（d）圖文搭配，重點突出 買家對圖片的認知程度遠高于對文字的認知程度，適當地使用圖片可以提高買家的關注度。此外，確立頁面的視覺焦點也很重要，過多的干擾元素會讓買家不知所措。（e）利用搜索引擎優(yōu)化 減少Flash和大圖片的使用，過多文字描述，以便搜索引擎更容易收錄網店，讓買家更容易找到所需商品。第37頁，共73頁。（一）網店布局的基本元素在一個完整的淘寶旺鋪中，網店頁面通常包括的元素有： 店招、公告、促銷欄、寶貝分類導航、寶貝展示區(qū)、寶貝描述、計數器、歡迎歡送、聯系方式等。 第38頁，共73頁。 店招： 顧名思義，店招是一個店鋪的招牌。對于網店的店招來說，必須是放在店鋪

15、的最上方，用來說明經營項目，是招攬顧客的牌子。 店招首先應說明店鋪是經營什么的，有什么特色使顧客必須在這里停留，同時還要注意店招太小，不能做短了，否則會顯示得既不專業(yè)又不協(xié)調。 第39頁，共73頁。公告欄 它是每家店鋪必備的欄目。是用來向買家展示自己店鋪里有什么新品、新優(yōu)惠政策的絕佳平臺，同時也是買家獲取店鋪信息的重要渠道。促銷欄 促銷欄的長度一般是750像素左右，高度沒有限制，這里比店招有更重要的廣告價值。促銷欄通常越大越好，但高度不能太高，其中的內容要有動感，給顧客一種像在看電視的感覺，內容也不要過于單一。動態(tài)的內容最好置于整個促銷欄的左上方，因為這里正處在顧客視野的正中央，最容易引起注意

16、。第40頁，共73頁。 寶貝分類導航 這也是每個店鋪都有的。在建立目錄時應遵循一些原則，比如說按照字母順序來排列產品分類，并在頂上加以注解，這樣就會更人性化，節(jié)省顧客搜尋所需寶貝的時間。 店鋪類目的裝修是重中之重。在店鋪類目中，不僅可以很方便地利用各種圖片來展示商品分類，還可以通過圖片及圖片上的文字來表達的任何內容。注：店鋪分類的顏色、圖案和文字最好與店招有一定的呼應，這樣在整體上會有一種連續(xù)性和協(xié)調感。第41頁，共73頁。寶貝描述 該內容是在買家對產品有興趣之后，點擊進入后看到的頁面。這里對大家來說可操作的內容是最多的，需要注意的是要使描述具有層次性，條理清楚，各個部分經歷獨立。第42頁，共

17、73頁。計數器 計數器不是必備的，但是，它能使賣家更好地揣摩買家的心思。如果店鋪人氣很高，買家看到他中意的東西之后又看到人氣這么旺，肯定是保質保量，并且售后可能也不會很差，于是就留下一個很好的印象，非常有利于成交。 注：通?？梢蕴砑佑嫈灯鞯牡胤剑汗鏅?、分類導航欄、描述模板。第43頁，共73頁。聯系方式 對于旺鋪來說，聯系方式最好放在促銷模板的右下角，因為人們的習慣通常都是把署名、聯系方式、日期等放在右下角。 在描述模板的頂端或底端也都可以添加聯系方式。對于普通店鋪來說，聯系方式可以放在公告欄或者分類的頂端。第44頁，共73頁。（二）網店版面布局設計網店頁面設計要講究編排和布局，雖然網店頁面設

18、計不同于平面設計，但它們有許多相近之處，應加以利用和借鑒。為了達到最佳的視覺效果，應講究整體布局的合理性，使瀏覽者有一個流暢的視覺體驗。第45頁，共73頁。版面布局設計原則第46頁，共73頁。a 主次分明，中心突出 在一個頁面上，必須考慮視覺的中心，這個中心一般在屏幕的中央，或者在中間偏上的部位。因此，一些重要的商品一般可以安排在這個部位，在視覺中心以外的地方就可以安排那些稍微次要的內容，這樣在頁面上就突出了重點，做到主次有別。第47頁，共73頁。b 大小搭配、喜歡呼應 對待商品展示的多個圖片的安排要互相錯開，使大小圖像之間有一定的間隔，這樣可以使頁面錯落有致，避免重心偏離。第48頁，共73頁

19、。c 頁面布局時的一些元素 格式美觀的正文、和諧的色彩搭配、較好的對比度、具有較強可讀性的文字、生動的背景圖案、大小適中的頁面元素、布局勻稱、不同元素之間有足夠空白、各元素之間保持平衡、文字準確無誤、無錯別字、無拼寫錯誤。第49頁，共73頁。d 文本和背景的色彩 考慮到大多數人使用256色顯示模式，因此一個頁面顯示的顏色不宜過多，主題顏色通常只需要23種，并采用一種標準色。e 簡潔一致性 保持簡潔的常用做法是使用醒目的標題，這個標題常常采用圖形表示，但圖形同樣要求簡潔，另一種保持簡潔的做法是限制所用字體和顏色的數目。要保持一致性，各個頁面文本、主要圖形、標題或符號旁邊留下相同的空白。第50頁，

20、共73頁。網店頁面內容的排版頁面上文本的排版： 一般文本的排版整體性好，瀏覽起來通暢而絲毫沒有阻礙，理解內容更加容易。文字的大小應該適中，如果太大瀏覽起來增加翻頁的難度，太小看起來太累。 因此這是很值得每一個設計者慎重考慮的。用色一般區(qū)別于主體的顏色，它可以起到強調作用，但凡事都是過猶不及，一個整體的文字內容里用的顏色太多，勢必會影響讀者的理解，也會影響使用心情，導致厭倦情緒。第51頁，共73頁。文本的排版第52頁，共73頁。頁面上圖片的排版 圖片在網頁設是計中也占據很重要的地位，由于圖片的加入使網店頁面更加豐富多彩，所以用好圖片是非常重要的。 幾個值得注意的：圖片不能太大，受寬帶的限制，人們

21、是很難忍受等待之苦的，這就要求把圖片的體積縮小，同時又要使圖片盡量清楚、直觀，最大限度地發(fā)揮它的作用；另外圖片的排布也很講究，特別是多圖的情況下，既要使圖片與圖片之間有聯系，同時又要融為一個整體，使看起來有條理。第53頁，共73頁。如圖第54頁，共73頁。第三章網店頁面的視覺元素設計第55頁，共73頁。一、網店導航設計 網店的導航是網店內容架構的體現，是否合理是網店易用性評價的重要指標之一。正確的網店導航要做到便于瀏覽者的理解和使用，讓瀏覽無論進入網店的哪一頁，都很清楚自己所在的位置，很容易返回網店首頁。 常見的有幾種導航：圖片導航、按鈕導航、文字導航等。第56頁，共73頁。 （一）導航設計的

22、基本要求 明確性： 無論采用哪種導航策略，導航的設計應該明確，讓瀏覽者能一目了然。具體表現為：讓瀏覽者明確店鋪的主要商品范圍；讓瀏覽者清楚的了解自己所處的位置等。只有明確的導航才能真正發(fā)揮“引導”的作用，引導瀏覽者找到所需的信息。第57頁，共73頁?？衫斫庑裕?導航對于瀏覽者應該是易于理解的。在表達形式上，要使用清楚簡潔的按鈕、圖片或文本，避免使用無效字句。完整性： 是要求網店所提供的導航具體、完整，可以讓瀏覽者獲得整個網店范圍內的領域性導航，能涉及網店中全部的信息及其關系。 第58頁，共73頁。 咨詢性： 導航應該能給買家提供咨詢信 息，它如同應該問詢處、咨詢部，當瀏覽者有需要的時候，能為使

23、用者提供導航。易用性 導航系統(tǒng)應該容易進入，同時也要容易推出當前頁面，或者使用者以簡單的方式跳轉到想要的去的頁面。第59頁，共73頁。 （二）導航的基礎要素 全局導航也稱主導航，是出現在網店每一個頁面上的一組通用導航元素，以一致的外觀出現在網店的每一個頁面，扮演著對瀏覽者最基本的訪問方向性指引。 一般網店的全局導航一般包括3個基本設計要素。 店鋪名稱：網店頂部的店招或店鋪名稱必須添加回首頁的超鏈接。 回首頁：每個全局導航左邊位置應該出現回首頁的提示及超鏈接。 全站基礎欄目（一級欄目） 第60頁，共73頁。 （三）導航設計注意要點 在設計導航時可以采用文本鏈接方式，一些網店為了表現網店的獨特風格

24、，在導航條上使用Flash或圖片等作為導航。以下是一些常見的導航設計注意事項： 導航使用的簡單性。 不要采用“很酷”的表現技巧。 注意超鏈接顏色與單純敘述文字 的顏色呈現。 測試所有超鏈接與導航按鈕的真實可行性。 導航 內容必須清晰。 準確的導航文字描述。 第61頁，共73頁。 二、頁面中的文字設計 在確定頁面的版面和布局后，還需要確定文本的樣式，如字體、顏色、字號等，還可以將文字圖形化。第62頁，共73頁。 （一）文字的字體、字號、行距 頁面中中文默認的標準字體是“宋體”，如果在頁面中沒有設置任何字體，在瀏覽器中將以這種字體顯示。 字號大小可以使用磅（point）或像素（pixel）來確定。

25、一般頁面常用的字號大小為12磅左右。較大的字體可用標題或其他需要強調的地方，小一些的字體可以用于頁腳和輔助信息。需要注意的是，小字號字體容易產生整體感和精致感，但可讀性差。 第63頁，共73頁。 無論選擇什么樣的字體，都要依據頁面的總體設計和瀏覽者的需要。在同一頁面中，字體種類少，版面雅致，有穩(wěn)重感；字體種類多，則版面活躍，豐富多彩。關鍵是根據頁面內容來掌握這個比例關系。 行距的變化也對文本的可讀性產生很大的影響，一般情況下，接近字體尺寸的行距設置比較適合正文。第64頁，共73頁。（二）文字的顏色 顏色的運用除了能夠起到強調整體文字中特殊部分的作用外，對于整體文案的情感表達也會產生影響。 另外

26、需要注意的是文字顏色的對比度，它包括明度上的對比、純度上的對比，以及冷暖的對比。這些不僅對文字的可讀性發(fā)生作用，更重要的是，可以通過對顏色的運用實現想要的設計效果、設計情感和設計思想。第65頁，共73頁。（三）文字的圖形化 所謂文字的圖形化，即把文字作為圖形元素來表現，同時又強化了原有的功能。 將文字圖形化，以更富創(chuàng)意的形式表達出深層的設計思想，能夠克服頁面的單調與平淡，從而打動人心。第66頁，共73頁。（四）讓文字易讀 正確的文字和配色方案是好的視覺設計的基礎。網店上的文字受屏幕分辨率和瀏覽器的限制，但仍有一些通用的準則： 文字清晰可讀，大小合適，文字顏色和色背景色有較強的對比度，文字周圍的設計元素不能對文字造成干擾。第67頁，共73頁。三、頁面中的圖片應用 圖片的好壞直接關系到交易的成敗，一張好的商品圖片能向買家傳遞很多東西，起碼應該能反映出商品的類別、款式、顏色、材質等基本信息。在這個基礎上，要求圖