跳到主要内容

需要响应式图像格式

GIF和JPEG并不是Web浏览器中首先支持的图像,即使它们似乎永远与我们在一起。 PNG及其alpha透明度功能在首次发现后主流采用需要一段时间。现在谷歌正在推动他们新的WebP图像格式但是对于WebP来说,已经冰冷的图像采用速度会慢一些。

我认为WebP是GIF和JPEG的混合体,没有提供任何新的革命性功能(如PNG的alpha透明度)。我们已经有了自适应/响应图像的问题这是一个需要革命性解决方案的问题。

我们的朋友JPEG,GIF和PNG的问题在于它们是什么:静态,独立的一招小马。它们不能同时具有低分辨率和高分辨率。我们需要的是一种图像文件格式,实质上是一个存储柜。

存储决议

例如,.mp3文件格式不仅仅是一些零和一些零的音乐。音频标签内还有元数据信息。例如,这就是iTunes记录歌曲标题,艺术家,专辑标题,歌曲出现年份等歌曲信息的地方。

我们需要有类似图像的文件格式。我们需要存储图像的不同变体,而不是捕获图像的元信息,这非常简单。一个图像文件可能包含缩略图图像,移动友好图像,桌面友好版本,视网膜显示版本和打印友好图像。

这种响应式图像格式不仅仅是一个梦想。已经存在一个图像文件格式:它叫做FlashPix。由合作伙伴伊士曼柯达,微软和惠普于1996年开发的图像文件格式领先于它的时代,因为它没有在浏览器市场上采用并且似乎无精打采。

响应式图像格式的好处

响应式图像格式的一个好处是它允许继续使用img元素和img元素。 img元素根深蒂固于网络的骨骼中。该通过强制对不同图像进行多个源引用以使一个图像起作用,提案违背了这种心态。对于那些基本的东西来说,这是一项额外的工作。

有人说过了元素是共识驱动的,精心设计的并且是可用的解决方案(参见cssquirrel.com/blog/2012/05/15/the-egotistical-puppet-king-and-i/)。

我会在这三个中给你两个 - 解决方案已经达成共识并且制作精良,但它不是一个可用的解决方案。

这就是为什么放弃XHTML的严格编码风格并将松散的HTML4编码实践灌输到HTML5中的原因。百分之九十五的网站没有验证(见dev.opera.com/articles/view/mama-markup-validation-report/),不是因为我们不希望它们,而是因为我们从开始或随着时间的推移对它们进行了编码。

要求网页设计师,博主和非技术人员创建他们的图像的许多副本并编写额外的HTML行以安抚每个可能的显示场景似乎不仅仅是非标准的方法,它也不是一个非常实用的方法。

由于浏览器供应商的地盘战争和许可问题,音频和视频解决方案的诞生是为了平衡不同的文件支持。通过尝试使用视频和音频元素产生的解决方案,如果我们将一个独特的数学问题的答案复制到另一个数学问题只是因为它使用了相同的整数。

没有必要制作多行HTML来使一个图像显示在网页中,就像在网页中提供的那样元素(见www.netmagazine.com/features/state-responsive-images)。

不编码的内容发布者

另一个问题是,使用附加标记插入图像的方法需要在WYSIWYG编辑器,内容管理系统中各自的工具栏和更新的旧网页中进行广泛的更改。

这根本就不会发生。需要有迷你Y2K级别的东西(见www.computerworld.com/s/article/9142555/Y2K_The_good_the_bad_and_the_crazy)让公司和组织开始花费这种资金来解决问题。

SRCSET属性

最近,WHATWG在考虑了之后宣布了自己的提案元素(见www.whatwg.org/specs/web-apps/current-work/multipage/embedded-content-1.html#attr-img-srcset)。乍一看,这绝对是一个更实用,更向后兼容的解决方案元件。

该属性的语法需要像Jeremy Keith讨论的那样工作(参见Adactio.com/journal/5474/),但这些问题很容易解决 - 希望 - 不那么引人注目。

保存一次,图像无处不在

但是,如果给出了一个选择,我相信网页设计师宁愿从Fireworks,Photoshop或者他们最喜欢的图像编辑器中输出一件艺术品。然后将此容器文件上载到服务器上,就像我们之前使用的每个其他图像文件一样,并通过HTML页面中的img元素引用。唯一的区别是服务器和浏览器同意应该在引用时显示其存储柜中的哪个图像。

IMG尚未死亡

简单的img让我们走到了尽头,它还没有让我们失望。但是SRCSET属性的引入是一个聪明的举动,让我们更接近解决方案。现在,让我们看看通过构建更智能的浏览器和服务器,使图像格式更智能,更好。

Web需要一种图像格式,当浏览器询问服务器时,服务器可以提供包含正确分辨率的正确图像。我们需要一种可与服务器和浏览器协同工作的图像格式,以确定适当的分辨率。

用于网页设计的新图像格式并非不可能。有时候感觉就像这样。



翻译字数超限