今天下面要讲的是针对有PC站和移动站点的,而且PC站和移动站存在页面对应关系的为最佳。这样的移动适配主要针对蜘蛛,对优化有很大的好处。判断是否用JS跳转到移动端;对蜘蛛就用或声明。完整的移动适配是PC和移动端的URL一一对应。
移动端适配相关部署
移动端Title、Description、Keywords(TDK)设置
搜索引擎会首先抓取页面
对用户使用搜索引擎,页面主标题、描述的与用户使用的关键词匹配程度高,一般会获得较多流量。
网站Title、Description、Keywords(TDK),搜索引擎对Keywords的权重可以忽略,由于在移动端展示时,标题和描述字数和PC端有一定区别。参考文章《什么样的文章标题形式利于搜索引擎SEO优化》
移动端绝对路径
一般由于PC和移动端采用不同的CSS样式表,另外由于两套模板需共用网站根目录下的favicon.ico图标等,采用绝对路径保证正常调用。
移动端rel="canonical"声明
为了解决网站由于URL链接不一样,但网页内容一样,避免百度重复收录的问题。
比如:PC端与移动端对应URL分别为
http://www.cuoxin.com/code/ http://m.cuoxin.com/code/
在移动端之前,增加如下代码:
里面的链接是告诉搜索引擎,这个链接是规范、正确、希望百度收录且参与排名的链接(网页权威链接)。
需要用rel="canonical"声明的情况:
①网站进行了改版,将旧的内容搬到新的URL,但没有做301重定向;
②某些CMS栏目或内容的静态链接和动态链接内容相同,而且没有做301重定向;
③移动端和PC端虽然模板不一样,但是主要内容一样,避免分散权重。
移动端声明
不同的移动设备上浏览页面有可能出现横向滚动条。增加viewport属性作用是当前viewport的宽度等于设备的宽度,同时不允许用户手动缩放。
移动端
③行内样式
行内样式写法
移动端和PC端建议首页采用②页面内写法,其他采用①外部引用写法,为了让HTML主体部分代码简洁,尽量不采用③行内样式写法。
移动端适配PC端相关部署
PC端声明
适配只针对存在对应关系的页面,无对应关系的PC页面无需任何操作。
name="mobile-agent"为更新后的meta声明,建议使用。原有meta规则http-equiv="mobile-agent"能够兼容并继续生效,已标注过的无需修改。
橙色部分为移动端对应URL页面;format有几种属性:wml、xhtml、html5,根据实际情况选用。
在PC端之前,增加如下代码:
评论列表()