浏览环境变化让网站设计已经不再有绝对的标准宽度

2022-05-24    分类: 网站设计


网站建设时,大多数网站设计师首先考虑的是要设计什么样的分辨率。这实际上就是决定你的设计应该有多宽。随着手机、平板等各种终端设备广泛应用,以及各种分辨率的显示器普及,网站已经不再有标准宽度这样的东西了。既然浏览环境变化让网站设计已经不再有绝对的标准宽度了,那么在网站设计制作时如何确定网页宽度呢?这是一个问题,而且每家网站建设公司都会面对,对需要认真对待并找到解决方案。
为什么要考虑解决方案
1995年,标准640x480分辨率监视器是现有的大和最好的监视器。这意味着Web设计人员专注于在12英寸到14英寸的显示器上制作在Web浏览器中看起来很好的页面,其分辨率达到大值。如今,640x480的分辨率还不到大多数网站流量的1%。人们使用的计算机分辨率更高,包括1366x768、1600x900和5120x2880。在许多情况下,1366x768分辨率屏幕的设计是可行的。
在网页设计的历史上,我们不需要太担心分辨率的问题。大多数人都有大屏幕的显示器,他们没有大化他们的浏览器窗口。因此,如果您决定设计一个不超过1366像素宽的页面,您的页面可能会在大多数浏览器窗口中看起来很好,即使在分辨率较高的大型显示器上也是如此。
浏览器宽度
在你开始思考“好的,我会让我的页面1366像素宽”之前,这个故事还有更多的内容。在决定网页的宽度时,一个经常被忽略的问题是您的客户保留其浏览器的大小。具体地说,它们是将浏览器的大小大化为全屏大小,还是将其保持在小于全屏大小的范围内?
在对所有使用公司标准1024x768分辨率笔记本电脑的同事进行的一次非正式调查中,有两个人让他们的所有应用程序都大化了。其余的由于各种原因打开了不同大小的窗口。这说明,如果您要将该公司的Intranet设计为1024像素宽,85%的用户必须水平滚动才能看到整个页面。
为大化或不大化的客户进行说明后,请考虑浏览器边界。每个Web浏览器都有一个滚动条和边框,在800x600分辨率下,可用空间从800像素缩小到740像素或更少,而在分辨率为1024x768的大化窗口上,则缩小到980像素左右。这就是所谓的浏览器“铬”,它可以从可用的空间,为您的网页设计。
固定或响应式宽度
实际的数字宽度并不是你在设计网站宽度时需要考虑的唯一因素。您还需要决定是固定宽度还是液体宽度。换句话说,您是要将宽度设置为特定的数字还是设置为一定的百分比?
  • 固定宽度
    固定宽度的页面和它们听起来完全一样。宽度固定在一个特定的数字上,无论浏览器有多大或多小,它都不会改变。无论你的读者的浏览器有多宽或多窄,如果你需要你的设计看起来完全一样,这是很好的,但是这个方法没有考虑你的读者。使用比您的设计更窄的浏览器的用户将不得不水平滚动,而使用宽浏览器的用户将在屏幕上有大量的空白空间。要创建固定宽度的页面,只需对页面分区的宽度使用特定的像素编号。
  • 响应式宽度
    “液体宽度”页面(有时称为“灵活宽度页面”)的宽度因浏览器窗口的宽度而异。这使您可以设计更多关注客户的页面。液体宽度页的问题是它们可能很难阅读。如果一行文本的扫描长度大于10到12个单词或小于4到5个单词,则可能很难阅读。这意味着拥有大小浏览器窗口的读者都有问题。要创建灵活的宽度页面,只需使用百分比或EMS作为页面分区的宽度。您还应该熟悉CSS大宽度属性。此属性允许您以百分比形式设置宽度,但随后会对其进行限制,使其不会变得太大以致于人们无法读取它。
CSS媒体查询
目前最好的解决方案是使用CSS媒体查询和响应性设计来创建一个页面,以适应查看它的浏览器的宽度。响应性网页设计使用相同的内容来创建一个网页,无论您是以5120像素宽还是320像素宽查看该网页。不同大小的页面看起来不同,但它们包含相同的内容。对于CSS3中的媒体查询,每个接收设备都使用其大小来响应该查询,并且样式表将根据该特定大小进行调整。

名称栏目:浏览环境变化让网站设计已经不再有绝对的标准宽度
分享路径:https://www.cdcxhl.com/news12/157712.html

网站建设、网络推广公司-创新互联,是专注品牌与效果的网站制作,网络营销seo公司;服务项目有网站设计

广告

声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联

外贸网站制作