Within your email, it's a good idea to use as much "plain" text as possible (in HTML) and thus reduce the use of images. This is precisely what we strive for when we are asked to transform an email into HTML. This guarantees immediate display in the event of images being blocked or not downloaded by your recipients, and optimizes the accessibility of your email campaign content. This makes it easier for screen readers to read the content.
However, the graphic formatting of texts directly included in your HTML code often requires the use of size, colors, styles and text weight! It's precisely this last point that we focus on in this article.
How do I write bold text in an email?
To make text bold in an email, simply surround the relevant piece of text with the tags <b> or <strong>. For example :
<p>
This is <strong>a paragraph</strong>
This is <b>a paragraph</b>
</p>In your code editor, you can use the keyboard shortcut Ctrl + b after selecting your text: this will automatically surround the piece of text in question with a <strong>.
You can also surround your text with a span with the CSS property font-weight with the value bold. Like this :
<p>
This is <span style="font-weight:bold">a paragraph</span>
</p>What is the difference between the <b> and the <strong> ?
The tag <b>
The tag <b> allows you to display bold text in all opening environments. However, the the developer.mozilla.org site indicates that the element <b> tag carries no particular semantic information. What's more, historically, this tag was designed to render text in a bold font (perfect!). Since HTML 4, however, elements with a purely stylistic purpose have been deprecated. The meaning of the element <b> tag has therefore evolved. If you want to put a text in bold, without putting any semantic importance on the text in question, then the <b> will do the trick.
The tag <strong>
The tag <strong> can also be used to display bold text. But that's not what it's for! As the developer.mozilla.orgThis element indicates high importance content, which is usually reflected in the bold text. But it should not be used for stylistic purposes! Be aware that if the content of the <strong> is, by default, displayed in bold today, since browsers and mail clients seem to agree on the graphic rendering of this tag for the moment, it could just as easily be displayed differently tomorrow.
Need help?
Reading content isn't everything. The best way is to talk to us.
Which tag to choose for bold text?
The tag <span>
In the end, this may be the best solution, especially if there's no real semantic value to be placed on the desired text. The text appears bold, but without any particular semantic importance.
What you will notice, however, is that fat "sets" (more or less strong) are not taken into account! Or rather, not in their entirety. Because there are only two possible solutions: lean typeface or bold typeface. So forget about bolder, lighter, font-weight:200etc... The values of font-weight different from bold are not supported at all on Lotus Notes 6.5, Lotus Notes 7.
Only AOL Chrome (win), AOL IE9 (win), AOL IE10 (win), AOL IE11 (win), BlackBerry 9930, BOL Chrome (win), Comcast Chrome (win), EarthLink Chrome (win), Freenet.de Chrome (win), GMX Chrome (win), Gmail Chrome (win), Libero Chrome (win), Mail.ru Chrome (win), Office 365 Chrome (win), Office 365 IE9 (win), Office 365 IE10 (win), Office 365 IE11 (win), Orange Chrome (win), Outlook.com Chrome (win), Outlook.com IE9 (win), Outlook.com IE10 (win), Outlook.com IE11 (win), SFR.fr Chrome (win), T-Online.de Chrome (win), Terra Chrome (win), Web.de Chrome (win), Yahoo! Chrome (win), Yahoo ! IE10 (win), Yahoo ! IE11 (win), all seem to support these differences. font-weight (but only for the values 800 and 900).
Should we conclude that only Chrome and IE, under Windows, support the font-weight:800 and font-weight:900 ?
The bolding of raw HTML text within an e-mailing is therefore possible using the <b>, <strong> and CSS property <font-weight> attribute with the value presentation to all bold. However, you should use the <b> or the styletag, and keep in mind that the <strong> can change its layout at any time!
Remark: Android 2.3 and Android 4.0.3 do not pass the texts of font-weight:[valeur] in bold only from the value 700 (whereas other webmails allow it from the value 600).
