为客户提供价值;为客户提供及时到位的服务;为员工提供发展平台。

设计前沿

您当前位置: 首页 > 设计前沿

处理网页图片最常见的10个错误及其解决方案

2016-12-23
浏览  1054次

处理网页图片最常见的10个错误及其解决方案

[导读] 对于任何一个现代网站来说图片都是最重要的部分。当前,据统计图片已经占到网站总带宽的60%。在处理前沿网站设计时更加明显。在    一个图像丰富的社交网站上使用类图钉的布局,这个数字能高达85%。不幸的是带宽很贵
对于任何一个现代网站来说图片都是最重要的部分。当前,据统计图片已经占到网站总带宽的60%。在处理前沿网站设计时更加明显。在一个图像丰富的社交网站上使用类图钉的布局,这个数字能高达85%。
    不幸的是带宽很贵。对于高流量的网站,带宽很可能要为你的IT花费负主责,轻松超越虚拟主机和存储花费。另外,如此大量的流量需要花时间,所以在浏览你的网站时,访问者很可能要花很长时间来等待图片的载入。
    我们列举了其中的我们往往每天会遇到的与他们如何可以(并应该)来解决的问题。

1. 奢侈的在浏览器端调整图片大小

    我们常常观察到开发者所使用的一个快捷方式就是使用浏览器端的图片大小调整,而不是在服务器端就把图片的大小调整好、.
    情况常常是一样的 – 网站中拥有许多特定尺寸的缩略图,然后图形的设计发生了变化. 新的图形设计要求缩略图尺寸有一点轻微的变化,而我们的开发者,有时是随意,有时则是刻意的,就使用原来的大尺寸图片,只是针对浏览器调整一下图片的CSS高度和宽度,使图片看起来是一张缩略图.
    在现代浏览器上,最终结果看上去确实是一样的,但是加载图片所耗费的带块却是不一样的. 你的网站访问这需要浪费珍贵的时间来加载一张不必要的拉图片,而你则浪费了多余的带宽去传输他们. 对于更老的浏览器这一问题会更加的突出,因为他们调整图片尺寸的算法效率是低于平均水品的.
    这一问题比你想象的还要普遍许多,它能在我们日常访问的许多网站中找到. 例如,访问 Yahoo 的前头版页面,你会注意到“热点“新闻这里加载的所有缩略图像素都是你所看到的尺寸的两倍.
如何解决: 对于开发者 / 设计者 – 请确保你要发布的图片完美的契合需要他们的网站的尺寸. 即使是同一张图片,也要用不同尺寸的缩略图来适配不同的页面, 创建不同尺寸的缩略图,而不是全都使用同一张大尺寸图片并依赖浏览器去调整它的大小,这样做是很值得的.

CopyRight © 2013-2019温州易邻信息科技有限公司 All Rights Reserved.  ICP证: 浙ICP备14031019号

0577-55562810
kok棋牌下载客服