第二部分：裝修2(ps等)【3】

第二部分：裝修目錄2.1網店裝修的意義2.2網店裝修攻略2.3商品圖片拍攝技術2.4處理吸引顧客眼球的商品照片2.4.1商品圖片美化在淘寶店鋪中的作用2.4.2圖片處理的基本工具——Photoshop2.4.3圖片處理的其它工具——光影魔術手2.5使用HTML制作網店店鋪2.6網店裝修通用技巧2.7網店精裝修2.4

處理吸引顧客眼球的商品照片商品圖片美化在淘寶店鋪中的目的是什么？2.4.1商品圖片美化在淘寶店鋪中的作用

增加我們的產品被潛在顧客發(fā)現的概率影響買家購買決策提高自己在同類商品賣家中的競爭力提升銷量，引起供貨商的重視，得到更好的服務以及更優(yōu)惠的條件2.4.1商品圖片美化在淘寶店鋪中的作用合格的商品圖片應該具備那些特征處理過的圖片和沒處理的圖片在淘寶搜索頁面上的對比

處理過的圖片和沒處理的圖片在淘寶搜索頁面上的對比處理過的圖片和沒處理的圖片在淘寶搜索頁面上的對比

我們用什么方法讓產品變得清晰直觀呢，吸引眼球呢？

處理前后產品圖片的對比1摳圖效應處理前后產品圖片的對比2邊框效應！處理前后產品圖片的對比3細節(jié)效應處理前后產品圖片的對比4美女效應

處理前后產品圖片的對比5水印效應

2.4.2圖片處理的基本工具

——PhotoshopAdobePhotoshop，簡稱“PS”，是由Adobe

Systems開發(fā)和發(fā)行的圖像處理軟件。Photoshop主要處理以像素所構成的數字圖像。使用其眾多的編修與繪圖工具，可以有效地進行圖片編輯工作。ps有很多功能，在圖像、圖形、文字、視頻、出版等各方面都有涉及。從功能上看，該軟件可分為圖像編輯、圖像合成、校色調色及功能色效制作部分等。圖像編輯是圖像處理的基礎，可以對圖像做各種變換如放大、縮小、旋轉、傾斜、鏡像、透視等；也可進行復制、去除斑點、修補、修飾圖像的殘損等。標題欄控制面板工具欄工作區(qū)Photoshop界面2.4.2圖片處理的基本工具

——Photoshop2.4.2圖片處理的基本工具

——PhotoshopPhotoshop的靈魂--圖層圖層窗口2.4.2圖片處理的基本工具

——PhotoshopPhotoshop的靈魂--圖層2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟打開圖片正方形裁剪圖象大小色差亮度調整摳圖方法智能銳化水印制作圖框制作儲存2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟展示2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—打開圖片2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—裁剪成正方形2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—裁剪成正方形保持正方型的裁剪方法將寬度高度設置一樣或者按住Shift操作2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—裁剪成正方形保持正方型的裁剪方法2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—調整圖片大小調節(jié)圖象明暗度及對比度

曲線工具色階工具色彩平衡色相飽和度打開圖片正方形裁剪圖象大小色差亮度調整摳圖方法智能銳化水印制作圖框制作儲存2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—色彩調節(jié)2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—色彩調節(jié)2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—色彩調節(jié)曲線工具色階工具色彩平衡色相飽和度調節(jié)圖象明暗度及對比度功能上色階不如曲線來的靈活

打開圖片正方形裁剪圖象大小色差亮度調整摳圖方法智能銳化水印制作圖框制作儲存2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—色彩調節(jié)2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—色彩調節(jié)

2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—色彩調節(jié)曲線工具色階工具色彩平衡色相飽和度調整輕微色差，偏色打開圖片正方形裁剪圖象大小色差亮度調整摳圖方法智能銳化水印制作圖框制作儲存2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—色彩調節(jié)PS圖片處理步驟曲線工具色階工具色彩平衡色相飽和度調整亮度，色彩度，嚴重色差打開圖片正方形裁剪圖象大小色差亮度調整摳圖方法智能銳化水印制作圖框制作儲存2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—色彩調節(jié)2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—色彩調節(jié)魔棒工具多邊形套索鋼筆工具打開圖片正方形裁剪圖象大小色差亮度調整摳圖方法智能銳化水印制作圖框制作儲存2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—色彩調節(jié)圖片一圖片二圖片三魔棒工具多邊形套索鋼筆工具魔棒工具適合摳背景顏色單一的圖，并且主體和背景色要有很大反差和對比打開圖片正方形裁剪圖象大小色差亮度調整摳圖方法智能銳化水印制作圖框制作儲存2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—摳圖方法圖片一2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—摳圖方法2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—摳圖方法2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—摳圖方法魔棒工具多邊形套索鋼筆工具

適合摳主體線條為直線的圖片打開圖片正方形裁剪圖象大小色差亮度調整摳圖方法智能銳化水印制作圖框制作儲存2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—摳圖方法圖片二2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—摳圖方法1234562.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—摳圖方法2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—摳圖方法魔棒工具多邊形套索鋼筆工具鋼筆工具是最精確的摳圖工具，使用時要配合多個鍵（shift,ctrl,alt）使用，掌握難度稍大。打開圖片正方形裁剪圖象大小色差亮度調整摳圖方法智能銳化水印制作圖框制作儲存2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—摳圖方法圖片三2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—摳圖方法CTRL：用處是可以將你描的那個點任意擺放，按住ctrl鍵再在節(jié)點上點鼠標左鍵，那么這個節(jié)點就可以隨意移動了，(比如是你鉤的那個路徑和實圖的路徑相差太遠那么，就用ctrl調動的再次調節(jié))ALT：用處是在鉤點的同時只要按住它,它會增加兩個支點以便你鉤完后方便的調結它的路徑。SHIFT：和鼠標左鍵結合使用可以保持路徑一直走直線。摳圖之方法三2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—摳圖方法ALT+鼠標滾輪拉近圖片處理細節(jié)2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—摳圖方法2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—摳圖方法按住Shift多項選擇2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—摳圖方法2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—摳圖方法2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—摳圖方法摳好圖片后可以進行多種操作 1.清除雜色，制作純色背景2.更換圖片背景2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—摳圖方法刪除背景雜色獲得純白背景2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—摳圖方法

按刪除鍵>取消選區(qū)

2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—摳圖方法摳好圖片后可以進行多種操作 1.清除雜色，制作純色背景2.更換圖片背景2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—摳圖方法更換圖案背景1.打開準備好的背景2.選擇移動工具2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—摳圖方法3.直接拖動選區(qū)圖片到背景區(qū)2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—摳圖方法2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟—摳圖方法2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟6—智能銳化2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟6—智能銳化2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟6—智能銳化文字水印圖案水印打開圖片正方形裁剪圖象大小色差亮度調整摳圖方法智能銳化水印制作圖框制作儲存2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟7—水印制作第一種：文字型水印2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟7—水印制作第二種：圖案形水印2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟7—水印制作文字水印圖案水印文字工具，圖層樣式應用打開圖片正方形裁剪圖象大小色差亮度調整摳圖方法智能銳化水印制作圖框制作儲存2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟7—水印制作2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟7—水印制作2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟7—水印制作2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟7—水印制作2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟7—水印制作2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟7—水印制作2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟7—水印制作文字水印圖案水印移動工具，圖層合并和圖層透明度應用打開圖片正方形裁剪圖象大小色差亮度調整摳圖方法智能銳化水印制作圖框制作儲存2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟7—水印制作2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟7—水印制作自由變換調整選區(qū)圖片大小(按SHIFT保持長寬比)2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟7—水印制作2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟7—水印制作2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟7—水印制作按SHIFT選擇要合并的圖層

2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟7—水印制作2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟7—水印制作2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟7—水印制作將背景刪除，然后另存為，以后每次都可以用了2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟7—水印制作單頁圖框多圖組合打開圖片正方形裁剪圖象大小色差亮度調整摳圖方法智能銳化水印制作圖框制作儲存2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟8—圖框制作圖框展示2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟8—圖框制作2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟8—圖框制作2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟8—圖框制作2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟8—圖框制作單頁圖框多圖組合打開圖片正方形裁剪圖象大小色差亮度調整摳圖方法智能銳化水印制作圖框制作儲存2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟8—圖框制作制作多圖組合2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟8—圖框制作2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟8—圖框制作2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟8—圖框制作2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟8—圖框制作按shift操作形成正方型路徑2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟8—圖框制作利用路徑選擇工具選擇路徑。

用鍵盤的箭頭進行位置調整用ctrl+c（復制）ctrl+V（粘貼）路徑2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟8—圖框制作2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟8—圖框制作刪除路徑選區(qū)2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟8—圖框制作刪除選區(qū)后請務必取消選擇，進行下一步操作

取消選擇2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟8—圖框制作2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟8—圖框制作2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟8—圖框制作用自由變換調整圖片大小角度2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟8—圖框制作2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟8—圖框制作2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟9—儲存2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟9—儲存2.4.2圖片處理的基本工具

——PhotoshopPhotoshop圖片處理步驟9—儲存2.4.3圖片處理的其它工具——光影魔術手是一個對數碼照片畫質進行改善及效果處理的工具軟件。光影魔術手簡單易用,不需要任何專業(yè)的圖象處理技術,就可以制作出專業(yè)膠片攝影的色彩效果對于在淘寶開店的掌柜，光影魔術手給我們商品圖片的美化提供了更實實在在的應用。

光影魔術手——圖片大小的調整根據大眾顯示器分辨率的設置1。800×6002。1024×7683。更高分辨率依據淘寶網站對商品圖片限制進行設置1。圖片大小限制在120k內2。在1024×768的情況下只能顯示940的寬度2.4.3圖片處理的其它工具——光影魔術手

光影魔術手——圖片大小的調整根據大眾顯示器分辨率的設置1。800×6002。1024×7683。更高分辨率依據淘寶網站對商品圖片限制進行設置1。圖片大小限制在120k內2。在1024×768的情況下只能顯示940的寬度建議大家制作圖片的時候寬度選擇范圍最好在500px--700px左右，這樣的大小在以上各個分辨率下都是能完整的顯示圖片的，避免圖片顯示不全造成的成交失??！2.4.3圖片處理的其它工具——光影魔術手

光影魔術手——圖片大小的調整2.4.3圖片處理的其它工具——光影魔術手

光影魔術手——圖片大小的調整2.4.3圖片處理的其它工具——光影魔術手

光影魔術手——圖片大小的調整2.4.3圖片處理的其它工具——光影魔術手

光影魔術手——圖片大小的調整2.4.3圖片處理的其它工具——光影魔術手

光影魔術手——圖片大小的調整2.4.3圖片處理的其它工具——光影魔術手

光影魔術手——圖片大小的調整2.4.3圖片處理的其它工具——光影魔術手

光影魔術手——圖片大小的調整2.4.3圖片處理的其它工具——光影魔術手

光影魔術手——圖片亮度色彩等的調整

如果覺得補光按鈕達到的亮度效果不太理想，可點擊菜單欄“調整”“曲線”工具進行細調。曲線調整功能2.4.3圖片處理的其它工具——光影魔術手

光影魔術手——圖片亮度色彩等的調整

2.4.3圖片處理的其它工具——光影魔術手

光影魔術手——圖片亮度色彩等的調整

色階調整功能2.4.3圖片處理的其它工具——光影魔術手

光影魔術手——圖片亮度色彩等的調整

2.4.3圖片處理的其它工具——光影魔術手什么是白平衡？白平衡英文名稱為WhiteBalance。物體顏色會因投射光線顏色產生變，在不同光線的場合下拍攝出的照片會有不同的色溫。例如以鎢絲燈(電燈泡)照明的環(huán)境拍出的照片可能偏黃，一般來說，CCD沒有辦法像人眼一樣會自動修正光線的改變。(ＣＣＤ在攝像機里是一個極其重要的部件，它起到將光線轉換成電信號的作用)。下面的圖片就顯示了在不同顏色光線下的不同圖象。

光影魔術手——圖片白平衡的調整

2.4.3圖片處理的其它工具——光影魔術手遇到照片的顏色偏色怎么辦？在正常光線下看起來是白顏色的東西在較暗的光線下看起來可能就不是白色，還有熒光燈下的“白”也是“非白”。對于這一切如果能調整白平衡，則在所得到的照片中就能正確地以"白"為基色來還原其他顏色。

光影魔術手——圖片白平衡的調整

2.4.3圖片處理的其它工具——光影魔術手調節(jié)白平衡后的照片

光影魔術手——圖片白平衡的調整

2.4.3圖片處理的其它工具——光影魔術手

光影魔術手——圖片白平衡的調整

2.4.3圖片處理的其它工具——光影魔術手

光影魔術手——圖片白平衡的調整

2.4.3圖片處理的其它工具——光影魔術手

光影魔術手——圖片白平衡的調整

2.4.3圖片處理的其它工具——光影魔術手

光影魔術手——銳化圖片提高清晰度2.4.3圖片處理的其它工具——光影魔術手

光影魔術手——銳化圖片提高清晰度2.4.3圖片處理的其它工具——光影魔術手

再比較下處理前后的照片2.4.3圖片處理的其它工具——光影魔術手總結圖片調整4個步驟1.圖片大小的調整2.亮度色彩飽和度的調整3.白平衡的功能4.銳化提高精度2.4.3圖片處理的其它工具——光影魔術手

光影魔術手——給圖片加邊框2.4.3圖片處理的其它工具——光影魔術手

光影魔術手——里面自帶的邊框效果

2.4.3圖片處理的其它工具——光影魔術手

光影魔術手——里面自帶的邊框效果

2.4.3圖片處理的其它工具——光影魔術手

光影魔術手——里面自帶的邊框效果

2.4.3圖片處理的其它工具——光影魔術手

光影魔術手——里面自帶的邊框效果

2.4.3圖片處理的其它工具——光影魔術手

光影魔術手——給圖片加邊框

2.4.3圖片處理的其它工具——光影魔術手

光影魔術手——圖片加上中白邊框的效果

2.4.3圖片處理的其它工具——光影魔術手2.5

使用HTML制作網店店鋪2.5.1HTML的基本概念一、

HTML基礎代碼介紹

每一個動物、每一個生物都有自己的語言，而計算機也不例外，同樣有自己的語言，在計算機繁雜的編程語言中，最簡單最容易理解的就屬HTML語言，在淘寶店鋪里所有的店鋪裝修無疑都是靠這樣一種語言來完成的（當然同樣也要靠圖片設計工具），雖然現在有很多的輔助工具來幫助我們進行直觀的設計，但學習HTML還是對店鋪裝修有很大幫助的，HTML為超文本連接，他是目前網絡上應用最為廣泛最為基礎的一種描述性語言，目前進行對網頁進行編輯的最好的工具為“Macromedia

Dreamweaver

8”，利用這款軟件我們可以進行非常直觀的將網頁進行界面式設計，但有些時候在調試代碼或者修改一小段代碼的時候，我們則必須懂得這些代碼的意思，下面我就來講解一下HTML的一些基礎。

2.5.1HTML的基本概念

例1、

<html>

<head>

<title>淘寶網</title>

</head>

<body>

<p>你好，我是淘寶網的忠實店家</p>

</body>

</html>

例子解析：

以上是一個完整的基礎網頁代碼，所有的編寫必須遵守以上規(guī)則，網頁必須是以<html>開頭以</html>結尾

；<head></head>之間是文本頭信息，可以顯示在網頁的瀏覽器最頂端的標題欄里，例子中網頁標題欄會顯示”淘寶網”。

<body></body>是最主要的部分，絕大部分的編輯都要在這里面進行，是網頁的主體。

<p></p>是文本標簽，在網頁中會顯示“你好，我是淘寶網的忠實店家”

大部分編輯必須遵循<>開頭</>結尾。

2.5.1HTML的基本概念二、HTML在淘寶中的應用

在淘寶的編輯器里，過濾了很多功能，如javascripts的腳本語言，這是因為怕有一些不法店主利用這個語言來編寫病毒或進行網頁跳轉等等，但我們還是可以有很多功能可用，下面我逐一介紹主要功能。

2.5.1HTML的基本概念二、HTML在淘寶中的應用

1、表格

<table

width="200"

border="1"

cellpadding="0"

cellspacing="1">

<tr>

<td> </td>

<td> </td>

</tr>

</table>

例子樣式如右：2.5.1HTML的基本概念二、HTML在淘寶中的應用

1、表格

<table></table>為表格標簽，必須以此開頭和結尾。屬性：border=“1”表格邊框寬度為1

cellpadding=“0”表格填充，一般我們都選0

cellspacing=“1”表格間距，一般我們也選0<tr></tr>為表格中的行標簽；<td></td>為表格中的列標簽，例子