前端制作(美工)是怎么把PSD制作成页面的?

美工怎么做的我不清楚,因为我是做前端的,我就从前端这个角度说吧。

首先拿到PSD,先分析哪些是要导出为图片的,哪些是可以自己用代码完成的。
将图片全部导出,要做成雪碧图的都做成雪碧图

然后直接开始码代码,在谷歌浏览器或者火狐中测试,不要用IE做第一次测试。
1.对照设计图,写好框架
2.完善细节,添加JS效果(可重用的组件,模块注意分离)
3.完善所有页面,测试浏览器兼容

PS:如果是无任何前端基础,单纯的是美工的话我就布吉岛了,记得是直接用PS的切片工具加DW调整。 再说这种事情本应是前端做的呀,为毛要让美工or设计师做,做出来的有用不。。。

编码规范和组件模块如何分离可以参考网易的NEC规范
规范 - NEC : 更好的CSS样式解决方案

作者:朱乐义
链接:http://www.zhihu.com/question/23824421/answer/25782086
来源:知乎
著作权归作者所有,转载请联系作者获得授权。

 
 
http://www.uimaker.com/uimakerhtml/uistudy/2010/0430/3379.html
 

psd做成HTML相关参考页面的更多相关文章

  1. js检测移动设备并跳转到相关适应页面。

    PS:网页自适应的方式有多种.有通过CSS样式表来实现自适应(主流),也有通过显示不同的页面来实现的方式. 下面代码是记录通过判断设备特征来跳转到相关的页面的方法. 实现要求: 当手机,平板访问 a. ...

  2. 系统UINavigationController使用相关参考

    闲来无事便在网上google&baidu了一番UINavigationController的相关文章,然后又看了下官方文档:看看更新到iOS7之后UINavigationController的 ...

  3. HTML 内嵌JS脚本、相关参考手册

    提供一个JS.HTML参考手册入口:http://www.w3school.com.cn/jsref/index.asp. JavaScript 最常用于图片操作.表单数据处理以及内容动态更新. &l ...

  4. 根据一个旅游网站的psd素材还原的静态页面

    自学web前端的html.css和jquery两个月,想检验下自己的学习成果,遂从网上下了个关于旅游网站的psd素材,自己照着素材还原网站的静态页面. 这是我制作好的静态页面的压缩文件:旅游网站首页. ...

  5. Python 异常相关参考

    Python所有的异常都是从BaseException类派生的,常见的错误类型和继承关系如下: BaseException +-- SystemExit +-- KeyboardInterrupt + ...

  6. java相关各种页面跳转

    AK相信页面跳转在这个圈圈圆圆里是个地球人都能经常遇到的事,AK也在平时的工作学习中记录了一些,这里就做一个小小的总结,有任何的疑问和质疑都希望您能告诉我,不用担心后果,必定至少您还能理我,AK万分感 ...

  7. ECharts的使用相关参考---转

    ECharts图表组件初级入门之(一):如何将ECharts引入至项目中的几种方式 http://www.stepday.com/topic/?801 ECharts图表初级入门篇:如何配置EChar ...

  8. PHP验证码参考页面

    http://blog.sina.com.cn/s/blog_95ee14340100z8q9.html http://www.jb51.net/article/44951.htm

  9. asp.net 安全性相关参考

    <system.web> <depolyment retail="true" /> </system.web>   AntiXSS http:/ ...

随机推荐

  1. HBase性能调优

    因官方Book Performance Tuning部分章节没有按配置项进行索引,不能达到快速查阅的效果.所以我以配置项驱动,重新整理了原文,并补充一些自己的理解,如有错误,欢迎指正. 配置优化 zo ...

  2. 《TCP/IP详解 卷一》读书笔记-----广播&多播&IGMP

    1.广播和多播都只适用于UDP,因为TCP是面向连接的,需要将两台主机的两个进程绑定在一起,即IP地址和端口对 2.通常,网卡能看到网络中的每一个数据帧,但是往往它只接受目的地址与自己MAC地址相同的 ...

  3. ZBrush中如何才能快速完成脸部雕刻(下)

      骨骼,是一门基础艺术,几百年来一直为伟大的艺术大师所研究,它曾经,也将一直是创作现实且可信角色的关键,提高骨骼知识更将大大提高雕刻技能. 查看更多内容请直接前往:http://www.zbrush ...

  4. 边工作边刷题:70天一遍leetcode: day 85-2

    Paint Fence 要点: 这题是求number of ways,如果是相邻不相同颜色,那么就trivial了:k*(k-1)^(n-1).所以这里no more than two adjacen ...

  5. EZ GUI Button和Checkbox创建

    第一次接触EZ GUI,记录学习过程 准备工作 导入资源 导入 EZ GUI 1.0795.unitypackage 和 SpriteManager2 v1.92.unitypackage EZGUI ...

  6. Tomcat与内存泄露

    一.Tomcat的JVM提示内存溢出 查看%TOMCAT_HOME%\logs文件夹下,日志文件是否有内存溢出错误 二.修改Tomcat的JVM 1.错误提示:java.lang.OutOfMemor ...

  7. Android Studio 三种添加插件的方式,androidstudio

    前几篇blog我们介绍了如何安装和配置Android Studio,这篇Blog我们来聊聊如何给Android Studio添加插件,添加插件的路径有三种,我把他们分类如下: 点击设置小按钮 点击[P ...

  8. where,having与 group by连用的区别

    select 列a,聚合函数 from 表名 where 过滤条件 group by 列a having 过滤条件 group by 字句也和where条件语句结合在一起使用.当结合在一起时,wher ...

  9. action中result没有值

    action中result没有值,访问action会输出action中的所有数据,输出类型为.action类型 .

  10. C语言 详解多级指针与指针类型的关系

    //V推论①:指针变量的步长只与‘指针变量的值’的类型有关(指针的值的类型 == 指针指向数据的类型) //指针类型跟指针的值有关,指针是占据4个字节大小的内存空间,但是指针的类型却是各不相同的 // ...