为什么响应性的Web设计胜出
当前位置:首页>>手机网站>>手机网站建设

当考虑对一个单独的移动网站移动网络战略和称重响应性的Web设计中,最重要的指标是如何的网站是为用户的功能 。 这超出了更好的小屏幕上的内容组织。 移动(和桌面)的网站应该很容易找到,容易的共享,加载速度快,易于维护,易于构建。

如果我们记住这一点,考虑到在Web今天,它看起来会,有许多令人信服的理由,响应性的Web设计。

设置阶段

考虑简单的谷歌涂鸦的东西。 这些小的更新创建谷歌主要的嗡嗡声,他们几乎每天都有点惊讶。 然后考虑网站如Facebook更新他们的代码库,一天两次 。 这两种情况暗示在未来,用户将期望的内容和功能比以往任何时候都更快地进步。

新的内容要求,人们也共享信息比以往任何时候都更需要集中,到***的内容和可靠的方法来访问这些内容 。

不幸的是,这些都不是这个不断发展的互联网的***挑战。 然而,这些问题都可以得到解决使用响应的Web设计。

在我进入的具体为什么我会认为反应是更好的现在和未来,我希望搞清楚一件事。

内容神话

整个辩论框架,重要的是要忘记一个古老的神话 。 这是信念的内容应该受到限制,为移动用户根据自己的目标和意图的缩减或取消。

截至目前为止,限制的内容做了一些意义。 特别是在早期的现代移动Web浏览器。 然而,今天,它被广泛地接受,我们不知道任何有关用户的目标基础上,他们使用的设备。 用户需要和期望在他们的移动设备的全部功能 ,因为它们可以用它在任何地方,以任何理由, 现在有28%的美国成年智能手机用户大多在他们的移动设备访问互联网 。 这意味着,许多用户从字面上要求所有在桌面上移动,否则他们将获得相同的功能。

我们不能消除的内容或功能,但我们也不能表明***都在一个小屏幕上。 这意味着我们需要重新设计和重新组织成更小的“意见”的内容和聪明的方法,隐藏或暗示的辅助内容。 这不***是容易的,但它是必要的。

Quartz's menu is hidden and hinted at on small screens. 
Quartz的菜单是隐藏的,并暗示在小屏幕上。 大图 。

现在我们已经知道的事实 - 我们有重组的内容,但不能***消除 - 有两种方式来实现这一点。 一个是与响应的Web设计,而另一个是一个单独的,为中心的移动网站。

一致的URL结构

URL的结构是非常重要的,今天在网络上。 共享您的网站和其内容浏览以许多不同的方式,从不同的地方,在不同的设备上。 人们发现你的网址在搜索结果中点击您的广告,他们从Facebook到您的博客和有关贵公司的电子邮件发送给他们的朋友,他们得到的信息。

设备用户共享一个链接从特定的URL将决定他们的份额,如果不匹配的移动设备上查看链接,有机会接收的共享链接的用户会看到一个混淆或误导的布局。 解决这个问题,我们可以重定向的,但是当我们添加更多的复杂性和功能集成到移动网站,这将成为一个严重的任务管理, 它通常不这样做正确。

我们点击链接的搜索引擎,电子邮件或鸣叫,带我们去了错误版本的一个网站。 例如,你的朋友想要向您发送电子邮件维基百科文章。 他们在手机上,所以他们发送电子邮件你的链接en.m.wikipedia.org,/维基/ Responsive_web_design的 ,和你的笔记本电脑上打开该链接。 你会看到复制的一列横跨整个长度的13英寸屏幕。 这很烦人,但更重要的是,它混淆了,不鼓励游客。

Wikipedia Mobile viewed on a laptop is a single column of copy that spans the entire length of the screen. 
维基百科的手机上观看一台笔记本电脑是复制的一列横跨整个屏幕的长度。 大图 。

SEO

此外, www.mysite.comm.mysite.com是不同的URL。 如果重定向不正确的结构,搜索引擎和分析两个URL可能没有意识到,在不同的设备上提供相同的内容。 搜索相关性和分析报告可以很容易地分化。

更不利的是一个URL结构,是***不同的移动, 而不是仅仅m.添加到URL的前缀 ,一些手机网站有一个***不同的页面结构的移动。 这***应该避免的,独立的网站或不!

只是一个搜索引擎,谷歌,采取措施进行索引和提供了正确版本的网站,但我们不能依靠计算机实现两个不同的网址具有相同内容的索引,排名和权重相同页。 因此,为了确保谷歌索引您的不同的URL是否正确(或相当),您需要按照他们的指引和添加额外的代码, 谷歌显示如何在一个教程 ,但在页面顶部,他们说清楚,搜索引擎优化,响应的设计是“谷歌的推荐配置。”

***的搜索索引。" alt="Google recommends responsive Web design for optimal search indexing." src="http://media.smashingmagazine.com/wp-content/uploads/2013/02/googleRecommends-500.png" width="500" height="300" /> 
谷歌建议响应性的Web设计***的搜索索引。 大图 。

加载时间

我们需要保持相同的页面结构和相同的URL,但我们应该组织的显示设备上的基于内容的。 这提出了一个具体的挑战的响应设计,虽然。 加载时间。

当使用一个代码库,重新组织内容,我们不可避免地造成额外的div小号和其他元素,得到隐藏的。 在移动设备上,通过数据网络和处理能力有限,这是一个问题,因为无论他们是隐藏的或没有, 您的手机加载在你的代码中所有的元素 。

智能,高效的编码可以***限度地减少加载时间。 有时人们错误响应性的Web设计“省时”的发展,但在现实中,正确编码响应网站是困难的。 ***限度地减少加载时间,需要专业知识的编码和代码和浏览器的工作了坚实的知识。 但在大多数情况下,一个***的开发人员可以实现快速加载,当它涉及到文本及其它“轻”的内容。

然而,图像,是一个更为严峻的挑战。 今天,没有一个伟大的答案。

图片

响应网站上的图像需要一个巨大的屏幕足够大,即使他们得到大小为小屏幕可视。 因此,我们创建他们大,但我们的移动网站受到影响,因为我们还是要加载,全尺寸的图像。 随着带宽,缓存大小和处理器的限制,这是不理想的。

有很多响应的图像解决方案在未来的作品,喜欢的picture元素 ,和是像响应的图片社区团体 (RICG)谁正在寻找长期的,基于标准的解决方案。 不过,今天有没有伟大的解决方案,以确保您的图片得到服务的一个有效的文件大小或他们的作物时,屏幕房地产有限。

,虽然有一些变通办法 。 有自适应数字图像交换图像在断点处。 jQuery的图片和Picturefill模拟拟议picture元件的功能。 我公司的专有平台基础上,我们已经创建了一个jQuery插件( 响应图的开放源码),有效地处理图像切换不同的屏幕尺寸。 虽然它解决了加载时间的问题,它仍然依赖于JavaScript,而不是一个***的,长期的解决方案。

在某些时候,会有一个解决方案。 如今,90%的时候,这个问题就更为烦恼的不是一个完整的路障。 由于数据连接得到更快的获得更加强大的手机, 它变得不再是一个问题 。 ,将来的代码标准响应图像的承诺相结合,意味着有一天,我们不会过分担心的图像加载时间问题,我们将有更没有理由做任何事情,但响应性的Web设计。

我不想低估的加载时间问题。 在有些情况下 - 某些网站是太形象重或复杂夸大的加载时间问题 - 在一个单独的网站可能会仍然是聪明的。 增加负载时的响应性设计,使用一个单独的网站就像是一种妥协。 它需要一个决定。 最敏感的网站,尤其是JavaScript的帮助下,仍然可以吱吱声可接受的负载时间和响应性的Web设计获得额外的好处。

内容更新和新功能

究竟会不会在未来发生改变的是敏捷的网站用户和互联网发展趋势的基础上改进和适应不断增长的需求。我们正在更新的内容和功能越来越频繁。 响应设计,我们只需要将功能添加到一个单一的代码库,节省了时间和创造焦点。 花费的时间量,以维持在同一网站的不同版本的往往被低估。

此外,迭代是一个成功的现代网站。 这已经成为一种必然的网站今天拿到常规的功能更新和附加 ,尤其是对电子商务和Web应用程序。 有这么多的数据,人们如何使用您的网站,它是一个不调整你的用户体验基于这些数据,监督。 在某些时候,保持和提高在同一个网站的多个版本,意味着时间和金钱,无论是走向两个版本,添加的功能较少,更多的功能只有一个(可能是桌面版)。 我公司有一个客户端,作为一个很好的例子。

我们保留维护和更新网站,我们并没有建立,它有一个***独立的移动版本。 这家大型企业客户具有良好的分析数据,所以他们有很多的网站在管道的改进和新的举措。 由于我们只有这么多时间在我们每月的固定器,修复和功能的愿望清单,因为超过这些时间,我们通常只在桌面版将所有的伟大的新功能。

现在,移动的经验是远远落后于台式电脑的体验,它看起来并不像将很快改变。 只是没有足够的时间。 然而,他们已经运行了活动,根据各地QR码和推动移动在活动中使用他们的网站。

在某些方面,这是一个巨大的监督。 以另一种方式,它只是一个无法回避的问题所造成的具有一个单独的移动网站。 对于我们的客户,就很难认为它是更聪明的释放更少的新功能,更多的网站版本。 他们宁愿看到的举措去住了,然后花费时间和金钱来维护的移动版本。 有很好的理由,但坏的结果。

***都增加了一

概括地说,我们知道了一些事情。 我们知道,所有的内容和功能需要,可为移动用户。 我们知道,今天,URL结构是很重要的。 我们知道,加载时间是很重要的,但它有一天会不再是一个问题。 我们知道,网站需要总是发展,变化,新特点,它需要时间来实现。

如果你看一下这些因素在总,响应性的Web设计赢得。

这就是说,编码技术和移动策略仍然应该为每个项目单独考虑。 有图像时太重要了,当功能需要有很大的不同目标用户的人口统计时,禁止响应设计。 在我看来,这种情况很少发生,但要记住,反应是不是一个的毯子的解决方案,修复了网络上所有的问题,这是很好的。

***一件事。 不要忘了,为每一个单独的移动版本,你正在构建和维护,一个独立的平板电脑版和电视版在拐角处。

无论你支持多少个版本,如果您使用的是单独的网站,你支持太多。 理想情况下,你应该只需要支持一个。 响应的设计是有道理的。 更有意义的明天。