Search engine optimization (SEO) has been around for a while and it’s safe to say that it’s one of the biggest driving forces behind the way tech trends form and evolve in the online world. For many years now, digital marketers and web developers have been doing their best to create websites that are instantly recognizable to search engines, thus driving value both to site owners and visitors. During this quest, they’ve come up with loads of different gadgets and tools, from exploiting social media platforms to content optimization, link building, indexability and so on.
However, sometimes, SEO professionals tend to forget that optimizing isn’t only about links and content. Great SEO should touch every aspect of the website and the site’s code is no exception. After all, it is the engine that drives the website.
That being said, a semantically coded page can give that competitive edge marketers are looking for with increased indexability and more accurate indexing in general.
This is where Schema and HTML5 come into the picture.
Search engines have always been madly in love with HTML since the very beginning, mainly because HTML was designed for well-structured semantic content forming the page’s core. As such, it helps search engines a great deal in finding where to find style sheets, scripts, images, videos and many more sections of a page or pieces of content.
The biggest problem was that developers often used their own unique ways when it came to defining different sections on pages, which made it almost impossible (okay, really difficult) for search engines to identify the desired content on a website.
With the introduction of HTML5, new semantic elements have been added to improve the understanding of web pages (both for developers and browsers) and have replaced elements like <div> or <span> that where non-semantic.
Even though initially, HTML5 received mixed reviews from developers, being deemed as “too complicated”, time has passed and it’s clear now that its semantic elements and other features can greatly benefit websites and SEO efforts giving both browsers and users what they’re looking for.
HTML5 semantic elements and why should you start using them
These are the elements that help in defining different web page parts:
- <header> – The element that defines the header area of the section or document
- <main> – Defining the main part (content) of the given document not including navigation, footer or other global items
- <nav> – Used in defining navigation links
- <article> – A piece of self-contained content within a document, like a comment, blog posts and such
- <section> – Used to define sections within the given document
- <aside> – Used to define the content that can be found aside from the main content.
- <figure> – Defining self-contained, independent content like videos, photos or illustrations
- <mark> – Used to help browsers identify important content or something that is highlighted
- <figcaption> – The element which helps identify the caption for the figure
- <hgroup> – Aids in identifying a group of header tags
- <footer> – Used to help identify the footer area
- <time> – Helps defining time
How do semantics help?
- Identification – As stated above, semantic elements help a great deal when it comes to identifying key page parts. For example, Google’s Hummingbird engine focuses on the conversational aspects of the content on pages and using HTML5 semantics will help Hummingbird in understanding the entire page better.
- Keeping traffic on the website – HTML5 can help keep visitors on websites longer, and the more time visitors spend on a particular page, the higher the ranking for said page.
- Helps in repurposing or syndicating page content – Semantic elements encourage the syndication of website content across channels. This means that there are more trusted “external” links to your site which helps a great deal with page rankings.
- Handles rich content better – Especially good for pages that are content-heavy (audio and video).
Apart from semantics, HTML5 can help out search engines when AJAX & URLs’ remove the #! from URLs. This isn’t a big deal when it comes to user-experience but it prevents search engines in successfully passing page value and can also lead to problems when it comes to indexing. HTML5 solves this problem by using the pushState method, by manipulating the browser’s history object.
Schema is a code that is added to pages to help browsers better understand what the content means on the given pages, and not just what the content says. To put it into perspective, with Schema, search engines can tell if “bass” in the heading refers to the fish or music. As such, browsers can give better results to their users.
When websites use the schema markup, search engines can help give better value and overall experience to users because the markup enables them to better understand web pages.
Why is this important?
Well, for starters, it has been shown that adding the Schema Microdata (initially created by Microsoft, Google, Yahoo, and Yandex) helps pages get more click-through rates (CTR) in a SERP (Search Engine Results Page) against those pages that don’t use the markup. And we all know that CTR is a crucial factor when it comes to page ranking.
The markup was created with the user in mind helping them find the desired pages and content easier and comes with loads of different microdata sets created specifically to cater to different types of websites and info. Here are a few examples:
- Local businesses
- Software applications
- TV episodes
- Book reviews
As said before, these are only a few great examples. You can also find everything else, even medicine dosages.
If you are looking to use Schema…
When it comes to Schema – the more the better, meaning, to more content you mark up, the better results you can achieve. It might be a bit confusing at the beginning but in time, you’ll realize that there’s tons of content you can mark up. However, it’s important to mark up only the content that’s visible to users and stay away from hidden elements.
To sum it up
It’s clear now that there’s more than meets the eye when it comes to SEO and experts shouldn’t solely rely on link building, content and exploiting social channels. It’s true that “content is king” in digital marketing and thus plays an utterly important role in search engine optimization, however, there’s also another saying: “Great SEO and web design go hand in hand”. This goes a bit deeper, however, it reminds both SEO experts and web developers that the sole core of a website and different structural aspects can also dramatically improve not just the way browsers rank and identify your content, but the way your visitors react to it.
And at the end of the day, websites are -at least should be- primarily created for people, not search engines. Content and products should hold value, be relevant to customers. If those criteria aren’t met, not even the best SEO practices and web design will be able to help a business turn a profit or grow at a faster rate.
Once the value is in place, HTML5, Schema, links social channels and content can all work to boost traffic and help turn leads into valuable customers.
All in all, never forget that your customers should be your priority, search engines can be your close second.
- Cloud-Based App Development: 6 Tips to Avoid Common Pitfalls - 2. March 2021.
- Nuxt.js’ SSR/Universal Mode: What Is It and How to Host It - 26. February 2021.
- Your Ultimate Guide to Creating an Amazing Website for an IT Startup Company - 23. February 2021.