用 Photoshop 创建邮件的提示
对齐切片
尝试将所有切片水平、整齐地对齐,并减少垂直跨越的切片。
水平横跨的表格单元格是可被接受的,但是垂直跨越的单元格在 Outlook 里可能会显示失败。
请这样做:

请不要:

仅将有需要加入超链接的地方进行切片
在上面提示的基础上,只将有需要加入超链接的地方进行切片,减少切片的数量。
否则,Outlook 可能无法识别复杂的 HTML 代码而导致你的邮件错位。
请这样做:
如果你只想在图片、 [Learn more] 以及 [Try it free] 按钮加入超链接,只需在你需要的地方切片,并保持切片的整齐。

请不要:
如果段落标题不是可点击的,则不需要在此进行切片。

将切片之后的图像储存为 HTML 文件
步骤 1:保存切片图像为 Web 格式
在切片之后,选择在 [文件] 菜单下的 [存储为Web所用格式],选择合适的图片格式,然后点击 [储存]。

步骤 2:优化设定
在 [Save Optimized As] 设定中,在 ]Format] 中选择 [HTML and Images],在 [Slices] 中选择 [All Slices],然后在 [Settings] 中,选择 [Other...] 。

步骤 3:输出设定
在 [HTML] 输出设定中,勾选 [Output XHTML]。
![勾选 [Output XHTML]](../../../resources/img/campaign/tips-on-creating-email-with-photoshop/zh-cn-07-2d792cae61.png)
然后进入 [Slices] 的输出设定版面,在 [TD W&H] 栏,选择 [Always]。
![[Always] 意味著总是在 <td> 里设定了高度和宽度](../../../resources/img/campaign/tips-on-creating-email-with-photoshop/zh-cn-08-3538a64b9d.png)
步骤 4:加入 border="0" 和 style="display: block;"
将文件储存为 HTML 文件后,打开 HTML 文件。
在所有的 <img> 标签上加入 border="0" 和 style="display: block;"。
加入前 | <img src="images/banner.jpg" width="600" height="50" alt="Banner" /> |
---|---|
加入后 | <img style="display: block;" border="0" src="images/banner.jpg" width="600" height="50" alt="Banner" /> |
了解更多关于这一步骤的信息,请看准备 HTML 邮件的提示 - 关于图像 - 提示 3 和 4。