移动优化
移动优化是确保从移动设备访问您网站的访问者拥有针对设备优化的体验的过程。
什么是移动优化?
每年人们花在移动设备和平板电脑上的时间越来越多,但许多网站的设计仍然不能适应不同的屏幕尺寸和加载时间。移动优化会考虑网站设计,网站结构,网页速度等,以确保您不会无意中将移动访问者转移。
移动SEO最佳实践
如果您的网站已经针对搜索引擎进行了seo优化,那么在优化移动设备和Google转向移动优先索引时,您需要考虑的其他一些事项。
页面速度
由于硬件和连接问题,对于移动用户而言,页面速度对于桌面用户来说甚至更为重要。除了优化图像之外,您还需要缩小代码,利用浏览器缓存并减少重定向。
不要阻止CSS,JavaScript或图像
在过去,一些移动设备无法支持所有这些元素,因此移动网站的网站管理员阻止了一个或全部三个。但在大多数情况下,这已不再适用,智能手机GoogleBot希望能够查看和分类用户所做的相同内容。所以不要隐藏它。如果您有响应式网站或其他移动解决方案,这些元素对于帮助Google了解也至关重要。
移动网站设计
移动设备正在简化和彻底改变网站的设计方式。在我们无休止地滚动的世界里,“在首页上”不再具有意义
不要使用Flash
该插件可能无法在您的用户手机上使用,这意味着他们将错过所有乐趣。如果要创建特殊效果,请改用HTML5。
也不要使用弹出窗口
在移动设备上尝试关闭它们可能很困难,也很令人沮丧。这可能会导致较高的跳出率。
为胖指设计
如果您的按钮太大,太小,或者在试图让页面滚动的手指的路径中,触摸屏导航可能会导致意外点击。
优化标题和元描述
请记住,当用户使用移动设备进行搜索时,您使用的屏幕空间更少。要在SERPS中展示您的最佳作品,请在创建标题,URL和元描述时尽可能简洁(不要牺牲信息的质量)。
使用Schema.org结构化数据
由于屏幕空间有限,具有丰富网页摘要的搜索结果甚至比桌面更突出。阅读有关Schema.org结构化数据的更多信息。
优化本地搜索
如果您的公司有本地元素,请记住优化您的移动内容以进行本地搜索。这包括标准化您的姓名,地址和电话号码,并在您网站的元数据中包含您的城市和州名称。有关本地SEO的更多信息,请点击此处。
移动站点配置
在设置站点时,您可能做出的最重要决定可能是决定是否要使用响应式,动态服务或单独的站点配置。每个都有其优点和缺点。Google更喜欢响应式设计,但只要您正确设置它们,它就支持所有三个选项。
响应式网页设计
响应式设计的网站使用CSS3媒体查询,使用流畅的网格和灵活的设计为移动和桌面用户提供相同的内容,以自动适应用户屏幕的大小。
响应式设计使用媒体查询根据屏幕宽度,方向和分辨率来定位布局。例如,您可以使用以下CSS指示浏览器如何为宽度为420或更少的屏幕显示内容:
代码示例
@media screen和(max-width:420px){ .class { [这里的这个类的风格] } }
要链接到单独的样式表,请在您的<head>
代码之间添加以下HTML :
代码示例
<link href =“mobile.css”type =“text / css”medi a =“screen and(max-device-width:480px)”rel =“stylesheet”/>
响应式设计允许您进行各种媒体查询,以便用户可以在微型移动屏幕,大于平均水平的移动屏幕甚至平板电脑上看到专为其设备设计的网站。
使用Google的移动测试工具验证您的网站是否针对移动设备进行了优化。
动态服务
如果您没有完整站点重新设计的资源或想要为移动访问者显示不同于桌面访问者的内容,则一种解决方案是使用一个URL显示不同的HTML和CSS集,具体取决于设备的类型您的访问者正在使用(也称为检测用户代理)。这可能很有用,例如,如果您是一家想要移动访客(可能在您的社区闲逛)的餐馆,您可以查看评论样本和地图而非您的完整网站。
基于用户代理显示不同的内容称为动态服务,它使用Vary HTTP标头完成,如下所示:
改变HTTP标头
GET / page-1 HTTP / 1.1 主持人:www.5dseo.com (...其余HTTP请求标头...) HTTP / 1.1 200好的 内容类型:text / html 变化:用户代理 内容长度:5710 (... HTTP响应头的其余部分......)
来自Google Developers Blog的示例。
简而言之,这意味着显示的内容将根据请求页面的用户代理而有所不同。
动态服务并不是它看起来完美的妥协。首先,它依赖于拥有更新的用户代理列表,这意味着每次新的移动设备进入市场时,该列表都需要更新。对于其他设备的HTML,桌面和移动设备的错误提供并不少见。阅读更多关于常见陷阱的信息。
单独的移动网址
另一种选择是为移动用户创建第二个并行站点。这允许您为移动访问者创建完全自定义的内容。为避免URL混淆,大多数并行移动站点使用“m”子域。
在将访问者发送到正确版本时,并行移动网站可能与动态服务网站一样不完美,因此请务必让最终位置错误的访问者轻松点击其首选体验。
您还需要确保您的网站重定向全部到位并尽可能精简以降低网页速度。为了避免重复的内容问题,您需要设置rel =“canonical”。