As someone who was very intimidated by SEO for a very long time and then became a Showit SEO specialist, it is my civic duty to uncomplicate all things SEO for you.
Today’s topic? HTML text tags.
Which is yet another example of a techy jumble of jargon meant to make you feel like you’ll never *really* understand SEO.
Not on my watch.
In this post, I’m covering:
- What are HTML text tags?
- Why are text tags important?
- Showit’s HTML text tags list + use guide:
- How Showit assigns text tags automatically.
- How to change a text tag in Showit.
…all in a way that’s easy to understand + implement on your own Showit site.
What are HTML text tags?
HTML text tags, or text tags for short, are the code versions of all the text and decorative elements (i.e., bullets or numbers, emojis, bits of copy added for personality, etc.) on a website page.
There’s a whole list of HTML tags used within the code of your website (like those used to annotate bold, italicized, or strikethrough words, for example), but text tags specifically give context to the level of importance and function of all the words on a web page.
As a Showit user, you don’t need to worry about the code part.
But it’s still wise to understand and pay attention to text tags.
Why are text tags important?
When you look at a page of a website, you can probably identify the navigation, the headlines, the subheadings, and the body copy from visual cues.
The fonts will differ in size, with more important info as larger headlines and supportive copy as smaller text. The fonts themselves might even differ to complement one another and clearly separate headlines from body copy.
All of these visual cues give you context as to where your eye should go first, signaling what’s the most important piece of information and what’s meant to build on and support that information.
But since search engines can’t actually see your website, text tags help them read the code instead.
When your content is understood, you can be ranked accordingly. And text tags help the bots better understand the structure and content of each page of your website.
Similarly, screen readers rely on text tags for context, allowing the user to focus on the most important info, skim the details, or skip ahead to a certain section. Which means that getting your text tags right plays a huge role in the accessibility of your website.
Showit’s HTML text tags list + use guide:
Following the same order in which text tags are listed in Showit’s dropdown menu, here’s what each one means and how to use text tags correctly in Showit:
div
The div tag is reserved for decorative text elements on your page. Traditionally, the div tag is used to group together elements that can then be styled using CSS. But the average user should assign div to purely decorative elements.
For example, if you use an accent font to sprinkle personality-driven statements throughout your site, tag them with div.
In the example above from my homepage, the large yellow text is how I style my accent copy. What you see pictured is part of a scrolling banner that says, “Stay Awhile / Lovely to Have You Here.” That copy doesn’t add any SEO benefits or helpful context to the page. It’s purely to add personality. And so, it gets the div tag.
h1
Also known as Heading 1, this is reserved for the single most important piece of copy on your page.
Typically the largest and first headline on the page is the h1. But Showit is unique in that they allow you to tag anything as an h1.
The pro is that you have complete freedom to do what you wish with your site’s layout.
The con is that oftentimes people inadvertently hurt their SEO because of said freedom.
Here are the guidelines to follow so that doesn’t happen to you:
- Only one h1 per page. (Double, triple, quadruple check!)
- Reserve this tag for the most important piece of copy on the page.
- Try like crazy to include your target keyword somewhere in your h1.
- Use it above the fold (aka don’t make people scroll to read it).
h2
Otherwise known as Heading 2, the h2 tag should be used for the second-most important pieces of information on the page. Tag secondary headings or subheadings that support your h1 as h2’s to show you’re focused on the topic at hand and know your stuff.
Technically, you can use this one as many times as you want. And that number will vary page to page and website to website. But you’ll likely have multiple of these, so aim to include your target keyword in one of your h2’s.
This basically tells Google that this is an important topic to you and you’re discussing it in detail on the page, improving the chances of that page being ranked.
h3
Also known as Heading 3, h3’s are used for information that’s still important, but not as important as h1 and h2 headings.
When possible, sprinkle supporting or secondary keywords (aka sub-topics or synonyms for your target keyword) through your h3 tags. Emphasis on sprinkle as you never want to keyword stuff.
nav
Short for “navigation”, nav tags are only to be used for navigation links in your main navigation (at the top of the page) and for any navigational links in your footer (at the bottom of the page).
Not for use in your calls to action or buttons throughout the page.
p
The p tag is short for “paragraph”. Use it for all your body copy. Easy peasy.
How Showit assigns text tags automatically.
Whether you’re using a Showit template or designing from scratch, you’ll eventually add in your own content by way of the “Add Element” button:
When you choose one of Showit’s built-in text styles, Showit automatically assigns an HTML text tag to match:
- Title → h1
- Heading → h2
- Subheading → h3
- Paragraph → p
This is convenient, but it’s also a little sneaky, because Showit is assigning the tag based on style, not based on importance.
Here’s why that matters…
Let’s say you already have one h1 at the top of your page (as you should). Later, you decide you like the big bold “Title” font for a testimonial or special announcement lower on that same page.
If you choose “Title” just for the look, Showit will give it another h1 tag without warning. Suddenly you’ve got two h1’s on the page, which is a major SEO no-no and can confuse search engines about the main topic of that page.
That’s why I always recommend you double-check and manually update your text tags. *Especially* for any new text you add.
And because Showit gives you complete creative control, you can change the tag without changing how the text looks.
How to change a text tag in Showit.
As long as you know where to look, changing a text tag in Showit is really simple. Here’s how:
- Click on the text box you want to edit. (A blue box will appear around the one that’s selected.)
- In the right-hand side panel, click on “Text Properties.”
- Click the dropdown next to “Text Tag” and select the correct option.
Here’s a numbered visual of what that looks like in the back-end of Showit:
A little back-end task for a big SEO win.
Updating HTML text tags is one of those tasks people either don’t realize they need to do or push to their will-get-to-whenever-I-can-but-probably-never-will task list.
But the SEO + accessibility boost it brings is well worth the effort.
If you’re a business owner who doesn’t have the time (or desire) to do this themselves or a Showit designer who wants to hand off tedious client project close-out tasks like this one, I can take it off your plate.
My Showit Site Sweep is a two-day deep clean of your site’s back-end, where I catch (and fix) things like duplicate h1’s, missing tags, and other sneaky issues that can hurt your SEO — so you end up with a site that’s organized, easy to update, and SEO-friendly. Book yours here.
Thanks for reading! I hope you found this helpful and learned something new about Showit SEO.
If you’re new around here, hi! I’m Shannon—online homemaker specializing in Showit SEO, copywriting, and web design that gets your dream clients feeling comfy-cozy and ready to choose you.
Come on in and stay awhile:
- Follow along on Instagram.
- Subscribe on YouTube.
- View my 1:1 Showit SEO services to work together.
- Book a Showit Site Sweep to hand off the back-end tasks you hate to a Showit SEO gal who loves them. 💁♀️
+ view the comments
