Email and css OR tables

Question

I have a form that needs to be emailed. I am currently using a table design and wanted to make it look better so decided to use css. I am really concerned about the fact that not all clients will handle css so I wanted to get some advice. If anyone of you had to email a form, how might you handle it? It pretty much needs to be rock solid, well, for I'd say at least 95% of the email clients out there, including yahoo and gmail. I already know that gmail strips the css out of the form. I am using rounded corners in this form and unfortunately inline css is not an option because of the sequence that the css needs to be in.

Please offer me some advice before I begin this journey. Thanks.

EDIT: Inline css is not an option with the form I currently designed but could be an option for a different design that allows rounded courners.

Answer 1

I agree (and voted for above): The table with images circa 1997 is what I would recommend.

I may be mis-reading it a bit, but I'd push back a little bit on the "email a form" requirement. Emailing forms and expecting them to work at all is optimistic, if not unrealistic.

First, you may have problems getting form elements to display in email clients. I tested forms in email a couple years ago, and I can't remember whether it was the form tags that were removed, or the actual input elements. That was when I talked my client out of it.

If you can get the form to display, where is it going to submit to? Is the email client really going to allow this? What are you going to do if there are form validation errors? How does that work?

I know people have done this, but it will be an uphill battle. It seems like what is much more common is to provide links to web pages with forms. Perhaps you can provide customized links that get people through filling out most of the form (pre-filling email addresses, etc.), but have the actual form submit happen from a web page.

Good luck!

Answer 2

The best advice for designing and building HTML for emails if you want "rock solid" as you say is to pretend you are living in 1997 and use <table>, image slices, and even the dreaded <font>.

Some CSS is supported, as seen in this chart of compatibility across different email clients at the Campaign Monitor site. The biggest hit is that if you have any users on GMail, inline CSS is your only option as GMail strips all <style> tags.

As far as the rounded corners go, you will have to use images.

Answer 3

Unfortunately, HTML support in email clients isn't at all standardized. If you're aiming to hit the majority (your 95%) of users, you're best off designing the email form using tables (without rounded corners...unfortunately it's not going to look great). Taking that approach with get you the widest supported user base.

Unfortunately there's a trade-off of good looks versus compatibility. You just have to decide which is more important.

Answer 4

So just write the stylesheet in the page? Or is that not possible for some reason?

Images maybe not be be loaded though [automatically], and that's for the clients benefit, so depending on how you do your design, you may like to think that over.