作者：创锐设计
出版社：机械工业出版社
格式: AZW3, DOCX, EPUB, MOBI, PDF, TXT
Photoshop+Dreamweaver淘宝天猫网店美工与广告设计一本通：实战版试读：
前言
随着电子商务的飞速发展，越来越多的人养成了网络购物的消费习惯。人们只需要动动手指就能浏览琳琅满目的商品，并轻松完成商品交易。在网络购物中，打动消费者下单购买的因素有很多，除了商品本身的品质优势和价格外，网店图片的美观度、网店页面整体的装修布局也是不可忽视的。本书以Photoshop和Dreamweaver这两个网店装修常用的软件为平台，结合大量典型而精美的实例，全面地讲解网店装修和广告设计的知识和技能。◎内容安排
全书内容分为4部分，读者可循序渐进地阅读，也可根据自己的需要选学某一部分。
★第1部分：网店装修准备知识
这一部分即“写在处理之前”，主要讲解网店装修的准备知识，包括网店装修的后台操作、常用工具、视觉要素、工作流程等内容。
★第2部分：网店装修图像处理——Photoshop
这一部分包括第1～6章，讲解Photoshop在网店装修图像处理中的应用，主要内容有：商品图像的快速调整、商品图像的修复与修饰、商品图像影调与颜色的处理、商品图像的抠取与合成、装饰图形的绘制、网店文字的排版处理。读者通过学习，既能掌握网店图片的处理技法，又能精通Photoshop中各类工具的使用方法。
★第3部分：网店装修页面排版——Dreamweaver
这一部分包括第7～10章，讲解Dreamweaver在网店装修页面排版中的应用，主要内容有：基础HTML装修代码、运用可视化方式添加页面元素、页面超链接与导航菜单设计、使用表格和CSS样式美化页面，手把手教大家使用Dreamweaver完成网店页面布局排版与个性化装修代码制作。
★第4部分：网店装修实战应用——Photoshop+Dreamweaver
这一部分即第11章，讲解Photoshop和Dreamweaver在网店装修实战中的结合应用，包括店招与导航、店铺海报图、商品分类导航、旺旺客服区、店铺优惠券和收藏区、店铺公告、主图与橱窗照、商品详情展示的设计。读者通过学习，能够运用书中讲解的方法完成个性化的网店装修工作。◎主要特色
★内容实用，实例典型
本书在挑选内容和设计实例时以实用、典型为出发点，将网店装修中应用最广、效率最高的技法融入贴近实际应用的典型实例中进行讲解，能够有效提高读者的阅读兴趣和学习效率。
★图文并茂，清晰直观
本书在讲解操作步骤时基本采用“一步一图”的方式，非常清晰、直观，让读者能够轻松和快速地掌握操作要领。
★栏目丰富，延展学习
本书在讲解过程中穿插了各种栏目板块，如“技巧提示”“知识扩展”等，大大增加了本书的知识量，帮助读者掌握更多实用的软件操作技巧和网店装修知识。
★资源完备，轻松自学
本书配套的学习资源提供所有案例的相关文件。读者按照书中讲解，结合文件动手操作，学习效果立竿见影。◎适用范围
本书适合网店店长、网店美工等希望快速掌握网店装修和推广技术的读者阅读和学习，也可作为大专院校相关专业或电商培训机构的教学参考书。
由于编者水平有限，在编写本书的过程中难免有不足之处，恳请广大读者指正批评，除了扫描二维码关注公众号获取资讯以外，也可加入QQ群736148470与我们交流。编者2019年5月
如何获取学习资源
步骤1：扫描关注微信公众号在手机微信的“发现”页面中点击“扫一扫”功能，如下左图所示，进入“二维码/条码”界面，将手机摄像头对准下右图中的二维码，扫描识别后进入“详细资料”页面，点击“关注公众号”按钮，关注我们的微信公众号。步骤2：获取学习资源下载地址和提取密码
点击公众号主页面左下角的小键盘图标，进入输入状态，在输入框中输入5位数字“63201”，点击“发送”按钮，即可获取本书学习资源的下载地址和提取密码，如下图所示。步骤3：打开学习资源下载页面
在计算机的网页浏览器地址栏中输入步骤2中获取的下载地址（输入时注意区分大小写），如右图所示，按Enter键即可打开学习资源下载页面。步骤4：输入密码并下载文件
在学习资源下载页面的“请输入提取密码”文本框中输入步骤2中获取的提取密码（输入时注意区分大小写），再单击“提取文件”按钮。在新页面中单击打开资源文件夹，在要下载的文件名后单击“下载”按钮，即可将其下载到计算机中。如果页面中提示选择“高速下载”还是“普通下载”，请选择“普通下载”。下载的文件如为压缩包，可使用7-Zip、WinRAR等软件解压。步骤5：播放多媒体视频
如果解压后得到的视频是SWF格式，需要使用Adobe Flash Player播放。新版本的Adobe Flash Player不能单独使用，而是作为浏览器的插件存在，所以最好选用IE浏览器来播放SWF格式的视频。右击需要播放的视频文件，然后依次单击“打开方式>Internet Explorer”，如下左图所示。系统会根据操作指令打开IE浏览器，稍等几秒钟后就可看到视频内容，如下右图所示。
如果视频是MP4格式，可以选用其他通用播放器（如Windows Media Player、暴风影音）播放。提示
读者在下载和使用学习资源的过程中如果遇到自己解决不了的问题，请加入QQ群736148470，下载群文件中的详细说明，或寻求群管理员的协助。
写在处理之前
网店装修是指对网店页面进行美化和装饰设计，从而达到提高网店商品转化率的目的。在进行网店装修之前，我们需要先了解网店装修的重要性、网店装修后台的基本操作、网店装修的常用工具、网店装修的主要视觉元素、网店装修的工作流程等，以便在实际的装修过程中提高工作效率，达到事半功倍的效果。01 网店装修的重要性
也许有人会问，网店不装修可以卖东西吗？当然，现在很多电商平台都提供网店装修模板，卖家可以直接使用，无需额外装修就能卖东西。但是，这些装修模板往往千篇一律，很难体现特色，因此，还是会有很多卖家想尽一切办法将自己的网店装修得更加漂亮，以在众多网店中脱颖而出，获得更好的客源和更高的转化率。
这些卖家之所以如此重视网店装修，是因为网购具有一定的特殊性。在实体店，消费者可以通过看、尝、摸、闻、听去感知实物；而在网店中，买家只能通过看页面中的视频、图片和文字来了解商品。所以，网店装修就显得尤为重要。总体来说，网店装修是为了达到让网店页面更美观、吸引更多眼球、提升转化率等多种目的，如下图所示。
下面通过对比两家网店的页面，直观地感受一下网店装修的作用。如下左图所示的网店对店招、导航条、促销广告、商品分类等进行了艺术化设计，使得商品与页面整体风格形成视觉上的统一，更能吸引买家的注意，博得买家的好感；如下右图所示的网店则采用了电商平台最基本的装修设置，并没有做额外设计，给人的感觉是单调、简陋，买家很难对这样的网店产生信任感。
接下来再选择两家网店风格和价格都比较相近的两款商品进行比较。下一图所示为装修过的网店的商品，下二图所示为未装修的网店的商品，从图中可以看到，装修过的网店的商品，其交易数量、收藏人气和评论数都比未装修过的网店的商品高很多。由此可见，网店装修是促进商品销售的重要因素。02 网店装修后台常用操作
在进行网店装修之前，需要对网店装修后台的一些常用操作有一定了解，如设置并应用默认模板、添加页面及自定义模块等。下面以淘宝为例进行讲解。1.上传图片到图片空间
装修网店之前，首先要做的就是将装修需要用到的图片上传到图片空间。淘宝有专门的图片空间来存储和管理装修图片。登录卖家后台管理中心，单击“店铺管理”下方的“图片空间”，即可进入图片管理页面，单击“上传”按钮，如下一图所示，弹出“上传图片”对话框，可以直接将图片拖动到对话框中间位置，也可以单击“上传”进行上传，如下二图所示。
上传完成后，页面中会显示上传后的文件或文件夹，选中文件或文件夹，可以单击“重命名”按钮，对上传的文件或文件夹进行重命名操作，如下图所示。在此页面中单击“删除”按钮，可以删除已经上传的文件或文件夹。2.页面布局管理
页面布局管理是对页面整体结构的调整，包括店铺招牌（店招）、导航和页尾等，这也是进入网店装修进行模块添加的一个最基本的操作。登录卖家后台管理中心，找到并单击“店铺装修”，如下一图所示，进入网店装修后台页面，根据需要选择要装修的页面是手机端还是PC端，然后单击“装修页面”按钮，如下二图所示。
进入下一级装修后台页面，在页面中先单击“首页”右侧的下拉按钮，然后选择要装修的页面，如店内搜索页、详情页或个性化装修页面等。选定装修页面后，单击“布局管理”按钮，如下一图所示，进入“布局管理”页面，显示默认的页面布局效果，如下二图所示。
如果需要向页面添加新布局样式，单击页面中的“添加布局单元”按钮，如下一图所示，在弹出的对话框中单击选择想要的布局结构，如下二图所示。
添加新的布局单元后，在页面左侧单击选择相应的模块，将其拖动到添加的布局单元中，如下左图所示，即可完成页面的重新布局，如下右图所示。如果需要删除布局单元，则单击布局单元右侧的删除按钮。3.应用模板快速装修网店
为了便于卖家快速完成基本的网店装修工作，电商平台通常会提供一些装修模板。淘宝平台提供的装修模板有简约时尚官方模板、动感红官方模板、收费店铺官方模板三套。淘宝卖家都是在这几套模板的基础上进行网店装修的，其中绝大部分的淘宝网店装修特效模板代码，如全屏海报代码、轮播代码、卡盘代码等，都是基于简约时尚官方模板制作出来的。
进入网店装修后台，单击顶部导航栏中的“模板管理”按钮，如下左图所示，进入“模板管理”页面，滚动鼠标滚轮，在下方的“可用的模板”区域中单击选择要应用的装修模板，然后单击“马上使用”按钮，如下右图所示，就可以应用所选模板快速装修网店。4.添加自定义模块
电商平台提供的装修模板的风格并不总能匹配网店的整体形象或商品的特质，如果使用默认的装修模板不能达到理想的装修效果，就需要使用自定义装修模块。
进入网店装修后台，然后单击左侧的“自定义区”模块，将其拖动到右侧页面区中合适的位置，当出现“松开鼠标，模块会放到这里”的提示文字时，如下左图所示，释放鼠标，即可插入一个新的自定义模块，如下右图所示。
添加自定义模块后，模块右上角会显示“编辑”“删除”“添加模块”等按钮。单击“编辑”按钮，将弹出如下左图所示的“自定义内容区”对话框，在对话框中定义模块背景色、图片和文本等。如果已经使用Dreamweaver编辑好装修代码，则可以单击“源码”按钮，将代码复制、粘贴到代码编辑区，单击“确定”按钮以完成装修，如下右图所示。5.选择合适的默认装修配色
不同的颜色能带给人不同的感受。例如，蓝色能使人联想到科技、干净和理性；紫色能使人联想到神秘及高贵；绿色能使人联想到自然与生机等。淘宝为卖家提供了几种配色方案，大家可以根据所销售商品的特点选择合适的配色方案。
进入网店装修后台，单击左侧的“配色”选项，在右侧即显示系统提供的几种配色方案，只需要单击某个配色方案，如下左图所示，就能快速更改网店的整体装修配色，更改后的效果如下右图所示。6.更改页面背景图
很多新手卖家总觉得自己的网店装修效果太过单调，其原因之一就是页面背景效果欠佳。此时可以通过装修后台为页面设置更美观的背景图。网店装修背景图通常都要经过一定的设计，可以通过抠取及合成等后期处理手段进行美化，使其与商品和网店整体装修风格形成更统一的视觉效果。
单击网店装修后台左侧的“页面”选项，如下左图所示，在右侧先取消勾选“页面背景色”右侧的“显示”复选框，如下中图所示，再单击“更换图”按钮，如下右图所示。
打开“打开”对话框，在对话框中选择需要应用的背景图，然后单击“打开”按钮，如下一图所示，再设置背景显示方式和对齐方式，如下二图所示，更换背景后的网店装修预览效果如下三图所示。03 网店装修常用工具
在进行网店装修时，常常需要使用一些软件对装修的素材进行优化或美化，如图片处理和网页架构设计等。网店装修中比较常用的两个软件是Photoshop和Dreamweaver，下面就来简单认识一下这两个软件。1.Photoshop
Photoshop是Adobe公司开发的图像处理软件，它的专长是处理以像素构成的位图图像，包括编辑加工、校色调色、添加特效、抠图与合成等。
在计算机中安装好Photoshop软件后，双击桌面上的快捷方式图标即可启动软件。启动软件后可以看到界面由菜单栏、工具选项栏、工具箱、面板等几大部分组成。Photoshop界面的各组成部分及功能介绍如下图和下表所示。2.Dreamweaver
在网店装修后台进行编辑时，我们会看到很多的源代码。如果需要对模板进行重构，可以在Dreamweaver里对模板的代码进行编辑。
Dreamweaver是一款“所见即所得”的网页编辑工具，是唯一提供Roundtrip HTML、视觉化编辑与原始码编辑同步的设计工具，利用其可以轻而易举地制作出跨越平台和浏览器限制的充满动感的网页。进行网店装修时，应用Dreamweaver对页面进行编排，可以创建具有网店自身特色的装修页面。Dreamweaver工作界面的各组成部分及其功能介绍如下图和下表所示。
试读结束[说明：试读内容隐藏了图片]