1、关于网页制作的,什么是切图,切图要达到什么目的,用什么工具来切
制作网页,很多的时候,首先要用图片处理软件制作出网页的效果图。效果图做好是一幅完整的图片,不可能把这一整张的图片都用在网页里。把效果图中有用的部分剪切下来作为网页制作时的素材,这个过程就是切图。(当然是用剪切、选择工具也可以,但是用切片工具处理更精确。)
切图的目的就是更加精确的进行网页布局。
photoshop、fireworks等软件都带有切片工具。
2、网页美工是怎样进行图片切图的
步骤如下:
1.首先我们需要用到的文件就是psd的文件了,一般都是由设计师来完成的,我们切图也就是切psd文件,因为psd文件是分层的,所以想切哪里切哪里。
2.之后用Photoshop软件打开psd文件,这里小鱼用CC版本演示,其他版本大同小异。我们打开之后可以双击左侧的放大镜工具,将图片缩放到原图大小。
3.我们要切图,当然用到的就是“切片”工具了,可以点击左边的切片工具,也可以右击这个图标选择更多的相关工具。切图都是用切片工具。
4.选择好切片工具之后,想要切哪里就直接拖动鼠标就可以了,然后会出现切线,在切线框内右击还可以弹出菜单。
5.点击菜单的编辑切片选项还可以对切片进行编辑,可以编辑大小等项目。
6.但是如果我们只想要字怎么办,不要底层背景,那么可以用“移动”工具。选择移动工具,在不要的背景上单击,这时候在“图层”面板里面就会选中这个图层。注意勾选上面的“自动选择图层”。
7.把选中的不需要的背景前面的小眼睛去掉,最后只剩我们想要的部分。
8.然后点击左上角菜单栏的“文件”,选择“存储为web所用格式”选项。
9.如果要透明的,那么一般选择png格式,如果要非透明的,那么哪个格式存储的文件小就选择哪个,这样能保证网页加载速度快。然后点击下面的“存储”按钮。
10.然后给图片命名,选择一个保存地址,最后选择“选中的切片”,不然好多没用的图片都会保存下来。
11.最后找到保存好的图片打开,已经是一个我们想要的图片了。
3、网站前端切图是什么意思,主要做什么
切图是设计师交付给开发的产物之一,设计稿完成后,设计师需要将其切成便于制作成页面的图片。但因为开发经常需要不同平台不同尺寸的切图,如果全部由UI来做,不仅费时费力,可能还会因为细微的差距造成开发不能很好的还原设计稿。
所以可以用摹客之类的专业工具来自动切图。UI把Sketch、Adobe XD、PS的设计稿进行切图标记,上传至摹客后,开发就可以自主下载不同平台不同尺寸的切图和使用了。
4、网页设计好后的切图是什么意思呢
切图就是把用设计软件设置好的图片切成相应的大小,切图后再把图片上传就可以可以加快显示速度,不用等整个图片都下载以后显示。
PS切图步骤:
1、打开PS,然后点击切片工具。
2、点击切片工具后,就可以把图片切成需要的大小。
3、切好图片后,点击导出web所用格式。
4、进入导出web所用格式页面,按住shift键把所有切片都选中。
5、导出格式设置为JPEG。
6、最后点击存储就可以了。
5、在网页设计中如何用PS切图
1、在Photoshop中打开设计稿,如下图:
2、选择工具板上的slice切片工具,大面积的色块单独切成一块,尽可能的保持在水平线上的整齐,切好的图如下所示:
3、在PhotoShop中选择file-save for web...来输出,这里要注意一些参数的选择:
4、接下来在Dreamweaver里建立站点:
5、在图示左边的site name中为站点起一个名字,如example然后在下面的local root folder中选择刚才导出的站点的文件夹:
6、重新制作页面表格,通常在photoshop中直接导出的htm文件是不可以直接使用的,因为有些地方在实际运用时要作调整:
7、根据这个页面表格所示,在新的页面中建立一个三行一列的表格,把cellpadding,cellspacing,border三项值设为0,不然会有空隙,最后选择表格,背景添加图片即可。
6、网页设计怎么切图
你用什么软件设计的就用什么软件来裁切图,我用的是photoshop进行设计,也是用这个来进行的切图;
切图保存格式最好、最常用的是gif和jpg。色彩要求不多的情况下,比如说小图标,就用gif。如果色彩比较丰富,gif就不够用了,就要保存成jpg。至于png,一般情况下不要用,一个是占用空间大,再是在不同的浏览器下浏览,会出现灰色背景,祝你好运!
7、UI 中网页设计切图怎么切
PxCook,目前我还没用上Mac,所以也不知道传说中的Sketch到底多神奇。PxCook在Windows上标注还比较顺手,虽然它还附带切图功能,但是比较鸡肋,不推荐用它切图。
切图工具:
Cutterman 一款PS的插件,切图非常方便,但不支持绿色免安装版本PS,而且对PS版本要求比较高,针对CS 6的已经不维护更新了。推荐安装官方完整版PS cc,然后自行破解。官网上有安装使用教程,自己研究下吧,因为我也是最近才开始接触这款插件。
Part 2 Photoshop
现在常用的几种设计尺寸
1. 640*960 4时代的尺寸,刚接触APP设计用的是这个尺寸,拟物盛行的时代(现在用这个尺寸设计的应该比较少了吧);
2. 640*1136 5/5S/5C,IPhone更新,咱们设计也得跟着与时俱进(应该还有人用这个设计尺寸),进入扁平的时代了;
3. 750*1334 6 目前我做设计稿的设计尺寸,IPhone6的尺寸,向下可以适配4,5,向上可以适配6 plus;我记得IP6推出后,我问总监应该用什么尺寸设计,他说用IP6的吧,好适配,切出来就是@2x了,改一改上下都能照顾到。
8、网页美工切图需要会什么
你div和css学一些常用的基础就可以了,还要会JavaScript,但是最主要还是要学会怎么使用工具,切图片的话用Photoshop就行,要熟悉里面的切片工具,还要会Dreamweaver,可以用来调整页面,要做动画的话可以用flash,呵呵,做一个好的美工可不容易,主要是对美和颜色搭配有一种非常敏感的感觉,美工做好一个页面90%的时间花在设计图片上了,10%用工具软件切好。
9、我现在在做网页设计,现在我想要自己做整个网页的部分,切图、写代码?
学做网页设计最好还是去找个好的培训机构,乐福创想网页设计培训就还不错,我朋友就是那边学的
10、网页切图怎么做? 网页设计切图
网页切图怎么做,网页设计切图的方法。
如下参考:
1.打开PS,点击切片工具,如下图所示。
2.点击切片工具,可以将图片切割成所需的大小,如下图所示。
3.剪切图片后,点击导出特殊网页使用的格式,如下图所示。
4.输入属导出web的格式页面,并按住shift键选择所有部分。
5.导出格式设置为JPEG,如下所示。
6.最后,单击save存储,如下图所示。