前端制作(美工)是怎么把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. Hive tuning tips

    1. limit Hive has a configuration property to enable sampling of source data for use with LIMIT: hiv ...

  2. LESSON THREE

    安装redis,并使用ruby进行简单测试.             使用redis客户端ruby测试 安装gem yum install rubygems  安装ruby所需的redis-rb程序库 ...

  3. android strings.xml 报 is not translated in af,

    57 down vote In your ADT go to window->Preferences->Android->Lint Error Checking Find there ...

  4. 03SpringMvc_自定义的spring.xml配置文件和逻辑视图名

    这篇文章的目的是实现Struts2中一种形式(封装视图的逻辑名称),在Struts2中Action处理后会返回"SUCCESS"这样,然后根据"SUCCESS" ...

  5. Managing the Lifecycle of a Service

    service的生命周期,从它被创建开始,到它被销毁为止,可以有两条不同的路径: A started service 被开启的service通过其他组件调用 startService()被创建. 这种 ...

  6. C/C++关于string.h头文件和string类

    学习C语言时,用字符串的函数例如stpcpy().strcat().strcmp()等,要包含头文件string.h 学习C++后,C++有字符串的标准类string,string类也有很多方法,用s ...

  7. 文件“D:\file.txt”正由另一进程使用,因此该进程无法访问该文件。

    关于如题的解决方案! 都是有一定编程基础的人,我就不讲其它的了. 1.在实例化一个FileStream后,用完它一定要关闭.先试试这一条: 2.第一条不起作用的话,用本条.在实例化FileStream ...

  8. JS案例之7——瀑布流布局(2)

    这个例子与上一篇类似,唯一的区别是排序的方式有差别.上一篇是在高度最小的列里插入内容,这个案例是按顺序放置内容. 两种方法各有优缺点.第一种需要在图片内容加载完成的情况下有效.这个例子不需要在wind ...

  9. Linux第二次报告20135221

    学习计时:共xxx小时 读书: 代码: 作业: 博客: 一.学习目标 1. 熟悉Linux系统下的开发环境   2. 熟悉vi的基本操作   3. 熟悉gcc编译器的基本原理   4. 熟练使用gcc ...

  10. SVPullToRefresh​ 下拉刷新,上拉加载

    https://github.com/Sephiroth87/ODRefreshControl 类似刷新控件,类似qq动画的那种刷新. 一.下载第三方库 https://github.com/samv ...