前端工程师和美工配合的一些知识

　　1.图片理论基础

　　　　常见的图片格式包含以下几种：

图片格式对比

图片格式	优点	缺点
PNG（1996）	透明，无损压缩，渐进显示和流式读写，保留图像名称作者版权等	色彩支持少 PNG8 PNG24 PNG32，ie6不支持
JPEG（1992）	色彩多	有损压缩
GIF（1987）	动态图，可透明，体积小(后台统计)	处理256种颜色，不能半透，处理锯齿效果不好
SVG	矢量图形，无损压缩，绘制路径xml语言	浏览器支持不是很好，主要用于移动端font-face

　　　　关于png8，png24，png32的区别在网页上有详细介绍http://www.ittribalwo.com/article/2599.html，

PNG8	8位的png最多支持256（2的8次方）种颜色，8位的png其实支持不透明、索引透明、alpha透明。
PNG24	支持2的24次方种颜色，表现为不透明。
PNG32	支持2的32次方种颜色，32位是我们最常使用的格式，它是在png在24位的png基础上增加了8位的透明信息，支持不同程度的半透效果。

　　　　说到png8和png24的区别，『png 不透明』只能为不透明，代表格式有：『png8 不透明』和『png24』，导出软件有：Photoshop、Fireworks。不推荐使用『png 不透明』格式，建议用jpg图片来代替它。

　　　　在使用photoshop导出png图片的时候，注意设置透明度和杂边。

 

　　 2.adobe fireworks和svg的处理

　　　　svg使用推荐网址： https://icomoon.io/app/#/select

　　　　fireworks的使用下次再补充。主要是自己刚安装了fireworks，还不知道怎么用，就被逼着把网页的psd制作成html。完成后，再写一个帖子。

 

　　 3.adebe photoshop切图

　　　　复制图层--图像--裁切--透明像素--存储

　　　　ps插件：css3Ps下载地址 http://css3ps.com/Download/  安装教程： http://jingyan.baidu.com/article/f71d603796d11a1ab641d190.html

　　　　　　　　

　　4.adobe Dreamweaver处理基本网页

 　　　　只是辅助工具，可快速搭建标签，学习一些经典的js。

　　　　

　　　　

转载于:https://www.cnblogs.com/fanfan-nancy/p/4928694.html