移动站适配rel=alternate PC页和H5页适配标注
鉴于移动化大潮的汹涌和H5页的炫丽普及,百度针对PC页与H5页的跳转适配方式推出了最优方案:
1.在pc版网页上,添加指向对应移动版网址的特殊链接rel="alternate"标记,这有助于百度发现网站的移动版网页所在的位置;
2.同时在移动版网页上,添加指向对应pc版网址的链接rel="canonical"标记。
电脑端网站截图:

移动端网站截图:

如果你的网址是:
pc版网址:http://pc_url
移动版网址:http://mobile_url
那么此示例中的注释如下所示:
在pc版网页(http://pc_url) 上,添加:
<link rel="alternate" media="only screen and(max-width: 640px)" href="http://pc_url" >
在移动版网页(http://mobile_url) 上,所需的注释应为:
<link rel="canonical" href="http://mobile_url" >
之前的Meta标记(mobile agent)会继续沿用,但我们推荐使用HTMAL5语言制作的移动页面使用最新方案进行跳转适配,其它如xml语言的移动页跳转适配,需要继续使用之前的meta标记方式:
<meta name="mobile-agent"content="format=[wml|xhtml|html5]; url=mobile_url">
内容整理:http://www.cnblogs.com/osfipin/。SEO移动站适配标签。
移动站适配rel=alternate PC页和H5页适配标注的更多相关文章
- PC站与H5移动站最佳适配方案
HTML5是目前HTML的最屌版本,同时也是建设移动站的最佳技术.百度适时推出PC站与H5移动站的最佳适配方案,对站长而言实在是久旱逢甘霖.详情如下: PC站与H5移动站最佳适配方案 pc端: 在pc ...
- Flexible实现H5页面的rem布局适配
1.https://www.w3cplus.com/mobile/lib-flexible-for-html5-layout.html (使用Flexible实现手淘H5页面的终端适配) 2.http ...
- 教你如何用 lib-flexible 实现移动端H5页面适配
前话 好久没写教程了(可能会误导新手的菜鸟教程( ̄▽ ̄)"). 这是我的github,欢迎前端大大们和我一起学习交流 https://github.com/pwcong 最近入职公司做前端实 ...
- 站点的rel="alternate"属性
概述 今天看决战平安京官网源码,突然看到了rel的alternate属性,百度了一下,记录下来,供以后开发时参考,相信对其他人也有用. PC端rel 在pc版网页上,添加指向对应移动版网址的特殊链接r ...
- 多语言网站利器 rel="alternate" hreflang="x"
下面是我在浏览网站时无意看到的,然后就搜了一下,感觉内容不错但我还没有测试,就转载过来做个备注,有时间了在翻过来看看 rel="alternate" hreflang=" ...
- 【原】让H5页面适配移动设备全家 - 前端篇 - PPT
7月份在部门内给设计中心的同事们带来<让H5页面适配移动设备全家 - 设计师篇 - PPT>的分享,在视觉和交互稿上提出页面适配的建议及提升页面体验的好处,促进前端和设计双方更好的合作,同 ...
- 【原】让H5页面适配移动设备全家 - 设计师篇 - PPT
上一篇文章<pageResponse - 让H5适配移动设备全家>中分享了一个小插件让一套H5页面适配几乎所有移动设备,得到了一些同学的推荐和认可,这里感谢大家的支持. 在此之前也在部门前 ...
- 利用link标签rel="alternate stylesheet"属性实现界面动态换肤
rel="stylesheet"属性指定将一个样式表立即应用到文档.rel="alternate stylesheet"属性将其作为备用样式表而在默认情况下禁用 ...
- 如何用PC标签在列表页中调出文章内容 phpcms
如何用PC标签在列表页中调出文章内容 phpcms v9 moreinfo=”"参数说明 {pc:content action="lists" catid="$ ...
随机推荐
- 在Linux(Luna)下向Launch启动器中添加图标
记录下在Luna下向Launch中添加图标的步骤,以供以后参考,这里我以加入eclipse图标为例: 首先,我们来创建一个desktop文件(Luna中到启动器Launch可以看作是Ubuntu中到桌 ...
- 【腾讯bugly干货分享】微信Android热补丁实践演进之路
本文来自于腾讯bugly开发者社区,非经作者同意,请勿转载,原文地址:http://bugly.qq.com/bbs/forum.php?mod=viewthread&tid=1264& ...
- 快速构建App界面的框架(●'◡'●) -----SalutJs
前言 卤煮在公司之初接触到的是一个微信APP应用.前端技术采用的是Backbone+zepto等小型JS类库.在项目开发之初,这类中小型的项目采用这两种库可以满足基本的需求.然而,随着迭代的更新和业务 ...
- .NET基础拾遗(6)ADO.NET与数据库开发基础
Index : (1)类型语法.内存管理和垃圾回收基础 (2)面向对象的实现和异常的处理 (3)字符串.集合与流 (4)委托.事件.反射与特性 (5)多线程开发基础 (6)ADO.NET与数据库开发基 ...
- 从Java文件到字节码文件
本文涉及的javac编译器来自openjdk. javac的目录地址为:解压目录/langtools/src/share/classes/com/sun/tools/javac/ javac编译器将J ...
- CSharpGL(15)用GLSL渲染2种类型的文字
CSharpGL(15)用GLSL渲染2种类型的文字 2016-08-13 由于CSharpGL一直在更新,现在这个教程已经不适用最新的代码了.CSharpGL源码中包含10多个独立的Demo,更适合 ...
- Java基础知识(贰)
一.面向对象 Java中的面向对象与C#的面向对象,本质都是一样.所以对于学过C#的同学理解Java中面向对象的概念就比较轻松. 对象 定义: 万物皆对象,客观存在的事物都称为对象. 1.面向对象 类 ...
- Error on line -1 of document : Premature end of file. Nested exception: Premature end of file.
启动tomcat, 出现, ( 之前都是好好的... ) [lk ] ERROR [08-12 15:10:02] [main] org.springframework.web.context.Con ...
- SQL Server 远程连接出错~~~无法访问服务器
异常处理汇总 ~ 修正果带着你的Net飞奔吧!http://www.cnblogs.com/dunitian/p/4599258.html 代理开一下 tcp/ip协议开一下 收工
- springboot(八):RabbitMQ详解
RabbitMQ 即一个消息队列,主要是用来实现应用程序的异步和解耦,同时也能起到消息缓冲,消息分发的作用. 消息中间件在互联网公司的使用中越来越多,刚才还看到新闻阿里将RocketMQ捐献给了apa ...