2015年9月8日分钟阅读
对于我们中的许多人来说,他们一直在为用户创造一个更加友好的网站体验,你已经转向响应式网页设计(RWD)为你或你的客户的网站。
虽然我们默认RWD是最好的选择,特别是因为我们都知道谷歌喜欢它,重要的是要认识到它不是唯一的柔性设计类型存在于那里的gn。
在这种情况下,我所说的是适应性网页设计(AWD),这个概念已经流传了很久一些时间,但直到最近才被引入讨论,因为它可能比RWD更先进。
为了了解哪个选项具有更优的性能和用户体验,让我们来看看设计类型的优缺点,看看对于某些设备和网站类型,什么是最优化的。
自适应网页设计
历史RWD源自Ethan Marcotte,他创造了这一短语,并将其定义为一种开发网站的技术,该网站可以“流畅地更改并响应以适应任何屏幕或设备大小。”
该技术使用使用流体网格系统创建的单个模板,该系统能够根据样式表中使用的CSS媒体查询响应不同的屏幕大小。
在使用这种方法时,确保你的设计具有响应性,否则你的开发者将花费更多时间和资源在平板电脑和手机上重建网站,以弥补其缺乏灵活的结构。
除了流体设计外,RWD还提供了我们的用户认为有用的其他几个优势:
在不同浏览器和平台上保持一致的外观。
该网站是通过一个网址,精简和改进搜索引擎优化。
只需要维护一个URL上的一个网站-减少了设计和开发时间。
尽管有这些好处,RWD也有它的缺点,特别是当涉及到它的加载时间急剧增加由于在后台加载的图像和其他元素的高带宽可能对网站的性能至关重要。
RWD也明确了你的设计师能够在多大程度上发挥他们的能力来创建你的网站,因为一个更复杂、视觉上更繁重的设计在更小的设备上可能无法很好地缩小规模。
现在我们知道了RWD的行为,让我们看看AWD,看看它是如何比较的。
自适应网页设计
AWD采用了不同的方法,因为它灵活的设计旨在根据用户所使用的设备为用户提供专业化的体验。
无论设备大小,RWD都有相似的外观和感觉,而AWD的行为略有不同。
一个自适应的网站不是按比例缩小的设计,而是服务器端,这意味着服务器检测到它正在观看的设备的类型,并显示为它定制的网站版本。
举个例子来说吧,假设你有一个带有图像、标题、描述和分享链接的博客布局,但在手机上,由于图像数量太多,网站加载时间太长,用户在较小的设备上可能会感到不知所措。与其按比例缩小,你只需让服务器检测用户打开的设备,并显示一个更小的博客版本,只有标题,社交分享链接,低质量的图片,没有描述。
这意味着,在试图优化网站时,服务器承担着繁重的任务,而不是网站本身。
AWD提供的其他福利包括:
由于图像是针对特定设备压缩和调整大小的,因此加载速度要快得多。
网站加载速度更快,因为服务器能够检测到它所在的设备,只加载对它来说必要的某些代码。
您的灵活性得到了提高,您可以设计不同版本的网站,并根据您认为适合的设备进行定制——为移动用户提供更好的体验。
虽然,就像AWD听起来一样完美,但它并没有在公园里散步。由于定制,开发和设计时间急剧增加。此外,如果您希望在更新完成后进行更新,则需要多次执行这些更新,以便它们适用于站点的每个自定义版本。
所以,如果你没有团队或资金来支持一个适应性网站,最好现在就避免它,直到你更好地理解它和它提供的挑战。
什么对什么最好?
尽管你可能更喜欢这些技巧中的一种,但重要的是要认识到,决定你应该使用什么的不是你喜欢的,而是什么对你的用户最好。
也就是说,你需要确保你的用户能够根据他们的需求得到满足。所以,如果你知道你的用户会更好地适应一个保持移动布局一致的网站,那么就坚持使用RWD。如果你的用户足够精通技术,而你正在为未来铺平道路,那么AWD可能是一个更优的解决方案。
尽管AWD更难实施,但它所提供的灵活性和速度,特别是对电子商务和媒体行业的用户而言,可能只会为其用户群带来最好的影响。
对于我们这些网站不一定过于依赖手机的人来说,实现一个响应性强的网站可以让你表现得很好,让你在将来需要时可以选择实施自适应设计。
下载完整的网站重新设计指南
填写下面的表格,了解如何设计一个能产生结果的网站