Email Marketing

Design Tips for Images in Your Emails

4 minutes

Design Tips for Images in Your Emails

Want to enjoy all the advantages of using images in email campaigns? Want to understand how to build an email using responsive design and get to know how to embed pictures in your SendPulse emails? This article will meet your expectations and answer your questions, so keep reading.

Why images matter

A visualized offer works better. Images allow you to emphasize certain aspects of your message and draw subscribers’ attention to the key information. According to Vero, emails with images have a 42% higher click-through rate (CTR) compared to text-only emails.

People are more likely to click on the pictures. Use this fact to your advantage and add links that lead to your website to every image.

Using images improves brand awareness. Place your company’s logo on images and use your brand colors so that a subscriber can recognize and distinguish you from others.

Tips for your email design

Image size

Use images that are smaller than 5 MB becuase image size influences the loading speed of your email. Make sure the size of your image in pixels corresponds to that of your email; otherwise, its dimensions will be squashed resulting in low quality and slow loading. If you need an image of 100х100 pixels, resize it beforehand.

Responsive template

According to statistics, 54% of emails are opened on mobile devices. Therefore, make sure your email design is responsive: this way, your emails will look good both on desktop and mobile.

Some more useful recommendations:

  • Don’t include too much text in your email as it may be hard to read it on mobile.
  • Template width should be no more than 500-600 pixels.
  • Use a single-column layout. Put important information and call to action (CTA) buttons at the top of the email so that your subscribers won’t have to scroll down to find it.
  • Don’t overload an email with unnecessary images and never place important text information on top of pictures. Sometimes an image in the email might not be displayed; in this case, a user will simply not get your message.
  • Design touchscreen-friendly CTA buttons that are around 44х44 pixels.
  • Make the email subject short. Mobile phones display only 25-30 characters.
  • There is more space dedicated to the preheader than to the subject line on mobile. So take advantage of preview text to make a teaser to your email.

Building email templates is a delicate process, which usually requires time and skills in HTML and CSS. If you have no opportunity to build a responsive design yourself, you can use free HTML templates from the SendPulse gallery.

Image format

There are four popular image formats used in emails. These are bitmap and vector images: JPEG, PNG, GIF, and SVG. There is no definite answer about which format is best. You should take into account the characteristics of each format and determine the one that is suitable for your email content. To make your choice easier, we will provide both advantages and disadvantages of each of them.
JPEG

Advantages:

  • Suitable for photos and images with more than 256 colours;
  • Small file size.

Disadvantages:

  • Cannot be animated;
  • Not suitable for images with text;
  • Lossy compression;
  • Does not work well for logos and icons.

PNG

Advantages:

  • Supports transparency;
  • Suitable for images with text and logos;
  • Minimal loss of quality during compression.

Disadvantages:

  • Large file size;
  • Cannot be animated;
  • Not supported by all web browsers.

GIF

Advantages:

  • Enables transparency;
  • Supports animation;
  • Suitable for text;
  • Lossless compression.

Disadvantages:

  • Supports only 256 colours;
  • Big file size;
  • Not suitable for photos.

SVG

Advantages:

  • Scalability and flexibility;
  • Small file size.

Disadvantages:

  • Not compatible with all web browsers.

To find quality images of different formats for your emails, you may visit different photo stock websites like GraphicMama.

Email fonts

Font size is crucial for email readability. According to email design guidelines, it is recommended to use the font of 14 pixels for the body copy of long emails and 16 pixels for the body text of short ones.

A good rule of thumb is to stick to a maximum of three different fonts in your emails. To play it safe, choose sans-serif fonts — Verdana, Arial, or Tahoma — as they are the default fonts of the most popular email clients.

How to embed images in your emails with SendPulse

Step 1. Create an email campaign and fill in the required data

Choose a mailing list, indicate the sender’s name, and type in the subject line.

Step 2. Choose an email template

You can import a template you have previously created, use the template builder, HTML editor, or choose a ready-made responsive HTML template from  the SendPulse gallery.

Step 3. Insert the image into the email body

In the template builder, choose the required layout structure and then upload the image.

If you use a ready-made template, replace the images with yours.

In the HTML editor, click on “Insert/edit image.”

If you are not proficient at email coding, have a look at the article “Tips and Tricks for Coding Your Emails.”

Essentials you should pay attention to

To resume, take a look at some tips that you should always keep in mind when designing your email:

  1. Image-only emails trigger spam filters, so they will most likely be sent to the spam folder. You can get more information about this problem in our article “The Ultimate Guide: How to Prevent Emails from Landing into the Spam Folder.”
  2. Use text to highlight the key points of your email because pictures may not be displayed with all inbox providers.
  3. Add alt text to every image you add to your emails.
  4. Use responsive HTML email templates.

Follow these recommendations to make your emails appealing and easy to perceive. Use images wisely and do not hesitate to rely on SendPulse.

Date of publication:

18 Jul. 2018

1 Star2 Stars3 Stars4 Stars5 Stars
Loading...
Average Rating: 5/5
Total Votes: 33
Share:
Twitter