这意味这什么呢?简单说,我国智能机不但普及,且已趋饱和,移动红利即将消耗贻尽。那对于网站优化人员又意味着什么?结果上讲,重大网站没有完成移动化需亡羊补牢,中小网站去完成移动化迫在眉睫。
制作出用户体验良好的手机页面只是万事俱备,最为关键的临门一脚是获得搜索引擎的青睐,这样才能得到精准的用户,很多网站拥有PC和移动两套页面,从经验上看,精准、高效地被搜索引擎识别不但促进移动页面的排名和流量获取,对PC页面也有额外的效果加成。
在经历了一轮轮移动H5项目,看过很多移动页面识别和优化的国外文章,更重要的是多次和百度相关人对话和解决问题后,我将一些常见的HTML识别细节总结了两部分,用于促进移动页面被搜索引擎识别、收录,让更多优质流量更早、更多地分发到自己页面。
一、head标签中的部分
1.URL设计
URL尽量含有通用已成趋势的移动命名,例如“m./wap./3g./mobi./mobile./mob/wml/”,可以在子域名等方面体现
2.页面顶部的doctype标签
作为协议的重要部分,doctype中是否移动化也很重要,检查是否存在与移动相关的声明,如这些关键词,openmobilealliance, xhtml-mobile, xhtml-basic,wapforum,dtd compact html
例:“”
3.meta标签中的viewport属性和x-ua-compatible 属性
viewport,移动前端开发中最重要的标签,响应式设计的根基,如果你的页面是遵守响应式设计的,那么说明这些页面对移动设备有友好的输出。
典型的的viewport代码是这样的,
,判断移动与否的关键属性值为width,如果width=device-width这是典型的移动友好的设计,增加判定为移动页面的砝码,如果width有具体值,且值大于典型的移动屏幕(应该小于600),那么该页面被判定为PC页面的几率大大增加。但,META中还有一个很独特的属性作为SEO人员应该很少接触到,那就是x-ua-compatible 属性,该属性是PC意味非常强烈的功能性代码。示例代码如此,
,从百度工程师处得知,该代码会有较强暗示当前页面为PC页面的功能,需选择性使用。以上这些
中出现的内容,此外div块的个数也值得注意,没有哪家移动页面会过量使用div块;还有典型的只用于适配PC机器的HTML代码,例如:accesskey(如果移动页面用,要不前端招错人了,要不产品招错人了,应该引起警觉)
head和正文两大部分,基本涵盖了一张页面最主要的部分。
网站优化人员一定要把握这些使用细节,协助前端工程师从正反方向将公司的PC和手机页面泾渭分明地呈现给搜索引擎。试想如果你每日被抓取页面达到90%的识别率,而一般水平是70%,这种优化增量是非常显著的。
最后,分享一个机器学习的思想给网站优化的新人,此文中心思想截取如下:“你从市场上的芒果里随机的抽取一定的样品(训练数据), 制作一张表格, 上面记着每个芒果的物理属性, 比如颜色, 大小, 形状, 产地, 卖家, 等等。(这些称之为特征)。 还记录下这个芒果甜不甜, 是否多汁,是否成熟(输出变量)。你将这些数据提供给一个机器学习算法(分类算法/回归算法),然后它就会学习出一个关于芒果的物理属性和它的质量之间关系的模型。 下次你再去市集, 只要测测那些芒果的特性(测试数据),然后将它输入一个机器学习算法。算法将根据之前计算出的模型来预测芒果是甜的,熟的, 并且/还是多汁的。
结合本文中的内容、再结合你已经烂熟于心的搜素引擎工作原理,设想一下,你的所有页面都是芒果,百度是带有识别模型(且该模型会自己训练、纠正自己)的芒果鉴别器,怎么让你的芒果持续性地、每次被拿起来都进入那个又大、又甜、又多汁的篮子?那些一眼就看出来的大甜芒果当然好判断,那些一眼看不出来的呢?我们能不能多生产些一眼就看出来好坏的芒果呢?这样整个果园是不是好收割一点?”