HTML5: Should Hreflang Always Point To A Direct Translation?

This is a good practice to place this kind of links in head for multilanguage sites: But, acco

Solution 1:

alternate+hreflang: link vs. a

Semantically it makes no difference which one to use. In both cases the link links to a translation of the page.

But it’s conceivable that a consumer (e.g., a search engine) decides to ignore alternate+hreflang on a elements, for example because some sites allow this markup in user comments. It’s rare that users could edit the head, so they might only look for alternate+hreflang on link elements in the head.

Unless you have strong reasons not to do this, simply provide both:

• a language switcher, especially for your human users, in the body (a elements)
• translations links for bots that only check the head (link elements)

Page vs. site

An alternate+hreflang link is defined to point to a translated document, not a site.

Pages not translated

If /pl/artykul/id/101 is not translated into other languages (or you don’t know for sure that it is, or you don’t know the URL), simply don’t use alternate+hreflang.

And yes, it would be wrong to link to a translated parent page in this case: /pl/aktualnosci is not a translation of /en/news/2015/03/02/stackoverflow-rules.

Of course you could still provide such a link for usability reasons, but you should not use the alternate+hreflang markup for this link.

Solution 2:

1. Since rel attribute defines the relation of the linked document, if you use it in the anchor tag theres no need for the link tag in the header.
2. The translation link should always point to the translated version of the current page and not the website (pl/kontakt -> en/contact).
3. If the resource is not translated, omit the link to the translation (obviously you have to check for translations when generating the page). If the URLs are translated then the translation link must point to the URL of the target language (same of above, must check for translations ahead).

As of UX if I'm reading the news of today, when I click on a link promising me to show it in my own language, the last thing I want to find is the news of yesterday translated, instead I would rather understand that there's no translation available (grayed out disabled link might be the most user friendly), before navigating. So better follow semantics and keep it simple, instead of trying to present a counter-intuitive UX.