【发布时间】：2012-06-19 07:20:14
【问题描述】：
我目前正在获得一个由从事 Photoshop 工作的人设计的网站，并将向我提供该网站的 PSD - 相当多的图层等...
有什么方法可以将其转换为 HTML/CSS 还是必须手动完成？
一些网站似乎提供了这项服务，但我不确定他们是否只是将 PSD 分成多个部分并将它们显示为图像而不是 HTML/CSS。
也许完全转换是不可能的。
想法？谢谢
【问题讨论】：
【发布时间】：2012-06-19 07:20:14
【问题描述】：
最好的方法是手动完成，或者花钱请人为您用 HTML 编写。仅仅削减 PSD 的网站通常会产生糟糕的，有时甚至是无效的 HTML。
通过使用主要不是切片图像的布局，您可能会获得更好的结果（更快的加载页面、更好的 SEO、更好的语义等）。
【讨论】：
许多网站将完全按照您指定的方式进行操作。
搜索对 PSD 到 HTML/CSS 服务提供商的评论并比较费率/周转时间/质量。
您还可以使用http://csshat.com 等更新的工具，这将在很大程度上有所帮助。
【讨论】：
Photoshop 可以将布局转换为带有编号的 id 和类的可怕的修复布局。你不希望这样，因为它是一场噩梦。最好也是唯一的方法是对布局进行切片，适当地命名切片，然后导出它们。然后手动编码您的 html / css。这是每个人都会做的，所以没有什么错。当然，您的 html / css 需要很好才能做好，但这就是我们获得报酬的原因。
顺便说一句。在布局中使用大量图像和带有文本的图像是非常糟糕的做法。除了定制营销材料之外，现在几乎没有任何借口。如果有你需要的字体，那么你可以使用 Cufon。在许多情况下，可以使用 css 实现圆角。我最近的一些布局总共使用了 5-10kb 的图像。
显然，你不能期望你作为新手这样做，但这是你应该追求的目标。
【讨论】：
你应该手动完成。
有自动工具（1、2）可以进行转换，但输出代码简直太糟糕了。不要指望之后能够轻松地维护代码。
还有一些网站可以为您编写代码。他们应该遵循通常的提示和技巧来做好它。有些可以，有些不行。
或者你可以学着去做。只需手动编码即可。不难，但是你需要一些HTML、CSS的基础知识。
查看设计/布局/框/等的每个块，然后查看它具有哪些元素以及如何使用 HTML/CSS 重新创建它们。如果没有答案。
您还可以找到有关它的教程 (3)、指南 (4) 和视频 (5)。这方面的信息非常丰富。
(1) Adobe Muse：http://www.adobe.com/products/muse.html
(2) SideGrinder 3：http://www.medialab.com/
(3) 谷歌：http://www.google.com/search?q=convert+psd+tutorial
(4)阿特莫夫：http://artmov.com/ebooks/how-to-convert-psd-to-html-css
（5）YouTube：http://www.youtube.com/results?search_query=convert+psd&oq=convert+psd
【讨论】：