空gif(1x1 pix)文件有什么用途?


12

我看到一些随机页面提到使用空gif图像以某种方式提高性能。我也发现nginx有一个用于此目的的模块。我不知道的是,确切地说,如何提供这个小文件可以提高Web服务器的性能或感知的响应速度。谁能帮助我了解好处?


1
我也很想知道这一点。我一直都在看他们,但从未想过为什么...
马克·亨德森

Answers:


20

1x1 gif文件被某些网站用来设置元素之间的间距(特别是在较旧的网站上,当浏览器对HTML / CSS的解释更趋于咳嗽时会产生 IE 咳嗽)

今天,它们还经常用作“跟踪像素”的请求目标,“跟踪像素”用作收集使用统计信息等的工具,尤其是在电子邮件/营销活动中。

您为此文件提供特殊模块的原因是(a)它经常被请求,并且(b)每次都返回相同的内容,因此,如果您不想在磁盘上放置文件,可以避免。


我一直听说它主要是用于跟踪用户,因此阴影“ they”会将其作为来自另一台服务器或其他位置的拉动而嵌入,以便于轻松跟踪命中,并且还通过电子邮件将其嵌入html邮件中以了解您是否阅读了邮件或不; 垃圾邮件发送者针对未禁用HTML / RTF消息并因此将其作为成功地址出售给其他垃圾邮件发送者的人的已读回执版本。
巴特·西尔弗斯

是的,这在电子邮件中很常见。对于网站,该技术已被Google Analytics(分析)之类的JavaScript所取代。
ceejayoz

也称为Transparent.gifSpacer.gifClear1x1.gifBlank.gif检查Wiki Link1Link2,其中css sprites的用法之一是在站点中标记图像。
shaijut 2015年

8

我不确定是否要提高性能,但是在跟踪中通常使用1x1像素的图像。通常称为网络错误(或信标),此图像使浏览器向来自该图像的服务器发出HTTP请求。然后可以检查该请求以获取跟踪信息(例如IP,浏览器,引荐来源网址等)。


2

在Google中搜索“ 一个像素gif ”或“ 单个像素gif ”会返回许多文章,这些文章讨论了使用该文件定位网页元素的技术。

来自优化设计:一像素GIF(2000年1月1日):

在Web设计的早期,HTML的局限性激发了设计师寻找各种解决方法的能力,从而可以控制页面的布局。这些变通办法中最重要的方法之一是单像素GIF技巧,它使用单个像素GIF并使用IMG标签的height,width,hspace和vspace属性对其进行修改。

GIF本身很小,几乎不需要下载时间。并且,取决于单个像素是否透明,结果可以用作间隔物,或者用作水平或垂直尺。


2

包含1x1图像并不会提高性能,反而会降低性能-这是一个额外的HTTP请求,少量额外带宽等。

该模块只是为了使性能降低较小(通过更有效地提供图像),因为用于在页面上定位元素的1x1像素技术可能会有用。


对图像的1x1性质进行了优化以完成其工作,无论其可能是什么(跟踪,间距等),都具有最佳性能,这可能是一种误解。
Xonatron

但CSS精灵提高性能,也称为1x1的图像Transparent.gifspacer.gif的Clear1x1.gifBlank.gif检查维基链接1链路2,在使用CSS精灵形象标志的使用的一个这样的网站。
shaijut 2015年

@stom这与CSS精灵无关。
ceejayoz

1

它们也用于图像拼接。一个小的透明图像用作image标签的src属性,而实际图像是CSS背景图像。性能优势来自CSS背景,它仅是单个图像的一部分,该图像合并了页面中的许多图像,从而减少了总体请求数。

参见例如:


这应该是主要答案。其他答案中有很多关于单像素gif可以完成的事情的好信息,但这是描述使用它们的性能原因的唯一答案。
mc0e 2014年

0

以上所有出色的答案。该模块还有另一种用途。

当您想阻止广告在您的网络中显示时,如果仅拒绝请求的URL,浏览器的加载时间就会受到影响(或在页面上显示阻止消息)。然后,解决方案是将浏览器流量重定向到提供空白图像的内部站点(而不是拒绝请求URL)。

可用于执行重定向的一些技巧是Dnsmasq和Squid重写规则。

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.