How to mark up a "New Comment E-mail"?

[DoubleDee]

I am having a couple of issues with a “New Comment” e-mail, which gets sent out to Members who “subscribe” to an Article Thread.

1.) What would be the “proper” way to mark up this e-mail body copy…

Dear Debbie,

The user, “MomOfFive”, has posted a new comment to the article:
“Postage Meters Can Save You Money”

To view this article, click here

To view this comment, click here

Sincerely,

Customer Service

What I have now is this…

<p>Dear Debbie,</p>
<p>The user, "MomOfFive", has posted a new comment to the article:<br />
	<span class='indent'>"Postage Meters Can Save You Money"</span>
<p>To view this article, <a href='/articles/postage-meters-can-save-you-money'>click here</a></p>
<p>To view this comment, <a href='/articles/postage-meters-can-save-you-money#comment_91'>click here</a></p>
<p>Sincerely,<br /><br /><br />


<p>Customer Service</p>

I am wondering if I should use all <span>'s instead or just wrap everything in ONE <p>?? :-/

2.) My other problem is that I have this style defined…

.indent{
	padding: 0 0 0 2em;
}

…but when I go into FireBug it says I have no styles declared?!

I’m not sure if this is an issue with my HTML and FireBug or if it deals with my PHP which generates the HTML? :-/

I’d post my PHP here, but Ralph always yells at me when I do that!

Thanks,

Debbie

[ralphm]

If you want the email to work in most email clients, you have to use inline styles rather than classes, because a lot of email clients rip out all CSS other than inline styles. (You have to think like a 1990s coder to build HTML emails, unfortunately.)

This issue has nothing to do with PHP, so well done for not posting any.

[DoubleDee]

@ralph_m

If you want the email to work in most email clients, you have to use inline styles rather than classes, because a lot of email clients rip out all CSS other than inline styles. (You have to think like a 1990s coder to build HTML emails, unfortunately.)

You lost me.

1.) Are you saying I can’t have <p> tags?

2.) What about my question of using <p>'s vs <span>'s or something else?

3.) How would my code have to be changed to be consistent with what you are saying?

This issue has nothing to do with PHP, so well done for not posting any.

Then what is causing that weird FireBug thing?

What I didn’t say was that I am echoing my e-mail in PHP and not getting to e-mailing it. So why does FireBug act like I have no styles like…

<span class='indent'>\\"$articleHeading\\"</span>

Regardless, whether that was in an actual e-mail generatd by PHP’s mail() function, or just echoed to the screen by PHP like I currently have, I would expect my .indent{} style to work.

So what is going on there??

Thanks,

Debbie

[ralphm]

It might depend on what email client you are viewing the email in, but many of them strip out styles in the head of your document. So you need to use

<span [COLOR="#FF0000"]style="padding: 0 0 0 2em;"[/COLOR]>"Postage Meters Can Save You Money"</span>

for your styles to work in a majority of email clients.

It’s up to you whether you use <p>s or <spans>. Obviously it’s better HTML to use <p>s, but they can be a pain to style in HTML email, so there is sometimes an argument for using spans, <br>s and so on.

Here is a handy guide to what is and isn’t supported in the main email clients: http://www.campaignmonitor.com/css/

[DoubleDee]

@ralph_m

It might depend on what email client you are viewing the email in, but many of them strip out styles in the head of your document. So you need to use

<span [COLOR="#FF0000"]style="padding: 0 0 0 2em;"[/COLOR]>"Postage Meters Can Save You Money"</span>

for your styles to work in a majority of email clients.

Sorry, Ralph, but I’m not following you very well tonight. :-/

1.) You are saying to use Inline Styles like your Padding example, above, right?

So that means I cannot rely on my CSS Stylesheet, right?

2.) But how does that relate to HTML Tags??

Don’t I want to still mark up my E-mail Body in HTML Tags like <p>??

Or do E-mail Clients ignore those?

It’s up to you whether you use <p>s or <spans>. Obviously it’s better HTML to use <p>s,

Forget we are talking about E-mail for a moment.

3.) If you had this copy, which s the better way to mark it up…

Choice #1:

<p>Dear Debbie,</p>

<p>The user, "username4", has posted a new comment to the article:</p>
<p>"Consider Becoming an S-Corporation"</p>

<p>To view this article, click here</p>

<p>To view this comment, click here</p>

<p>Sincerely,</p>


<p>Customer Service</p>

or

Choice #2:

<p>Dear Debbie,<br /><br />

The user, "username4", has posted a new comment to the article:<br />
<span style="padding: 0 0 0 2em;">"Consider Becoming an S-Corporation"</span><br /><br />

To view this article, click here<br /><br />

To view this comment, click here<br /><br />

Sincerely,<br /><br /><br />


Customer Service<p>

but they can be a pain to style in HTML email, so there is sometimes an argument for using spans, <br>s and so on.

4.) Again, I’m not following what E-mail Clients do to HTML Tags like <p>?

I know you said that they only support Inline Styles, but what about HTML Tags?? :-/

5.) Which are the pickiest…

Web-based e-mail like Yahoo and Gmail?

Or actual E-mail Clients like MS Outlook?

Thanks,

Debbie

[ralphm]

@DoubleDee

You are saying to use Inline Styles like your Padding example, above, right?

Yes.

So that means I cannot rely on my CSS Stylesheet, right?

Yes. You can’t use a style sheet as such anyway. Your choices are styles embedded on the page inside <style></style> tags or inline styles, but the former are often deleted.

But how does that relate to HTML Tags?

Don’t I want to still mark up my E-mail Body in HTML Tags like <p>?

Or do E-mail Clients ignore those?

Doesn’t affect tags, except that they can be tricky to style, even with inline styles. Some clients make your headings green, for example, no matter how you try to style them. Very annoying.

If you had this copy, which s the better way to mark it up…

Obviously number one is better.

Again, I’m not following what E-mail Clients do to HTML Tags like <p>?

HTML tags are supported. They display them like you’d expect, except that they often set their own styles for them, which can be hard to override. Getting HTML email to work nicely is a pretty depressing area, nothing like styling a web page. You have to use tables for layout, for example.

Which are the pickiest…

Check out the link I gave. Not surprisingly, anything owned by Microsoft is pure Hell on Earth, but there are some other serious offenders also. If Mac Mail were the only email client, we’d all be in heaven.

[DoubleDee]

@ralph_m

Doesn’t affect tags, except that they can be tricky to style, even with inline styles. Some clients make your headings green, for example, no matter how you try to style them. Very annoying.

I’m going to use this as a way to sneak in some PHP…

Not sure if you mean “E-mail Header/Heading” like this…

	$headers  = "From: admin@MySite.com <admin@MySite.com\\r\
";
	$headers .= "MIME-Version: 1.0\\r\
";
	$headers .= "Content-Type: text/html; charset=ISO-8859-1\\r\
";

…or if you mean <h1>, <h2>, <h3>, and so on?

Regardless, is that the code I want to use for my e-mails? (I was given that some time back from someone so I could use an HTML Table in an e-mail, but I don’t know if that is “proper” code/E-mail Header or not? (:

Obviously number one is better.

Ralph???

Why would you wrap <p></p> around a few words like “Dear Debbie,” ???

Don’t you think people like Paul O’ would say that you should only put <p>'s around an actual paragraph?

A Salutation or Sentence isn’t really a paragraph…

But you could argue that Choice #2 is all one paragraph, except for maybe the Salutation.

Debbie

[ralphm]

Not sure if you mean “E-mail Header/Heading” like this…

	$headers  = "From: admin@MySite.com <admin@MySite.com\\r\
";
	$headers .= "MIME-Version: 1.0\\r\
";
	$headers .= "Content-Type: text/html; charset=ISO-8859-1\\r\
";

…or if you mean <h1>, <h2>, <h3>, and so on?

This is an HTML forum, so of course I mean HTML headings like <h1> etc.

Regardless, is that the code I want to use for my e-mails? (I was given that some time back from someone so I could use an HTML Table in an e-mail, but I don’t know if that is “proper” code/E-mail Header or not? (:

Looks OK to me, but this is not the right forum to ask.

Why would you wrap <p></p> around a few words like “Dear Debbie,” ?

Others may disagree, but I’d argue that the <p> (“paragraph”) element doesn’t really correspond with a proper paragraph in English grammar. The <p> element has to play a lot of roles. There is no <sentence> element, for example, or <greeting> element, and so on …

As far as I’m concerned, if we write “Dear Someone” and then start the following text in a new block with a gap in between, then they are separate paragraphs. But of course, this is where HTML discussions get a bit petty and pointless, IMHO.

[DoubleDee]

@ralph_m

As far as I’m concerned, if we write “Dear Someone” and then start the following text in a new block with a gap in between, then they are separate paragraphs. But of course, this is where HTML discussions get a bit petty and pointless, IMHO.

Just trying to learn the best ways.

Thanks for your help! :tup:

Debbie

[ralphm]

@DoubleDee

Just trying to learn the best ways.

Yes, that comment wasn’t directed at you. I was just warning you that others might come in and argue with my comments about paragraphs. It’s good for you to be asking the questions, and there’s no right answer as such. Given that HTML email is such a hell hole, the HTML tags used are the least of one’s worries. It’s really annoying that email client vendors haven’t brought them up to scratch. Microsoft has been setting them backwards in recent years, which doesn’t help—tying the rendering of Outlook to MS Word rather than web standards, for example.

[DoubleDee]

@ralph_m

Yes, that comment wasn’t directed at you. I was just warning you that others might come in and argue with my comments about paragraphs. It’s good for you to be asking the questions, and there’s no right answer as such. Given that HTML email is such a hell hole, the HTML tags used are the least of one’s worries. It’s really annoying that email client vendors haven’t brought them up to scratch. Microsoft has been setting them backwards in recent years, which doesn’t help—tying the rendering of Outlook to MS Word rather than web standards, for example.

Yeah, I suppose that issue with e-mail clients could be a drag for a lot of people.

Fortunately for my needs, my e-mail probably doesn’t even need HTML.

All I wanted was my Article Title to be indented and bold.

Other than that, my e-mail is just a few lines and really only qualifies as a “text” e-mail.

But since I wanted the indent and bolding, I suppose I had to switch to HMTL. And when I did that, I was trying to use “good” markup standards.

As far as my e-mail copy, I can see it you way and the other way.

For simplicity, I ended using your approach.

Since my e-mail won’t garner any SEO points, and because it is so simple, this probably isn’t a place to strive for “perfection”!

Thanks,

Debbie

[ralphm]

@DoubleDee

this probably isn’t a place to strive for “perfection”!

Yes, emails are a bit more like newspapers … here today and gone tomorrow.