当前位置: 网站建设 > 专业知识资讯 >

页面制作是如何精确还原设计稿的

时间:2013-04-18 10:27来源:未知 作者:网站建设 点击:

标签:页面制作是如何精确还原设计稿的
点击尺子上的如图的按钮图标可将尺子垂直: 用鼠标拖动从A点到B点的直线,测量两点间的间隔, 成都最大的网络公司 。 第一步:打蛇打七寸视觉规范 作为一名及格的页面重构者和网页设计师,实在基本才能项有一条:网页还原设计稿。 你能做到页面与设计稿丝绝不差吗? 点击把持面板最右边的图标,打开抉择屏幕尺,会在屏幕上显示如下图的尺子、为了便利透视测量,可将尺子设置成透明或半透明: 6、网页取色 2、横向测量 这里有一款可以准确测量网页的软件想分享给大家,软件名是 FastStone Capture,记得是一共事去年
页面制作是如何精确还原设计稿的》文章地址:http://www.tfxk.com/zixun/041SB432013.htm

 

  点击尺子上的如图的按钮图标可将尺子垂直:

  用鼠标拖动从A点到B点的直线,测量两点间的间隔,成都最大的网络公司

 

  第一步:打蛇打七寸——视觉规范

  作为一名及格的页面重构者和网页设计师,实在基本才能项有一条:网页还原设计稿。

  你能做到页面与设计稿丝绝不差吗?

  点击把持面板最右边的图标,打开抉择“屏幕尺”,会在屏幕上显示如下图的尺子、为了便利透视测量,可将尺子设置成透明或半透明:

 

  

  6、网页取色

  2、横向测量

  这里有一款可以准确测量网页的软件想分享给大家,软件名是 FastStone Capture,记得是一共事去年推举给我的,当时只是为了找一款可以截屏的小软件,而今我想找一款可以专门用来测量网页的软件的时候,想不到它还能排上用处——软件虽小,却五脏俱全。

  务必请求设计师在设计稿上对各种间距、宽度、特殊字体、特殊字色、特别行高级等进行标注,这样在页面制造的时候不必去从新量取也大大增强了还原设计稿的正确度,更减少了与设计师的沟通成本和后期联调成本。如下样例:

 

  实际证实,我在负责的新名目中这样的问题已经减少了良多了。

  第三步:工欲善其事,必先利其器——网页标尺工具(FastStone Capture)

  第二步:万事俱备,只欠春风——设计稿标注

  默认尺子是横放的,可以按键盘上、下、左、右键单像素挪动尺子,鼠标点在尺子的刻度上,屏幕右上角会有一个放大镜显示测量的区域,成都网站制作公司,拖动鼠标可以精确测量程度的长度。拖动尺子横向两边沿可将尺子任意拉长或缩短。

 

  设计师最好是在页面开端制作前定好视觉规范,这样可以大大减少页面制作后期联调的成本,做网站。另外页面制作可以对模板化的货色前期做统一的规范,如字体、ICON、边框、背风景、间距等做同一的class接口,等后期设计规范固定下来后有变动的处所调起来就很轻易了。

  或双击尺子可将尺子垂直。

  航海用的指南针、医生用的体温计、木匠用的卷尺……许多职业都有它专用的测量仪器,那么咱们在制作页面的时候势必也要测量间距、宽度、高度、色彩……等等数据,那么页面制作是不是也应当有一个专业的页面精确测量的工具呢?

 

  点击尺子上的图标: ,屏幕右上角放大镜会显示线长度。

  为了减少与设计师沟通上的本钱,重构师不得不督促设计师做前期整站的视觉标准,把一些公共能商定的内容以文档的情势写明,后期严厉履行起来。

  文章起源:

  点击尺子上的图标封闭尺子,返回软件节制面板,点第三个图标 (扑捉矩形区域):拖动鼠标测量想要测量的网页矩形模块吧,屏幕左(或右)上角的放大镜会显示w*h=值*值,w是宽度,h是高度。

  3、垂直测量

  

  OK,简略教程到此停止,本想搞个视频演示的,但想想这个软件其实很简单很简单,如果有不清楚的地方可以实际操作一下。

  垂直丈量跟横向测量的方式相似,这里就不反复说了。

  

 

  5、矩形测量

  假如严格做到以上设计师到重构师流程的三个步骤,页面还会有那么多页面还原设计稿的问题吗?

  1、翻开测量工具

  4、点对点测量

  有时候我们从设计师那里拿到的设计稿不必定是精确无误的,例如:统一类的模块题目文字,一个地方是13PX,另外一个地方是14PX;一个页面有多种字体颜色肉眼看起来一样却实际取到的色值不一样;每个段落的行高不一样;同一类型的弹出框多种尺寸;等等…… 这样的情形,我们不能为了还原设计稿而还原设计稿。

  惋惜该软件不三角板也没有圆规,难以测量矩形。别急,能够用其余办法取代,这里用到截屏功效。

  有人可能会想,又不是造原枪弹,哪能一像素不差啊?

  我想说: 细节真的很主要!细节决议成败,真堪称失之毫米差之千里,如果你是想打造一个精品项目真的有那么恐怖。所以在前面烦琐那么多是想大家多器重页面细节问题,真的要把页面当原子弹来做。这里分享一下我工作中的一点教训吧,请多多拍砖。

  点击软件掌握面板右边的图标:,呈现下拉框,取舍“屏幕取色器”,涌现吸管图标,移动吸管唆使的坐标点击获取屏幕任一地方的颜色值。


(责任编辑:网站建设)
页面制作是如何精确还原设计稿的相关文章
上一篇:浅谈整顿低俗之风形势下的网络营销服务 下一篇:浅谈中小型企业如何策划网络营销体系
回到顶部