The Contentful SEO guide
International SEO & localization
Joshua Lohr, Rob Remington, Nick Switzer
Updated: April 23, 2024
The Contentful SEO guide
This is chapter 9 of the series,The Contentful SEO guide.
Summary
Contentful provides built-in tooling that makes it simple for content creators to manage localized and translated versions of their content. We won’t get into the specifics of architecting that portion of your build here, but we do have a detailed tutorial, a full section of our Content Modeling Design Patterns course dedicated to localization, and documentation on a few different localization patterns to consider. Additionally, check out our guide to best practices for multilingual SEO.
Localization markup
If you have localized variations of the same content, such as the same page in both English and Spanish, or the same page in British English and U.S. English, you need to add the appropriate language attributes to your HTML to avoid duplication and serve the correct content in the correct region’s search engine. The good news is, once you’ve configured your desired locales in Contentful, your developers can easily add the needed attributes in the frontend.
Failure to do so could result in the following negative results:
- Duplicate content penalties from search engines,
- Cannibalization, meaning your own content competes against itself in search results, and
- Incorrect content served in the local search engine, e.g., U.S. English content served in Google.co.uk (Google UK), when you have localized content for the target local search engine.
There are two tools at your disposal for preventing duplicate content, which are the “HTML lang” attribute and “hreflang” markup. Both should contain one language code (in ISO 639-1 format) and optionally a region code (in ISO 3166-1 Alpha 2 format):
- For example, if your site is in English and you only have one variation of your site, then you would simply use en for your language declaration. Note this language declaration is always spelled out in lowercase letters.
- Alternatively, if you have variations of your site in both British English and American English, then you would use the respective language (lowercase) and region (uppercase) codes, separated by a hyphen:
en-GB
en-US
Important to note, Google has stated that it does not use the HTML lang attribute or hreflang markup to determine the language of the page. Instead, it uses its algorithm to make that determination. We highly recommend having both of these elements in compliance to ensure all search engines serve the correct content in the correct local search engine to mitigate duplicate content risks.
HTML lang attribute optimization
- The HTML lang attribute declares the language and optional region for the page.
- The attribute should be placed within the
<html>tag. - Language only example:
<html lang="en"> - Language and region example:
<html lang="en-GB">
Hreflang markup optimization
- Hreflang markup declares the language and optional region for the page.
- It was designed (by Google) to help search engines serve the correct content in the local search engine, and negates negative duplicate content signals.
- Not using hreflang markup could cause search engines to be unaware of the direct relationship of these properties, and thus could be treating replicated content negatively as duplicate content.
- The
x-defaultattribute is an optional tool and highly recommended to declare the default language and/or region for search engines to serve across in local search engines where you have not specified an “alternate” (or variation) URL. - The hreflang markup should appear in
<head>, and is handy to QA if it appears after the canonical link element tag, but it’s important to note that these tags can be implemented via HTTP headers or XML sitemap instead. For illustrative purposes, we have only outlined how to implement hreflang via HTML tags since it’s the most common method for implementation.
Hreflang markup examples
Let’s take a look at a few examples.
Language example:
Example URLs:
- Global English:
https://www.example.com/example-page/ - Global Spanish:
https://www.example.com/es/página-de-ejemplo/
hreflang markup:
<link rel="alternate" href="https://www.example.com/example-page/" hreflang="en" />
<link rel="alternate" href="https://www.example.com/es/página-de-ejemplo/" hreflang="es" />
Language example with x-default:
Example URLs:
- Global English:
https://www.example.com/example-page/ - Global Spanish:
https://www.example.com/es/página-de-ejemplo/
hreflang markup:
<link rel="alternate" href="https://www.example.com/example-page/" hreflang="en" />
<link rel="alternate" href="https://www.example.com/es/página-de-ejemplo/" hreflang="es" />
<link rel="alternate" href="https://www.example.com/example-page/" hreflang="x-default" />
Language and region example:
Example URLs:
- U.S. English:
https://www.example.com/example-page/ - UK English:
https://www.example.com/en-gb/example-page/ - Global Spanish:
https://www.example.com/es/página-de-ejemplo/
hreflang markup:
<link rel="alternate" href="https://www.example.com/example-page/" hreflang="en-us" />
<link rel="alternate" href="https://www.example.com/en-gb/example-page/" hreflang="en-gb" />
<link rel="alternate" href="https://www.example.com/es/página-de-ejemplo/" hreflang="es" />
Language and region example with x-default:
Example URLs:
- U.S. English:
https://www.example.com/example-page/ - UK English:
https://www.example.com/en-gb/example-page/ - Global Spanish:
https://www.example.com/es/página-de-ejemplo/ - Rest of world:
https://www.example.com/example-page/
hreflang markup:
<link rel="alternate" href="https://www.example.com/example-page/" hreflang="en-us" />
<link rel="alternate" href="https://www.example.com/en-gb/example-page/" hreflang="en-gb" />
<link rel="alternate" href="https://www.example.com/es/página-de-ejemplo/" hreflang="es" />
<link rel="alternate" href="https://www.example.com/example-page/" hreflang="x-default" />
In conclusion
Thanks for checking out our Contentful SEO guide! We hope you’ve found it helpful.
Please don’t hesitate to reach out to our Professional Services Team should you have any questions about managing your SEO with Contentful. Or, if you’re brand new to Contentful (welcome!), get started with a free account today!
Written by
Joshua Lohr
Senior SEO Manager
Josh is the SEO Lead at Contentful. With 15 years of experience working directly in SEO for global brands and agencies, he gets his kicks playing a variety of instruments and appreciating the nature of his adopted home in Scotland.
Rob Remington
Practice Architect
Rob Remington is a Practice Architect at Contentful, where he collaborates across all areas of the company to develop our recommended ways of building with Contentful, and ensure our technical teams have the resources they need to help our customers succeed.
Nick Switzer
Senior Solution Engineer
Nick is a technical people-person who lives for solving business problems with technology. He is a solution engineer at Contentful with 14 years of experience in the CMS space and a background in enterprise web development.