Chapter 4: HTML Code & Search Engine Success Factors

These elements in the Periodic Table of SEO Factors encompass the HTML tags that provide crucial information to search engines. They help highlight key parts of your content and influence how your pages appear in search results.

Are you describing movie showtimes? Do you have ratings and reviews on your e-commerce pages? What’s the headline of the article you’ve published? In every case, there’s an HTML tag to communicate this information effectively to search engines, improving your site’s visibility and relevance.

Tt: Titles

HTML titles have always been and remain the most important HTML signal that search engines use to understand what a page is about. Your titles convey what your pages are about to users as well as search engines, so it’s important that they are unique and descriptive.

Titles are specified through the HTML title tag. This is typically what shows as the clickable link in a search result. Your titles should be concise, accurately reflect your page’s content and feature the keywords you wish to rank for — without keyword stuffing (a Toxin).

There might be times when search engines opt to present searchers with another title if they deem it more appropriate and descriptive. To increase the odds of the title you created getting shown to searchers, consider the terms you want your page to be found for, then use those terms in an accurate, unique title.

[Pro Tip]

“In most cases, Google will use the title in the meta description for their snippets, but sometimes they don’t and we’re seeing that if they don’t like the title for one reason or another, they would pick the H1 [instead]. 

A page can rank for a lot of different terms and when somebody’s searching for something, that title might not be a good fit . . . That’s the main driver for Google to be overriding what you do on the titles and the snippets — because the snippet that is going to come up is not going to be a great match for this specific query.

That’s why the idea of ‘Oh, you have to have exactly the same title as the H1,’ makes no sense. It’s better to have them different so that you’re giving Google a better backup. So, when users search, Google can use the title, but if they’re searching for secondary terms — because a page can rank for hundreds of keywords — they can use the H1 as a backup.” -Hamlet Batista, CEO and founder of RankSense.

Ds: Descriptions

The meta description tag is an HTML element that can be used to suggest how you’d like your pages to be described in the search listings. Descriptions to appear below the headlines in the search results. 

Although it is not technically a ranking factor, it’s a “success” factor. Adding a well-crafted description can help entice users to click your result over the others on the page.

As with titles, the search engines may not always pick the description you provide. 

“I think we have a very similar approach to Google in the sense that we will pick something that is not your official description if we think it better represents your document or your page,” says Frédéric Dubut, senior program manager lead for Bing.

“My top advice would be, if you want your own title and your own description to be used in the search results, make sure that they are really representative of what the document is about.”

“Don’t try to go out of your way to even just slightly misrepresent things,” Dubut advises. “If we think your title and description, as written in your meta tag, are not 100% accurate of what your page is about, then that’s when the system is going to look very closely at other parts of your document and going to extract a caption that it thinks is more relevant.”

St: Structure

“Structured data gives search engines a better understanding of the content on your page,” Jessica Bowman, owner of enterprise SEO consultancy SEOIn-house, explains, adding, “For users, it enhances the listing to give them more insight into what’s available on that page. From a brand perspective, it gives eye candy.” 

Structured data is a code format that lets you tell the search engines what your content is about in their one “language.” Specific schema markup (code) can make it easy for search engines to digest and understand the page content and structure. Bowman says SEOs need to master how to properly implement schema on their sites wherever appropriate.

The result of structured data often translates into what Google calls a “rich snippet,” a search listing that has extra bells and whistles that make it more attractive and useful to users.

“Structured data are tremendous for search results, because your result can be filled with rich media, images, pricing information, ratings and so on — and in a carousel versus just the blue link,” says Detlef Johnson. 

For example, let’s say you run a music publication. One of your articles is a review of Taylor Swift’s album 1989. Using structured data markup, you can inform search engines that you’re referring to an album and not the year 1989. 

Although the use of structured data is not a direct ranking factor, it may yield some advantages on the search results page. Compared to standard search results, rich results offer additional information or functionality that may be more attractive or useful to users. Rich results often appear prominently on the results page, which can increase brand awareness and drive traffic to your content. 

There is concern that rich results eliminate the incentive for users to click through to your page, which limits marketing opportunities. All other factors being equal, a rich result is still more likely to get clicks than a standard result.

For more, see SEO: Structured Data & Schema.org and Google: Google Rich Snippets sections. 

And these resources: The full hierarchy of Schema, Google’s Structured Data Testing Tool.

Hd: Headings

Headings are a hierarchical way to organize and identify key sections of your content. A page will typically have a headline. Behind the scenes, in the HTML code, the headline is wrapped in an H1 tag. This page has a headline and several sub-headings to break up the copy into sections. Those sub-headings use H2 tags, the next “level” down from H1 tags. 

Wrapping your headings in header tags is what generates the special formatting. For example, the name of this section, “Hd: Headings” is wrapped in an H2 HTML tag, as follows: <h2>Hd: Headings</h2>.

“You have to first think about the experience of the user — how do headings improve it?” Hamlet Batista, CEO and founder of SEO platform RankSense, says. “If you just put a blurb of text from start to finish, it’s going to be very difficult for the user to read and follow it. That’s what the purpose of headings are: to make sure that you can quickly scan the page, understand what it is about and even know whether you want to spend the time to read it completely.”

Using multiple H1 tags (or none at all) is not going to trip up Google’s algorithms, Webmaster Trends Analyst John Muller has said. However, he also notes that having clear, semantic headings is useful for search engines to understand pages and makes your content more accessible to users. 

It is good practice to use keywords your H1s and H2s to give search engines a better idea of what your page is about. Do not spam your headings with keywords. Use them to make your content easy for users and search engines to navigate.

CLS: Content Shift

As Google has removed the AMP requirement, we’ve gotten rid of that element and added two new ones: Image ALT (ALT) and Content Shift (CLS). Content Shift (CLS) focuses on the elements of visual stability. Cumulative
Layout Shift, which is part of the Core Web Vitals and overall page experience update, refers to unexpected changes in a page’s layout as it loads — it’s annoying for users at a minimum and can cause real damage depending on the severity of the shift and content of the page.

“Have you ever been reading an article online when something suddenly changes on the page? Without warning, the text moves, and you’ve lost your place. Or even worse: you’re about to tap a link or a button, but in the instant before your finger lands—BOOM—the link moves, and you end up clicking something else! Most of the time these kinds of experiences are just annoying, but in some cases, they can cause real damage,” said Philip Walton, Engineer at Google, and Milica Mihajlija, Chroiumum Developer. To provide the best user experience, Google recommends a CLS score of 0.1 or less.

ALT: Image ALT

Known by many names (ALT tags, image ALT, ALT descriptions, etc.), Image ALT text is HTML that describes what an image is and what it’s on the page for. While many SEOs use ALT text to help with image search, the main purpose of these image descriptors is accesibility.

“ALT text is the written copy that appears in place of an image on a webpage if the image fails to load on a user’s screen. This text helps screen-reading tools describe images to visually impaired readers and allows search engines to better crawl and rank your website,” explained Braden Becker for Hubspot.

While it can help with your SEO, the key for image ALTs is that it provides a positive user experience for users of all ability levels. It’s not a requirement in terms of being indexed and ranked, but it should be a part of any SEO’s audit to-do list.

Sc: Schema

Another new addition to the HTML section this year is Schema (Sc). Schema “is a semantic vocabulary of tags (or microdata) that you can add to your HTML to improve the way search engines read and represent your page in SERPs,” according to Moz’s SEO Guide. It’s not just for Google, either. Many search engines use Schema data to help them interpret content on the web: Bing, Yandex, and more.

There’s lots of discussion about whether structured data like Schema improves rankings, but most SEOs agree that, at a minimum, it does help with more comprehensive rich snippets. As many SEOs are implementing and experimenting with Schema nowadays, it’s become table stakes for most industries.

SEO Guide chapters: Home – 1: Factors – 2: Content – 3: Architecture – 4: HTML – 5: Trust – 6: Links – 7: User – 8: Toxins – 9: Emerging