Every Email marketing Company should choose a responsive User Friendly HTML Template to get better open rate and Customer engagement. Design Emails around 500-600 pixels in width. Use universally supported Fonts. In case you need to use special fonts, use it within an image. Use background images sparingly or never. Some clients do not support them.

1. HTML Design Praxis – Email Marketing

2. Pixels, Fonts & Background Images
 Design Emails around 500-650 pixels
in width. Beyond that will lead to
horizontal scrolling for popular emails
like Gmail & Yahoo.
 Use universally supported fonts like
Arial, Times New Roman. In case you
need to use special fonts, use it
within an image
 Use background images sparingly or
never. Some clients like Outlook do
not support them.

3. Background Colours
 Use background colours (preferably
light) that contrast with the used
font to ensure readability.
 Avoid using body background
colours. It may not get rendered
properly with all email clients.
 Wrap the background colour
attributes inside a table. This helps a
lot in avoiding irregularity in the
content organisation.

4. JAVA Scripts , GIFs
 Do not use Java Scripts. Java
scripts are not supported by some
email clients and others view it as
security risk.
 GIFs and mini videos more viable
option can be used for motion
 Ensure that the GIF size remains
small. Also make sure that you use
them sparingly.

5. HTML Tables, CSS
 Use HTML Tables for Design
Layout. They are universally
supported by all ISPs.
 Avoid CSS if possible, but if you
must use them , choose
embedded styles called inline.
 Using CSS can be more
cumbersome than their
perquisites.

6. Images , Buttons for CTA
 Images, Forms should be hosted on
server, and cannot embedded within.
Include redirect links for forms or
images.
 Use the right number of images
depending upon your purpose –
promotional, ecommerce etc.
 Use buttons, charts & images that
grab user attention and stand out
leading to a CTA

7. Deliverability
 Never forget to set image
dimensions. Your images must be
mobile & tab responsive. (40 - 60kB
is ideal maximum limit).
 Large images may be sliced down
into 2 or more images for optimum
performance.
 Use Alt Tags for Images. This will
prevent deliverability issues for slow
browsers. Use styled text for good
rendering

8. Img./Txt Ratio, Aesthetics & Text
Versions
 Maintain an optimum Image to
Text Ratio. Anything like 60:40
or 80:20 is desirable.
 Make use of colour and
aesthetic senses and learn
target user psychology
 Never forget to include the
text version of the HTML Code

9. Mozify your Images
 “Mozify” slices images bigger
images in cells with smaller images
achieving a mosaic effect using their
background colors. (Ref.
EmailOnAcid)
 It is universally supported except in
Outlook client which blocks images.
 When the image is not loaded, it
shows the mosaic cell background,
depending on which the user can
decide whether to view image or not.

10. THANK YOU
Find us at