Photoshop常用图片格式及图片处理技巧笔记

学习使用Photoshop的基本使用，以及Photoshop中关于切图这一块的知识，目的是能熟练使用Photoshop查看UI设计师的设计效果图，同时利用Photoshop切图来制作专业html页面

一、常用图片格式

图片是网页制作中很重要的素材，图片有不同的格式，每种格式都有自己的特性，了解这些特效，可以方便我们在制作网页时选取适合的图片格式，图片格式及特性如下：

1. psd：photoshop的专用格式
   1. 优点：完整保存图像的信息，包括未压缩的图像数据、图层、透明等信息，方便图像的编辑
   2. 缺点：应用范围窄，图片容量相对比较大
2. jpg：网页制作及日常使用最普遍的图像格式
   1. 优点：图像压缩效率高，图像容量相对最小
   2. 缺点：有损压缩，图像会丢失数据而失真，不支持透明背景，不能制作成动画
3. gif：制作网页小动画的常用图像格式
   1. 优点：无损压缩，图像容量小、可以制作成动画、支持透明背景
   2. 缺点：图像色彩范围最多只有256色，不能保存色彩丰富的图像，不支持半透明，透明图像边缘有锯齿
4. png：网页制作及日常使用比较普遍的图像格式
   1. 优点：无损压缩，图像容量小、支持透明背景和半透明色彩、透明图像的边缘光滑
   2. 缺点：不能制作成动画
5. webp：将要取代jpg的图像格式
   1. 优点：同jpg格式，容量相对比jpg还要小
   2. 缺点：同jpg格式，目前不支持所有的浏览器

位图和矢量图

• 位图：也叫点阵图，是由一个个的方形的像素点排列在一起拼接而成的，位图在放大时，图像会失真。上面讲的5种图像都属于位图
• 矢量图和位图组成图像的原理不同，它的图像轮廓是由函数曲线生成的，当放大图像时，实际的原理就是将曲线乘以一个倍数，图像可以轻易地放大，而且不会出现像素块，图像边缘也不会出现锯齿
  • svg：目前首选的网页矢量图格式
    • 优点：图像容量小、图像放大不失真、支持透明背景和半透明色彩、图像边缘光滑
    • 缺点：色彩不够丰富
  • flash：退出历史的重量级网页矢量图格式
    • 优点：图像容量小、图像放大不失真、支持透明背景和半透明色彩、图像边缘光滑、还可以制作动画、可编写交互
    • 缺点&