psd作成HTML相關參考頁面

前端製做（美工）是怎麼把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