布局新闻稿的 个基本要点

[kumartk]

电子邮件营销是任何公司的沟通和推广策略中必不可少的工具。

时事通讯是通过提供有价值的信息、促销和更新来让订阅者了解情况并参与其中的最有效方法之一。

然而，一份成功的时事通讯不仅要提供高质量的内容，而且还要以一种有吸引力且易于阅读的方式呈现它。这就是布局发挥作用的地方。

良好的新闻通讯布局对品牌认知度、打开率、点击率以及最终电子邮件营销活动的有效性有重大影响。

有效布局的一些关键方面包括简洁的设计、移动友好性、加载时间优化以及图像和视觉元素的正确呈现。

选择简单、响应迅速且轻量级的设计

1- 选择简单、响应迅速且轻量级的设计
新闻通讯应具有简单的设计，以便在所有电子邮件客户端以及不同平台上正确查看。

我们建议您在排版新闻稿时使用标准字体、纯色背景，并减少使用图像，多使用文字。

请记住，您的新闻通讯越轻，下载速度就越快。建议您的 html 大小不要超过 1 MB。

► 设计简洁的重要性
新闻通讯设计的简洁性对于吸引读者的注意力并确保阅读轻松舒适至关重要。

简洁、干净的设计让您能够轻松识别内容的关键元素，并避免视觉超载，避免导致收件人停止阅读甚至取消订阅。

另外，简单的设计通常更容易适应不同的设备和电子邮件客户端。

► 确保移动设备的兼容性
越来越多的人通过移动设备访问电子邮件，因此确保您的时事通讯在手机和平​​板电脑上看起来不错至关重要。

响应式设计可自​​动适应不同的屏幕尺寸，确保所有用户获得最佳阅读体验。

为了实现这一点，重要的是使用流体布局、使用清晰的字体大小，并避免在移动设备上可能引起问题的元素，例如大图像或复杂的交互元素。

► 减少加载时间
加载时间是用户体验的一个关键因素，会影响时事通讯的打开率和参与度。

简单轻量的设计，优化的图像，没有不必要的元素，有助于减少加载时间。

这对于移动设备尤其重要，因为移动设备的互联网连接速度较慢，并且用户通常不太愿意等待内容加载。

为了减少加载时间，重要的是尽量减少使用大图像，避免使用多媒体文件，并尽可能压缩 HTML 代码。

使用响应式设计

2- 使用纯 HTML
您使用的 HTML 应该尽可能简单，避免使用脚本、样式、效果、表格等。

您的时事通讯应包含 HTML 和纯文本版本的消息。

默认情况下，Mailrelay系统从 HTML 消息生成纯文本消息，这更有效，因为两种文本之间的差异会导致垃圾邮件分数的增加。

► 在新闻稿中使用纯 HTML 的优势
在新闻通讯中使用纯 HTML 具有多种优势，有助于提高不同电子邮件客户端和设备之间的兼容性和可传递性。这些优势包括：

兼容性：大多数电子邮件客户端广泛支持纯 HTML，确保您的新闻稿能够在各种平台和设备上正确显示。
控制：通过使用纯 HTML，您可以更好地控制新闻稿的外观，并根据受众的需求进行调整和优化。
可传递性：使用纯 HTML 而不是外部 CSS 和 JavaScript 可以降低您的新闻稿被识别为垃圾邮件或通过电子邮件过滤器阻止的可能性。这可以提高送达率，并增加您的邮件到达订阅者收件箱的机会。
加载时间：纯 HTML 通常比使用外部 CSS 和 JavaScript 的电子邮件文件大小更小。这意味着您的时事通讯将更快地加载到订阅者的收件箱中，从而改善用户体验并增加他们参与您的内容的机会。
► 避免使用外部 CSS 和 JavaScript
虽然使用 CSS 和 JavaScript 可以在设计和功能方面带来优势，但它也可能给新闻稿带来问题，原因如下：

不兼容性：某些电子邮件客户端不完全支持 CSS 和 JavaScript，这可能会导致您的时事通讯显示不正确或不完整。
可传递性：使用外部 CSS 和 JavaScript 的电子邮件更容易被识别为垃圾邮件或被电子邮件过滤器阻止，从而对可传递率产生负面影响。
加载时间：外部 CSS 和 JavaScript 文件会增加新闻稿的文件大小，从而导致加载时间更长并降低用户体验。
安全性：出于安全原因，某些电子邮件客户端可能会自动阻止活动内容（例如 JavaScript），这会影响您的时事通讯的功能。
简而言之，建议避免在新闻通讯中使用外部 CSS 和 JavaScript，尽可能选择纯 HTML，以确保更高的兼容性、可交付性和更好的用户体验。

利用 HTML

3- 使用表格布局新闻稿
尽管 HTML5 和 CSS3 的出现代表着进步，但电子邮件客户端尚未完全融入这些技术，并且继续在 HTML 编码中使用表格。

这就是为什么我们建议您始终使用表格来布局您的新闻稿，以避免意外的结果。

► 为什么使用表格而不是 div
虽然在现代网页设计中，div 和层叠样式表 (CSS) 因其灵活性和易于维护而受到青睐，但对于新闻稿而言，表格仍然是最可靠的选择。

主要原因是不同电子邮件客户端和设备之间的兼容性和一致性。

在新闻稿中使用表格代替 div 的一些好处包括：

兼容性：几乎所有电子邮件客户端都支持表格，包括那些 CSS 支持有限的客户端。这可确保您的时事通讯在所有设备和平台上一致显示。
结构：表格为您的新闻通讯布局提供了清晰、易于遵循的结构。这使得为​​您的订阅者创建有组织的、易于阅读的布局变得容易。
宽度控制：使用表格可以让您有效地控制新闻稿的宽度。这对于确保您的设计在移动设备上看起来不错并能正确缩放到不同的屏幕尺寸特别有用。
► 布局中有效使用表格的技巧
为了在设计新闻稿时充分利用表格，请牢记以下提示：

嵌套表：如果您需要更复杂的结构，您可以将表嵌套在其他表中。但是，尽量不要嵌套太多表格以避免复杂化并确保良好的可读性。
使用空单元格：如果您需要在元素之间添加空白，则可以使用空单元格，而不是使用 CSS 添加边距或填充。这将确保所有电子邮件客户端中空格均能正确显示。
内联样式：将内联样式应用于表格和单元格，而不是使用外部层叠样式表。这将有助于确保您的样式在所有电子邮件客户端中正确显示。
对齐和文本换行：在表格单元格中使用对齐和文本换行属性可以有效控制内容的定位并确保整洁、一致的外观。
考虑可访问性：确保您的时事通讯可供所有用户访问，包括视障人士或使用屏幕阅读器的用户。为此，请向图像添加描述性alt属性，并使用标题标签和清晰的文本来构建您的内容。
在布局中使用表格

4- 宽度不得超过 600px
许多电子邮件客户端不会全屏显示您的电子邮件，而是通过大约 600px 宽的预览面板显示。

您还应该记住，宽度较大的图像更容易被视为垃圾邮件。

尊重这一措施非常重要，这样您的新闻通讯才能正确显示。

► 适应不同的设备和电子邮件客户端
建议不要超过600px宽度的主要原因是适应性。

大多数电子邮件客户端和移动设备（例如手机和平板电脑）viber 数据库 对其可显示的最大宽度都有限制。

通过将新闻稿保持在 600px 宽度以内，您可以确保它与大多数平台兼容并在所有设备上正确显示，避免水平滚动问题并确保最佳用户体验。

► 可读性和用户体验
将新闻稿宽度保持在 600px 以下的另一个原因是可读性和用户体验。

更窄的布局使内容在移动和桌面设备上更易于阅读，因为用户不必水平滚动即可阅读所有内容。

此外，通过限制宽度，您可以更好地控制新闻稿中元素的布局和排列，从而更轻松地创建简洁、有序的设计，让您的订阅者轻松遵循。

最终，将您的新闻稿宽度保持在 600px 以内可提高可读性并确保您的订阅者获得愉快的用户体验。

宽度不得超过 600px

5-使用内联样式
一些电子邮件客户端不支持电子邮件标头中的样式标签。

为了避免这个问题，使用内联样式会更方便。

► 时事通讯中的在线样式的好处
与使用外部或内部层叠样式表 (CSS) 相比，内联样式有几个好处：

增强兼容性：某些电子邮件客户端可能无法正确解释 CSS 样式表，尤其是在外部链接的情况下。通过内联应用样式，您可以确保在所有电子邮件客户端中一致地应用样式。
降低被标记为垃圾邮件的风险：包含外部 CSS 样式表的电子邮件可能会被垃圾邮件过滤器视为可疑电子邮件。通过使用内联样式，您可以减少电子邮件被标记为垃圾邮件的可能性。
文件大小更小：通过内联应用样式，您无需上传额外的 CSS 文件，从而减少了电子邮件的整体大小并加快了加载时间。
► 如何在 HTML 中应用内联样式
要在 HTML 中应用内联样式，只需向 HTML 标签添加“style”属性并定义相应的 CSS 属性。

以下是如何将内联样式应用于元素的示例：

正确编码样式以避免电子邮件管理器出现问题

6-避免图像出现意外结果
在表格结构中使用分割图像或一个图像旁边的另一个图像时，每个图像都必须具有“display：block”样式。

由于 Gmail 等电子邮件客户端会自动在图像之间生成不需要的空白，这会弄乱我们的新闻稿的设计，如下所示：

► 如何针对不同的电子邮件客户端优化图像
使用“alt”属性：某些电子邮件客户端可能会默认阻止图像。确保为图片添加替代文本（“alt”属性），这样如果图片未显示，订阅者也可以了解图片的上下文。
设置特定尺寸：在 HTML 代码中定义图像的尺寸（宽度和高度），以防止它们在不同的设备或电子邮件客户端上扭曲或不正确显示。