响应式网站制作的发展
- By 本站 - 2023-04-04 19:18
- Read:301
对于现代网站制作师来说,“响应性”是优秀设计最重要的定义因素之一。其实一开始网站并不总是像今天这样适应性强,由于我们现在正在迎合大量经常在具有不同屏幕尺寸的移动设备和桌面设备之间切换的用户。
向响应式网站制作的转变并不是一夜之间发生的。多年来我们一直在调整“响应式网站制作”的概念,最终达到我们今天所处的阶段。 最初创建第一个网站时,没有人担心跨屏幕的响应性。所有网站的设计都是为了适应相同的模板,开发人员并没有在设计、布局和排版等概念上花费大量时间。即使当 CSS 技术开始被广泛采用时,大多数开发人员也不必担心如何让内容适应不同的屏幕尺寸。然而,他们仍然找到了一些方法来处理不同的显示器和浏览器尺寸。
早期开发人员可用 的两个主要布局选项是固定宽度或流动布局。对于固定宽度的布局,如果您的显示器的分辨率与网站制作时的分辨率不完全相同,则设计更有可能被破坏。流动布局可以适应不同的显示器分辨率和浏览器尺寸。但是,内容也可能溢出,并且文本会经常在较小的屏幕上中断。
2004 年,Cameron Adams 的一篇博客文章介绍了一种使用 JavaScript 根据浏览器窗口大小交换样式表的新方法。这种技术被称为“分辨率相关布局”。尽管他们需要开发人员进行更多工作,但依赖于分辨率的布局允许对网站制作进行更细粒度的控制。 依赖于分辨率的布局基本上是作为 CSS 断点的早期版本,在它们出现之前。缺点是开发人员必须为每个目标分辨率创建不同的样式表,并确保 JavaScript 可以在所有浏览器上运行。当时有这么多浏览器需要考虑,jQuery 作为一种抽象浏览器选项之间差异的方法变得越来越流行。
与分辨率相关的设计等概念的引入大约是在许多移动设备变得更加支持互联网的同时发生的。公司正在为他们的智能手机创建浏览器,而开发人员突然也需要考虑这些问题。尽管移动子域旨在为用户提供与智能手机桌面站点完全相同的功能,但它们是完全独立的应用程序。拥有一个移动子域虽然很复杂,但确实有一些好处,例如允许开发人员将 SEO 专门定位到移动设备,并为移动网站变体带来更多流量。但是,与此同时,开发人员需要管理同一网站的两个变体。
自从 Marcotte 引入响应式 Web 设计以来,开发人员一直在研究尽可能有效地实现该想法的新方法。大多数开发人员现在分为两类,根据他们是首先考虑桌面设备用户的需求,还是移动设备用户的需求。趋势越来越向后者加速。 在移动优先浏览时代从头开始设计网站时,大多数开发人员认为移动优先是最佳选择。移动设计通常更简单、更简约,这与当前网站制作的许多趋势相匹配。
采取移动优先路线意味着首先从移动角度评估网站的需求。一旦开始创建桌面和平板电脑布局,您就可以正常编写样式,使用断点。或者,如果您采用桌面优先的方法,则需要通过您的断点选择不断调整它以适应较小的设备。
响应式网站制作仍然不完美。有无数的网站仍然无法在所有设备上提供同样令人难以置信的体验。更重要的是,新的挑战不断出现,比如弄清楚如何为 AR 耳机和智能手表等新设备进行设计。 当然我们是在不断进步的,相信响应式网站制作会有更好的发展。
转载请保留出处及原文地址:/index.php?r=article/Content/index&content_id=490