Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

For an email newsletter should I use double br tags to reduce some inline code?

Since I'm styling inline using <span> or <p> tags should I maybe just go real old school and use <br><br> to break paragraphs instead of closing and reopening the <p> tag each time?

For example here's a snippet of code that I currently have and its just so redundant. I know that's the nature of having to code inline but seems like I might be able to reduce some noise by doing <br><br>

<p style="font-size: small; font-family:Tahoma, Geneva, sans-serif">Selection of the 200 New &amp; Recently updated companies over the last month. Click on the company name for up-to-date business information.</p>
<p style="font-size: small; font-family:Tahoma, Geneva, sans-serif">Company Name, FL provider of Category was updated on 2/12/2013</p>
<p style="font-size: small; font-family:Tahoma, Geneva, sans-serif">Company Name, TX provider of Category was updated on 2/13/2013</p>
<p style="font-size: small; font-family:Tahoma, Geneva, sans-serif">Company Name, AK provider of Category was updated on 2/15/2013</p>

Is there a downside to switching some of this out when applicable for <br><br>? Email client support or anything like that?

like image 693
Ryan Avatar asked Feb 28 '13 14:02

Ryan


People also ask

Why we should not use BR tag in HTML?

The main reason for not using <br> is that it's not semantic. If you want two items in different visual blocks, you probably want them in different logical blocks. In most cases this means just using different elements, for example <p>Stuff</p><p>Other stuff</p> , and then using CSS to space the blocks out properly.

Do style tags work in emails?

The short answer is no. Gmail strips the tag and it's content. Hotmail, Yahoo! Mail and Windows Live Mail does not strip style-tags in the body-element. But take a look at "The Ultimate Guide to CSS" for HTML email over at Campaign Monitor.

Is it good practice to use BR in HTML?

It is a bad practice to use <br> to separate paragraphs of text. Instead, we should use the <p> tag.


2 Answers

Feel free to use the line break tags, you quite rightly have already identified the potential for reducing your markup this way, and there are no disadvantages to doing this. Every email client and web client supports them, and they're more reliable than using margins on paragraph tags, since margins aren't supported comprehensively across all systems.

Reference: http://www.campaignmonitor.com/css/

like image 96
niaccurshi Avatar answered Sep 22 '22 19:09

niaccurshi


I use double <br> tags between all text. It is the most consistent option for email.

You'll need to pair it with a &nbsp; though at the top and bottom of your text as it can in some clients (Outlook I think) will compress empty lines. Here is an example:

<td>
&nbsp;<br>
The no break space is needed above and below the text where it meets the table cell.
<br><br>
double br's between paragraphs are the best way to do it.
<br><br>
You need 1 no break space per line at the bottom (and top) so that Outlook doesn't remove the text row.
<br>&nbsp;<br>&nbsp;
</td>

This is the quickest way, but limits you to multiples of your line-height. Another option is to use padding:

<td style="padding-top:15px; padding-bottom:30px;">
The no break space is needed above and below the text where it meets the table cell.
<br><br>
double br's between paragraphs are the best way to do it.
<br><br>
You need 1 no break space per line at the bottom (and top) so that Outlook doesn't remove the text row.
</td>

Assuming the line-height was set at 15px, both these methods will produce the same results and are widely supported in all major email clients.

like image 26
John Avatar answered Sep 22 '22 19:09

John