你有一个“ 响应网站 ”？ 这是一个网站，其布局根据访客的设备和屏幕大小而变化。 响应式网页设计现在是行业最佳实践。 它由Google推荐并在遍布Web的数百万个网站上找到。 然而，有一个简单的“适合”不同屏幕尺寸的网站和一个真正具有响应能力的网站之间有很大的区别。
我经常会看到公司重新设计他们的网站，并推出新闻稿，赞扬他们新的移动设计的优点。 当我访问这些网站时，我经常发现的是一种布局，确实可以根据不同的屏幕进行缩放和变化，但就其响应性而言。 这还不够。 真正具有响应能力的网站不仅仅是为了适应更小或更大的屏幕而进行缩放。 在这些网站上，您还会发现以下重要特征。
1.优化性能
没有人喜欢等待网站加载，并且当有人使用移动设备的连接可能不太理想时，快速加载网站的需求变得更加重要。
那么如何优化网站的性能？ 如果您将新网站作为重新设计的一部分，那么您应该在创建性能预算时作为该项目的一部分。 如果您正在使用现有网站，而不是从头开始，第一步是测试您的网站的性能，以了解您今天的位置。
一旦你的网站站在性能方面的基准点，你就可以开始进行必要的改进以提高下载速度。 一个伟大的地方可能是与您的网站的图像。 太大的图片是缓慢加载网站的头号罪魁祸首，因此，从性能的角度来看， 优化您的图片以便进行网页传输确实可以帮助您的网站。
现实情况是，提高网站性能和快速下载速度是所有访问者都会喜欢的好处。 毕竟，从来没有人抱怨过某个网站“加载速度太快”，但如果一个网站加载时间过长，无论它是否响应地“适合”在他们的屏幕上，它都绝对会让人走开。
2.智能内容层次结构
当一个网站在大屏幕上显示时，由于可用的大量屏幕空间，您可以以各种方式放置内容。 您通常可以一次将重要的信息和图像，新闻更新，活动信息和网站导航全部放在屏幕上。 这使得访问者能够轻松快速地扫描整个页面的内容并决定对他们重要的内容。
当您采用该网站设计并将其转换为小屏幕设备（如手机）时，此场景会发生相当大的变化。 突然之间，你正在使用之前的屏幕房产的一小部分。 这意味着您需要确定网站上首先出现的内容，接下来会出现的内容等等。而不是立即看到所有内容，您可能只有空间显示一两件事（其中一种可能是导航）。 这意味着需要制定层次结构的决定。 不幸的是，往往会决定屏幕上的第一个内容，然后是第二个等等，就是页面本身编码的方式。 在构建响应式网站时，最简单的方法是在屏幕上首先显示代码中的第一项，然后在代码中显示第二项，等等。 不幸的是，在一台设备上可能最重要的可能不是对另一台设备至关重要。 一个真正的响应网站理解，内容的层次结构应该根据不同的情况而改变，并且它应该聪明地显示它在哪里显示。
CSS布局技术（包括CSS网格布局，Flexbox等）的改进使网页设计师和开发人员能够在智能地布置内容时获得更多选择，而不是受HTML代码中内容区域的确切顺序的束缚。 随着设备格局和我们网站用户的需求不断发展，利用这些新的布局技术将变得更加重要。
3.考虑设备优势和劣势的经验
坚持设备主题 - 有人可以用来访问您的网站的每个设备都具有该平台固有的优点和缺点。 一个出色的响应网站了解不同设备的功能和限制，并使用它们创建最适合访客可能在当时使用的任何设备的定制体验。
例如，手机包含许多在传统台式计算机中找不到的功能。 GPS是以移动为中心的功能的一个例子（是的，您也可以在桌面上获得一般位置信息，但设备GPS更准确）。 您的网站可能会使用GPS信息，根据当时的确切位置，巧妙地向用户发送非常详细且具体的逐步方向信息或特殊优惠信息。
在实践中这个委托人的另一个例子是一个能够理解你正在使用什么样的屏幕显示的网站，并发送最适合该显示的图像。 如果您的屏幕像素密度较高，则可以决定将更高质量的图像发送到该屏幕。 但是，这些相同的图像在功能较差的屏幕上毫无意义，而额外的文件大小会因为没有实际的原因而下载，而额外的质量会丢失。
真正优秀的响应网站会考虑整个用户体验，并努力根据其屏幕的设备类型或尺寸以及硬件的其他重要方面来量身定制体验。
4.内容与上下文
最初，响应式网页设计因为网站布局响应不同屏幕尺寸的想法而获得其名称，但您可以响应的不仅仅是屏幕尺寸。 基于以前使用设备优缺点的例子，您可以使用这些设备以及日期和时间等其他数据来真正定制网站体验。
设想一个大型贸易展览活动的网站。 尽管响应式网站会根据不同的屏幕来改变网站页面的布局，但您也可以使用日期来确定显示哪些内容最重要。 如果是事件发生的时间段，您可能希望突出显示注册信息。 但是，如果事件实际发生在那一刻，注册可能不是最重要的内容。 相反，您可能会认为当天的活动时间表更重要，因为它与用户的紧急需求更相关。
更进一步，您可以利用设备的全球定位系统来确定它们在贸易展会上的实际位置。 您可以根据他们的位置为他们提供互动内容，向他们展示附近的展位或即将开始的会议。
5.可访问性
我们将研究网站如何真正满足访问者需求的最后一个例子是考虑网站可访问性 。 网站应该能够被尽可能多的人使用，包括那些残疾人。 您的网站应该能够被需要屏幕阅读器或其他辅助软件访问其内容的人使用。 通过这种方式，您的网站正在响应他们的需求，因为您已确保针对残疾访问者的体验虽然不同，但仍然适用。
通过对尽可能多的数据点进行响应，而不仅仅是屏幕大小，网站可能不仅仅是“移动友好”，它可以在每一个短语的意义上成为真正的响应式体验。