今天是《Google Seo,每天五分钟轻松学会》第十六课,主讲如何使用hrefang属性助力多语言网站。因为合理使用hrefang属性对管理和优化不同语言版本的网站,以及用户体验上,起到非常重要的效果。
一、hrefang原理
1、什么是hrefang
hrefang是一种html属性,使用在link标签里面,用来指定网页的语言和目标区域。
简单来说,就是当不同国家境内用户访问你的网站时,为了给客户最好的用户体验,通过hrefang属性设置,网站自动展示相应语言版本的页面给用户,让客户更好的访问网站内容。
2、hrefang工作原理
假设你的网址是:www.example.com
那么你在德国使用Google搜索网站
或者进入网站时,
URL会显示网站的德语网址为:
www.example.com/de/
或者de.example.com
具体的URL展示形式取决于你如何设置。
当你在美国使用Google搜索网站
或进入网站时,
URL会显示网站的美式英语网址为:
www.example.com/en-us/
或者us.example.com
二、hrefang使用方式
hrefang使用方式有三种。
1、在html中使用
我们直接通过案例分析:
<link rel="alternate" hreflang="lang_code" href="url_of_page" />
①、案例中rel="alternate",代表该链接为此页面的备用版本。
②、案例hreflang="lang_code"中的属性值"lang_code"是举例,指语言/区域版本代码,由一个或两个可选的值组成,两个值之间用“-”符号分隔,并且此属性在使用中,切记必须要填写。
I、例如:
hrefang=“en” 代表英语;
hrefang=“en-US”代表在美国境内使用的英语版本,即美式英语;
hrefang=“en-GB”代表在英国境内使用的英语版本,即英式英语;
道理类似于我们中文的简体和繁体的意思,主要是便于用户访问浏览网站内容。
II、lang_code的值中,还可以使用x-default,主要是当网站的语言/区域与用户的浏览器设置不匹配时,系统会使用保留值x-default,这时,我们可以使用x-default,让用户跳转到相应的语言选择页面,然后进行选择语言浏览。
使用方法如下:
<link rel="alternate" href="https://example.com/en-gb" hreflang="en-gb" />
<link rel="alternate" href="https://example.com/en-us" hreflang="en-us" />
<link rel="alternate" href="https://example.com/en-au" hreflang="en-au" />
<link rel="alternate" href="https://example.com/country-selector" hreflang="x-default" />
③、案例href="url_of_page"中,url_of_page这里是举例,具体代表你网站相应语言/区域的url网址。
2、在http标头中使用
这种方法,常用于非html文件,例如pdf
我们继续通过案例来看:
Link: <https://de.example.com/file.pdf>; rel="alternate"; hreflang="de",
<https://example.com/file.pdf>; rel="alternate"; hreflang="en"
通过这种方法,我们就可以让面向德语和英语的用户访问相对应的pdf文件。
3、在xml网站地图中使用
这种方法可以把所有网址的所有语言和区域写入进去,并且能快速让Google知道。
下面我们引用官方案例来解释:
假设添加下面三个页面到xml网站地图中:
I、以英语用户为目标用户:
www.example.com/english/page.html
II、以德语用户为目标用户:
www.example.de/deutsch/page.html
III、以瑞士境内的德语用户为目标用户:
www.example.de/schweiz-deutsch/page.html
使用方法如下:
<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
xmlns:xhtml="http://www.w3.org/1999/xhtml">
<url>
<loc>https://www.example.com/english/page.html</loc>
<xhtml:link rel="alternate" hreflang="de" href="https://www.example.de/deutsch/page.html"/>
<xhtml:link rel="alternate" hreflang="de-ch" href="https://www.example.de/schweiz-deutsch/page.html"/>
<xhtml:link rel="alternate" hreflang="en" href="https://www.example.com/english/page.html"/>
</url>
<url>
<loc>https://www.example.de/deutsch/page.html</loc>
<xhtml:link rel="alternate" hreflang="de" href="https://www.example.de/deutsch/page.html"/>
<xhtml:link rel="alternate" hreflang="de-ch" href="https://www.example.de/schweiz-deutsch/page.html"/>
<xhtml:link rel="alternate" hreflang="en" href="https://www.example.com/english/page.html"/>
</url>
<url>
<loc>https://www.example.de/schweiz-deutsch/page.html</loc>
<xhtml:link rel="alternate" hreflang="de" href="https://www.example.de/deutsch/page.html"/>
<xhtml:link rel="alternate" hreflang="de-ch" href="https://www.example.de/schweiz-deutsch/page.html"/>
<xhtml:link rel="alternate" hreflang="en" href="https://www.example.com/english/page.html"/>
</url>
</urlset>
总结:
道理还是和hrefang的原理是一样的,具体使用,就记住
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
xmlns:xhtml="http://www.w3.org/1999/xhtml">*解释:把这个理解成规则,所有的内容要在规则里使用,并且有结束标签。
<url>*解释:这里理解成一个页面url地址设置开始的标记,不需要填写任何东西在此处,记住有开始就有结尾,对应好即可。
<loc>*解释:这里是放网站原本url地址子元素,并且只能放一个url地址,有结尾,需注意对应!
<xhtml:link rel="alternate" hreflang="语言/区域代码1" href="相应的语言url地址1"/>*这里是使用方法,并且记住至少放一个
<xhtml:link rel="alternate" hreflang="语言/区域代码2" href="相应的语言url地址2"/>
...
</loc>*解释:这是结尾,对应开头loc标签
</url>*解释:这是结尾,对应开头url标签
</urlset>*解释:这是结尾,对应开头urlset标签
今天就分享到这里,期待能帮助你!
留言(如有建议/友链/合作等需求可在此处留言,会尽快回复,谢谢!)