切图之前

哪些是需要切出来的?


修饰性的 (一般用在background属性)

图标、logo

有特殊效果的按钮  文字等

非纯色的背景

内容性的 (一般用在img标签)

Banner、广告图片

文章中的配图

从服务器加载的图片不用 切图,只需要『占位』即可

切出来的图片 存为哪种类型?


修饰性的

PNG24 (IE6不支持半透明)

PNG8

内容性的

一般存为 JPG

切图 · 隐藏文字只留背景


若文字为独立图层,隐藏文字图层

找到文字图层

去掉眼睛图标

若文字和背景合并,平铺背景覆盖文字

矩形选框工具

自由变换 ( Ctrl+T )

使用移动工具 + Alt

切图 · png24


移动工具选中所需图层 (按住Ctrl 多选)

右键合并图层 (Ctrl+E

再右键复制图层到新文件,或直接拖至已有文件 (新建 : Ctrl+N)

切图 . png8


带背景切

合并 (可见) 图层 (Shift + Ctrl +E

矩形选框工具选择内容

魔棒工具去除多余部分

- 从选区中减去: 按住 Alt

可平铺背景的切图


主要针对css里面,background : repeat

用矩形选框工具选取一块区域

复制粘贴到新文件

平铺内容充满文件的宽 (x轴) 或高 (y轴)

切片工具


适用于可以一刀切的活动页

拉参考线

选择切片工具

点击 “基于参考线的切片”按钮

保存(全选切片,统一设置存储格式)

保存


存储所需内容

复制、       新建、     粘贴

Ctrl+c     Ctrl+N    Ctrl+V

( or 拖动内容至新文件)

存储为web 所用格式

Alt+Shift+Ctrl+S

保存类型一


当图片色彩丰富且无透明要求时

建议保存为JPG格式并选择合适的品质

品质,不要设置才能100,因为一旦设置成100,这就意味着图片没有任何压缩,这会导致图片相当大。

保存类型二


当图片色彩不太丰富时无论有无透明要求

请保存为PNG8格式

保存类型三


当图片有半透明要求

请保存PNG24格式

保存类型四


为保证图片质量

保留一份PSD,在PSD上进行修改

Photo Shop切图的更多相关文章

  1. 关于png、jpg、gif切图时的使用感悟

    关于png.jpg.gif切图时的使用感悟 曾经切图时都是一股脑所有图全切成jpg格式,最近突然心血来潮简单的研究了下其他图片格式的具体属性,才突然发现走了不少弯路,并没有做到使图片用最小体积展现出最 ...

  2. iOS设计 - 一款APP从设计稿到切图过程概述

    这篇文章站在GUI设计师的角度概述了APP从项目启动到切片输出的过程,相当于工作流程的介绍.这里写的不是一种规范,只是一种工作方法,加上技术的更新是非常快的,大家在具体工作中,一定要灵活运用. 这里我 ...

  3. iOS - 如何切图适配各种机型

    关于iPhone6/6+适配问题一直有争议,今天小编专门为大家整理了相关的有效方案,希望对大伙儿有帮助! 移动app开发中多种设备尺寸适配问题,过去只属于Android阵营的头疼事儿,只是很多设计师选 ...

  4. 切图时图片的选择:JPG、PNG、GIF的区别

    目前网站图片的采用一共有流行三种,分别是JPG.PNG.GIF,然而很多人并不知道三者在选择的时候究竟应该选谁.虽然都可以存储图片,但是如果要发布到网上,就必须考虑速度.大小和失真程度的问题.如果你运 ...

  5. 页面制作部分之PS切图

    页面制作部分之PS切图 <--本标签下,通过页面制作.页面架构.javascript程序设计.DOM编程艺术.产品前端架构五部分来分享总结笔记,总结笔记会陆续分享--> 网页设计在技术层面 ...

  6. 前端工程师技能之photoshop巧用系列第三篇——切图篇

    × 目录 [1]切图信息 [2]切图步骤 [3]实战 前面的话 前端工程师除了使用photoshop进行测量之外,更重要的是要使用该软件进行切图.本文是photoshop巧用系列的第三篇——切图篇 切 ...

  7. Android启动icon切图大小

    我们在给app切图的时候不知道告诉ui启动图标切多大,其实你新建一个android项目就知道应该切多大了.新建一个项目会产生几种大小的启动图标. 我把各个文件夹下的ic_launcher.png文件都 ...

  8. WebGIS中矢量切图的初步研究

    文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1.背景 在GIS领域,金字塔技术一直是一个基础性技术,WMTS规范专 ...

  9. 利用AE编写切图工具的一些探讨

    文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1.前言 这周利用晚上在家时间研究了下如何使用AE来开发切图工具.最初 ...

随机推荐

  1. 【转载】8天学通MongoDB——第四天 索引操作

    这些天项目改版,时间比较紧,博客也就没跟得上,还望大家见谅. 好,今天分享下mongodb中关于索引的基本操作,我们日常做开发都避免不了要对程序进行性能优化,而程序的操作无非就是CURD,通常我们 又 ...

  2. ASP.NET MVC系列:控制器的Edit方法

    在前面我们已经介绍了如何创建控制器.视图和数据模型,运行之前的项目并打开Movies主页,将鼠标悬停在“编辑”菜单上,你会看到浏览器右下角显示了“编辑”链接的地址

  3. jquery输入数字随机抽奖特效

    简介:jQuery自定义数值抽奖活动代码是一款点击开始按钮计算机会产生玩家输入范围内的随机数,点击停止按钮,将显示数字最终结果的效果. 效果展示 http://hovertree.com/texiao ...

  4. 鼠标滑动加载div

  5. XMPP客户端开发(2)--发送接收消息

    客户端连接上服务器并登录以后,可以发送.接收消息. 首先需要定义Chat,MessageListener和ChatMessageListener几个变量: private static Chat ch ...

  6. 制作Java视频播放器

    一.工程准备 首先需要下载并安装VLC播放器,然后下载vlcj外部库. 下载slf4j中的slf4j-api-1.7.13.jar. slf4j- nop-1.7.13.jar 将vlc安装目录下的l ...

  7. springmvc(4)注解简单了解

    对于我这样的新人来说,因为是刚开始做项目,所以以前的技术不是用的很多,就比如springmvc来说,实际上使用的都是注解形式的,对于那些全部都是配置的来说,虽然也了解一些,但是实际上还是没试用过的. ...

  8. 【FOL】第一周

    本来打算按计划做下去的,发现原来那个sprite虽然功能强大,但是对我想要做的东西来说,冗余似乎有些多,决定自己写一个. 之前做了一段时间的h5游戏,用的是panda.js,发现这个引擎封装的还不错, ...

  9. Fiddler (三) Composer创建和发送HTTP Request

      之前已经写过两篇Fiddler的文章了,分别是[Fiddler教程] [Fiddler script用法].  我准备把Fiddler写成一个系列. Fiddler的功能还有很多, 很多功能都没有 ...

  10. Java检测对象是否相等

    关系运算符==和!=也适用于所有对象,但它们的含义通常会使初涉Java 领域的人找不到北.下面是一个例子: public class Equivalence { public static void ...