How to validate html email templates? - html

I am using telerik reporting tool to generate reports in different formats, .pdf,.html, .doc, .txt etc. Some of our client's email server doesn't sport attachment in emails so I want to embed the .html report to my email body instead of attaching it as attachment so user can see report content directly and copy report content. But when I append .html report to the email body it doesn't render in proper format as it was. Is there any online tool or plugin which convert the normal html to email template friendly html? Or how can I validate that this page is going to render fine as email body or not if not then why not? which tag should I remove or replace etc.
I have tried this online tool
but its not working, still got dirty html in email.

There are a couple questions in here, which I will do my best to answer as someone who is comfortable coding emails.
Regarding HTML Email validation, there really isn't a good option.
Since most email clients don’t follow web standards and there are no
email-specific standards in place, properly coded HTML emails will not
pass HTML validating because, if coded properly, nearly all of the
code within an HTML email is likely to be comprised of deprecated
elements.
source
You can use the W3C validator to catch unclosed tags and typos, but that's about it.
But it sounds like you're looking for a tool that converts webpage-friendly html into email-friendly html. Despite both using HTML and CSS, coding emails is quite different from coding the web. Unless the web-friendly HTML design is very basic (say, a series of paragraphs and images), chances are the webpage-friendly html would not bode well in email clients. (Sounds like you've already discovered this.)
Without knowing what these reports look like and what how they should display in email clients, I'm hesitant to give you specific suggestions. I don't know any tools that automatically make 'safe' email markup. If you're open to tweaking the email markup a little, here are a few guidelines:
Keep the design simple.
Use <table>s instead of semantic elements like <div> for layout.
Become familiar with what CSS is and is not safe to use in an email.

I have just found this nice validator (EmailLint - unfortunately hosting has lapsed). There are defined rules for e-mails and you can validate your e-mail against them.

Related

How to send a newsletter?

I am a newbie and this it is the first time that I have created an html and css code.
I have written a newsletter and now I would like to send it but I do not have idea about how.
Right now the situation is as following:
I have a folder with an HTML file, a folder with the CSS file and another Folder with all the images.
Now I would like to send it, but as I said before I do not know how.
I have red that I need to make a unique file HTML and CSS (HTML with an in line CSS). Is that the only way to go?
Which program do you suggest to send the newsletter?
Where should I store the images in order to make them visible to the recipients?
Any suggestion???
Like everyone above me, I would recommend Mailchimp too.
Now why it would be ideal in your situation is 'cos:
Since you've already created a separate html and css file, merging it into inline styles is going to take considerable effort if you have a lot of content. Mailchimp has a wide variety of templates to choose from where you can just pick a template which suits you and add just the content part.
Newsletters are very tricky to code since all email clients display content in a different way unless you're really proficient at writing newsletter html files from scratch. For eg, the email client Outlook (Microsoft) will ignore margins and some other css properties. The templates from Mailchimp have been perfected to show your content exactly like your design across almost all major email clients.
If you're going to send out a big number of newsletters, your newsletters might go into spam folders based on a variety of reasons. Mailchimp has authentication so that unless you go against some obvious law, your newsletter will land in your recipient's inbox.
You can also host your images on your own server and ask Mailchimp to reference that location. I do this when I send out newsletter for my website.
Its even got free plans to help start you out and see if it works out for you.
Try Mailchimp it is faster, easier and gives more options.
There are many tools availbale which gives services for sending emails also many other features.
As your HTML mailer is ready with image folders. Try to use inline style and for the images use full path like http://company.com/image/name.jpg ofcourse you have to place this HTML file and image folder on the server as well. And then you have to copy all the HTML code and place in any marketing tool and then you ready to send emails.
Mailchimp
Pardot
Constant Contact
you can choose constant contact to sending email.they offer 30 days free trial.
MailChimp is a good bet. Their API is wide enough to get into customising the hell out of their standard templates. Watch their pricing though, it can get out of hand the larger your cliental gets!

Should I avoid HTML-formatted notification e-mails?

A few years ago, it seemed to be accepted wisdom to avoid HTML formatting in favor of plain text when sending notification e-mails to users, because a) not all e-mail readers supported HTML and b) HTML-formatted e-mail was more likely to land in the user’s spam folder.
Are these arguments still valid today, or are HTML e-mails fair game now?
Any restrictions I should keep in mind?
EDIT:
I'm planning to use only a small subset of HTML -- bold, italic, links, lists and tables will be sufficient.
Making html email work correctly everywhere is a very hard task (each client seems to support a different small subset of html / css etc.).
If you decide on sending html email, be sure to send multi-part mime messages (both html and plaintext versions in the same email) so clients which don't understand html can just render the text correctly.
I believe HTML is the way to go these days, all clients I have worked with use HTML to render their emails, but to keep it safe, you should send it both formats, HTML and plaintext. With .Net its simply create an AlternateView.
Here are a couple of resources that I have found very useful
http://www.smashingmagazine.com/2010/01/19/design-and-build-an-email-newsletter-without-losing-your-mind/
http://www.mailchimp.com/kb/article/how-to-code-html-emails/
Prepare your email HTML according to email templates. You can find many services for preparing and testing your html email. Just Google around.
And for sending part, prepare a plain text version of your message, and send the email as multipart. You can use an open source library like Zend Mail or an online app like MailChimp. In this way, if the client app doesn't support HTML, it's shown the plain text version instead.

confusion with the email newsletter

i was trying to get a newsletter done in html . is it mandatory to use while creating a newsletter email template ? what else do I need to take into account to encode the newsletter ?
To get started you can use the templates provided here. When you have some time on your hands go here to understand more about the difficulties associated with creating HTML email.
I think your question is whether you need HTML to make a newsletter. If it's not please ignore my answer.
You don't need to use HTML for your email newsletter, you can just use plain text. However if you want to markup your email newsletter (have colors, images, etc) you do need HTML.
Properly doing HTML-email is difficult. I'm guessing you're not an HTML expert, so I'd advise you to either keep to plain text (which for most purposes is absolutely fine) or use an email newsletter service like MailChimp.
You'll need an application to send your html newsletter from.
http://www.campaignmonitor.com has an easy to use user interface as well as a free trial.

Rules when creating HTML E-Mails?

Is there anything I need to be aware of when creating a HTML e-mail? Is it as simple as creating a valid HTML page then sending it via PHP? Or do I need to use tables to ensure it display's correctly.
Any advice to get this right first time would be much appreciated.
Creating an HTML email that displays the way you want to in email clients, can be very difficult, if not impossible. Unfortunately, email clients do not use the latest and greatest web browsers when displaying emails, and they can also restrict what should be allowed (and with good reasons).
No matter how much you might love CSS-based layouts, table-based layout is still the way to go for HTML emails. You can still use CSS for other things, of course, but in some cases it will need to be inline. The best looking HTML emails I've seen, are largely made up of tables and big images - simply because unlike on normal web pages it is nigh on impossible to create the equivalent using good web development practices. HTML email is a world of its own.
You should also test the emails in as many email clients as you can - and while it can be cumbersome to install all the different clients, you can also use services such as Litmus, MailChimp and CampaignMonitor (see also this question). Personally I have had good experiences with Litmus.
Good luck, creating HTML emails can be quite messy!
Tables are definitely the best option for HTML emails, since most other methods tend to display differently on different machines.
Things to watch out for:
Images are often blocked by email programmes - try to use background colours where possible
Don't link to an external stylesheet - put the styles in <head>. This will prevent your server being hit when the emails are opened.
There's also a good blog post from Mailchimp about using CSS in HTML emails.
Tables is bad...but the correct way to go in emails...
Also send only the part you would normally put in the body and only use inline css.
Another important thing is that background images most of the time dont work.
This is a very good guide that can help you out.
my advice: test in a lot of browsers,mailclients and email programs
You should check out Email on Acid, they not only show you what your email will look like in each client they also analyze your HTML. They highlight the HTML in you code that is not supported in the clients. This tool has saved me hours trying to figure out why an email doesn't render correctly.
One other thing that is very helpful is they provide Tips & Tricks for each client. Anyway you might want to check it out, very helpful.

Should I use HTML 4.0 mark up for my email templates?

A designer coded an html template using CSS best practices. I want to use this template as an email newsletter template, but I've heard people say hotmail, yahoo and gmail offer limited support for CSS.
Am I supposed to re-code these templates using table layouts and font tags?
The short answer is Yes.
You're going to get the best compatibility across webmail accounts & email clients by using the most basic and dumbed down HTML possible.
Don't use any CSS files or <style> tags. Do everything inline.
Handle positioning with nested tables that have explicit widths
I make heavy use of HTML comments in these situations to make sure I don't get confused about where I am in the layout.
All text should be surrounded by <font> tags with the font style information.
Images should have explicit widths & heights.
This helps the email retain its proper layout when images are blocked.
I usually test on a minimum of the following:
Outlook 2003
Outlook 2007
Most of your headaches will come from here.
Thunderbird
Entourage (OSX version of Outlook)
Gmail
Hotmail
Yahoo Mail
You're usually in pretty good shape if you get something that shows up properly on all of those.
We use Exact Target and they have an HTML preview feature but it's not perfect. I've run into a lot of situations where an email looked good in the preview but still came through broken in Outlook 2007.
Mark above said everything that you need to do to develop email templates (it's the 90's all over again), but I wanted to add one last thing:
http://www.email-standards.org/ is a great resource to see how different email clients interpret HTML and CSS.
To build on what Mark said:
If at all possible, avoid using CSS at all (though, it's usually alright for things like text). Use tables for all positioning, empty <td> elements for padding/smaller positioning bits.
And even with all this, it's only going to look perfect in a few email programs/sites. HTML email is, I'm fairly confident in saying, utterly impossible to do in such a way that it shows up perfectly in all mail clients/apps.
You'll have to go back to stone-age HTML to get HTML emails to work out as Mark suggested. All styles inline in the html. No STYLE tags or external stylesheets.
MailChimp and CampaignMonitor both offer excellent free HTML email templates. They also both offer email testing services that send your html emails to several different email clients and then send you screenshots of the results.
use div tag with fixed height/weigth and put all your HTML in there. It would look the same in most clients. Iv'e tried it before and it works fine.