响应式/自适应网站对百度友好的优化

响应式（或者说自适应）是指可以根据设备分辨率进行自动适配已达到友好显示的一种网页设计，目前已经被越来越多的网站所使用，因为相比于传统的搭建一个PC站点，使用响应式/自适应的方式有以下优点：

1. 搭建更简单快捷，缩减成本；

2. 提升用户体验，不需要中间跳转另记域名；

3. PC端和移动端SEO保持一致；

4. 避免重复内容和出错内容；

5. PC端和移动端链接统一。

那么，如何做到对百度友好呢？

搜索引擎优化与用户体验是相辅相承的

要做好SEO优化，首先肯定是需要有一个良好的用户体验。这里就采用响应式设计的网站总结一些需要注意的问题。

网站在移动端的打开速度

移动端网络情况复杂，从2G到4G到WIFI，各种情况下的访问速度如何，这些都是需要考虑的，尤其是响应式的网站，由于是适配PC端的，所以难免会有很多js、css以及图片等，而这些文件如果过多或者过大，对于访问速度肯定是会有影响的。针对这些问题，有如下建议：

1. css文件尽量都合并再一个文件里面，并且进行压缩；

2. js文件放在页脚，多个js文件在条件允许的情况下建议合并并且压缩；

3. 图片建议压缩后上传，不宜过多图片，背景图片可以采用雪碧图合并；

4. 开启Gzip压缩；

5. 有条件可以选用CDN进行静态资源的加速。

   
   

图片等资源在移动端的表现

对于图片等资源，建议设置最大宽度（max-width），避免屏幕过小图片过大导致图片溢出的情况。视频等资源，如果考虑移动端播放的话，请不要使用flash播放，因为iOS是播放不了的，如果是使用第三方视频资源的话，比如优酷土豆，获取视频分享代码的时候可以获取通用代码，通用代码是支持移动端播放的。

选择性的显示网页内容

有些内容不适合在手机端显示，比如播放不了的flash视频、悬浮广告，那这个时候我们可以不显示这些内容。对部分移动端不需要或者不友好的内容进行隐藏处理也是可以达到良好的用户体验。

响应式网站优化要点

上面都是响应式网站需要注意的优化细节，那么下面才是优化的重点：

applicable-device标注

优化好了响应式网站，我们还需要做的一件事情就是告诉百度，我是响应式网站！所以这是一个很重要的优化措施，需要在网页head标签内添加以下代码：

<meta name="applicable-device" content="pc,mobile">