The “em” tag is an HTML tag used to emphasize specific text within your content. When you apply the “em” tag in HTML, it displays the text in italics, helping to highlight key information to your users. This makes it a frequently utilized tool in content creation.

However, there are several other HTML tags capable of emphasizing text, such as the “strong” tag and the “b” tag. It’s crucial to understand the differences between these tags and to use them appropriately depending on the context.

In this article, we’ll explore the essentials and basic usage of the “em” tag, its effects on SEO, and how it differs from other emphasis tags. This information will be useful when creating content, ensuring effective emphasis and improved user engagement.

What is the “em” Tag?

The “em” tag is an HTML tag used to emphasize specific text within a document. When you set the “em” tag in HTML, it makes the selected text italic , helping to draw attention to it.

Using the “em” tag is straightforward. Simply enclose the text you want to emphasize with it.

The basic form of the “em” tag is as follows:

Text to emphasize

Example: Let’s emphasize “SEO” in “Tokyo SEO Maker.”

-Without the “em” tag

<p>Tokyo SEO Maker</p> 

-With the “em” tag

<p>Tokyo<em> SEO </em>Maker</p>

As shown, the text within the “em” tags turns italic.

The “EM” in “em” tag stands for “emphasis.”

Attributes and Browser Support for the “em” Tag

The “em” tag is a global attribute, meaning it can be specified with any HTML element and is supported by most browsers.

For PCs and smartphones, the supported browsers include

Note: On Windows, if the standard font is set to Meiryo, setting the “em” tag does not turn the text italic. If the text does not display in italic even with the “em” tag, it may be because the default font is set to Meiryo.

Benefits of Using the “em” Tag

While it’s not mandatory to use the “em” tag in content creation, it allows for emphasizing the text you want the user to focus on. Many users skim through content, so in pages filled with text, important messages can often go unread.

Furthermore, unembellished text can seem monotonous and be challenging for some users to read. If reading becomes cumbersome, users may leave the page. Many users prefer to quickly read only the essential parts, so using the “em” tag to highlight text is crucial to capture their attention.

Tips for Using the “em” Tag

Using the “em” tag to emphasize specific text can make the information you want to convey easier for users to read and adds rhythm to the text, encouraging them to read through to the end. However, despite its many benefits, it is not advisable to overuse the “em” tag within your content.

Overusing the “em” tag can make it difficult to understand which parts of the content are truly important. Even if users read to the end, they may not remember the key points if emphasis is used excessively. It’s crucial to use the “em” tag judiciously and creatively to capture and retain user interest.

Differences from Other Emphasis Tags

The “em” tag italicizes text, but there are various other tags for emphasis as well. For instance, the “strong” tag makes text bold and indicates its importance to Google’s search engine.

The “b” tag also bolds text but does not convey importance to Google like the “strong” tag. It’s simply useful for bolding text for decorative purposes. Understanding when to use the “em” tag versus other tags like “strong” and “b” is essential depending on your objectives.

Differences Between the “i” Tag and the “em” Tag

The “i” tag, like the “em” tag, is used to italicize text. However, the “i” tag is specifically for setting text in italic type, which leans to the right, making its appearance similar to that of the “em” tag.

• “em” tag: Italicizes text for emphasis.
• “i” tag: Italicizes text for stylistic purposes.

For emphasis, it’s better to use the “em” tag rather than the “i” tag. The “i” tag is a global attribute, so it can be used with any HTML element and is straightforward to use—just enclose the text you want to emphasize.

The basic form of the “i” tag is as follows.

<i>Text here</i>

*Replace “Text here” with your specific text.

Differences Between the “strong” and “em” Tags

The “strong” tag is an HTML tag used to bold text, which also communicates the importance of the text to search engines. Using the “strong” tag on words closely related to the main keywords in an article can enhance SEO effectiveness.

• “em” tag: Italicizes text to emphasize it but does not convey importance to search engines.
• “strong” tag: Bolds and emphasizes text while signaling its importance to search engines.

The “strong” tag, being a global attribute, can be used with all HTML elements and is simple to use—just enclose the text you want to emphasize with it.

The basic form of the “strong” tag is as follows.

<strong>Text here</strong>

*Replace “Text here” with your specific text.

Differences Between the “b” and “em” Tags

The “b” tag is another HTML tag that bolds text. While it serves the same visual purpose as the “strong” tag—making text bold—it does not convey textual importance to search engines.

• “em” tag: Displays text in italics.
• “b” tag: Displays text in bold.

If your goal is simply to make text stand out, using the “b” tag is recommended. It is also easy to use—just wrap the text you want to emphasize with it.

The basic form of the “b” tag is as follows.

<b>Text here</b>

*Replace “Text here” with your specific text.

Methods to Italicize Text Using CSS

Aside from using the “em” tag to italicize text, you can also use CSS, a styling language, to achieve italics. Here, we’ll discuss the advantages of using CSS for italics and how to set it up.

What Exactly is CSS?

CSS stands for “Cascading Style Sheets,” a stylesheet language commonly used alongside HTML. While HTML is the programming language used to create the basic structure of a website, CSS is used to design and decorate that structure, enhancing the overall appearance of the website. Although it’s perfectly fine to place an “em” tag directly within HTML, if you simply want to italicize text, you can also achieve this through CSS.

Benefits of Using CSS

Choosing CSS over the “em” tag for italicizing text offers several advantages.

-Maintains text structure

-Easy to maintain

-Achieves SEO benefits

Preservation of Text Structure

By separating the roles of HTML and CSS in managing a site, you maintain the integrity of the document’s structure. Embedding both structure and design elements directly into HTML can complicate the source code, potentially disrupting the text structure. Therefore, it’s recommended to set stylistic changes like italics in CSS rather than HTML.

Easier Maintenance

Separating the roles of HTML for structure and CSS for design makes the site easier to maintain. 

For instance, if you want to change the design or text decoration of a website composed solely of HTML, you would need to modify each piece of code individually. Using CSS, you only need to update the CSS file, simplifying site maintenance.

These features not only make CSS an effective tool for website styling but also contribute to better SEO by keeping the HTML cleaner and more focused on content structure.

Achieves SEO benefits 

By separating roles in HTML and CSS when building websites, you can minimize unnecessary code, leading to a lighter source code. This streamlines page loading times when users visit, providing a better user experience. Faster site speeds also result in higher ratings from search engines, making CSS an excellent choice for SEO.

How To italicize text with CSS

To italicize text with CSS, you use the font-style property. To apply italics, simply set font-style to ‘italic.’ This property not only allows for text styling but specifically enables text decoration in italics. Here’s how you can use it:

Selector { 

font-style: italic; 

} 

Example

• HTML Code

<p class=”italic”>Tokyo SEO Maker</p>

• CSS Code

.syatai{font-style: italic

} 

• The Result in HTML and CSS: Tokyo SEO Maker appears as Tokyo SEO Maker in italics.

The SEO Impact of the em Tag

The em tag is used to italicize and emphasize text but does not inherently enhance SEO. 

Recommended Video: Is there a difference between the “strong” and “b” tags in terms of SEO?”

You can check Google’s official view in this video. Even though it is said to have no SEO effect, using the em tag makes the text more readable and enhances usability, which in turn does have an SEO benefit in that regard.

Summary

To enhance the quality of a website, it’s crucial to create content that satisfies users. Mere text can be monotonous, making pages difficult to read and reducing the time users spend on them, which could lead to search engines marking these pages as low-quality. Utilizing the em tag to decorate text adds rhythm to your content and makes it easier for users to understand the important parts. Besides the em tag, various other emphasis tags can be strategically placed to maintain balance within the content.

Author Profile

International Web Consultant Paveena Suphawet

A trilingual professional in English, Thai, and Japanese, she has numerous achievements in international SEO. She studied the latest IT technologies at Assumption International University, Thailand, and majored in International Business at the University of Greenwich, UK. Following her tenure at ExxonMobil’s Thai branch, she became a key member of Admano from its establishment.

Return to the top of Japan SEO