Design

Email Design For Mobile: Best Practices to Take Your Marketing Emails up a Level

Evolution of Mobile-First Design The term "mobile-first design" is one you may have heard before, but perhaps you've never put it to practice. To understand ...
Emily Santos
Emily Santos
Sep 15, 2022

Evolution of Mobile-First Design

The term "mobile-first design" is one you may have heard before, but perhaps you've never put it to practice. To understand what mobile-first means, it's important to understand how web and email design has evolved over time.Previously, desktop computers were the most commonly used device to view websites and emails. Today, mobile phones are ubiquitous and part of our lives.We use mobile phones for most of our everyday tasks. From waking up tolistening to our favorite podcasts, managing our project, chatting on Slack with our colleagues, and, yes, checking emailsThe shift in how users view content forces marketers and designers to approach email creation with a slightly different mindset – using a "mobile-first" design method.

What is Mobile-First Design?

The mobile-first design method encourages us to build emails and websites considering the smallest device first. This means that as your design process continues, additional functionality and content is added for larger screens, such as desktops.A Bluecore report shows that "59% of Millennials and 67% of Generation Z use their smartphones as their primary email source." Given that a vast majority of your subscribers are most likely part of these generations, it is safe to assume that ignoring mobile-first design could result in low email engagement.It is easy to see that mobile-first is essential. However, it does come with its challenges that could become barriers to your success. These barriers include spam filters, ineffective subject lines, long graphic load times, or accessibility concerns.To get a better understanding of these challenges and best practices to tackle them, continue reading.

Why Should We Optimize Emails for  Mobile Responsiveness?

Reports by Litmus show that "roughly half of all email opens occur on mobile devices." In fact, SaleCycle shows that "42.3% of people delete emails on their devices when they're not optimized for mobile."Unfortunately, a majority of marketers have yet to embrace mobile email design. A 2020 study by SuperOffice found that "nearly one in five email campaigns were not optimized for mobile viewing."By ignoring mobile design, even your best emails could be providing your reader with a poor email experience, and you could be missing out on the benefits it can provide, such as:

  • Increased conversion rates
  • Higher open and click-thru rates
  • Fewer opt-outs
  • Better email delivery rates

Mobile Email Design Stats to Make You Go Hmmmm….

Here are some moreinteresting mobile email stats that might make you consider upping your mobile email game.

  • "Almost every report on email open rates concludes that mobile is responsible for at least 50% of all opens" (Campaign Monitor)
  • "70% of users will delete poorly formatted emails in under three seconds." (Campaign Monitor)
  • "Mobile transactions accounted for 71% of sales on Black Friday and Cyber Monday in 2021." (Shopify)
  • "Smartphone users spend five to six hours daily on their phones, not including work-related use." (Statista)

See also: Top Email Design Trends for 2022

Creating Mobile Responsive Emails: 8 Best Practices

As we've outlined, you have much to gain from investing time in learning about responsive email design for mobile. According to MailChimp"launching a mobile responsive email design can increase unique mobile clicks by 15%".So, let's unwrap some essential best practices for creating responsive emails that convert and make you more confident in mobile email.

1. Best Email Subject Lines

The best email subject lines are the ones that intrigue you, offer you a deal, or require you to take action. While desktop allows up to 60 characters to reel your reader in, mobile-only has the capacity for 30-35 characters.

The Stats on Subject Lines:

  • "Subject lines influence 33% of email recipients to open the email." (OptinMonster)
  • "Subject lines can cause 69% of people to mark the email as spam." (OptinMonster)
  • "Using an emoji in a subject line can increase open rates by 56%." (Experian)
  • "Subject lines that use personalization increase open rates by 50%." (Marketing Dive)
  • "Including a sense of urgency can increase open rates by 22%." (OptinMonster)

When you have so much riding on such a small amount of real estate, you may feel pressured to deliver brilliance each time.An effective subject line is one of the most important and it might seem like a difficult and daunting task. Lucky for you, we're here to help. Here are some tips to make writing a short and effective subject line:Ways to improve your subject line performance Right Away

  • Personalize it
  • Avoid salesy-phrases like "apply now," "cash bonus," and "earn money"
  • Include a keyword for SEO Optimization. 
  • Add some emojis for an extra dose of personality 
  • Make it timely and specific
  • Add a sense of urgency
  • Keep it relevant to your copy

Don't Forget About Preheaders

The preheader is the text line displayed under the subject line in your email. You can use this additional real estate to get someone to open your email. We'll talk more about A/B testing and how you can test the effectiveness of your subject line and preheaders.

2. Best Practices for Designing Emails for Mobile 

In a mobile-first email design world, design starts with the mobile user's needs and then the desktop user's needs. Approaching design with this mindset will ensure you're delivering the best experiences to most of your audience who choose to use mobile for email.A good mobile-first email design will include:

  • A single-column layout
  • Simple copy
  • Standard fonts
  • Limited, on-brand color

Single-column Layouts

A responsive email designed with a single-column layout will be well-received by users on any device. It is by far the most accessible format to navigate from a smartphone.The single-column email makes it easier to focus on the messaging, presenting information in a precise order using a hierarchy. The content will scale and fit nicely regardless of the device used to view it.

Copy

Continuing with our subject line guidance above, keep copy simple. It can be challenging for someone to read a large amount of text on a small screen, like that of a mobile device.Keep the experience enjoyable by landing your message quickly before users scroll past it. Here are some tips for how to write short, goal-oriented sales copy:

  1. Have one goal in mind, and try not to do too much more than that with one email message.
  2. Keep a consistent brand voice throughout the email.
  3. Use subject line and preheader text to add to the email's content.
  4. Use active words that engage.
  5. Get specific – don't use too many fluff words that take up space.
  6. Have someone else read it to make sure your message is clear.

See also: 4 Steps for Writing Better Emails and Collaborating Efficiently

Fonts

Have you ever tried to read a tiny font on a smartphone? Be sure to choose readable fonts – at least 22-point headlines and 14-point body text.We also recommend choosing a standard font and limiting the fonts used to no more than two. Defining this will keep your email legible and looking professional and on-brand.

Colors

We love color and think it can add a lot of fun to design. However, mobile email is not necessarily the right place for a crazy amount of color. Too much design in an email can be distracting from the message, so try to choose one primary color and one or two secondary colors for each email.It would be best if you also considered accessibility concerns when choosing the color for the email. For many mobile users, Dark Mode is a default setting. Not only does it enhance accessibility and reduces eye strain on those with light sensitivity, but also:

  • Preserves battery life on devices by reducing screen brightness and using less energy.
  • Offers a slick and cool dark interface that many prefer.

Read this article for Dark Mode best practices. When using BEE Pro, you can easily toggle on and off the Dark Mode feature to helpsimulate how your messages will be displayed when dark mode is enabled.

Dark mode for Mobile Email Design

3. Optimize Images for Mobile Use

Images are a great way to create visual interest and engage your audience in the content of your email. However, images could also hurt your email's performance if not done correctly.See also: How to Optimize Images for Responsive Mobile EmailsSome common mistakes made when it comes to images include:

  • Images too large to load
  • Images not formatted for accessibility
  • Poor image quality
  • The image is not responsive
  • The image is in the wrong format

To give your readers the best user experience, it's best to use responsive email images in your email design. Using responsive images is one way to keep your design mobile-first and provide a positive experience for mobile users.

High-Quality Images

It is best to export high-quality mobile and web images with a resolution of 72 DPI (dots per inch). While this might sound small, this is not one of those instances where more is better. A 72 DPI guarantees a high-quality image on web and mobile and prevents blurriness.It's also important to consider the image's color values. CMYK (cyan, magenta, yellow and black) color values are meant for print and won't display well on a digital screen. Instead, we recommend images in RGB (red, green, blue) because they work well for high-quality digital images.

Image Size

File sizes impact the total time it will take for email content to render once it's opened fully. In addition, on a mobile device, internet connections could contribute to long load times. Avoid these concerns by optimizing your image sizes for mobile-first email design.For the highest quality image, we recommend adjusting your content area width to around 600px. Images will adapt according to the device used to open the email, so this is the safest route to ensure a high-quality display. Be sure to compress your images for faster loading times.

Image Format

There are many different image file formats, each with pros and cons.

  • PNG: These images maintain their quality when compressed and can export transparently.
  • JPEG: These images are suitable for colorful photos but don't allow transparency and may lose quality with compression.
  • SVG: These images are in a vector format, allowing easy resizing without losing quality.

Image Accessibility

Always consider if you should include accessibility components to assist visually impaired individuals. For example, here are two ways to make your images more accessible:

  • Alt Text: Includes an image description that allows screen readers to describe the image to someone who cannot see it. 
  • Color Contrast: It may be hard for some to distinguish between colors. Reading colorful text on top of a bright background can be especially hard. Consult this guide by Color Oracle for tips on designing for people with visual impairments.

Keep Diversity and Inclusiveness Top of Mind 

As you choose images for your mobile email design, be sure to consider your audience's diverse perspectives. Consider their genders, races, abilities, cultures, ages, and more.If your audience is diverse in these areas, then your emails should also represent this diversity. When you select images, consider if the people in your pictures represent different races, genders, abilities, etc. Here is an articleto help you write more diverse and inclusive emails.

4. Tips for CTA Design

A call-to-action (CTA) can be a link or a button. When designing your mobile responsive email, it is best to use large, colorful buttons for the CTAs. According to Constant Contact, "buttons are 25% more likely to be clicked than a link alone."Sometimes, a thin link can be challenging to find and click on a smartphone. Provide a big, colorful button to get the most attention from your readers. A suggested size is a minimum of 44px x 44px.After you consider how to design your button, next, think about what it says. The purpose of a CTA is to encourage your reader to do something. Here is a list of common CTAs:

  • Sign Up
  • Subscribe
  • Try for Free
  • Get Started
  • Learn More
  • Join Us
  • Register

These CTAs are generic, and some may cause hesitancy because the reader doesn't know what they'll get beyond the button. What does "Learn More" mean?Marketing emails often use engaging CTAs that are more explicit about what the reader can expect. A few examples of more descriptive CTAs include:

  • Download the eBook
  • Sign Up for Weekly Newsletters
  • Book a Free Demo
  • Register for Free Webinar

In your email, it is best to drive attention toward a single action to take. Including multiple CTAs with different activities may cause confusion and, therefore, inaction on the reader's part. Similar to the guidelines for writing the best email copy, keep your CTAs focused on the one goal of your email and don't distract from that goal.Ensure accessibility of your CTAs by using HTML code to define your button instead of inserting an image. Within the code, you can include alt tags to identify the CTA text for a screen reader.

5. Best Use of Space

When designing the layout for your mobile-friendly email design, remember to make it user-friendly as well. It can be challenging to interact with elements on a mobile device if they are too close together. By leaving a good amount of white space around design elements and CTAs, you can help drive a more positive user experience.Often, simple emails can get the message across more easily. Utilizing white space allows a reader to focus more carefully on the action that you want them to take. A good email will contain your logo, simple copy, plain colors, and a clear call to action.How you choose to layout your email will have an impact on the user experience. A modular structure, similar to the layout options provided in BEE Pro responsive email templates, will ensure that your email layout is mobile responsive and presents information in an orderly way.Keep your email layout simple by including these three basic simple and skimmable design elements:

  • Header
  • Body copy
  • CTA

Keeping the content simple and a clean layout will make for a very user-friendly mobile email experience.

6. Best Use of Scroll

According to Campaign Monitor , the average person receives 100-120 emails daily, not including spam. That's a lot of emails! If you take time to read and scroll through every email, that will consume a large portion of your day.That is why many people scan their emails for essential details and only typically give an email 10-15 seconds of their time.For this reason alone, it is important that your email's key message is immediately seen with only a short glance. Don't beat around the bush, or you'll miss out on a potential conversion opportunity.Most readers do not follow a typical left-to-right reading pattern when scanning emails. Instead, their eyes will fly over the copy and images, typically in an "F" pattern.If you have subscribers, they may only be looking at headlines and CTAs.Here are some content tips by Campaign Monitor tokeep your email skimmable

  • Subject lines: For mobile audiences, the best subject lines will be 28 to 39 characters.
  • Preheaders: Most email platforms allow 40 to 100 characters.
  • Email copy: Ideal length is 50 to 125 words.
  • CTAs: Keep it short and sweet at two to five words.

Keeping your email copy concise will keep your message clear and get your point across more quickly.However, keep in mind that CTA placement is still extremely important, even if you have a short email. Don't bury your CTA at the bottom of the email – there's a high probability they won't even get there to see it.Instead, drive a higher level of engagement when you place a CTA before the first scroll. This may mean including a button in your header image or immediately below it. Then, if your email is on the longer side, including a few more buttons later will give them ample opportunity to convert.

7. Is A/B Testing Emails Necessary? 

A strong email marketing strategy will include testing to see if the improvement is achievable. Who wants to settle for the status quo? That said, there are a few different ways to optimize your emails with testing to increase results.HubSpot reports that "Q.A., A/B, and spam testing can lead to a higher ROI of up to 28%". So, where should you start?

Q.A. Testing

Use the test-send functionality available through your email provider to review emails, as they will appear to recipients before deploying them to your entire list. Doing this allows you to test appearance across multiple devices and email clients. Be sure to click on all hyperlinks within the test email to ensure they are linked correctly, and also review any personalization for proper setup.A good Q.A. testing process may also include a review by another person. With remote work at its highest levels, you may need a tool that will provide a suitable platform for collaboration.Ways you can speed up email development and team collaboration include:

  • Reusable content blocks - These ready-made templates allow everyone in your organization to build emails in an organized and repeatable way. BEE Pro utilizes a reusable content block strategy to help users create focused and on-brand emails every time.
  • Style guidelines - Empower all team members to take charge of creating mobile emails when you provide them with a brand style guide. Policies can include color palettes, fonts, text, title sizes, etc., and help keep communications consistent across the organization.
  • User roles and permissions - Allow team members to provide feedback and collaborate faster when you all have access to the email design platform. With BEE Pro, team members can be assigned as designated reviewers and provide timely feedback to speed up email design and launch.

A/B Testing

A/B testing can help you improve the performance of your emails by allowing you to learn what performs better – A or B. This article by 99Firms states that "approximately 59% of companies will perform A/B tests on their marketing emails."

What should you A/B Test? 

  • Subject lines
  • Call-to-action phrases
  • Button colors, size, and placement
  • Salutation
  • Bullet points
  • Video or no video
  • Personalization
  • Sending day of the week
  • Sending time of day

In addition to these items, A/B tests are also helpful in understanding UX design and conversion rate optimization. A study by Forrester Research showed that "better UX design could result in up to 400% increases in conversion rates."

Spam Testing & Email Deliverability

You can use a third-party testing app to check your email for red flag errors that may send your email to a spam folder. Nearly 16% of all emails go missing or get caught by a spam filter. Common triggers that could cause your email to identify as spam include:

  • Long, wordy emails
  • Lots of exclamation points
  • ALL CAPS
  • Too much salesy language
  • I.P. address reputation
  • Domain reputation 

In addition to these items, some design choices could help keep your emails from the spam folder.

What is the CAN-SPAM Act? 

The CAN-SPAM Act enacted in 2003, states that all marketing emails are required to have an unsubscribe option visible on every email. A simple mistake such as forgetting the unsubscribe link could lead you to be found in violation of CAN-SPAM and receive fines or penalties.Other requirements for staying in compliance include:

  • Don't send emails to people who have previously opted out
  • You must remove someone from your list within ten business days of opting out
  • Each email must have the physical address of the sender on it
  • Subject lines can't be deceptive or misleading

If you make it hard for a recipient to unsubscribe from an email, they could flag you as spam, and your email service provider could stop sending your campaigns. Unwanted emails can really bug some people.

8. Accessibility Guidelines for Emails

According to the CDC, 26% of adults in the United States have some kind of disability, making Accessibility design, not a choice but a necessity.The Americans with Disabilities Act (ADA) was implemented in the U.S. to ensure businesses considered how they were delivering products, services, and communications to all Americans. While some outlined guidance is specific, the law doesn't provide much detail around ADA email compliance standards. This makes our job even more critical in monitoring ourselves and ensuring we communicate in an accessible way.Email accessibility is about making sure allyour email recipients can access your message.Here are some best practice guidelines to ensure your mobile-friendly email designs are accessible:

  • Create descriptive subject lines
  • Don't rely solely on color to emphasize – use underlines with hyperlinks
  • Use responsive design 
  • Structure content with headers
  • Include alt text with images and graphics
  • Ensure legible font size and high color contrast ratios
  • Include white space
  • Include an HTML language attribute
  • Left-align text
  • Include captions in videos

The most beneficial changes email marketers can make to email accessibility is to keep content short, subject lines descriptive, and links and buttons easy to see.

Mobile-Friendly vs. Responsive Email Design

When you're preparing to begin optimization of an existing email built for desktop, you should consider if you want to build your emails mobile-friendly or with a responsive email design. Before you can make that decision, let's compare the two options.

Email Width

When you design an email as mobile-friendly, you essentially design the email to fit a mobile device. Typically, a mobile-friendly email will be constructed as a fixed width to the width of a mobile device.Responsive emails, however, are slightly different. First, their construction allows them to conform to the width of whatever device views the email. So, the email will be viewable at full width, whether viewed with a smartphone, tablet, or desktop.

Font Sizes

A mobile-friendly email will only display fonts at the size they were coded, for instance, 14-point body text. However, a responsive email will optimize the font size automatically in proportion to the original to display it legibly on the chosen device.

Layouts

We mentioned earlier that single-column layouts are ideal for mobile-friendly emails. While this is true, designing a multi-column email specifically for mobile is still possible.A responsive email, however, will adjust a multi-column email for a desktop to a single-column display for a mobile device. As part of this adjustment, elements can hide if the programmer chooses to help keep the email at a reasonable length.

How BEE Pro Helps Optimize Email for Mobile

Mobile design mode, available in both BEE Pro plans, helps email marketers optimize email for mobile devices. Functionality in the platform allows users to hide elements to save mobile users space and control how pieces will stack on the smaller device screens.With mobile design mode, users will save time toggling between desktop and mobile designs without needing to enter a preview mode. Also, if you want to change your mobile design, you can do this independently of the desktop design version. We think this is a more efficient and intuitive way to create mobile responsive designs in less time.

Optimize your Mobile Email Design with BEE Pro

With BEE Pro mobile design mode, the system will optimize your email for the best display on a mobile device. This includes adjustments to:

  • Alignment - When desktop designs have a multi-column layout, sometimes the alignment can look odd on mobile. Instead of hiding the contents, the mobile design mode will center-align it to look better.
  • Text size - Set different text sizes for paragraph, list, title, button, menu, icon, and form for mobile display.
  • Padding - Set different padding values for mobile and desktop.

https://www.youtube.com/watch?v=Vki0LNdPtJM

Mobile-friendly Email Responsse Template

BEE Pro provides over 1,500 mobile responsiveemail templates. All of our templates are designed to provide you with peace of mind and ensure that all content is arranged to display optimally on mobile devices. Here are some tips for finding the right email template for you:

  • Usage: How will you use the email? Is it for an announcement or a sale? There are many usage category options.
  • Industry: Get closer to the look you want by filtering down to the industry level. A wide variety of sectors are offered, including automotive, health and wellness, and fashion.
  • Automated: Will your email be sent in an automated message format? There are several great template options available to get your brainstorming. Consider abandoned cart, confirmation, thank you, and password reset emails.
  • Seasonal: Grow customer relationships with timely seasonal email messages. We have various seasonal options, including Chinese New Year, Fashion Week, and the Super Bowl.

After you've selected your template to use, easily drag-and-drop content into the email or landing page. Switch from Desktop to Mobile mode to ensure design and content looks good on any device.

BEE Pro mobile design mode

How Mobile Email Design Implemented with BEE Pro

The Director of Communications for the College of Natural Sciences and Mathematics at the University of Denver became a BEE Pro advocate after speeding up his design process to get work done faster.Since a large portion of his audience where busy college students with mobile devices, he needed a tool that allowed him to optimize emails for mobile. Our intuitive builder provided him with the flexible layouts he needed, along with key features like mobile optimization, for him to be successful at his job.With BEE Pro, the director could quickly complete email designs with easy-to-implement content blocks and use mobile optimization to design on-brand emails. It worked well with his email-sending platform and made his email marketing experience much smoother. In addition, quick preview tests allowed his boss to review emails quickly and stay organized for a more seamless workflow experience.You can read more about the University of Denver's BEE Pro story.

What Comes Next?

Now that you've become a pro at mobile responsive email design, check out our tips on creating landing pages that convert. You can use BEE Pro to effortlessly create responsive landing pages from scratch or use one of our templates.BEE Pro helps anyone design emails and landing pages with our easy-to-use, drag-and-drop, no-code editor. Get access to over 1,500+ email and landing page templatesprofessionally made by 30+ Designers. We are always launching new designs, so there's always something new to discover!Take your email and landing page design to the next level by subscribing to BEE Pro. Happy designing!

7 Black Lives Matter Emails That Moved Us

The #BlackLivesMatter movement has been taking over our social media feeds and inboxes alike. Here at Beefree, we wholeheartedly speak out against racism and aff...
Beefree team
Beefree team
Jun 6, 2022

The #BlackLivesMatter movement has been taking over our social media feeds and inboxes alike. Here at BEE, we wholeheartedly speak out against racism and affirm the value of all Black lives. We’re thrilled to see so many brands and email newsletters doing the same by sending their subscribers educational resources or places to take action.We realize, though, that crafting a good Black Lives Matter email can be difficult. This is a heavy topic — and it’s extremely important. How can your email design back up #BlackLivesMatter in a way that helps, not hurts? Take a look at these seven Black Lives Matter emails to get some ideas for your own timely messages.

Crafting a good Black Lives Matter email can be difficult. This is a heavy topic — and it’s extremely important. How can your email design back up Black Lives Matter in a way that helps, not hurts?

The Lily

Lily Lines, a women-centric newsletter created by The Washington Post, sent an excellent Black Lives Matter email to its subscribers. We love the way this newsletter is organized: It starts out with an essay by a Black author and community organizer, sharing beautiful illustrations between every few paragraphs. It continues with a few brief news hits and a social media highlight. And the whole message is laid out with black text on a plain white background, making the important information clear and easy to read.Subject line: This is a difficult time. An activist has advice.

black lives matter email newsletter

Byrdie

Beauty brand Byrdie was on top of things when #BlackLivesMatter began to trend. This brand not only made a statement about how it supports equality and human rights, but went a step further by sharing extra resources. Supporting Black-owned brands is a great way to recognize and support the Black community. Byrdie took this to heart by sharing a massive list of brands that are relevant to its readers. The majority of this email utilizes a simple single-column layout listing links for readers to check out.Subject line: 60+ black-owned brands every beauty lover should know

black lives matter email example

The Wing

When it comes to trending causes that matter, your first instinct might be to think out of the box. If everyone is talking about the same topic, your contribution needs to stand out, right? But in most cases, simple is best. Black Lives Matter emails aren’t about your brand — they’re about the movement. So take a cue from companies like coworking space The Wing, who created a simple yet highly impactful email design. The background of the email is off-white and doesn’t detract from the message, and the words “Black Lives Matter” are in a strong font front and center. Importantly, The Wing backs up its statement by making a financial donation to the cause and encouraging its readers to do the same.Subject line: Black Lives Matter

simple black lives matter email

Electric Literature

Electric Literature is another example of a great Black Lives Matter email that makes the content relevant to its audience. The email is organized with the most important information — Electric Lit’s statement condemning violence against the Black community — at the top. Next there are simple but attractive dividers to separate the rest of the content so you can easily scan and find what you’d like to read. The message doesn’t have an overt CTA. Instead, it quietly includes three buttons at the bottom for anyone who wants to click.Subject line: Read Black writers, now and always

good black lives matter email

Prose

Prose uses a muted color scheme and incorporates a few different fonts in this Black Lives Matter email. The white font is easy to read on the background colors and the quiet colors are appropriate for the message that’s being shared. Prose gets right to the main point of the email — Black lives matter — and encourages action from its readers.Subject line: A note to our community

black lives matter email to take action

B The Change

B The Change uses strong, powerful language to evoke a response from readers. Under its initial statement, the company follows up with several resources where readers can learn more or take action. We love the black-and-white images and text that make the green CTA buttons pop.Subject line: Let’s get to work tackling racism 

example black lives matter email

Tusk

Remember, with Black Lives Matter emails, simplicity is the best way to get this important message across. Tusk takes this principle to heart. From the subject line to the color scheme to the length of the copy, everything about this email is simple and basic. And because there aren’t any flashy design elements to detract from the copy, the message of the email truly stands out.Subject line: Black lives matter

simple email for black lives matter

Wrap-up: Black Lives Matter email templates

Now is the time to stand in solidarity with the Black community and send an impactful Black Lives Matter email from your brand. Choose a professionally-designed, mobile-responsive email template from the BEE catalog to send out this important message. By using Black Lives Matter email templates, your brand can add its voice to this historic movement and play a small role in making a difference.

Share this post with your friends! Pin it on Pinterest ?

Black Lives Matter Cover

3 Ways to Incorporate Retro Design into Your Email Marketing Campaigns

Retro design is making a comeback and is one of the top email design trends of 2022. According to The Designest, this wave of retro design includes elements ...
Emily Santos
Emily Santos
Apr 8, 2022

Retro design is making a comeback and is one of the top email design trends of 2022. According to The Designest, this wave of retro design includes elements from “Art Deco, Good Old ’90s, and 2000s Nostalgia.”

Design and Nostalgia

A simple explanation for why trends keep coming back, even those we wish never would, is nostalgia. People crave to relive the “simpler times” when they didn’t know what the future would hold and their worries seemed small. As marketers and designers, we have the power to use design to evoke that same feeling nostalgia creates: the warmth, the calm, the hopefulness.What does this mean for you?For one, making your readers happy is always a plus. When your readers connect with you, they are more interested in your content and will continue to read and look forward to the next message you send. They are also more likely to take action on what you’re asking from them. But even if it doesn’t get that far, you’re guaranteed to make a lasting impression because of how you made them feel.As technology and design advance, the human desire for something shiny, different, and new grows, but you can never go wrong with a little nostalgic design. Know your demographics to identify which era will resonate with them the most and bring them back to “the good old days.”

3 Ways to Incorporate Retro Design Into Your Next Email or Landing Page

Retro design encompasses various eras, each with its own unique elements. Because of this, the possibilities of what you can create are endless. Don’t be afraid to mix and match and make something memorable. If you’re unsure where to start, here are three simple ways to add a retro feel to your email design.

Color

Unconsciously, color plays a role in the way people feel, react, and make decisions about a brand and its product. In this case, color is the easiest way to communicate and illustrate an era that evokes nostalgia within your readers. For example, when you think of the 80s, what’s the first thing that comes to mind (besides leg warmers and leotards)?Perhaps the color pink, blue, or neon green?

retro color palette

You can use tools such as coolors.co, Adobe Color, and Pinterest to help you generate the perfect color palette for the era you want to recreate. If you’d create an 80’s feel to your next email design add the HEX codes in BEE Pro. You can also use this template by Veronica Medina.

Use this template in Beefree!

Use this template in Beefree!

Font

When it comes to retro design, there is just as much an emphasis on typography as color. The purpose of a font is to influence how the reader perceives and is affected by what you are trying. Take this example by RTRO. The “handwritten” font on the header paired with a monospaced font (inspired by the typewriter days) makes the email feel like a personalized note from RTRO to their reader. Use the Permanent Marker and Courier New fonts to replicate the same feel in your emails inside BEE Pro.

RTRO email design inspiration

Shapes and Filters

If you’re not sure where to start embracing this email design trend, try playing with shapes and textures! Depending on the era you are trying to evoke, this can look different, but don’t be afraid to experiment and mix and match. This template by Betina Todorova incorporates those fun, bold colors that remind us of the 80s/90s paired with hand-drawn pop art style shapes influenced by the 50s.

Use this template in Beefree!

Use this template in Beefree!

BEE Pro makes it easy to add a filter to images inside the editor. If you’re looking to double down on the vintage feel of your emails or landing pages, try adding the Vintage Filter and Noise to your images for a grainy/ film camera look

BEE Pro image filter setting

Ready to Create a Retro Email or Landing Page?

Start creating retro email and landing pages with BEE Pro for free. Using the tips we shared above you can customize any of our 1,300 templates to replicate the era you wish to illustrate.Have fun with it! Trends are meant to offer something different and memorable to your reader. When it comes to retro design, each era builds off the other. Don’t be afraid to experiment with different elements and try something new.If you need some additional inspiration, hereis our take on retro design. It is fully functional and ready to be used for all your email or landing page needs. Enjoy!

5 Inspiring International Women’s Day Emails

Originally published on Feb 19, 2020. Last updated March 7, 2022.International Women’s Day happens every year on March 8. Gender equality is an ongoing strug...
Beefree team
Beefree team
Mar 7, 2022

Originally published on Feb 19, 2020. Last updated March 7, 2022.International Women’s Day happens every year on March 8. Gender equality is an ongoing struggle that touches the lives of women and their families everywhere. This holiday is a chance to acknowledge the women in your community and be part of a global conversation that matters to your audience. If you're considering sending an International Women’s Day email, you should make sure it's thoughtful and will resonate with your readers. We've gathered some examples from brands that have done it right:

Gender equality is an ongoing struggle that touches the lives of women and their families everywhere.

Tell a story like Bumble and Bumble

Storytelling may be the most essential way we connect with each other. And that's true for brands as well as individuals. In this example, Bumble and Bumble did this by spotlighting a few of its employees. You could also take a slightly different approach by soliciting user-generated content from your customers, asking them to share how they use your product to celebrate International Women’s Day.Subject line: Celebrate International Women’s Day 

international women's day email

Keep it simple like Memebox

We’re slightly obsessed with this pink-and-white Memebox email. The graphic ferns and flowers around the edge make the perfect frame for the message. The copy is clever: “Let’s get ship done.” Create a similarly simple but beautiful email to showcase your products this International Women’s Day.Subject line: Celebrate International Women’s Day with free shipping

international women's day email example

Be both strong and feminine like Loft

The pastel color scheme and graphic flowers on this Loft email give it a feminine feel, but the strong font keeps the overall design from being overwhelmingly sweet. In terms of strategy, Loft cross-promotes its Instagram content and chooses a cause to support. Being clear on what you support, whether it's a holiday or a cause, increases brand loyalty; 84% of consumers are more likely to support a brand whose values align with theirs.Subject line: Celebrating women (today and every day)

international women's day email design

Share content and products like J. Crew

This sleek black-and-white J. Crew email shares an inspiring piece of video content before getting into the products the company has to offer. Your Women’s Day email is a great place to highlight relevant products — the apparel, gifts or other items that support the cause.Subject line: Celebrate International Women’s Day with us… 

women's day email

Promote action like Lululemon

As Lululemon points out, gender equality isn’t just important one day of the year. Encourage your readers to keep pushing for equal opportunities year-round. And like Lululemon, you can also create content that gives your readers actionable ways to do this. The links in the Lululemon email take the reader to a landing page with a podcast and a list of 364 ways to make a difference.Subject line: How will you spend the other 364?

international women's day email template

Wrap-up: Create your own International Women’s Day email

Ready to design your own email? We have the perfect International Women’s Day email template, designed by Galina Grahovska.

Use this template in Beefree!

Use this template in Beefree!

We also made aWomen’s Day email template that’s meant for fundraising events specifically. This template was designed by Martin Nikolchev.

Use this template in Beefree!

Use this template in Beefree!

Use these International Women’s Day email templates – along with all this design inspiration – to celebrate and encourage women all year round!

Dark Mode Design Best Practices

According to a 2020 study by Android Authority, 81.9% of participants use dark mode on their phones and 64.6% of participants expect sites and apps to automa...
Emily Santos
Emily Santos
Feb 28, 2022

According to a 2020 study by Android Authority, 81.9% of participants use dark mode on their phones and 64.6% of participants expect sites and apps to automatically apply a dark theme or at least offer the option. Popular email providers like Gmail and Outlook have already launched dark mode as an option for their users, changing the game for email marketers and designers. So, what’s the hype with dark mode? By turning light background colors dark (typically a shade of gray or black), it creates a new user experience that:

  • Enhances accessibility and reduces eye strain on those with light sensitivity.
  • Preserves battery life on devices by reducing screen brightness and using less energy. 
  • Offers a slick and cool dark interface that many prefer.

With the increase in user screen time, it’s clear to see why users want this option.It’s time for marketers and designers (I’m looking at you) to stop ignoring dark mode when designing. Taking the extra step enhances user experience, ensures that your content is accessible to all, and prevents your emails from being sent to the dark place - aka the SPAM folder.

The Cold Hard Facts about Dark Mode You Can’t Ignore

Dark mode is becoming the norm. Almost every email client has adopted their version of it and readers expect a consistent experience.

Your readers matter.

The number one rule for content marketers and designers is to put the audience front and center. Considering and testing how content looks in dark mode vs. light mode shows your readers that you care about creating a consistent, cohesive, and accessible experience for all.

Email clients are unpredictable.

Depending on the email provider, there are three different ways that email clients might change the look of your content:

  1. No changes at all: In the case of Yahoo mail and Apple Mail there is no impact on how emails are viewed. 
  2. Partial color invert: Email clients like Outlook only detect light-colored sections and turn them into darker colors. 
  3. Full color invert: This is where everything is inverted. All the areas with light turn dark and vice versa. This is the Gmail apps MO. 

It is important to make sure that designs are rendered as well as possible in both light and dark mode. If readers don’t recognize where the email is coming from, they will ignore it, delete it, and may unsubscribe altogether. This hurts your email deliverability in the long term.Take the extra step to ensure that your reader experience is consistent and enjoyable, regardless of their preferred mode.

How to optimize emails for dark mode

Designing for dark mode doesn’t have to be hard. Here are some of our best tips to start implementing today.

Avoid using true black

The high contrast between true black backgrounds (#000000) and true white (#FFFFFF) will make things more difficult to read, defeating the purpose of dark mode altogether. Instead, use dark gray (#121212) as the background color to soften the contrast.

Saturated Brand Colors

While your saturated brand colors look great in light mode, these colors are too bright and will affect readability.Before you run away, we’re happy to say there is no need to call your design team for reinforcement. Instead, have fun and experiment with a desaturated or muted pastel version of your brand colors.

Optimize Images and Logos 

For many email marketers, this seems to be the biggest challenge when it comes to optimizing emails and landing pages for dark mode, but again, it doesn’t have to be. Here are a few ways to optimize images and logos.

  1. Use a logo that uses a brand color that isn’t black or white. 
  2. If you have an image or element with a black background, add a white outline to improve its visibility and avoid it from fading into the background. 
  3. Ensure images and logos are PNG format with transparent backgrounds.
  4. Keep things minimal. Dark backgrounds can give the illusion of limited space so keep things simple to not overwhelm the reader. 

3 Dark Mode Design Examples

Are you a visual learner? Oh Good! We have a few examples of designs we love and why they work.Example 1: Apple Fitness AppThe Fitness app is a great representation of how using bold colors against black backgrounds is still possible without it being too harsh on the user. Dark mode shouldn't compromise the purpose behind the app. In this case, the final result is the same: it inspires movement and gets us excited to work out.

apple dark mode example

Apple Fitness AppExample 2: Notion AppTheis works because it exemplifies how dark mode shouldn’t hurt the essence of the product or the user experience. If anything, it enhances the experience altogether. Dark mode offers a level of sophistication and makes us feel fancy. All of these use different shades of gray to offer depth and create shadows without it feeling boring.

Notion Dark Mode Example

NotionExample 3: Google home screen

Google dark mode example

GoogleFinally, Google's dark mode offers a simple and elegant interpretation of dark mode. Notice that they don't use true black (the background color is #202124) and they differentiate the search and "I'm Feeling Lucky" buttons with a shade of grey (#303134). Everything else is white, so that CTAs are clearly readable.

It's time to stop ignoring the facts

Previously, email marketers and designers (looking at you again) have ignored the effects dark mode has on emails and landing pages. Partly because no one could have predicted how many users required this feature and partly because it seemed like a difficult task. We hope that we debunked that with this article. If we didn’t, then our apologies, but we want to offer you some hope.

The solution: Dark Mode Preview Toggle 

How can you adjust your email designs to account for dark mode? BEE Pro has the solution. Starting March 16, 2022, our email and landing page design suite will feature a new Dark Mode preview toggle that will help you create emails with dark mode in mind.By simulating how your messages display in dark mode, it will help you recognize and avoid main design issues that may occur when an email message is received by a reader that has dark mode enabled.

How to preview how emails will render in dark mode

Preview how your email will render in dark modeThis handy feature will help spot common “design mistakes” and ensure that you are creating cohesive and consistent experiences for your readers without limitations based on the mode they choose to use.We hope that you’re as excited as we are. If you’re new to BEE Pro get started for fee. You can also check out our HTML professional email and landing page templates and choose one that is dark mode friendly (refer back to our tips above).

Improve Email Deliverability with 3 Design Tips

Designers and email marketers both have the same goal: to create high-performing email campaigns. When emails are delivered to the SPAM folder, performance p...
Beefree team
Beefree team
Feb 1, 2022

Designers and email marketers both have the same goal: to create high-performing email campaigns. When emails are delivered to the SPAM folder, performance plummets. We recently covered the ins and outs of design x deliverability in an Instagram Live discussion with Jennifer Nespola Lantz.

 

View this post on Instagram

 

A post shared by 🚀 Design with BEE (@beefree.io)

In this article, we're expanding on an important topic discussed in our conversation with Jen: design choices can impact your ability to deliver your email messages to the inbox (i.e. your email "deliverability").

What is email deliverability?

Email deliverability is the ability to successfully land your messages in the inbox. You can have beautifully designed, perfectly optimized emails - but if nobody receives them, that’s not really going to matter.Many things affect whether your emails end up in the inbox or not, including the reputation of your FROM address (the email address that the message comes from), the reputation of the sending platform, and even more technicalities like email authentication.Those are all important and you should discuss them with your email service providers. But even if you're not techy, your choices can affect your email deliverability.

How email design affects deliverability

Let's assume that all the technical stuff has been taken care of. Are there other choices that affect your ability to deliver emails to the inbox? The answer is "yes".At the core, it's about engagement. Mailbox providers (like Gmail, Apple Mail, and Yahoo! Mail) want to make sure their users are having a good experience in their inbox. In other words, they want people to receive messages that they want to engage with. Design choices that affect engagement, therefore, can impact deliverability.Let's look at some of them.

(1) Don't hide the unsubscribe

It's a bit counterintuitive, but the best way to make sure your audience is engaged is to make it easy for them to opt-out. You're emailing people, not email addresses. Even if you do a great job at segmenting your audience and sending them content they care about, there will be those that no longer wish to receive your messages. Make it easy for them to unsubscribe.There are two fundamental reasons to have a visible unsubscribe link:

  • Spam complaints. If you make it hard to unsubscribe, your messages are more likely to be flagged as SPAM. That's a very strong signal to the mailbox provider that people do not want to receive your emails. If spam complaints rise, your likelihood of ending up in the SPAM folder gets higher and higher. In addition, your ESP may decide to stop sending your campaigns altogether.
  • Engagement score. If everyone on your list actually wants to be there, your overall engagement score goes up. If 200 people click on a link in your email out of 1000, that's a 20% engagement score. If you sent the same message to 10,000 people and the number of clicks remained the same, engagement would go down to 2%. Clicks are just one of the engagement signals that mailbox providers look at to determine whether customers care about that message, but you get the point.

For example, Dwell Magazine uses a clear, transparent design for the unsubscribe preferences at the bottom of their newsletter:

Clear unsubscribe options in email design

Here is another example from Netflix: notice that the unsubscribe link has the same size, color, and underline style as all other links in the section. There is no attempt to hide it.

Netflix unsubscribe link example

Apparel brand For Days, instead, wrote the unsubscribe in a font size that is so small that at first we didn't even see it. We love the design of their clothes, but they should reconsider the design of the email footer :-)

For Days unsubscribe design example

Similarly, Portuguese airline TAP chose to make the "Cancel Subscription" link almost invisible in their email. Not a good idea.

Cancel subscription link almost invisible

(2) Don't send image only emails

There are many reasons not to send emails that only contain images. Among them: they will not be seen when images are turned off, they're slow to download when the quality of the internet connection is poor, and they often don't render well on a mobile device. On top of that, they often get treated as SPAM by the inbox providers because spammers try to conceal text by using images. Spam filters typically consider that kind of message as high-risk and put them in the SPAM folder.The same is true for messages that includes minimal text (i.e. a very low text to image ratio).We cover this in details in Why you should avoid sending image only emails.

Example of image only email

(3) Be recognizable, fast

How quickly do you decide whether to read an email when you're browsing through your inbox? In an era of 8-second attention span, we take even less time to glance at an email and decide whether we're going to read it or not. It's crucial that your messages are easily recognizable, so your readers don't have to spend any of that short attention span figuring out who is sending them the message.One way to do this is to use a recognizable, consistent FROM name and email address. This not only helps your recipients recognize you, but it also helps you build a reputation with the mailbox providers. The alternative is problematic: the more you change things, the more uncertainty is created and the more difficult it is for Gmail & Co. to decide that the incoming message is to be trusted.For example, task automation company Zapier has been sending blog updates from "Deb at Zapier (blog@zapier.com)" for some time. This adds a recognizable human element for the recipient ("Deb"), while creating consistency for the mailbox provider (the FROM email address has been "blog@zapier.com" for a long time).

Recognizable FROM address

Equally important is to employ a clean, brand-focused, consistent design, especially when it comes to transactional emails (those are emails that you would never want your customers to flag as SPAM and not receive.) For example, Google uses a clean, minimalistic, on-brand design for security alerts: font, colors, logo, links...everything is quickly recognizable.

Example clear branding on transactional emails

Wrap-up: email design does impact campaign deliverability

The choices you make from a design point of view can impact your ability to deliver emails to the inbox over time.Make sure that:

  1. You don't make it difficult for people to unsubscribe
  2. You have a good balance between text and images
  3. Your customers can quickly recognize your messages

With BEE Pro, you can quickly design emails that perform well. You can also create and save all sorts of different email footers with clear unsubscribe links, and then re-use them quickly when you need a specific one for a newsletter or promotional campaign.Get started by checking out our free email template catalog

Top Email Design Trends For 2022

Email design trends are always changing and smart design moves last year might not be what put you ahead of the pack this year. As you step into 2022, make s...
Emily Santos
Emily Santos
Jan 31, 2022

Email design trends are always changing and smart design moves last year might not be what put you ahead of the pack this year. As you step into 2022, make space for growth by staying open to new ways to engage with your customers and prospects.Keeping up to speed with email design trends will strengthen your email marketing campaigns and allow you to consistently stand out in the inbox. Here are email design trends to expect in 2022.

6 Email Design Trends for 2022

As email design continues to evolve, be sure to keep up with trends so your marketing campaigns stand out amongst your competitors. Take note to get ahead on your 2022 campaigns with these 6 key trends.

Optimism and lightheartedness

After enduring years of restrictions, lockdowns and masks, it's time to bring fresh air and fun into our email designs. Take a look at the colors and gradients you're using. What emotions do they evoke? What stories are you telling in email? At the end of the day, we’re designing for the humans at the other end of the screen.

Dark Mode

According to a poll by Android Authority, over 90% of users use some type of dark mode on their mobile devices. Dark mode is growing in popularity, as it makes for a less eye-straining reading/working experience. Plenty of devices - both desktop and mobile - allow for an easy switch to dark mode. The days of choosing between a light design and a dark design are over. Make sure you optimize every design for both.

Mobile Design

Optimizing your email designs for mobile devices is becoming more and more important every year. Tests have found that 42.3% of people will delete an email if it’s not optimized for mobile. As new tools evolve to enable detailed responsive design, keeping  mobile design trendstop of mind is a must.

Animations

Emails are expected to become more interactive and animated in 2022. As our technology continues to evolve to enable larger image files, we’re able to bring in designs that are more eye-catching and exciting for subscribers. Add more GIFs and scroll animations to your list of bold email design ideas.

More personalization

Adding to the beginning of your email no longer counts as personalization. A truly personalized experience calls for segmentation, merge tags and crafty use of customer data. Examples like Spotify Wrapped have changed the game for what customers expect to find in their email.

Spotify wrapped

Artificial Intelligence

AI is no longer in the distant future. In fact, it’s already here. If the aforementioned trends feel overwhelming to you, enlisting the help of AI-powered tools may be the answer. AI can help craft subject lines, choose color pallets, and even deliver customized content to your customers.

2022 Email Design Trends with BEE Pro

Now that you have a leg up on email design trends headed your way in 2022, it’s time to take advantage of them. Start designing your emails with BEE Pro to optimize your designs so they’re ready to outstand the competitors in the inbox.Our drag-and-drop builder gives you the creative flexibility to design faster and export emails straight to your email service provider (ESP). Design from scratch or choose from one of our templates in our catalog of 1000+ templates. Start your free trial here.

How to Create a Landing Page in 10 Easy Steps

Designing a landing page is a lot like putting a house up for sale. You stage the place, take eye-catching pictures, and list it in hopes of achieving one go...
Emily Santos
Emily Santos
Nov 9, 2021

Designing a landing page is a lot like putting a house up for sale. You stage the place, take eye-catching pictures, and list it in hopes of achieving one goal: Selling the house.In the same way, a well-designed landing page gets you to a focused goal: Getting your customer to click on the CTA. Just as you would stage your house for the big sale, you have to make sure your landing page is designed with elements that will entice readers and lead them to click.You don’t need expert-level design skills to achieve a high-converting landing page. Narrowing in on the quality of your content and landing page design elements is a sure way to attain those big results.Are you helping your target audience and meeting their needs? Are you intriguing your customer base to the point of conversion? Think about these questions as you follow along with this step-by-step guide to start designing landing pages that convert.

Know when to use a landing page

Before we go any further, let’s pinpoint if a landing page is the right asset for your goals. Identify what type of page you want to use before you begin designing. Do you need a website or a landing page to achieve your goals?Use a landing page when:

  • You have one focused goal to achieve
  • There are few distractions and one CTA (Call-to-action: The action you want your customers to take)
  • You need to include sign up forms, lead initiating content, sale promotions

Use a website when:

  • You want to explain multiple goals and provide in-depth details
  • There are plenty of info regarding different goals and multiple CTAs
  • You need to build brand awareness and teach customers about your product

Now that we confirmed we need a landing page, you’re ready to jump into the design steps.

Use this template in Beefree!

Use this template in Beefree!

How to build a landing page in 10 easy steps

Landing pages are supportive tools for your business. They work to achieve results like building your email list or driving purchases. Building a landing page requires you to identify the purpose of the page and then implement design elements that align with that purpose. Now let’s get into the nitty-gritty of the design process.

Decide on a campaign goal

By definition, landing pages have one focused goal. Before designing your landing page, determine what your goal will be. Is your landing page going to:

  • Drive sales? Display a specific product where the CTA leads straight to the shopping cart.
  • Boost conversions? Have a clear path to conversion that builds brand awareness.
  • Generate Leads? Grow faster by offering a product demo, free downloadable resource or sign up form.

Once you’ve decided on your campaign-specific goal, choose the template layout that fully supports your goal.

Plan your landing page layout

Your layout is what guides subscribers to achieve the goal of your landing page. The perfect landing page will have a visual hierarchy and includes a headline, your offering, an explanation of the benefits, visuals, a CTA and lead-capture forms.The visual hierarchy of your landing page content will do some of the legwork for you. It creates a natural, easy-to-read pattern for subscribers, which clarifies what action you would like them to take. The F-pattern or Z-pattern layout is recommended for a smooth read.

Also, always remember to prioritize content above the fold. This means that the most important content will be visible instantly upon opening the landing page. Important information and your CTA need to be front and center before you dive into more details.This technique is like a first impression, it gives visitors a quick look at what you have to offer before they scroll, which helps increase conversions faster. It’s also a way to be respectful of a visitor's time.

Write your concise copy

The copy is the driving force of your landing page. It’s how you entice visitors with your offer and communicate the benefits of why your product or service is worthwhile. When writing copy make sure to:

  • Develop a clear headline. State your offer and how it will benefit your visitors. Keep this short and concise.
  • Bring it back to the customer. Simply stating all the highlights of your product/service doesn’t help your visitor. Share the benefits, details and how this is going to help visitors in the short and long term. 
  • Don’t get too technical. Cut the technical jargon and make it simple for visitors to understand what you have to offer. 

Get straight to the point with your copy. Be clear about your explanation of why and how your offer will help customers and meet their needs.

Create your CTA

The CTA is the action you want visitors to take on your landing page. It’s the conversion-driving component and it should be crafted carefully. When designing your CTAs be sure to:

  • Prioritize a main CTA. Having one CTA is best for your landing page, but if you are including more than one, make sure your main CTA is larger and above the fold for visitors to clearly see and be drawn to.
  • Be descriptive. The copy you use inside your CTA will dictate if visitors care to click in or not. If you keep the copy vague, visitors will be less likely to click. Use specific language like, “Start your Free Trial” or “Add to Cart”. 

The simpler the action, the more likely visitors will take that action. Concise copy and visible CTAs is the key to converting visitors.

Choose your images/visuals

Include images that your visitors will connect with on an emotional level. Customers should be able to relate, laugh or feel comforted by the imagery you use. For example, use pictures of dogs if your product/service is related to dogs, or with skin-care products use images of people using your product or close-ups of skin before and after using your product.It all depends on what your product or service is, but make sure to be mindful of the visuals you use for your landing pages. Images that create a more personable experience are what will get customers to buy.For your landing page use images that are personable, emotional and make sure they are optimized. They should also support the copy and other components of your landing page. 

Plug in your design elements 

Stick to the visual hierarchy when you start plugging in your content. This is the best way to limit distractions and ensure visitors will read your content. Use one of BEE’s landing page templates or start from scratch and drag and drop content blocks to make your own template.Be sure to match the landing page with the rest of the assets you create. Visitors and subscribers should be able to recognize your brand when reading your content.Last, be sure to optimize for mobile, and this is made easy with our Mobile Design Mode. This allows you to switch between desktop and mobile view while designing and it will ensure that your content renders on all devices.

Integrate with tracking tools 

Integrate your landing page with Google Analytics and your CRM platform to analyze page performance. See what components are working and not working through this tracking and rework based on that info.It’s also helpful to set your custom domain (with a BEE Pro Agency or Enterprise plan). This is a sure way to raise brand awareness and customer credibility.

Double-check everything and then hit publish

Before publishing your page make sure to:

  • Check the copy
  • Solidify buttons and forms
  • Confirm that you’re focused on one goal

Make sure every component of your landing page is working properly to avoid any issues once it’s published.

Reel in traffic

Now that your landing page is live, it’s time to boast about it. Share your page through:

  • Email marketing
  • Social media handles
  • Social or pay-per-click (PPC) ads

These techniques are the best way to target different audiences and increase conversions at a faster rate.

Improve landing page with A/B tests and optimization

Keep an eye on your landing page. If certain components aren’t achieving their intended purpose then try implementing it in a different way. This could be through changing the copy, the CTA color or any other element that could use some tweaking.Test new elements and optimize everything to make sure the conversions continue to increase.

Use this template in Beefree!

Use this template in Beefree!

How to build a landing page: Expert Insights with our Design Community

Now that you have reviewed each step of the design process and know how to create a landing page, it’s time to run through some insider design tips. Two of BEE’s freelance designers, Betina Todorova and Navid Nosrati blessed us with some expert advice on how to truly make the most of your landing page designs. Let’s take note:

The essentials

Betina: 

  • Define your purpose/goal. 

“The purpose of a landing page is to guide the user to achieve a specific goal, not just roam around your website. A landing page goal like signing people up for a webinar or getting them to subscribe to something. An important part of achieving this goal is to offer an incentive.” 

  • Structure your landing page (hero, body, CTA and footer).

“A hero section is where you have your headline/offering/value proposition,subheading and first CTA.In the body you have to build trust. You can put things like your USP (unique sellingpoints), social proof, reviews, customers you've worked with, etc. This is where you can also offer an incentive to help make up user's minds. For example if your goal is to sign up people for a webinar you can offer them a downloadable mini e-book.Then it's time for your finalCTA. This should be presented in a very clean and precise way so the user knows exactly what to do.”

Navid: 

  • Be purposeful about your layout.

“Having an asymmetrical balance on a page plays a main role. The purpose of a landing page is to create conversion and to do so the page needs to be designed in a way that leads the visitors to different sections of the page.”

  • Understand the weight each element carries and craft accordingly.

“The hero section has to have a clear value proposition and explain to visitors what's in it for them—this needs to be very powerful. Then, a strong call to action. We must tell visitors exactly what they need to do, for example: Click Here, Start For Free, Sign Up Here.And the most important part of a page is the visuals. We want to always show the visitors an image, and that image needs to be very clear and hopefully explain to them what they’re going to get. Normally, I design the images in a way that matches the header of that section so if the visitors are just scrolling without reading by looking at the image they still understand what that section represents.”

The nitty-gritty details

Betina:

  • Create a visual hierarchy.

Hierarchy is important, as this will guide the user along the page. The design of a landing page should be clean, not cluttered with 2 or 3 fonts max.”

  • Include an accent color.

“In your color palette you should have an accent color. Save this color for your CTA to draw attention. Many people make the mistake of using their accent color everywhere and this results in users leaving the page because they're not sure what to do. Also an accent color doesn't have to be bright/neon to draw attention. It just needs to have high contrast from the background color to stand out and not be the same as the copy text for example.”

Navid: 

  • Storytell with a Z-pattern technique.

“Look and feel is quite important. As a designer, my goal is to create a landing page to build trust and offer the visitors a great user experience. I most often use the Z-pattern technique to design my landing page, which is used for pages that follow the storytelling aspect.”

  • Be intentional about each specific element.

“In my designs, I always include:Typography hierarchy: Headlines (no more than 6 words), sub-headers  (compliments the header but does not repeat the wording and no more than 100 characters), and use bullet points (skim-friendly).Call-to-action: Exhibit value of CTA. For example, having a CTA like "Start Now For Free,” provides trust to visitors that they can start using or testing the product without paying.Visual: Images (not complex and evoke emotion), color palette (complementary colors, good contrast ratio and accessible to visually impaired visitors).Social proof: Builds immediate credibility and leverages the bandwagon effect (testimonials or reviews).”

The common mistakes to avoid 

Betina:

  • Too many CTAs, excess information, poor quality images.

“I think a few mistakes that are made are adding multiple CTAs, too much irrelevant information makes it difficult for the user to navigate the page. Also having a lot of menu items that lead to other pages and poor quality images that aren’t optimized.For example, check out Netflix’s site. Their sign up page doesn’t have any menu navigation. So you basically have nothing else to do other than to sign up.”

Navid: 

  • Inconsistent, broken or unstyled elements.

“Having inconsistent, broken or unstyled elements can be really hurtful to the landing page because visitors will see that and subconsciously doubt your brand.Another common mistake I often see is the designer of the page tries to show everything that they have to offer which can be overwhelming. The landing page is a very specific page with a very specific goal therefore it needs to be clear to the visitors and on point.”

Use this template in Beefree!

Use this template in Beefree!

Create landing pages with BEE Pro

Now that you’ve got the steps on how to make a landing page and collected some expert insight, you’re more than ready to design a professional landing page. Head over to BEE Pro to start from scratch and try the step-by-step guide, or quickly input your content into one of our beautifully designed page templates (some created by Betina and Navid).Also, be sure to set your custom domain with BEE Pro. An Agency or Enterprise Pro account allows you to personalize your published landing pages by using your customized domain for a more on-brand experience. Learn more about this here.

How To Design Landing Pages That Convert

Thoughtful content connects with your target audience and guides them to complete a specific action. Whether that action is to subscribe, purchase or review ...
Emily Santos
Emily Santos
Oct 15, 2021

Thoughtful content connects with your target audience and guides them to complete a specific action. Whether that action is to subscribe, purchase or review a product or service, a landing page serves as one of the best content forms to truly drive home conversions.At the core of a landing page is one defined intention. This intention or goal is more specific than only driving sales, it’s typically how you want to demonstrate value for each specific campaign: How can you show up for your customers and guide them towards a genuine solution to their problem? Once you narrow in on your goal, build a persuasive strategy and design the landing page to support that strategy: Why does your solution matter and how do you get customers to trust that it does?Understanding customer needs is the first step to creating an optimized landing page. Once you solidify that knowledge, you will be able to design and piece together your landing page elements that are geared towards customer personalities and interests.Let’s take this step-by-step so you can successfully craft a high-converting landing page.

What is a landing page?

A landing page is a standalone web page that serves one focused goal. In digital marketing, this is where your visitors end up or “land” after clicking on a link from your emails, social ads, or digital promotions. The best landing pages are campaign-specific and guide your visitors towards a CTA button.While normal web pages and your website showcase several different goals and allow visitors to explore,landing pages stay laser-focused on one goal: pushing visitors into the next step of the buying cycle. Depending on the stage they are on, this may be capturing leads, converting browsers into buyers or creating repeat buys.With a single CTA and the inability to explore the web page, the landing page is your best bet to increase conversion rates and lower costs of acquiring leads due its clear and direct mission.

Use this template in Beefree!

Use this template in Beefree!

What is the difference between a landing page and a website? 

While the terminology seems similar, a landing page and a website have different makeups. Deciding on which to use will ultimately depend on your objective for creating the page.A landing page has one focused goal, and that is to convert visitors into customers. It will have the visitor fill out a sign up form, or simply click on a specific CTA. It partners a website but is used for a specific promotion, event or offering.However, a website is what finalizes the conversion. It gives visitors an opportunity to explore the offer in depth through other offerings and explanations. Here’s a quick breakdown of the differences:

Landing page vs. Website

website vs. landing page

(Website)

website example
landing page

(Landing Page) 

Benefits of a high-converting landing page

Landing pages that convert are highly valuable for your business. They work to advance your visitors along in their buying journey. Some benefits of effective landing pages include:

  • Driving conversion rates
  • Providing actionable data tracking
  • Building credibility
  • Increasing search traffic

These are only a few of the reasons why you should develop landing pages for your campaigns. Keep reading to find out how to create a high-converting landing page.

What are the key components of a landing page? 

Developing a high-converting landing page comes down to a clear formula. Honing in on your landing page development, design and follow up that will make or break the momentum of your landing page. Depending on the type of page you plan to design, your elements will vary from each form. Follow along with this list to develop a page that increases those conversions:

A solid CTA

  • One/few CTAs
  • Visibility - clear, it stands out
  • Placement - above the fold

To-the-point copy

  • Compelling/catchy header and descriptive subheaders - aligned with other copy
  • Short, concise, informative and customer-centric
  • Considerable offer that communicates value 
  • Emotional triggers
  • Benefits and pain points - write content with your goal in mind
  • Strong grammar and spelling

Optimized design

  • Align the elements
  • Use white space to your advantage - spread out your content, and make it easy for customers to find your CTA
  • Add brand personality but don’t overload
  • Zero distractions - simple, focused design
  • Bullet point copy for a lighter design appearance

A single defined goal

  • Understand the purpose and intention of your landing page - clear message and defined goals
  • Customers come first - focus on the offer not who you are as a company. Speak and design for your target audience

Eye-catching imagery

  • Engaging imagery - images/multimedia
  • Videos 

Reviews/Testimonials

  • Customer feedback and support
  • Credentials and promises

Unique value proposition

  • What do you stand for?
  • What makes your company, product or service different from the crowd?

What are best practices for a high-converting landing page? 

Keep forms short

  • Know what specific information you want from potential customers
  • Showcase your data security badges so customers trust your brand

Promote on social media

  • Take advantage of PPC ads
  • Leverage your social media and post landing pages to those platforms

Automate

  • Ease the day-to-day by automating your landing page shares from the get-go

A/B test

  • A/B test your design components and personalized copy on each landing page you create
  • Check your metrics - pay attention and measure to know what to change and how to improve for more conversions on your next landing page

Follow up

  • Thank your customers
  • Give access to your other marketing channels 
  • Follow up by letting customers know how to reach you

7 Types of Landing Pages that Convert

With one set intention, landing pages cut out all distractions and lead your customers step-by-step through the buying process. Each page you use throughout your sales funnel plays such a crucial role that works not only to drive the final sale, but to also genuinely help your customers face their challenges and find their solutions alongside them.Kath Pay, CEO at Holistic Email Marketing, explains that our drive should be to help customers not just sell to them. She says that, “Good marketing is helpful marketing. Customers are subscribed to you for a reason, so make their conversion as easy as possible. Don’t put barriers in front of them.”A 404 landing page is just as important as a lead capture page because they all direct customers towards content they need. Include each of these landing page types to effectively help your customers and remove any barriers from their buying experience.

Lead capture page

A lead-capture landing page is created to collect leads through a data capture form. This page encourages or incentivizes customers to fill out the form with their information to gain some sort of reward in return. It’s a win-win, your customer gets something they want and you get the conversion.When to use this page: Mid-sales funnel —Where your customers have learned about your product and are now evaluating if what you have to offer is a right fit for them.

Use this template in Beefree!

Use this template in Beefree!

Squeeze page

Similar to the lead-capture page, the squeeze landing page is another form-based page to collect data. They are used to gather email addresses from potential customers. A squeeze page needs to quickly get straight to the point with a bold headline, a clear CTA, an exit option and links to next steps if they decide to move forward.When to use this page: Top of sales funnel—Where you gather leads through bare minimum information (the email address) to create an email list.

Use this template in Beefree!

Use this template in Beefree!

 (Easily delete content to simplify the landing page) 

Splash page 

A splash landing page is a simple version of a landing page where an announcement or special offer is provided. There’s no data collection, it's simply about giving potential customers information. The splash landing page should have a clean layout with a clear CTA, minimal copy and few images.When to use this page: Any time in your sales funnel—Where you provide customers with general information before they end up on your main website.

Use this template in Beefree!

Use this template in Beefree!

 (Easily delete content to simplify the landing page) 

Sales page

The sales page is a landing page where you convince your customers to make a purchase. These pages are often touchy with design because it’s best to thoroughly understand your customers before finalizing any of the copy or design elements. If you push too hard or not hard enough, you could lose the sale. Your page length will depend on the details of the product or service you’re providing. Whether it be a small push with quick bullet points of benefits or a page filled with extensive info, make sure your push is backed by your intentions and clearly represents your value proposition.When to use this page: Bottom of sales funnel—Where you push visitors to become customers and make that purchase. Convincing people to buy from you is difficult so design with clear intentions.

Use this template in Beefree!

Use this template in Beefree!

404 page 

A 404 page is a safety landing page and pops up when the page customers landed on was not found. The error, “Page not found,” should be stated and then should offer a solution. That way, customers won’t simply exit your page, the solution will guide customers to an alternate form of assistance or page. Focus on keeping the mood light here by using funny copy, memes or other humorous content that your customer base will respond well to.When to use this page: Any time in your sales funnel (safety net)—Where you give customers the option to head to your website or other pages that will assist their needs. This shows that you care for their experience as a customer and want to help them in ways you’re able to.

Use this template in Beefree!

Use this template in Beefree!

(Customize design to fit 404 page standards) 

Unsubscribe page 

An unsubscribe page is a landing page where customers are able to opt-out of receiving your emails. It’s considerate to set this page up to show customers that you care about how you engage with them. Don’t feel discouraged by an unsubscribe page. Use this page as an opportunity to re-engage. Provide options to understand how frequently customers want to receive emails from you, or offer something of value like a tutorial on how to work with your product.When to use this page: Any time in your sales funnel (safety net)—Where you have the opportunity to gain insight and survey your customers. Try to understand the reason as to why they are leaving you and how you will be able to win them back and build trust.

Use this template in Beefree!

Use this template in Beefree!

(Customize design to fit unsubscribe page standards)

Thank you page

A thank you landing page is a great way to show appreciation of your visitors and customers. They are perfect for creating and nurturing your leads and should include a survey, customer feedback box or where you simply thank customers for making a purchase.When to use this page: Any time in your sales funnel—Where you thank your customers and then incentivize them to come back and purchase more or click further to learn more details.

Use this template in Beefree!

Use this template in Beefree!

(Customize design to fit thank you page standards)

Landing pages that convert: Expert insights with Emily Ryan

Now that you understand the importance of landing pages to support and drive conversions for your marketing campaigns, let’s open the conversation to an expert in the field.Emily Ryan, MailChimp PRO Partner and Digital Strategist, shared her thoughts on landing page best practices to thoughtfully drive conversion rates. Follow along with Emily to nail down your high-converting landing page for future campaigns:

Considerations before creating your landing page

Before you start designing your page, you need to understand what your main goal is for the page.

  • Is it to get more subscribers or clicks on your product?
  • Or offer a discount? 

Nail down your goal and then start to work backwards on how to get to that goal.You always want to consider your Audience too. 

  • Who is your landing page for? 
  • What do they like and want? 

If you understand your ideal customer then you can build a great page for them. Keep the tone natural and not too salesy. Write your headings/sub-headings as if you're writing to one person in your audience. 

Best landing page design elements 

A great landing page has a few important elements. Most importantly, it has to be easy to read and understand. Think 8th-grade reading level. You should have:

  • A strong headline
  • Simple body text/copy
  • Great images

You also want your landing page to flow naturally and not feel like you're selling. The simpler, the better. A great headline with a beautiful image and a big button can do wonders! 

Benefits of  landing pages that convert 

The benefits of a great landing page are that it increases conversions — whether that's more sales or more subscribers. A landing page is a simple and effective way to reach your goal without having to build an entire website. I often say that a landing page is like a one-page website. They take little time to create and can have massive ROI. They're also incredibly useful when you have a simple offer and a strong CTA. A single page lets you focus on one goal instead of many. 

Key takeaways

Simple is always better. Make it super easy for people to understand your offer and then click on your button. Landing pages do not need to be long or have a lot of copy. A great image and strong headline can do the trick -- so don't overthink it. Stay clean and simple and remember to make that CTA button stand out!

Design landing pages that convert with BEE Pro

An effective landing page will ultimately do two things:

  1. Focus in on one focused goal 
  2. Turn visitors into customers

When designing your landing page, think about how you want your customers to engage with your content. Follow along with the key design best practices and get creative in a way that’s going to intrigue your distinct customer base. BEE Pro offers a collection of professional landing page templates to customize to fit your specific brand needs.Adapt different elements to optimize landing page conversions, and be sure to take advantage of extensive features like Mobile Design Mode, co-editing and more. Try it out here.

24 Ideas for School Newsletters

As summer winds down, prep time for the busy year ahead comes ever nearer. Before you know it, it’s time to start getting back into touch with teachers, pare...
Emily Santos
Emily Santos
Aug 6, 2021

As summer winds down, prep time for the busy year ahead comes ever nearer. Before you know it, it’s time to start getting back into touch with teachers, parents, and students. Get a head start on the school season by developing an engaging school newsletter to connect with your community.Regular newsletters with high open rates indicate that your communications are being viewed. Newsletters also foster transparency and trust by ensuring that everyone receives the information they need. But with all of the competition for attention, your school newsletter runs the risk of being missed, or even worse, hitting the spam folder.Education-related emails sit at an average open rate of 34%. To meet or exceedthis benchmark, we recommend that you implement the following best practices, draw on inspiration from example templates and use these ideas to engage your community.

School newsletter best practices

Sending a school newsletter will benefit your community. You’re providing them with essential information, crucial updates, and exciting news to circle them into the conversations that are happening. How can you make sure that these important messages don’t get deleted? Start with best practices to captivate attention.

  • Don’t overload with content. Less is more. Focus on the value of your content and narrow in on 2-3 main points to hit in each school newsletter. Overloading your emails with information is a sure way to end up in the archives. Many teachers, students, and parents appreciate a more concise email that brings value. Keep things simple and get straight to the point.
  • Design for mobile. Optimizing your school newsletters for mobile is crucial since nearly 50% of email opens are coming from these devices. With parents, teachers, and students constantly on the move, desktop design has taken a backseat. Your community needs information fast and at your fingertips to stay up-to-date with  changes and events.
  • Personalize. Apply personalization strategies to your emails to increase engagement and hear more feedback on your school newsletters. Take advantage of personalizing the subject line by using a first name or nickname that your subscriber goes by. Also, assure that the content you are sending is relevant to your desired subscribers. If they don’t feel connected with the content you are providing them with, rethink your purpose to reframe the desired plan and outcome.
  • Find the best time to send. Consider optimal times to send an email before choosing when to send an email. Your day, time, and frequency needs to cater to your subscribers and their schedules. Students read their emails at different times than teachers and teachers may read at different times than parents. It’s all relative to their schedule and interest in what your school newsletter has to offer. A great way to ensure that your school newsletter is reaching your subscribers at the best time is to ask your subscriber list. The goal is to provide value, so quality over quantity is the goal. 

Ideas for teachers 

As a teacher, enhancing your students’ knowledge and creating the best learning experience is a top priority. But you have an array of other responsibilities as well, like keeping parents informed about what their kids are learning by showcasing some of their work.If you’re planning on staying up to date with informing both students and parents, then using teacher newsletter templates is the best way to quickly initiate that line of communication. These examples will help you get started with brainstorming what to include in your school newsletter.

Newsletters for students: 

  • Field trip or class events: Share details on the upcoming events that your students will be able to look forward to.
  • Get involved: List volunteer opportunities and other ways to get involved with the community.
  • Important dates: Include a class schedule, syllabus or any crucial dates students need to remember and prepare for.
  • Self-care: Share mental health-related info. 
  • Book recs: Include a list of book recommendations/book of the month.
  • Meet the student section: Create a meet-the-student section where you ask a student a couple of questions that the class may not know about them and then feature them in the school newsletter. 

Newsletters for parents: 

  • Meet the teacher: Students are back to school and it’s made parents curious as to who’s going to teach their child all year. Send a brief description along with fun facts about you so they can warm up to you before the school year begins.
  • Supply wish list: As a teacher, you aren’t provided with many supplies or money for supplies to have a fully functioning classroom environment that would create the best experience for students. Include a list on your school newsletter to encourage parents or community members to donate supplies.
  • Contact info: Send your info and ask for theirs in return to initiate a line of communication. 
  • Pictures: Parents love to see pictures of their kids, especially in school while they are away from them. Add pictures from school trips or in-class activities - they will love to see their kids in action
  • Important dates: Keep parents informed of what their children are learning about and when. 

Ideas for college departments and career centers

There are endless opportunities when it comes to college newsletters due to the diversity of the student population. Advance your newsletter by sharing valuable info that can apply to different sectors of the student body. We’ve got you covered on ideas for your college newsletter.

  • Freshmen: Give freshmen the inside scoop on all the exciting things taking place on-campus; include tips on how to study and even an advice section from upperclassmen.
  • Writing Center: Throw in top writing tips or advice for students to read and apply in their next essay, this is useful for undergraduates and graduate students. Include the hours of the writing center and how students can make an appointment as well.
  • On-campus events: Talk about upcoming concerts, free giveaways, educational forums, fundraisers and other exciting events going around on campus.
  • Clubs: Share details about new clubs on campus and how students can join.
  • Athletics: Share the athlete of the week, team events/game schedules, and helpful material on collegiate athlete health and wellness. Even include pump-up quotes and tail-gate details to get more students involved in supporting college athletics.
  • Alumni: Stay connected with alumni through a creative newsletter that excites them. Invite them to school events and even include a spotlight feature to share their story and successes they've achieved post-college to inspire other students and to build a bridge of communication between undergraduates and alum professionals.
  • Career center: Share interviewing tips, job/internship opportunities, job/internship fairs, and insight from professionals to help guide students towards their dream career.
  • Department-specific: From psychology to chemical engineering, different academic departments will reach their students in different ways. Include department-related club info to encourage students to join or share a schedule for career planning lunch-in sessions with industry professionals.

Ideas for school districts

Districts have plenty to manage when it comes to keeping a constantly flowing stream of internal and external communications with teachers, students, and parents. Preparing school newsletters to reach each desired audience is overwhelming due to the abundance of content. Check out these ideas to better your school newsletter communications.

  • Staff meetings: Schedules and recaps of what was said, or information on new curriculum implementations can be included here. 
  • Tips: Provide insightful tips that teachers can use and take advantage of, for instance like organizational tips.
  • Events: Organize and include info about school supply fundraisers or other initiatives to help equip teachers with the resources they need to be successful OR inform parents with details about the next back to school picnic or community events throughout the year. 
  • Faculty honor roll: Spotlight teachers or staff that have achieved success inside or outside of the classroom to further their connections with one another.
  • Updates: Include info about new changes or happenings with the curriculum or other details that may affect teachers or students.

Key Takeaways

School newsletters throw a line of communication to teachers, parents, and students to build more of a human-to-human connection amongst such a large body of people. Evaluate your content to provide more value. This will increase your subscribers and that connection you are working towards.Include some of these newsletter ideas in your next email, and remember to:

  • Design for mobile
  • Keep content to a minimum for each email
  • Personalize the information
  • Find your email cadence (time, date, frequency) 

Design with BEE Pro and apply some of these inspiring ideas to your next school newsletter to better support your community.

Designing for Conversions - Principles for Success

Visual design is all about making things pretty, right? Not quite. When it comes to digital content like emails and landing pages, design brings much more to...
Beefree team
Beefree team
Jun 30, 2021

Visual design is all about making things pretty, right? Not quite. When it comes to digital content like emails and landing pages, design brings much more to the table than superficial aesthetics.Designing for conversions has the power to turbocharge KPIs like open rates, click through rates and, ultimately, revenue. In one A/B test conducted by Hubspot, just changing the CTA button color from green to red boosted conversions by 21%. Talk about low-effort, high reward.Of course, designing for conversions goes much deeper than choosing the right color. It’s an almost psychological practice that starts with deeply understanding your customer and ends with...well, it never really ends.

Principles for designing for conversions

At its core, strategic design is a dynamic process that builds on user research and response. There are no one-size-fits-all rules and no such thing as a perfectly optimized campaign. In other words, just because Hubspot’s audience prefers red CTA buttons over green, doesn’t mean yours will. And even if green wins out in one of your campaigns, that doesn’t mean it’ll work for every campaign moving forward.There are, however, best practices for optimizing design for conversion. Strategically design your emails from header to footer using these three principles.

Determine your purpose 

Like most good things in life, designing a good email starts with defining a goal. “If you can’t answer the question, ‘Why am I sending this email?’, then don’t send it,” says email marketing consultant Jordie van Rijn.After all, it’s impossible to design for conversion if you aren’t exactly sure what it is you want to convert your audience to. Visual hierarchies, imagery and CTA buttons can only be determined after you decide on an end goal.Before you start creating something new, ask yourself what action you want your audience to take. Be careful about assuming that every email is about selling. The customer journey consists of many steps and sometimes the action that you need your customer to take is more nuanced than “buy now”.Reasons for sending an email (that aren’t selling): 

  • Nurture your audience
  • Re-engage your email list
  • Prevent churn 
  • Onboard customers
  • Confirm transactions

Even if your primary goal is to sell, your email’s function is to get the customer to a landing page where they can learn more about your product or service. That may seem like a small shift, but it provides the clarity needed to streamline your design process.

Know your audience (and your competition)

It’s great to stand out in the inbox, but sending an email that feels too unfamiliar will result in confusion.Audiences convert when they understand what’s going on. For that reason, it’s vital to do your due diligence to find out what they already receive in their inbox. Is it mostly image-based or text-heavy? Minimalist or bold? Short and sweet or multiple scrolls?Knowing which design elements your audience is most familiar with allows you to pick and choose what to imitate and where you can differentiate.It’s also vital to know where and how your audience opens their emails, both in terms of mobile vs. desktop and which email service provider they’re likely to use.Responsive design guarantees that your email will render in most environments, but that doesn’t necessarily mean the email will be optimized across the board. It also doesn’t consider that consumers use different devices for different purposes.For example, while the majority of emails are likely to be open for the first time on mobile, consumers still prefer to make purchases on desktop or laptops. And if an email is read on mobile and then read for a second time on desktop, there’s a 65% higher likelihood of clicking through.What this means is different environments elicit different behaviors. So it’s vital to understand how your consumers are interacting with your emails. Since it’s likely that they’re using both desktop and mobile, use mobile design mode to optimize your design to look exactly like you intend it to on all devices.

Test design elements

Optimizing design relies on continuous feedback. But that doesn’t mean you should use a completely different design every time you send an email. In fact, consistent design will keep you out of the spam box. What you can (and should) do, is choose one design element to A/B test each time you send an email. Here are some ideas for design elements you can test:

  • F vs Z pattern
  • Heavier or less heavy image density
  • Multi-column vs single-column sections
  • Hyperlink color
  • CTA button color 

In addition to quantitative data (open rate, click through rate, etc), look at qualitative data to understand how your users react to emails. At least once per year, dig deeper by conducting user surveys or interviews with active subscribers.

Designing with BEE Pro

Good email design walks a tightrope between consistency and flexibility. Headers, footers and branding elements appear throughout all campaigns. But because different emails serve different purposes, it’s vital to adapt formats, fonts and other elements to optimize conversions.When emails and landing pages take days or weeks to create, going through design best practices like A/B testing or mobile design is tedious at best. Our team created BEE Pro with features like co-editing, branding kits and mobile design mode to give teams ultimate design freedom and the ability to optimize processes that get your email as close to perfect as possible. Check it out here.

5 Best Podcast Landing Page Examples to Increase Your Subscribers

There are thousands of podcasts floating around on streaming services, with topics running the gamut from broad (digital marketing) to hyper-niched (Denzel W...
Beefree team
Beefree team
Jun 22, 2021

There are thousands of podcasts floating around on streaming services, with topics running the gamut from broad (digital marketing) to hyper-niched (Denzel Washington movies). But whatever topic your podcast focuses on, we bet you have one thing in common with other podcasters: You’re always on the hunt for more subscribers.One of the best ways to turn casual listeners into subscribers is to build a podcast landing page. A well-designed podcast landing page will boost your subscription rate by helping to define your podcast’s unique voice and value proposition, making it easy for potential listeners to understand what you’re offering and subscribe to your show with confidence.Want to get more podcast subscribers? Here are five of the best podcast landing page examples to inspire you with your podcast landing page design.

A well-designed podcast landing page will boost your subscription rate by helping to define your podcast’s unique voice and value proposition.

Smart Gets Paid

Our first podcast landing page example is from the Smart Gets Paid podcast hosted by Leah Neaderthal. The structure of the page makes sense visually and is easy to navigate, with the podcast thumbnail on the left creating instant visual recognition. One line of descriptive copy explains not only what the podcast is, but who could benefit from listening (anyone who runs a B2B consulting or coaching business). You’ll also notice how the landing page includes multiple subscribe links. This allows visitors to select their preferred listening platform at a glance.

best podcast landing page examples

Below, Leah includes an additional paragraph describing her podcast. At the very bottom of the landing page, you can also view recent episodes and an “About Leah” section.

podcast landing page

Women at Work

The Women at Work podcast by Harvard Business Review introduces website visitors to the podcast using this podcast landing page. A few listening platforms are linked at the top of the page. It’s easy to explore the podcast by season using the navigation menu at the top, and the right sidebar includes photos and bios of the three podcast hosts (Amy Bernstein, Amy Gallo and Emily Caulfield).

best podcast landing page examples

Overall, this podcast landing page design is minimal. We see simple black-and-white fonts and a basic two-column structure. This minimalist, sophisticated approach aligns well with a brand like Harvard Business Review.

Every Little Thing

Next on our list of the best podcast landing page examples is Every Little Thing by Gimlet Media. This webpage begins by sharing the podcast’s tagline and some supporting information about the show. Further down, you can view ELT’s latest episodes and tweets. And no matter where you are on the page, the Spotify episode across the bottom means you can start listening to the podcast anytime.

podcast landing page design

From this feature preview to the color scheme to the fonts used on the page, every aspect of this podcast landing page is carefully chosen to help you get a feel for the ELT podcast and whether it’s for you.

The Marketing Scoop

The Marketing Scoop podcast by Laura Morelli for SEMrush is your weekly source of case-based stories of marketing growth. And the Marketing Scoop’s podcast landing page design should have you taking notes on more than just the marketing tactics shared on the podcast. At the top, a simple yet effective header provides a subtle touch of color and includes Laura Morelli’s headshot (adding a photo to your podcast landing page is a great way to help listeners match a face to the voice).

best podcast landing page examples

Below the fold, you can read more about the podcast, choose your favorite listening platform or start listening to the podcast right away. Embedding episodes directly into your podcast landing page is a great way to get website visitors hooked.

podcast landing page

The GaryVee Audio Experience

If it fits your brand, a colorful header can be a fun way to kick off your podcast landing page design. Gary Vaynerchuk grabs attention with this collage-like header for the GaryVee Audio Experience that includes his slogan; cutout images of past podcast guests; and some colorful doodles to top it all off.

creative podcast landing page design

The rest of this podcast landing page example is more text-heavy than others we’ve looked at here. Along the right sidebar, Gary lists several listening platforms. The rest of the page is dedicated to walking website visitors through the podcast and showing them the episodes where they should start. It can be overwhelming to jump into a new podcast, so getting your new listeners oriented is a great way to smooth out the process.

Wrap-up: Podcast landing page templates

Creating a landing page for your podcast that will get more subscribers might seem like a tall order. But with our podcast landing page templates, your job isn’t so hard after all. Customize your favorite template to create the best podcast landing page and give your subscriber count a boost!

Stay informed on all email trends

From the latest creative design strategies that inspire your next campaign to industry best practices and tech advancements, our newsletter is the go-to for all things creation.

By clicking Subscribe you're agreeing with our Privacy Policy