移动端网站如何做SEO优化
来源: | 作者:lszing | 发布时间: 2017-11-01 | 914 次浏览 | 分享到:
1、手机站定位和页面设计
手机站和PC站除了页面大小、展现形式不一样之外,在分析用户需求方面是都要做的。举个例子,对于一个本地的装修网站来讲,PC站是重点展现装修效果图案例、装修报价以及公司的装修设计师风采,那么手机站就应该重点突出公司的联系方式、地图、电话等等。移动端网站要的就是“及时、快速”。
同时考虑到营销型网站建设的反应速度,整体页面最好用div+css的代码来写,不要为了图个方便,用flash或者是js,这样搜索引擎想要抓取都很困难。还有就是很多的手机浏览器比如UC,他本身是不支持flash播放的,你需要另外单独安装手机falsh,但是用户哪有这么多时间去等待呢?
现在的很多智能手机都不支持java程序,所以网站最好用php开发。
2、手机站要做到简洁、大方
用户在手机上浏览内容,或者是屏幕大一些,在平板电脑上浏览,但是再大也没有普通的电脑屏幕大,所以,手机站的页面要更加的简洁,特别是对于那种有下载需求的网站,手机站上的下载按钮要清晰的摆在用户面前。如果你在手机上看过太原雅辉装修公司的移动站,就可以明显的感受到,我设计导航的时候并没有隐藏起来用下拉的方式展现,而是平铺在页面上面,用户一看就知道该点击哪里能找到他想要的内容。
还有就是内容页面不要太长,因为用手机浏览网站的用户,时间都是非常紧迫的,有的还是在坐车的过程中看,流量以及网速是一个大问题,所以一个问题能用一句话一幅图解决,就不要长篇大论。
对于商城类手机站来说,除了要做到以上几点,在最重要的付款页面一定要做到傻瓜式简单化,这个可以参考京东、淘宝来做,他们的付款页面就做的非常不错。
3、手机站禁止使用弹窗(一定要禁止)
弹窗这种东西,在PC站上用户已经够心烦的了,如果在手机或平板这么点的地方也弄个弹窗,用户真的是很无语了:“让我们进来,但是却不让我们安心的看”。
4、用哪种web语言做手机站比较好?
这一点我在赵一鸣随笔博客的移动端网站优化教程中已经讲过了,详细的分析了html4、html5做手机站的区别。在这里可以100%的告诉你,只要用户体验好,用哪种语言都可以,不一定是html5,你看尚品中国网站制作公司的手机站是html5吗?
5、url路径必须要规范化
做手机站,不要为了省那点空间费用用栏目页做,重新买个空间,用单独的二级域名做手机站是最好的,m.xxx.com或者是wap.xxx.com这种形式。
6、PC站与手机站做开放式配
我的那个装修网站手机站,上线之后只是针对性的更新了内容,一个外链没有,现在大多数主关键词都排名在首页,最重要的一个原因就是我的手机站做了开放式配。如果不知道该怎么做开放式配,可以看我博客的移动端网站优化板块儿里的移动端网站如何做开放式配一文,里边是以视频的形式展现的,一步一步教你怎么做开放式配。
7、其他小细节
关于robots、地图、关键词设置等这些问题,与PC站是一样的,PC站怎么做,手机站就怎么做。手机站首页的标题可以只写公司品牌词,也可以和PC站的标题一样,这个无妨。
对于响应式网站我们会谈到移动互联网和响应式设计的关系,首先将介绍如何巧妙的运用响应式设计,为什么性能对移动端非常重要,为什么响应式设计不能作为你网站的目标,最后技术的性能问题帮助我们更好的理解这问题。
自2000年开始,设计者和开发者就把移动设备的问题过于简单化,以至于现在仍然有人认为响应式网页设计能解决一切问题。
大家必须明白,凌驾于任何目标,移动网络体验必须和闪电一样快。迅速、实用、兼容的体验对所有移动设备都是挑战。当你使用响应式设计时,这些挑战都存在。从一开始就重视性能会让过程容易些。
响应式设计是很棒,但不是万能钥匙。如果你在移动设备上一味坚持,在转换率后就可能隐藏着性能问题。大约有11%的网站是响应式,这个数字每月都在增长,所以现在是谈论这个问题的时机了。
据Guy Podjarny研究,72%的响应式网站不分屏幕大小都提供相同的字节,尽管这会降低移动网络连接。不是所有用户都有耐心等着网站加载。
对响应式设计存在的问题有了基本认识,我们就能减低它带来的损失。
移动网站来自过去
我不是说你不应该采用响应式设计或者去用m.*的子域名。事实上,现在社会分享无处不在,不分设备,分配给给文档一个URL,这是聪明的做法。但这并不意味着一个单独URL应该提供相同的文档或每一个设备都应该下载相同的资源。
援引Ethan Marcotte的话,他创造了“响应式网页设计”这个术语。
最重要的是,响应式网页设计的初衷不是要取代移动网页。——Ethan Marcotte
响应式网页设计
交互、移动、快速
如果我们能使用一些其他的技术,就可以实现获得响应式设计好处的同时,不影响移动设备的性能。响应式设计从来不是意味着要解决“性能”,这也是为什么我们不能因此指责它的原因。然而,相信它能解决你所有问题,这大错特错。
设计响应式很重要,因为我们需要解决跨桌面和移动端视窗大小范围的问题。但是只考虑屏幕大小就低估了移动设备。桌面和移动端的界限正在变得模糊,基于不同的设备对我们而言仍然有多种可能性。但是我们还不能通过媒体查询来决定响应式设计的功能。一些评论家称之为“可靠的响应式网页设计”,然而另一些人则认为它是伴随现代视觉的响应式网页设计。在没有了解其基本语义的情况下,我们需要搞清楚这个问题。
虽然没有可应用于各类文档的万全之策,但是能够运用一些技巧来改善现有响应式的解决办法,并且力求性能最大化。
实现每一个文档对所有的设备都使用相同的URL和相同的内容,结构不必要相同。
当从零开始,遵循“移动先行”的方法。
在一个真实设备上测试当资源加载和显示会发生什么。不要依赖调整你的桌面浏览器。
使用优化工具测量和提高性能。
通过JavaScript传输响应图片,虽然我们更期盼着浏览器供应商(例如srcset)能解决这个问题
当你需要当前设备具备加载条件时,只加载JavaScript,这会在onload事件之后发生。
对移动设备,内联文档的原始视图,或者发送一屏显示内容。
使用下面一种或几种技术应用智能响应式的解决方案:条件加载、按组响应、服务器端层(如适应性方法)。
条件加载
不要总是在CSS中依赖media queries,因为浏览器将会为所有设备加载和解析所有选择器和样式 (后面详细讨论)。这就意味着手机为了一个大屏要下载和解析CSS。因为CSS块的呈现,你要浪费一些时间等待联接成功。
在设备上用JavaScript的matchMedia查询来代替CSS media queries,你知道这些内容是不会变化的。例如,大家都知道iPhone不能动态的转换成iPad的规格,所以我们只在正在需要CSS时才用。
可以用特征检测,例如 Modernizr,对UI和功能性做出更明智的决定而不是仅仅根据屏幕尺寸。
按组响应
在处理简单文档、为台式电脑和智能手机提供相同的HTML时,虽然为我们可以让所有屏幕依赖一个单一的HTML基础和响应式设计,但这并不总是最好的解决方案。为什么呢?同样是由于移动设备的性能。
即使我们在服务器端储存相同的文档,但是根据设备组别的不同给用户不同的文档。举个例子,为一个6英寸甚至更大的屏幕提供大的浮动菜单,为一个小屏幕提供汉堡菜单。在每个组群里,使用响应时技术以适应不同的场景,例如肖像模式和风景模式的转换,切换iPhone(320像素宽)、5英寸Android设备(360英寸)和平板(400像素)。 
热门新闻