将indesign网页设计导出为xhtml的最佳方法是什么?

时间:2011-03-16 04:55:41

标签: css xhtml dreamweaver adobe-indesign

我有一个专为网页设计的indesign文件。我试图从文件中导出>出口>使用Indesign CS5的Dreamweaver。我尝试配置所有内容并导出,但导出的结果非常糟糕。 Indesign导出的是图像和文本,没有包含任何设计(例如背景颜色,位置)。这只是我还是出口结果应该是?是因为我的indesign文件?如果我想获得我在indesign中设计的确切设计,那么最好的方法是什么,因为我不想设计两次。请建议我。谢谢。

4 个答案:

答案 0 :(得分:3)

Indesign主要用于印刷布局和设计。作为网页设计师,它非常糟糕。唯一可能改善输出的是确保在XHTML导出选项的“高级”选项卡中,并确保选中“包括样式定义”和“保留器本地覆盖”。除此之外,请查看http://help.adobe.com/en_US/InDesign/6.0/WS82C401A9-E844-40d5-B9B4-540CA374B0C6a.html

有关导出功能的更多信息。可以把它想象成一个跳跃点,你已经在inDesign中设计了一些东西,而不是最终产品。将来,我会使用Illustrator,Fireworks或Photoshop进行设计。

答案 1 :(得分:2)

从INDESIGN开始的所有平台的统一设计
(免责声明:没有默示背书;只是必须这样做,所以我认为我会将工作流程作为问题的答案发布)

0)InDesign ----> 1)Epub - IPad / Iphone等
|
| (导出为.eps)
|
V
2)Illustrator (3分钟,加上AI时间的工具;加上切片,如果你这样做的话) | | (2a)导出到.psd; 切片/准备在Illustrator或Photoshop中。
|
|或者(如果您更喜欢在AI中使用PS到PS) |
| (2b)或者,您可以跳过导出到.psd,只需:
| (文件>保存为Web和设备;请务必转到“编辑输出设置>切片
|并取消选择跛脚表并选择css;也将HTML更改为> XML)
|
|
| (注意:在此步骤中请记住,下一步可能有一些图层/组 |你可能想要的 |出口整块布。保存这些文件,但不要删除图层。只是切片 |以这种方式,你可以看到px的高度和宽度。你可能要搬家 |结束了。例如你有一个很棒的渐变。你想要原始的尺寸但是 |小文件或者你想要一个背景图片。记住这些事情。)
|
V
3)Photoshop (3分钟,加上PS时间的工具;加上切片,如果你在这里做;)
|
| (3a)文件>保存Web和设备;转到“编辑输出设置>切片并选择
|并取消选择跛脚表并选择css;也将HTML更改为> XML)
V
4)PROTO_XHTML和图像文件(此步骤您现在有:
| a)您的图像文件,正确比例
| ** b)一个XHTML文件,它方便地包含px中的大小 |你在风格部分中的所有图像 | * * c)您的图像文件在px中的位置 |
V
5)DO MATH (15分钟 - 您可能想要一些百分比的东西 - 图像大小;绝对或相对位置等 - 您将不得不做数学来得出这些数字
从您在上一步中生成的原始数据开始。打开Excel或其他东西。
使用剪切和粘贴技巧。做数学。)
|
|
|
|
V
6)Dreamweaver或无论您使用什么(将您的PROTOXHTML文件放入编辑器中。将px替换为DO MATH步骤中获得的百分比。)

< / p>

您现在拥有在任何类型的布局中重新创建原始设计所需的所有原材料,只要您了解基本的CSS。

答案 2 :(得分:2)

我创建了in5来解决维护布局的Web导出问题。

答案 3 :(得分:1)

我自己做了很多研究,因为我听到一些人说它可以做,但它似乎是一个非常基本的导出,除非是你创建现有InDesign内容网页的第一步,否则不是很有用否则也可以从专门的网页设计程序中从头开始。这里有一个很好的清晰页面:http://www.onsitetrainingcourses.com.au/main/page_blog_saving_indesign_files_as_html.html