产品设计

    今日:53| 主题:15602
收藏本版 (1)
软件产品、PC、移动、网站、平台的开发、策划等内容。

[其他] Designing Templates with Hero Images

[复制链接]
奇葩朵朵向阳开 发表于 2016-10-7 10:55:12
86 3

立即注册CoLaBug.com会员,免费获得投稿人的专业资料,享用更多功能,玩转个人品牌!

您需要 登录 才可以下载或查看,没有帐号?立即注册

x

Designing Templates with Hero Images-1 (background,including,interest,content,explore)
    In our latest release, we’ve added the ability to include background images in our basic templates. Background images are a simple way to add visual interest to your campaigns and promote brand consistency in your emails. Most importantly, they’re perfect for adding a hero section to your campaigns.
  A hero section is a design technique that involves using images, short, compelling copy, and a call to action to make content more attention-grabbing. But there’s a lot to consider if you’re including hero sections in your email. In this post, we’ll explore some best practices that’ll help you get the most out of this exciting new feature.
  Choosing an image

  Oftentimes, the hardest part about adding a background image to a template is finding a photo that works well with your brand—and the type of content you’re sending. Here are some tips that will help:
  
       
  • Images should be simple, and shouldn’t distract from the content of your email. For example, a photo of a landscape may work better than a visually busy pattern.   
  • Watch for the distribution of light and dark sections in an image, and keep in mind that your content might not be visible depending on the color of your text.   
  • If there are people in your images, make sure they aren’t awkwardly cropped or obscured on screens of different sizes.   
  • If you want an image to span the entire background of an email, it’s better to use high-res images. If you’re using images inside the body of your email, make sure they’re around 640 pixels wide.  
   If you’re not sure where to find high-res imagery, you can start by taking a look at great sites like unsplash.com and deathtothestockphoto.com . If you prefer to use a pattern instead, check out subtlepatterns.com and transparenttextures.com .
  Adding content

  Now that you have an image, the next step is to add your content. But there are some other design principles to keep in mind while doing so.
  In sections where you’re adding background images, try to keep content short and sweet in order to avoid a fight for attention between your image and the copy. Try leaving some breathing room around your text, which will make copy more readable and allow the images to effectively shine.
  Image and text colors also have an important role to play. When selecting font colors, be aware that, while a color may work well over one section of an image, it might be less readable on another. For example, using a light text color over an image with light colors can make your content impossible to read.
   You should also choose a background color as a fallback for sections where you’re adding background images. This color will display in clients where images are off by default or don’t render. A good way to choose a fallback color is by taking a look at your image and selecting the most prevalent color you see. However, you should be sure to choose a background color that has a high level of contrast to the text color used in that section.
  Rendering and limitations

   Unfortunately, background images aren’t supported across all email clients. We’ve done what we can to offer support for as many clients as possible, but there are 2 notable clients in which background images will fail: Microsoft’s Outlook and outlook.com. If you use a background image in one of these clients, they’ll display your fallback background color instead of the image. Check out the composition of your list and, if you feel that you absolutely need background images in Outlook, you may want to look into building a custom template or reaching out to aMailChimp expert for help.
   Background images can be tricky, so testing is absolutely necessary to ensure your design looks the way you want across the most important email clients in your list. OurInbox Preview tool allows you to test on different email clients directly in the preview mode of your campaign.
   For a more in-depth explanation of how to make the most of background images, visit our Knowledge Base .
  Good luck and happy designing!
友荐云推荐




上一篇:Here are user experience tweaks Microsoft added in the latest Groove update
下一篇:25 Inspirational Movies for Designers That Will Rock Your World
酷辣虫提示酷辣虫禁止发表任何与中华人民共和国法律有抵触的内容!所有内容由用户发布,并不代表酷辣虫的观点,酷辣虫无法对用户发布内容真实性提供任何的保证,请自行验证并承担风险与后果。如您有版权、违规等问题,请通过"联系我们"或"违规举报"告知我们处理。

纪兴胜 发表于 2016-10-7 13:30:41
不觉名利。。。。。
回复 支持 反对

使用道具 举报

EmilioVax 发表于 2016-10-8 17:19:28
被楼主的逻辑打败了!
回复 支持 反对

使用道具 举报

胡佩佩 发表于 2016-11-19 18:59:17
看电影,我都不耐烦看文艺片…
回复 支持 反对

使用道具 举报

*滑动验证:
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

我要投稿

推荐阅读

扫码访问 @iTTTTT瑞翔 的微博
回页顶回复上一篇下一篇回列表手机版
手机版/CoLaBug.com ( 粤ICP备05003221号 | 文网文[2010]257号 )|网站地图 酷辣虫

© 2001-2016 Comsenz Inc. Design: Dean. DiscuzFans.

返回顶部 返回列表