打造吸睛营销邮件:HTML邮件制作全攻略

更新:11-24 民间故事 我要投稿 纠错 投诉

其实打造吸睛营销邮件:HTML邮件制作全攻略的问题并不复杂,但是又很多的朋友都不太了解,因此呢,今天小编就来为大家分享打造吸睛营销邮件:HTML邮件制作全攻略的一些知识,希望可以帮助到大家,下面我们一起来看看这个问题的分析吧!

传统的邮件

与国外客户打交道时,难免会互发邮件,尤其是节假日期间。您可能需要发送一些祝贺电子邮件来祝您圣诞快乐或新年快乐。一封普通的邮件可能是一段祝福,也可能直接给客户邮件插入一张图片。

image但是您有没有想过让您的电子邮件看起来更好?就像下图一样:

如果你也想制作这样的邮件,那么就不要错过这篇文章了。接下来,就跟着我一步一步教你如何创建这样一封电子邮件吧!

如何制作漂亮的邮件

漂亮的邮件不仅在布局上吸引用户点击,更能体现您的独特性,增加您的品牌记忆。

我订阅了很多国外的博客邮件,印象最深的就是Shopify的邮件。

图片这是Shopify的每日博文邮件,几乎每天都会推送。与其他普通电子邮件相比,我更喜欢阅读此类电子邮件中的文章。

这类邮件有一个专业术语,叫做HTML邮件。那么什么是HTML呢?

HTML 是超文本标记语言的缩写。翻译成中文就是超文本语言。通俗地说,它是一种可以让图片、文字、视频排版美观的语言。它通常看起来像这样:

第一次看到这张图片,你可能有密集恐惧症!

这是否意味着要制作一封漂亮的电子邮件,您需要接触HTML,就像一本书一样?

当然不是,这里我找到了一种完全避免手动制作HTML邮件的方法,那就是可视化编辑来制作HTML邮件。

可视化编辑我们一看到字面意思就知道了,拖拽即可编辑。

图片我们只需要将对应的元素拖入编辑器中即可达到想要的效果。例如,要插入图片,请拖动图片元素,要添加按钮,请拖动按钮元素。

可视化编辑是未来创建网页和电子邮件的主要趋势。这种只要移动鼠标就可以创建内容的方法,当然可以大大提高你的办公效率。

那么有没有可以可视化编辑HTML邮件的工具呢?别着急,打起精神,我会一步步带领你的。

如何寻找好用的在线工具

当我想寻找新工具时,我会用英文在Google上搜索,因为毕竟国外的电子邮件使用场景更多,选择也更多。

然而,我在寻找的时候遇到了一个难题。什么是英语视觉编辑?

没关系,我们尝试一下最简单的描述。我们正在寻找的是电子邮件编辑器。如果您懂一点英语,电子邮件编辑器就是电子邮件生成器。好的,那么当你在Google 中输入best email builder 时,不要急于回车。我们检查一下下拉框,看看是否有什么惊喜。果然,我找到了一个核心关键词:best Drag and Drop email builder - 最好的拖放电子邮件编辑器。这个词与可视化电子邮件编辑器的含义基本相同。搜索一下。

通过这种搜索方式,我们可以快速定位到我们要找的工具。首先输入一个简单的描述词,然后在下拉框中寻找更详细的描述,因为谷歌会将全世界人们最关心的问题推送到下拉框中!

[图片上传失败.(image-1baa30-15782 950)]

通过上面的方法,我们发现了很多邮件编辑工具。以下是我收集的网址。当然,你也可以尝试一下。你可能会发现更多惊喜:

beefree.io/bee-freestripo.email/templatesfreeemaileditor.commosaico.iochamaileon.iolitmus.com/email-builder经过多轮筛选测试,我选择beefree.io来创建HTML电子邮件。

最好用的在线HTML邮件编辑器

beefree.io/templates/的官网告诉我,他们目前有200多个电子邮件模板。当我看到这些模板时,我流口水了,当我知道大部分都是不用注册免费使用时,赶紧点开一封邮件查看:

图片制作电子邮件贺卡的主要目的是圣诞节,所以我选择了一个相关的主题,点击查看:

image

编辑邮件

这封以圣诞节为主题的电子邮件中包含bling bling 的灯笼。看起来节日气氛不错,所以就选择了。经过对材料的初步分析,我需要准备5张图片,包括:

一个标志,一个主要产品,三个其他产品。上图第三部分我暂时不需要,所以删掉了。然后剩下的主要就是图片的准备和文案了。我们先来看看如何设置图片。

首先,让我更换主要产品图片。由于主产品图片需要PNG,PNG格式的图片背景必须是透明色,所以我必须扣除该图片。

这时我选择在线抠图工具remove.bg。我只需要上传一张图片就可以完成剪切。建议剪裁更干净,并采用纯色背景。

是的,剪裁很完美!

回到beefree,点击左边选择主图,然后点击右边出现的Change image

image 然后点击一个文件夹进入,然后点击上传上传刚才剪下来的图片,最后在图片上点击插入。

[图片上传失败.(image-c5a1c-15782 950)]

点击植入物后,可以在右侧调整图像大小和位置,非常方便。拖放非常好!

图片,请特别注意图片下方的提醒文字,该文字必须填写。当图片无法加载时,提醒文字会告诉用户图片是关于什么的

图片栏属于自我介绍或公司介绍部分,不需要直接删除

图像

然后依次上传剩余的产品图片,修改标题,添加按钮链接等

图片,然后添加其他社交链接

图片这里要特别注意。由于我们使用的是免费操作,所以只能打本地下载zip压缩包

image 如果您购买的是付费版本,则无需进行任何操作。付费版本可以直接转换为HTML或导入mailchimp edm系统直接发送电子邮件。

beefree的价格是每月15美元,比较适中。如果你想长期制作,建议购买付费版本。

图片

免费版的额外操作

由于我们不是使用付费包,所以只能下载一个压缩包。解压后我们可以看到两个文件:

图片如果我们点击这个以.html结尾的文件,我们可以在浏览器中看到电子邮件的正文:

图片但这封邮件只能在我的电脑上看到。我怎样才能将其放入电子邮件中?

前进!以下手法比较hacker,请仔细操作

压缩文件夹中的图片

如果我们想将文件放入在线邮件中,我们要做的第一件事就是将图像上传到网上。

想了半天,图片应该放到网上哪里呢?

我总结了一下,大家可以上传图片到:

网站后台媒体库mailchimp 媒体库其他图片床接下来我会演示如何将图片上传到自己的网站后台,但是在上传图片之前,我建议您对图片进行无损压缩。

你电脑本地的图片都在image文件夹里

图片这里的图片格式有gif/jpg/png,我们可以使用jpg和pngtinypng.com进行无损压缩

Imagegif 图片很特别。它们是动态图片。我们还可以使用另一个在线工具来压缩它们:https://www.iloveimg.com/zh-cn/compress-image/compress-gif

但gif压缩可能会导致较小的gif变成png,所以请格外注意。

图像压缩图像以使电子邮件加载速度更快。

接下来我们整理一下压缩图片,请关注图片名称不要更改

将图片上传到我们的网站后台,这是一个WordPress网站演示:

图片然后打开图片并复制图片链接:

图片链接格式一般为:

https://keentalking.com/wp-content/uploads/2020/01/Excavator1.jpg 我们删除最后的图片名称,只保留前面的部分,后面会用到:

https://keentalking.com/wp-content/uploads/2020/01/

使用subline text批量替换图片链接

这里使用的最好的工具是子行文本,官网是www.sublimetext.com/3。这是一个代码编辑工具。我们用它来批量替换HTML文件。图片链接。

首先下载子行文本。有从官方网站下载的免费个人版本。安装后,打开html文件:

图像,然后使用快捷键ctrl+f 或command+f

打开下面的搜索框并输入“images/”,然后单击查找全部图像。然后你会发现所有包含"images/"的选项都被选中了:

image 然后按一下键盘上的左方向键,选中的文字成为光标,然后按几下键盘的右方向键,将光标移动到"images/"后面,单击Delete键,删除所有"images/"前面。

说起来很复杂,但做起来却很简单。请看动画操作演示

[图片上传失败.(image-3823b8-15782 950)]

最后一步是粘贴我们之前的链接

https://keentalking.com/wp-content/uploads/2020/01/我们发现所有图片链接都被我们自己的官网图片链接替换了

图片点击快捷键ctrl+s或command+s保存。

验证图片是否替换成功

我们来验证一下这些图片是否替换成功。

这里推荐使用qq邮箱查看。

打开你的QQ邮箱,写一封信并创建一封空白电子邮件,然后单击“格式”,然后在出现的工具栏中单击“”。

image 选择子行文本中的所有代码:

[图片上传失败.(image-f357a8-15782 950)]

并将其粘贴到QQ邮箱空白处。粘贴后点击返回可视化编辑:

当图片中出现完整的HTML时,就表示成功了!

然后将图像发送到您的工作电子邮件,然后转发给用户等等。这都是熟悉的过程!

或者您可以直接将代码放入EDM 发送系统(例如mailchimp)中。

吐血总结

写完这篇文章,我发现了一句至理名言:免费是最贵的。

如果我购买了每月15 美元的套餐,那么这篇文章的一半就到期了!

当然,要做一封高点击率的营销邮件,还是需要在文案上花点功夫。例如,标题、描述和CalltoAction 必须仔细编写。由于篇幅限制,本节我们不会过多讨论,会在以后的文章中弥补。

好了,文章到此结束,希望可以帮助到大家。

用户评论

抓不住i

终于找到想要学习的方法了!一直想自己设计好看的邮件。

    有9位网友表示赞同!

一笑傾城゛

邮件营销真的很重要,可是我从来没尝试过自己做网页版。

    有18位网友表示赞同!

稳妥

现在好多人都用HTML邮件了,感觉这样更专业。

    有15位网友表示赞同!

清原

以前发的邮件总是特别单调,希望能学到一些技巧去提升它。

    有12位网友表示赞同!

←极§速

这个教程看起来很详细,应该能真正学会。

    有20位网友表示赞同!

(り。薆情海

有图文步骤教学很棒,不用担心看不懂复杂的代码。

    有15位网友表示赞同!

此刻不是了i

终于可以摆脱那些模板邮件了,自己做更个性化!

    有6位网友表示赞同!

呆檬

我还没接触过HTML编程,希望能循序渐进地学到。

    有13位网友表示赞同!

她最好i

学习完这个教程,以后就可以自己开设邮箱营销推广了!

    有10位网友表示赞同!

軨倾词

我想在网站上分享一些促销活动内容,用好看的邮件可以吸引更多人。

    有20位网友表示赞同!

暖栀

现在有很多设计资源可以使用,可以做一些非常精美的邮件模板。

    有10位网友表示赞同!

赋流云

我觉得很多电商平台使用HTML邮件的效果都很好 。

    有16位网友表示赞同!

冷落了♂自己·

学习过简单的HTML,期待能把知识用来制作专业邮件了!

    有12位网友表示赞同!

孤自凉丶

这应该是学习一个新技能的好机会。

    有11位网友表示赞同!

代价是折磨╳

我的朋友说用专业的邮件营销工具可以更高效的多,我想先看看这个教程再说。

    有8位网友表示赞同!

服从

希望能学到一些提高邮件打开率和小费的技巧!

    有13位网友表示赞同!

剑已封鞘

现在很多人都关注个性化服务,自己设计的邮件应该更有吸引力。

    有10位网友表示赞同!

失心疯i

这个教程能不能教会我怎样测试邮件效果呢?

    有15位网友表示赞同!

沐晴つ

希望这个教程能够教我的内容实用,而不是一些过于复杂的知识。

    有20位网友表示赞同!

【打造吸睛营销邮件:HTML邮件制作全攻略】相关文章:

1.蛤蟆讨媳妇【哈尼族民间故事】

2.米颠拜石

3.王羲之临池学书

4.清代敢于创新的“浓墨宰相”——刘墉

5.“巧取豪夺”的由来--米芾逸事

6.荒唐洁癖 惜砚如身(米芾逸事)

7.拜石为兄--米芾逸事

8.郑板桥轶事十则

9.王献之被公主抢亲后的悲惨人生

10.史上真实张三丰:在棺材中竟神奇复活

上一篇:《奇幻对决:兔狐传奇故事》 下一篇:拯救男孩:成长之路指引