怎样做一个响应式网站才专业

发布时间:2018-09-25 07:05:04    阅读:8370    作者:响应式网站建设
作为在网站建设领域里策划了近20年的站长来说,对网站建设行业认真仔细分析过响应式网站,其实响应式有许多优点,在这里就不列举了,网络上有许多关于这方面的介绍,今天重点给大家讲一下响应式网站的几个缺点。

首先我们来认识下,什么是响应式网站?

响应式网站 : 最近几年大众对于响应式网站的建设是越来越热衷了,那么建设响应式网站是从哪里开始的,现在的情况是怎么样的,未来又会有怎样的发展呢,这篇就带着大家一起来了解一下响应


最近几年大众对于响应式网站的建设是越来越热衷了,那么建设响应式网站是从哪里开始的,现在的情况是怎么样的,未来又会有怎样的发展呢,这篇就带着大家一起来了解一下响应式网站的前世今生。

 一、起源

从时间上来看,可以说的上是响应式网站起源的时间点其实并不久远,最早是来自于一个名叫伊桑的人在2010年撰写的一篇关于网站设计的文章,在这篇文章中伊桑提出了使用流动布局,媒介查询以及弹性图片这三种工具就能建设一个能适应不同屏幕的网站。

在传统的网站设计中,对于显示这一方面都是用像素这个单位来进行标示的,而在伊桑的文章中提出除了像素以外还可以使用百分比等方式来标示,这样就能使网站具备灵活的布局。使用媒介查询这种工具可以帮助网站查询到使用设备包括分辨率在内的多种属性信息,布局变得弹性后,网页中的图片也要变得有弹性,然后还可扩大至图标,视频等范围。

二、现状

如今,互联网在移动设备上的使用变得越来越多,这也使得这篇文章提出的建设响应式网站的方法越来越得到大众的认可。这既是由于环境这一外部因素的快速发展,也是由于响应式网站的建设正能满足来自内部的需求。

 目前建设响应式网站的方式存在两种,一种是汇总比较主流的设备的硬件信息,根据这些信息设计出多种布局的样式,再分别进行投射。另一种则是不必看设备的硬件信息,只关注内容,对内容进行设计和布局,由内容来决定应该如何进行呈现。

响应式网站的四大缺陷---响应式网站就是一个很大很大的坑。那么如何理解响应式网站呢,怎么样建设响应式网站呢,响应式网站和自适应网站有什么不同呢?

今天想要讲的是响应式网站四个致命缺陷:

1、就用户体验度来讲响应式网站做得并不到位

响应式网站设计基本原则是:自动识别屏幕尺寸并做出相应调整的网页设计,页面布局和展示的内容可能会随着屏幕尺寸变化而有所变化。响应式布局不管使用什么设备都是在服务器把数据推送到浏览器后,脚本或CSS自行检测设备屏幕大小后执行对应的样式表内容,并且一直通过本地脚本在监听屏幕大小的变化,随时做出样式响应的变化。
比如在1280x768分辨率的电脑屏幕上和在320x240分辨率的手机屏幕上显示一样的内容的话,内容都挤一起无法看清楚。所以响应式设计是选择把部分内容隐藏来解决这个问题。但这样的话页面的表现效果就不是那么好了,用户的交互体验也非常不友好。
比如下面这个响应式网站,右边移动端和左边电脑端相比,把产品展示模板隐藏了,这对用户体验是非常不友好的。而且左边明显不符合我们平常看到的移动端的设计。同一个网站PC端和移动端风格差异太大,感觉就是两个没有任何联系的网站。
如果是单独设计PC站和移动站,就能整体考虑规划,设计成一个整体风格类似功能相同的网站,避免像上面这种显示上的突兀
从天猫的做法可以看到:移动站界面是大家熟悉的和流行的,交互上更接近APP的UI风格。

2、响应式网站代码因为不精简所以对网站优化无利

百度对移动站和PC站的关键词处理策略不尽相同。如果网站设计成响应式, 所有设备访问同一份代码,这就非常不利于百度关键词优化。
而且百度的搜索排名是区分移动站和PC站的。如果PC站和移动站是独立分开的,那么移动站所做的百度排名,不会影响PC站的排名,PC站的百度优化也可以独立于移动站进行。
从商业推广的角度来看的话,移动站和PC站分开单独做比设计成一个统一的响应式网站会更好。

3、响应式网站同样因为代码过多会导致网站打开速度慢

响应式网站的实现原理通常是通过css或js来控制部分内容显示或不显示,从而使得网站在移动设备上看起来也正常。但通过代码不显示的内容其实依然还在页面上,只是表面看不见(不显示)了而矣,所以浏览器依然还会加载这部分看不见的网页代码。也就是说响应式网站要比单独的非响应式网站加载更多的数据,从而造成流量增加,而且网页的打开速度变慢。
比如说单独设计一个移动端网站,整个页面大小可能是100kb,如果设计成响应式网站(PC站和移动站代码合在一起)则页面大小可能就是400kb甚至更多。导致打开响应式网站的时间相比非响应式会慢很多,尤其是手机在用2G、3G网络上网的情况下更明显。

4、响应式网站因为兼容性而存在,但兼容性恰恰又是他的一个缺点

响应式网站算是比较新的技术了,运用了很多html5的特性,只有浏览器的高版本才支持这些html5特性,尤其是微软的IE浏览器对这一块的支持比较弱。
当然我们并不能完全去否定响应式网站的存在,大家可以阅读一下文章《官网为什么要做响应式?》。毕竟如果你为了去适应所有的浏览器而去做那么多网站也是不现实的事情。
QQ客服
陈经理