四代商业主题

高扩展、安全、稳定、响应式布局多功能模板。

¥69 现在购买

特别声明:文章多为网络转载,资源使用一般不提供任何帮助,特殊资源除外,如有侵权请联系!

现在很多网站都使用了自适应网页设计(Response-Web-Design),以满足庞大的移动端用户群的需要。但是在技术上设计了自适应的网页之后,出于SEO的考虑,你还要照顾到如何对百度更友好,即告诉百度“我是自适应页面”,方便百度进行识别校验。

自适应网站对百度友好的关键:添加applicable-device标签

浏览器对自适应识别校验代码

在自适应网页设计中,我们使用meta标签来告诉浏览器网页的自适应规则。如:

content属性值 :

width:可视区域的宽度,值可为数字或关键词device-width

height:同width

intial-scale:页面首次被显示是可视区域的缩放级别,取值1.0则页面按实际尺寸显示,无任何缩放

maximum-scale=1.0, minimum-scale=1.0;可视区域的缩放级别,

maximum-scale用户可将页面放大的程序,1.0将禁止用户放大到实际尺寸之上。

user-scalable:是否可对页面进行缩放,no 禁止缩放,user-scalable=yes 是声明网页可以缩小放大。

通用搜索引擎对自适应识别校验代码

这两个meta,no-siteapp和no-transform,是告诉搜索引擎不要把网页转码。
自适应网站设计对百度友好的关键

其实,使用上面两个meta声明,百度就能识别自适应网页了。

不过,为了对百度更友好,让百度更方便识别校验,我们要再添加一个meta标签。

方法也很简单,只要在上面viewport标签下面再添加一个applicable-device标签就行:

这个meta标签,表示页面同时适合在移动设备和PC上进行浏览。

不是所有网站都适合自适应设计

自适应网页设计(Responsive Web Design)是指可以自动识别终端设备屏幕的大小从而做出相应调整的网页设计方法。这种网页设计方法完美解决了如何在不同大小的网络设备上呈现同样的网页效果。大家公认自适应至少有4个好处:提升用户体验;PC端和移动端SEO保持一致;避免重复内容和出错内容;链接统一。

而自适应比较明显的缺陷是,开发成本比较高,尤其是要构建包含额外编程的复杂的自适应网站,所需的时间会比较长。如果网站需求较简单,有许多开源模板可供选择。

对于已经比较成熟PC网站来说,如果要实现全站的自适应,有可能需要推掉原来所有的代码进行重构,时间和技术成本都比较大,而且如果一个网站有多个portal(入口),会大大增加架构设计的复杂度,所以现在有很多网站只在移动端实现了响应式布局设计。

未经允许不得转载:作者:有鱼, 转载或复制请以 超链接形式 并注明出处 抓虾网
原文地址:《自适应网站对百度友好的关键:添加applicable-device标签》 发布于2019-06-14

分享到:
赞(0) 打赏

评论 抢沙发

6 + 5 =


觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏

Vieu4.0主题
专业打造轻量级个人企业风格博客主题!专注于前端开发,全站响应式布局自适应模板。
切换注册

登录

忘记密码 ?

切换登录

注册