3450399331
网站建设

成都网站制作:关于移动网页的不同适配的问题

发表日期:2025-01-14   作者来源:www.lubnke.com   浏览:196   标签:成都网站建设公司 成都网站制作公司    

成都网站制作公司博久网络今天来谈谈几种不一样的移动网页适配方法分别有什么应该注意的点,期望能帮到对这方面常识有需要的朋友。

1、跳转适配

1)meta标注,生效速度第二快的办法。在页面head中增加一行meta标注,来告知百度前页面对应的移动版页面的URL是什么与使用的声明语言,格式如下

用format可以告知百度指定移动页面使用的是什么语言(目前通常都是用HTML5) .URL的值为对应版本页面的URL地址,假如网页有多个版本,此标注也可以写多行。

2)提交适配关系,生效速度最快的办法。在百度站长平台的“移动适配”工具中主动提交适配关系,站长平台支持规则适配和URL适配。对于电脑版和移动版URL有肯定应关系的站点可以使用规则适配;假如较难用正则表达式匹配两版URL之间的的对应关系,则可以用"URL适配”。通过此工具,百度可以较快地发现网站的移动适配关系,从而加快适配处置的速度。这也是移动适配生效的最快方法。具体工具的用法,参见百度站长平台的官方工具介绍文档。建议大伙在设计移动站点URL时,尽量地保证移动内容在和PC内容一一对应的同时, URL也可以有肯定规则的一一对应。成都网站建设公司

3)另外建议大伙在电脑版网页上,添加指向对应移动版网址的特殊链接rel="alternate"标记,这能够帮助百度发现网站的移动版网页;在移动版网页上,添加指向对应电脑版网址的链接rel="canonical"标记。

4)自主适配,生效速度最慢的办法。用301或302跳转,不要用JS判断UA再跳转因为推广客户端会先加载网页然后再分析Js,所以假如用JS判断UA,用户则会感觉较强的顿挫感;同样蜘蛛需要渲染JS之后才能获得信息,也会加强搜索引擎蜘蛛的抓取困难程度。成都网站建设公司

建议大伙把以上工作全部做好,以促进适配关系的迅速、稳定生效。不过切记适配关系的一致性,不要有冲突,且多个版本网页中的主体内容要一致,不然或许会导致适配失败。

5)在页面head中用meta标签声明目前页面是PC页还是移动页。

若是PC页则用

若是移动页则用

2. 代码适配

1)为了使百度可以了解当页面发生变化时,同时需要用其他的UA重新抓取一遍,需要添加Vary HTTP标头,如"Vary: Accept-Encoding, User-Agent" . Vary HTTP标头具备以下两个尤为重要且好用的用途。

它会向ISP和其他地方用的缓存服务器表明:在决定是不是通过缓存来提供网页时它们应考虑用户代理。假如没用Vary HTTP标头,缓存或许会错误地向手机用户提供电脑版HTML网页的缓存(反之亦然)

它能够帮助百度Spider更迅速地发现针对手机进行优化的内容,这是由于百度在抓取针对移动内容进行过优化的网址时,会或有效的Vary HTTP标头作为抓取信号之一,百度会提升用其他UA抓取此网页的优先级。

2)在给用户返回的代码中用meta标注所返回的代码为电脑版还是移动版:

若是电脑版则用ta name="applicable-device" content="pc""

若是移动版则用

3,响应式

1)?在页面head中用meta标签声明目前页面合适同时在PC和手机上浏览:

2)在head中添加以下代码并且用元素处置自适应图片:

ta name="viewport" content="width-device-width, initial-scale-1.0"

技术在于更多的交流,成都网站制作公司博久网络给大伙推荐,有不对之处欢迎交流指正。

如没特殊注明,文章均为博益网 原创,转载请注明来自http://www.ziyubo.com/news/jianzhan/17670.html