HTML网站资源下载器
1247人气数
Aibi Photo AI照片增强器v1.34.0破解版
1331人气数
Photo Editor照片编辑器v9.7.1破解版
1294人气数
自由门VPN加速器
1719人气数
Telegram 电报TG 即时通讯软件
1335人气数
Little Rocket VPN 3.0 小火箭加速器3.0
1446人气数
今天主讲如何使用hrefang属性助力多语言网站。因为合理使用hrefang属性对管理和优化不同语言版本的网站,以及用户体验上,起到非常重要的效果。一、hrefang原理1、什么是hrefanghrefang是一种html属性,使用在link标 ...
今天主讲如何使用hrefang属性助力多语言网站。因为合理使用hrefang属性对管理和优化不同语言版本的网站,以及用户体验上,起到非常重要的效果。 一、hrefang原理 1、什么是hrefang hrefang是一种html属性,使用在link标签里面,用来指定网页的语言和目标区域。 简单来说,就是当不同国家境内用户访问你的网站时,为了给客户最好的用户体验,通过hrefang属性设置,网站自动展示相应语言版本的页面给用户,让客户更好地访问网站内容。 同时,你在不同地区进行Google搜索时,搜索结果展示的title和description以及URL地址都是当地语言。 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标签 |