Fonts and SEO: how to use bold and italics properly

SEO Gennaro Mancini 19 April 2024 Reading time : 10 minutes

Put us to the test!

Analyze your site

Select the database

This is a rather old and probably outdated topic, although it cyclically comes back in social discourse and actually even in the conversions we have with our users. Is there a difference in using strong and bold HTML tags in a text? What about between italic and emphasized? And how much does the use of these font signals affect SEO? So here are a few pointers that we hope will clarify the question and reassure SEO copywriters and publishers, starting with a general consideration: typography management should not be done only with the aesthetic effect in mind, because font choice, the use of bold and italics, or increasing font size are crucial tools for improving the usefulness and readability of the content we offer to our readers.

What bold is in HTML

Bold in HTML is a text formatting element that makes letters thicker and darker than normal text. In this way, we can guide the reader’s eye to relevant information, improving the readability of the text and highlighting key concepts to prevent them from going under the radar and being ignored.

Optimize your content

Use SEOZoom’s Editorial Assistant to refine all your content

Find out more

This effect is achieved through the  or  tag. Although both tags are visually similar, the  carries with it an additional semantic meaning: it indicates that the text is of special importance. This can have implications not only for human readers, but also for search engines and assistive technologies.

How to write in bold: apply strong to sentences or words

To apply bold to a segment of text, we need to enclose the desired text within or  tags. For example, this text is important will make the text “this text is important” bold. It is a simple practice, but one that can make a difference in the readability and organization of information on a web page.

Going into more detail, writing bold text on a web page is something that can vary slightly depending on the environment in which we are working. In particular, if we use a Content Management System (CMS) such as WordPress, Joomla or Drupal we usually have two main ways to apply bold – via the visual editor or directly in the HTML code editor – to which we add built-in keyboard commands.

Visual Editor

Most modern CMSs offer a visual editor, sometimes called WYSIWYG (What You See Is What You Get), which allows text to be formatted in a manner similar to a traditional word processor. To apply bold:

We select the text we want to make bold.
We click on the corresponding button, usually represented by a bold “B”.
The CMS will automatically add the necessary HTML tags without the user having to write any code.

HTML Code Editor.

If we prefer to have more direct control or if we need to work on more technical aspects, we can switch to the HTML code view, often accessible via a button such as “Text,” “Source Code,” or similar. In this mode:

We find the point in the text where we wish to apply bold.
We insert the opening tag before the text to be emphasized.
We add the closing tag just after the text in question.
The result will look like this: This text will be bold.

Integrated Commands

Some advanced text editors or integrated development environments (IDEs) may offer keyboard shortcuts to quickly apply bold. For example, you might be able to select text and press a key or key combination (such as Ctrl + B on Windows or Cmd + B on macOS) to automatically encapsulate the text in  tags.

What italics is in HTML

Italics is another formatting style that tilts the letters slightly to the right, giving the text a different look than normal. In HTML, italics is achieved with the  or  tags. Similar to bold, the  tag has semantic value beyond pure aesthetics: it indicates that the text has a special emphasis or is pronounced with a different tone.

Often used for quotations, foreign terms, titles of works, or to express a different tone of voice, italics help create a subtle but meaningful distinction in the flow of text. It is therefore an effective way to differentiate the tone or importance of a sentence or word within a larger context.

How to write in italics: applying emphasis to phrases or words

To italicize a piece of text, or  tags are used in a similar way to bold. For example, this text is emphasized will make “this text is emphasized” appear in italics.

From a practical standpoint, the directions given above apply, and so these are the techniques for slanting text whether we operate in a CMS or a pure text editor.

Visual Editor

In the user-friendly environment of a visual editor, the application of italics is intuitive:

We select the portion of text we wish to italicize.
We click on the corresponding icon, often represented by a slanted “I.”
The system will automatically insert the necessary tags for us, without requiring any manual intervention in the code.

HTML Code Editor.

In the case of a manual approach or greater precision, the HTML code editor is the way to go. Here are the steps to follow:

We locate in the text the exact spot where we want the italics to appear.
We place the opening  tag before the phrase or word to be emphasized.
We place the closing tag  immediately after the selected text.
The resulting code will look something like: This text will be italicized.

Integrated Commands

In some advanced text editors or IDEs, we may have quick commands for applying italics: in this case, just select the text and use a keyboard shortcut, such as Ctrl + I on Windows or Cmd + I on macOS, to wrap the selected text in  tags automatically.

Font emphasis tags, the myth of SEO effects and the real impact

When it comes to SEO, we often fall into the myth that every little element on a web page can be a ranking factor for Google. However, it is important to distinguish between what actually affects ranking and what actually improves the user experience – an absolutely central and non-negligible element, but one that does not imply a direct connection to improving organic visibility.

Starting from the basics: Google, with its complex and ever-evolving artificial intelligence, aims to provide users with the most relevant and quality results, and so even intuitively one can understand that marking a word or phrase with italic or bold tags certainly cannot decisively influence the algorithms.

So, let’s clear the air right away: it has never been denied that there may be a mild value for SEO in the use of strong and emphasized tags, but what we care about is that there is certainly value in terms of usability and readability for people, who at a glance can identify the parts of text that you have decided to emphasize.

Bold, italics but not only: the evolution of HTML tags in the semantic web

This last statement ties in with the history of these HTML tags, which have evolved over time to accompany the transition from a simple markup language to one that seeks to understand and categorize content in a more meaningful way, as per the characteristics of the so-called Semantic Web.

From the earliest steps of HTML code, there were a number of tags that allowed text to look different in browser rendering:  was the bold tag, the italic tag, and the underline tag. In all three cases, these were notes of graphical value only, which added no special information about the highlighted words for crawlers. In other words, these tags were purely presentational: they instructed the browser to display the text in a certain way, but provided no additional context or meaning. At a time when the Web was primarily a collection of static documents, this simplicity was sufficient.

With the introduction of HTML 2.0 through HTML 5.0 there was a significant change with the addition of the  and  tags, which are designed to add a level of semantic meaning to text, not just to change its appearance. We are indeed in the semantic web, and the ultimate deprecation of the old tags has been not just formal, but substantive: the new indications have greater expressive capacity and communicate a very specific meaning that can be interpreted by search engine crawlers.

The semantic web is an extension of the current web, in which information is given in a way that is understandable not only to humans but also to machines. In this context, the importance of semantic tags such as  and  has grown, as they allow search engines and other tools to better analyze the context and meaning of content. Other presentational tags such as  and <center> have also been deprecated in favor of CSS (Cascading Style Sheets), which separates design from content structure, allowing for greater flexibility and accessibility. In addition, HTML5 introduced new semantic elements such as <article>, <section>, <nav>, and <header>, which help define the structure and layout of content in a more meaningful way.

What are the html tags related to typography

Web typography is like the tone of voice in a conversation: it can influence not only how words are perceived, but also how they are understood.

As mentioned, back in the early days of HTML there was the possibility of using tags to “modify” the visual presentation of onpage text; classic presentational tags were commonly used to change the appearance of text, and the main ones include:

 makes text bold. Specifically, the  tag is short for bold and indicates a stylistic and graphic difference of one or more words from the rest of the text, but without attributing specific importance signals of these parts.
 renders text in italics. Specifically, the tag is short for italic (which means cursive, as a tribute to the Venetian typographer Aldo Manuzio and the style of writing that resembles calligraphy) and represents a portion of text in which something is expressed (a tone or mood, for example) that differs from the remaining content, without adding other meanings or elements of importance.
 emphasizes text. Specifically, the tag is short for underline and is used to emphasize portions of text and distinguish them from neighboring text.
 defines the font, size and color of the text.
<center> centers the text on the page.
<strike>or <s> shows the text with a line through it (strikethrough).
<big> increases the size of the text.
 reduces the size of the text.

Subsequent revisions and various updates implemented in HTML with the goal of improving the semantics and structure of Web documents then led to the creation of these new semantic markup, “new” tags or methods that provide richer context for search engine crawlers and improve accessibility because these markups have greater expressive capacity and communicate a very specific meaning that can be interpreted by search engine crawlers:

 indicates that the text is of particular importance, with a strong emphasis. It is displayed in bold by browsers.
 shows emphasis (from the initials of “emphasis” in English) that could influence how the text is interpreted. It is displayed in italics by browsers.
CSS (Cascading Style Sheets): In place of the and <center> tags, CSS is used to define styles such as font type, size, color, alignment and other aspects of design. This allows for greater separation between content and presentation.
 is used to highlight parts of text.
<del> indicates text that has been deleted from a document. It replaces <strike>or <s> to provide a semantic context of deleted text.
<ins> indicates text that has been inserted into a document.
 continues to be used, but with semantic context to indicate text of lesser importance.
and  for formatting superscript or subscript text, useful for chemical, mathematical formulations or references.

The use of these tags goes beyond simple visual presentation: they are an integral part of the semantic structure of a web page and, as such, can help improve the accessibility and understanding of content by users and search engines, which continue to refine their algorithms to better understand the context and relevance of content. As such, they can feebly promote proper indexing and, potentially, better ranking in search results. It follows that developers and content creators are encouraged to use these tags, not least to contribute to a more organized and understandable Web, where meaning is as important as presentation.

What bold with strong means

Labeling one or more terms with the strong tag means giving a net relevance to this text: it serves to thematize the page, it can also be used within headings, and it could also help to give importance to the keywords we are targeting with SEO strategy. It is no longer just a visual highlight, but a signal that search engines are also sensitive to, and they interpret that text as semantically important.

What italics with em means

Similar is the meaning of the new tag, which is used to emphasize (as on the other hand the name of the tag itself says, emphasis) a text or phrase that has different intonations from the others. Again, there is now added semantic emphasis recognized by crawlers, which in turn can then assign different weight to the portion of text thus characterized.

The use of strong and em tags for SEO

The decision to deprecate the old and in favor of the semantic tags and gives us some food for thought: first, it serves to give a clearer separation between content and graphics, freeing the tags from defining the appearance of text and leaving them with a more useful task, that of signaling information.

Thus, by using bold or italicized portions we provide not only a reading cue to users (focus your attention on this word or expression), but we also send a message to browsers, text-reading tools, and crawlers about the relevance those different portions have.

Going back to the initial reasoning, changing tags and favoring semantic ones is a remarkable operation that only makes full sense if we also frame it in a perspective of (albeit minimal) SEO variation: this is why we can say that putting keywords in bold (obviously strong) can have some positive effect for the ranking of the keywords we are working on, although obviously there is no actual feedback that can confirm the intuition.

When the crawler analyzes a page it immediately searches for the most relevant information, and so the use of emphasis tags might be one way to provide such hints. In addition, well-formatted text also has value for the reader, who is made easier to search for information, and we have said many times how writing online from an SEO perspective is also and above all writing for people and not just for robots.

How to use emphasis tags in text

Ultimately, here are some practical tips for managing the emphasis tags in the text when writing: first, for bold we should use the tag and avoid the tag (which is now deprecated); similarly, for italics we will use the tag instead of .

Improve your texts

Thanks to the Editorial Assistant, writing from an SEO perspective is quick and easy

Find out more

These labels allow you to highlight longer keywords or queues to strike more of a chord with users, give indication to crawlers and search engines, and possibly gain a slight ranking advantage.

Obviously, one should not overdo it: highlighting long sentences or many words in bold makes the text confusing and offers no added value, just as inserting italics on entire periods does little good.

Common sense remains the compass that must guide our work: text must be optimized for easy reading and comprehension, because this means focusing on quality and producing content that users and search engines like.

Google’s position on italics and bold in content

In short, using italics and bold in a piece of content does not directly affect a page’s ranking. However, what is clear is that Google values well-structured and easily navigable content, and this is where the importance of these typographic tools comes in.

In fact, as John Mueller reminds us, in its operations to try to figure out what the content of a web page is about, Google “looks at different things, such as the titles of a page,” but it also analyzes what “is actually bolded or emphasized within the text of the page,” because theoretically, the parts so labeled have to some extent some extra value, in the sense that it is a clear indication of what the author thinks are the most relevant passages for the topic being discussed.

This value, however, is relative only to the content of the page itself, and going to extremes we can say that using bold for some important points in a paragraph can help SEO, that is, it supports Google to better understand that paragraph or that page. But we should not go overboard in interpretations of this concept, because it is again Mueller who makes it clear that “a few snippets of bold text in an article can send stronger signals to Google, but bolding all the text on a page would not add any value,” precisely because the emphasis effect of these tags would be lost.