大数跨境

响应式网页设计的SEO优势

响应式网页设计的SEO优势 电商实践
2012-03-02
1
导读:网站所有者在开发移动站点时面临着诸多相互竞争的需求。不同的设备、不同的功能特性、不同的屏幕尺寸和分辨率,都对当今移动站点的设计与开发产生影响。据追踪与分析公司 Mongoose Metrics 称,仅

网站所有者在开发移动网站时面临诸多相互冲突的需求。不同的设备、功能、屏幕尺寸和分辨率,均会对当今移动网站的设计与开发产生深远影响。

据追踪分析公司 Mongoose Metrics 数据,截至2012年,仅9%的网站完成了移动端适配。移动端优化的核心通常在于提升可用性,对电商网站而言则更关乎转化率。软件服务商 Compuware 的研究显示,57%的用户不会推荐拥有糟糕移动体验的公司产品或服务,40%的用户宁愿访问竞品网站也不愿使用优化不佳的移动站。因此,在推动电商移动化进程中,将可用性与转化率作为首要关注点理由充分。幸运的是,解决移动可用性挑战的主流方案——响应式网页设计(RWD),同样对搜索引擎优化(SEO)大有裨益。

什么是响应式网页设计?

响应式网页设计是一种结合 CSS、CSS3 和 JavaScript 的设计理念,旨在创建能根据用户屏幕大小自动展开、收缩、重排或移除内容的流体布局。与其为不同尺寸和功能的设备开发独立站点,不如构建一套页面灵活响应,从而在从27英寸台式机到3.5英寸 iPhone 的各类设备上实现最佳显示。其可用性优势显而易见:客户无论使用何种设备均可顺畅交互,无需在模糊浏览全页或困惑查看局部之间做选择。随着可用性提升,跳出率降低与转化率增长往往随之而来。

诚然,部分场景下移动站的功能与内容需区别于桌面端;响应式设计可通过 CSS 隐藏或弱化对移动用户相关性较低的内容来处理此类情况。当然,某些需求唯有移动应用方能满足,但本文不探讨移动应用及 RWD 的技术实现细节。如需深入了解技术概述及相关资源,可参阅 Smashing Magazine 的《响应式网页设计:是什么以及如何运用》。

响应式网页设计有利于 SEO

采用响应式网页设计的另一大核心理由来自 SEO 层面:链接管理。若不为所有设备开发单一响应式站点,则需针对不同需求构建多个独立网站(如桌面版、智能手机版、平板版)。这些站点不仅需分别设计开发与维护,从搜索引擎角度看,还需配置大量链接及用户代理特定重定向以引导用户至正确版本。而单一响应式站点只需构建一组链接,无需添加繁琐重定向,既避免增加服务器负载、影响加载速度,又大幅降低维护成本。

以 Groupon 为例,其为智能手机开发了 Touch.groupon.com,为 iPad 开发了 Ipad.groupon.com,桌面端则保留 www.groupon.com。尽管搜索引擎具备按浏览器类型抓取的能力,但其并不热衷于判断哪些站点应接收何种设备的搜索请求。关键在于,将用户重定向至适配设备的责任完全在于网站自身。更多相关信息可参考文章《如何从 Googlebot Mobile 的新智能中获益》。

多数电商网站在移动端重定向方面表现欠佳(即便设有移动版)。即便是移动体验标杆 Amazon.com,也仍采用多站重定向而非响应式设计。不过鉴于其现有方案运行高效,短期内变革的必要性尚不明显。

链接对移动网站重要吗?

回到链接问题本身。若网站必须将移动用户从桌面版物理重定向至移动版,且智能机与平板站点在搜索结果中几乎无排名,那么移动站的链接价值何在?答案并非通过获取链接提升移动版排名,而在于防止移动用户分享或链接移动版页面时,从桌面版“窃取”链接权重(Link Equity)。

假设某产品页移动版获得2个博客、2条推文、2个 Facebook 点赞和2个 Google +1,而同一页面的桌面版则各获20个。此时移动版几乎无法获得排名,却分散了本属于强势桌面版的链接权重。若采用响应式设计,该单一产品页将汇聚总计22个各类链接与分享,而非分散于两个独立页面。简言之,集中链接权重能使单一页面发出更强信号,从而比拆分页面获得更优排名。

电子商务中的响应式网页设计示例

Nike Store 是目前最佳的响应式设计案例之一。从首页到产品页,其移动版与桌面版 URL 完全一致,仅显示效果随设备自适应调整。下图展示了 Nike 6.0 Dunk Low Women’s Shoe 在笔记本电脑、Android 平板及 Android 手机上的呈现效果。尽管设计布局各异,对应 URL 始终相同,这正是响应式设计的典型特征,而非单纯的移动网站。

放大此图片

Nike 的响应式网站设计会调整页面设计和布局,以在各种屏幕尺寸上实现最佳显示效果。

放大此图片

对于大屏幕,Nike 呈现功能齐全的网站版本。

放大此图片

对于较小的屏幕,Nike 提供更简洁、更简单的网络界面。

放大此图片

对于移动浏览器,Nike 仅显示购买所需的基本选项。

值得注意的是,Sony.com 虽也实践了响应式设计,但目前仅限于首页。一旦离开首页,格式即恢复为桌面端显示。颇具讽刺意味的是,一家生产移动设备的公司却未拥有真正对移动友好的全站体验。

Walgreens、Shoes.com、Coldwater Creek 等网站虽设有移动版,但其移动页与桌面页 URL 不同。这类站点仅是“移动端适配”,并非真正的响应式网页设计。它们仍将链接权重分散在不同页面的独立版本中,错失了通过响应式设计整合链接、强化页面信号的机会。

【声明】内容源于网络
0
0
电商实践
电商实践
内容 8035
粉丝 0
电商实践 电商实践
总阅读1.1k
粉丝0
内容8.0k