---------------------------------------译自Webdesigntuts+---------------------------------------
跟大家分享一些重点内容:
1、精确到像素
在设计稿中标明以下信息:
- Margins(外边距): 两种元素之间的外边距要协调统一,如果你希望全部外边距都是25px,那就要保证它们是精确的25px;
- Padding(内边距): 同外边距的原则;
- Font usage(字体选用): 字体的类型,大小,行距等都应该标注清楚,保证精确。
- Colors(颜色): 如果你确定要使用什么颜色,不管是用在字体,用在背景或者其他,确保使用准确的十六进制来表示颜色值。
2、在设计稿中写便签注释

3、加入交互效果
主要包括以下几种:
- 下拉菜单
- 链接按钮聚焦状态
- 图像滚动条
- 灯光效果
- 工具提示信息
- 表单元素
4、心中要有脚本

了解一些基本的脚本,知道某些效果的实现方法
“ Far too often I’m given a gorgeous design that isn’t practical (or affordable) to code because it hasn’t been designed with practicality in mind.”
我经常设计一些在编码过程中显得不实际的华丽页面,因为我在设计过程中没有想过要做实际的设计。
了解一些基本技术,如HTML,Flash,PHP等,这将可以帮助你更好地设计合理的页面。
全文戳:5 Easy Ways to Prepare Your Web Designs for Coding