Kev*_* C. 5 html email html-email
我的老板的客户抱怨说,当转发一些HTML新闻简报时,他们的基于表格的布局会中断.我已经确定这很可能是由于在Outlook中使用以下选项引起的:
工具>选项>邮件格式>使用Microsoft Office Word 2003编辑电子邮件
我的老板拒绝改变这个选项,并要求我找出解决方法.但我很难过.使用此选项转发时破坏的电子邮件位于http://www.egusts.com/stratham/stanford-square/10-0826/new/
以下是Word 2003 HTML编辑器完成后会发生的情况.没有编辑,只需选择该选项即可"前进" - http://www.egusts.com/stratham/stanford-square/10-0826/new/alt/
这是我的老板转发给我的一个例子,通过很好的方式 - http://www.egusts.com/stratham/stanford-square/10-0826/new/example.html
但我还是真的很难过.我不知道该怎么做.我以为我的原始模板的table-html非常简单直接.Word 2003编辑器中有什么问题？为什么？它剥离了一些标签吗？添加一些标签将其搞砸了？有什么我能做的吗？
我的智慧结束了!谢谢您的帮助
小智 12
不幸的是,转发电子邮件会导致一个客户端重新呈现已经呈现的HTML,这几乎总会搞砸一些东西.但是,在编写电子邮件时使用更好的做法将有助于减少这些问题.我做了很多电子邮件,这里有一些我学过的东西:
切勿使用rowpans或colspans.这些往往会在电子邮件客户端和转发时迅速崩溃.而是使用嵌套表.
如果您有一个弹出列表,请使用无序列表(ul),或者如果必须,使用2列表,每个列表项都有一行,并将每个项目放在第一列中.
远离p标签,它们在电子邮件客户端之间的间距不一致.使用2 br标签可以为您提供大致相同的空间量.
使用填充来控制元素的间距而不是边距.事实上,不是很一致,事实上,我不确定它是否有效.
超级脚本元素通常会将它们所在的行(或上面的行)向上推.使用内联样式的行高:0; 解决这个问题.但请注意,转发时仍会发生这种情况.如果您使用脚注并且只需要标注几个数字,请使用HTML实体¹ ,² 和³.
Windows 2007-2013 for Windows不支持背景图像.它们似乎适用于Outlook Mac和许多其他客户端,但如果您需要支持Outlook for Windows,请不要理会它们.
找到一个可靠的模板,并始终使用它.这应该包括头部的样式,旨在解决Web,桌面和电子邮件客户端的问题.以下是我经常使用的一些内容:
身体{宽度:100%!重要; -webkit-文字大小调整:100%; -MS-文字大小调整:100%; 余量:0; 填充:0; } a:link {color:#1d3666; 文字装饰:下划线; } a:visited {color:#1d3666; 文字装饰:下划线; } a:悬停{color:#a43232; text-decoration:none; } table {border-collapse:collapse; MSO的表lspace:0pt; MSO的表rspace:0pt; } table td {border-collapse:collapse; } img {outline:none; 文字修饰:无; -ms-interpolation-mode:bicubic; }一个img {border:none; 显示:块; }
虽然Gmail,雅虎,Outlook.com和AOL等网络客户端可能会从您的电子邮件中删除头部和任何内部样式,但对于大多数移动邮件客户端用户以及Outlook和Thunderbird等桌面电子邮件客户端来说,这些都是可用的.这些风格旨在解决的问题.对于其他所有内容,请使用内联样式.
此外,您似乎使用Fireworks创建了此项.这可能适用于网页,但电子邮件有很多陷阱和限制,FW可能没有考虑到.我建议使用Dreamweaver或其他一些有用的文本编辑器,并使用带内联样式的HTML.
我发现，除了使用透明间隔 GIF 之外，我还需要为每个容纳间隔 GIF 的 s 指定一个“宽度”。
这解决了大部分布局问题，尽管在 Outlook 中使用该选项集转发电子邮件会注入许多其他丑陋的代码，这些代码可能会搞砸。