HTML Email Content
This article provides information about HTML Email Content,HTML Elements.
Testing
- HTML version: use your email client such as Outlook and / or a web client such as Gmail. Each email client will display differently so it is worth testing more than one.
- Plain text version: disable HTML email in your email client to view the text version, or lookup the test order to view.
Tips
- Use XHTML -- therefore all elements most close. Examples: <img ... />, <br/>, <p> ... </p>, etc.
- Do not surround your XHTML email content with the <html> or <body> elements. Do not use <head>
- Use common and simple XHTML elements and attributes. Focus on message over design.
- 530px is a safe width for certain clients and certain preview panes (AOL in particular). Not including AOL, 600px is maximum.
- License lists which might be multiple lines should be surrounded in the pre tag for proper output:
<pre> #{orderItem.fulfillment.license.licenses.list} </pre>
Images
- Use images sparingly. They must be referenced as absolute URLs to an external website (http://...). URLs should be stable and not change frequently.
- Do not rely on every mail client showing referenced images.
- Specify "height" and "width" attributes so that layout is correct even if the image does not display.
- Use "alt" on all images, even if setting alt to: alt=""
Safe HTML Elements
p, div, span, img, a, table, tr, td, ul, ol, li, h1, h2, h3, h4, br
Safe HTML Attributes
All Elements: style=
a: href=
img: src=, width=, height=, alt=
table: cellpadding=, cellspacing=, width=, border=, background=
tr: align=, valign=
td: colspan=, align=, valign=, background=
Safe Inline CSS (style=) Properties
background-color: border: color: font-size: font-style: font-variant: font-weight: letter-spacing: line-height: list-style-type: padding: text-align: text-decoration: text-indent: vertical-align: white-space: width:
Have any questions about FastSpring? We’re here to help!