• 1.摘要
  • 2.基本信息
  • 3.切图误区
  • 4.切图工具
  • 5.切图目的

切图

修图的方式

切图是指将设计稿切成便于制作成页面的图片。切图用于完成html+css布局的静态页面,有利于交互,形成良好的视觉感。通俗来讲,把一张设计图利用到切片工具 把自己所需的切成一张张小图,然后前端开发用DIV+CSS完成静态页面书写,完成CSS布局。

基本信息

  • 中文名

    切图

  • 外文名

    firework

  • 目的

    画面浏览速度快有利于优化

  • 定义

    有利于交互形成良好的视觉感

  • 常用工具

    Photoshop

切图误区

切图大家都有个误区,觉得切图就是把图片切出来,其实并不完全是这样,首先处理的是什么类型的页面图片型(EDM 或活动着陆页等)、图文型(门户网站或电商网站等)、界面型(Web App 等),把图片切出来这个过程是叫切片。

第二个是体积,所以切图时候一定注意少用图片工具,采用div+css布局更能减小网页体积是表现与内容分离。

切,代表前端!

切图工具

主流是dreamweaver、photoshop软件,还有sketch、firework等,低端QQ切图,网页切图等。

切图目的

为前端编程者带来方便,提高效率,让网页稿有了交互性,实现你平时看到的各种各样的功能。画面浏览速度快,有利于优化。