用 Photoshop 创建邮件的提示


对齐切片

尝试将所有切片水平、整齐地对齐,并减少垂直跨越的切片。

水平横跨的表格单元格是可被接受的,但是垂直跨越的单元格在 Outlook 2007 和 Outlook 2010 里可能会显示失败。


请这样做:

保持切片简单整齐

请不要:

太多垂直跨越的切片

仅将有需要添加超链接的地方进行切片

在上面提示的基础上,仅仅将有需要添加超链接的地方进行切片,减少切片的数量。

否则,Outlook 2007 和 Outlook 2010 可能无法识别复杂的 HTML 代码而导致你的邮件错位。


请这样做:

如果你只想在图片、 “Learn more” 以及 “Try it free” 按钮添加超链接,只需在你需要的地方切片,并保持切片的整齐。

只为超链接的地方切片

请不要:

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

太多不必要的切片

将切片之后的图像储存为 HTML 文件

步骤 1:保存切片图像为Web格式

在切片之后,选择在 文件 菜单下的 存储为Web所用格式,选择合适的图片格式,然后点击 储存

存储为 Web 所用格式

步骤 2:优化设置

Save Optimized As 设置中,在 Format 中选择 Html and Images,在 Slices 中选择 All Slices,然后在 Settings 中,选择 Other...

使用这些设置

步骤 3:输出设置

在 HTML 输出设置中,勾选 Output XHTML

勾选 “Output XHTML”

然后进入 Slices 的输出设置版面,在 TD W&H 栏,选择 Always

“Always” 意味着总是在<td>里设置了高度和宽度

步骤 4:添加 border="0" 和 style="display: block;"

将文件储存为 HTML 文件后,打开 HTML 文档。

添加 border="0"style="display: block;" 至所有的 <img> 标签。

添加前 <img src="images/banner.jpg" width="600" height="50" alt="SalesCatalysts.com">
添加后 <img style="display: block;" border="0" src="images/banner.jpg" width="600" height="50" alt="SalesCatalysts.com">

了解更多关于这一步骤的信息,请看 准备 HTML 邮件的提示 - 关于图像 – 提示 3 & 提示 4