基于移动搜索的网页设计优化研究

摘 要：本文介绍了移动搜索的特点、面向移动设备的网站优化规则和策略，从样式表、网页标签、页面结构、网页导航、屏幕分辨率优化等方面，阐述了移动端网页优化的具体方法。

关键词：移动搜索；网页设计；搜索引擎优化

中图分类号：TP393.4 文献标识码：A

Abstract：This article describes the characteristics of mobile search，site optimization for mobile devices rules and policies，from the style sheet，page tags，page structure，page navigation，the screen resolution optimization，etc..Finally the paper describes the specific methods of mobile terminals page optimization.

Keywords：mobile search engine；webpage design；search engine optimization

1 引言（Introduction）

据媒体预测，到2016年，全球移动设备的互联网搜索量将超过桌面设备。移动搜索是指以移动设备为终端，用户通过移动通信设备输入搜索项，对互联网的检索结果通过无线网络返回给用户。移动互联网搜索引擎优化（Mobile Search Engine Optimization，缩写为MSEO，简称移动搜索优化），它是在传统PC互联网搜索引擎优化（即SEO）基础上发展起来的一种关于移动搜索引擎的排名优化。

2 移动搜索的特点（The characteristics of mobile search）

2.1 移动搜索的特点

首先，移动搜索具有可用性特点。移动设备可用性包括：界面可视性、导航、内容等。网页界面可用性表现为同一窗口中内容要精简，按内容的重要性排列显示；网页版面布局要方便用户更容易地接收信息等。

其次，移动搜索具有可访问性特点。移动搜索用户与桌面搜索用户相比，对搜索结果的关注度更高[1]。移动用户更多的是搜索能解决身边的问题，诸如餐饮、旅游、公交等，主要关注生活服务类、健康保健类、教育培训类这三类信息，因此移动SEO的需求主要是针对这些网站的搜索引擎优化[2]。

2.2 根据移动搜索特点的网页移动化策略

网页移动化策略有两个：（1）响应式网页设计。（2）搜索引擎开放适配服务，抓取移动资源。

响应式网页设计（Responsive web design）是一种网页设计的方法，该设计可使网站从桌面电脑显示器到移动设备上适合阅读和导航。响应式网页设计就是能够用一套样式，使网站的页面能够在不同分辨率的屏幕下都有很好的表现形式。

百度的移动资源有两种抓取方式，一是通过传统的蜘蛛（spider）抓取，另一种是通过百度提供的“开放适配”服务。目前百度开放适配服务共提供三种方案：自主适配、标注Meta声明、提交对应关系Sitemap。按照百度官方的定义用“开放适配”的抓取速度会优于传统的网页抓取。

3 移动端网站优化的规则和策略（The mobile terminal website optimization rules and strategies）

3.1 百度移动搜索结果的排名标准

百度鼓励mobile资源，根据百度移动搜索结果的排名标准：（1）检索友好性，其友好性判断标准是网站有没有可以匹配移动设备的HTML5结构。（2）有完整的功能/服务满足用户需求，保证内容/服务的稳定可用，保证访问速度及到达率。（3）移动化交互体验，符合移动终端特性。（4）使用规范的html5/xhtml协议语言。

3.2 移动端搜索结果的排名策略

移动端网站优化打破传统网站的优化方式，移动端搜索结果的排名策略主要由基础相关性、资源质量、检索友好性三个部分组成，如图1所示。

手机页面进行适配，移动网站的DOCTYPE声明有助于搜索引擎识别该页面是否适合手机浏览，mobile页面协议编写如果不规范，会造成百度无法正常识别。

<！DOCTYPE> 声明应该位于文档中的最前面的位置，处于 标签之前，其声明格式，详见表1。

4 基于移动搜索的网页优化（Webpage optimization based on mobile search）

面对移动搜索市场，移动用户需求与标准的桌面搜索需求是不同的，移动用户更倾向于即时需求，移动搜索与桌面搜索相比，具有：（1）在移动设备上的小屏幕，可能只能出现5个搜索结果。（2）移动搜索查询往往极短，查询的关键词也比传统桌面搜索更少。（3）移动搜索查询结果受到字数限制。例如，PC端和移动端搜索结果，PC端30多个中文汉字才截断，移动端不到20个字就截断[3]。

4.1 移动端网站样式表的优化

制作的一个移动样式表单，称之为“handheld.css”，这个CSS可以把传统网页格式化为移动设备可以浏览的网页。

如果客户端是手机等移动设备时，就会载入这个css样式表。

4.2 移动端网页标签的优化

（1）meta标签优化，使用标注meta声明开放适配协议。站长在站点PC页的源代码头部嵌入一行或多行Meta信息，由Meta信息来指明该PC页对应的手机页的URL。

Meta声明的格式：

（2）描述标签（description）的优化，使用description目的是用来说明页面的主体内容。描述标签也会被显示在搜索结果当中被用户所见。

（3）jquery标签的优化，提升移动用户的使用体验。例如，滑动切换图片相比于自动切换和点击切换，滑动切换增强了用户操作的主动性、隐藏标签和显示标签实现动画效果，同时提升了切换的便捷性。

4.3 移动端页面结构的优化

使用三层的页面结构。由于移动端是直接用手指操作，需要响应元素点击区域要相对明显，布局上可以多上下排列。移动网站的页面加载速度要比普通网页加载速度慢，所以减少页面数量非常重要。用户是不会有耐心不断打开网页上的，所以尽可能简化网站的布局也是很重要。一个标准的移动站应该包含首页、列表页和详情页三种类型，页面类型及层级不超过三个，保证简单、高效的用户体验[4]。使用尽量浅的页间结构，减少用户点击次数，提升浏览体验，如图2所示。

4.4 移动端网页导航的优化

网页导航可用性表现为用户能快速地找到所需的信息，是用户体验的重要实现方式。移动网站可以采用的导航种类较PC端要少，按照范围的不同，可以分为三大类：结构性导航、关联性导航和公用程序导航，三者的关系详见表2。

一般首页导航可以分为导航式和内容式两种，导航式因其风格简洁可起到快速传达品牌形象的作用；内容式因其丰富的内容，可快速传递信息，如图3所示。

通过导航，用户可以知道所在页面在整个网站中的位置，在移动端导航中尽量使用文字链接，不要使用复杂的js或者flash。使用图片做导航时，可以使用Alt告诉搜索引擎所指向的网页内容。

4.5 移动端网页屏幕分辨率的自适应

移动端网站的页面需做到以下三点：一是页面随屏幕宽度变化，无横向滚动条；二是屏幕不放大时，能清晰浏览内容，文字大小不低于12像素；三是屏幕不放大时，按钮、链接等点击方便，按钮尺寸不能过大或过小。

5 结论（Conclusion）

移动网络搜索引擎在全球范围内正日益普及，移动端网站设计优化，如何提升用户在移动端的搜索体验，如何将使得移动端的网页更加适合移动平台的发展特性，是当前移动网站设计者需要考虑的首要问题。

参考文献（References）

[1] 俞国红.移动搜索引擎优化技术的研究[J].苏州市职业大学学报，2014（04）：36-38.

[2] 杨海波，赵文龙，黄成.移动搜索与桌面搜索比较研究[J].医学信息学杂志，2012（04）：35-38.

[3] 刘妮娜.移动环境下搜索引擎的个性化方法[J].江南大学学报（自然科学版），2006（02）：54-57.

[4] 李雅.手机网页版式设计研究[J].科技与出版，2011（12）：90-92.

作者简介：

夏忠球（1964-），男，本科，工程师.研究领域：网络安全，软件技术，数据库技术.