• 你好~!欢迎来到萌娘百科!如果您是第一次来到这里,点这里加入萌娘百科!
  • 欢迎具有翻译能力的同学~有意者请点→Category:需要翻译的条目
  • 如果您在萌娘百科上发现某些内容错误/空缺,请勇于修正/添加!编辑萌娘百科其实很容易!
  • 觉得萌娘百科有趣的话,请推荐给朋友哦~
  • 萌娘百科群119170500欢迎加入,加入时请写明【萌娘百科+自己的ID】~
  • 萌娘百科Discord群组已经建立,请点此加入!

帮助:动图

萌娘百科,万物皆可萌的百科全书!
跳转至: 导航搜索

萌娘百科支持GIF、APNG、Webp、SVG等动图格式。

GIF

一幅GIF动画。

GIF是目前互联网上最古老的动图格式之一,发表于1987年6月15日,已有31年历史。[1]尽管某些与之同时代的某些图片格式(比如PCX)都已经成为历史,但它仍然是目前整个互联网最流行的图片格式之一。由于年代久远,其兼容性非常良好,但也因为其过于老旧,所以它只支持256色的动图。[2]

优点 缺点
  • 兼容性好,支持几乎所有平台。
  • 与之相关的编辑软件较丰富
  • 只支持8位(256)色图片。
  • 对于多帧的,复杂图片压缩率不理想。

APNG

一个APNG沙滩排球的演示动画。

APNG是一种动态的PNG图片格式,由Mozilla基金会的两位工程师Vukicevic和 Stuart Parmenter在2004年提出。意在扩充PNG图片的机能。而当时,APNG的前身MNG已经存在了,但由于其体积庞大不为用户所接受。为此,Mozilla的工程师们改变了APNG的压缩算法,使之在保留真彩的基础上能做到体积小巧。初代的APNG格式于2008年5月21日发布。[3] 一开始,APNG只兼容Mozilla基金会旗下的浏览器,但1年前Google Chrome浏览器宣布了对APNG图片格式的支持。[4]并在后来的版本中完全支持APNG。 APNG会通过算法计算帧之间的差异,只存储帧之前的差异,而不是存储全帧。这么做可以极大地压缩图片的体积。[5]但对于较为复杂的动画截图,APNG的压缩效果并不是非常理想。

优点 缺点
  • MediaWiki内核的萌娘百科兼容。
  • 支持24位全彩动图。
  • 与之相关的编辑软件较丰富。
  • 对于高分辨率的,内容复杂的动画截图压缩率不理想。
  • 不是所有浏览器(比如Edge)都支持。

WebP

参见:Template:image

WebP格式是一种图片格式,衍生自影像编码格式VP8,被认为是WebM多媒体格式的姐妹项目,是由Google在购买On2 Technologies后发展出来。[6] 与APNG一样,WebP支持动图。并且体积非常小(在无损前提下可以达到Jpeg的50%)。但编码速度较慢。[7] 要插入WebP图片,需要使用{{image}}模板。比如:

{{image|显示类型=inline-block|图片=3-Color Animated Gears.webp|宽=330|高=300|种类=box|描述=三色齿轮动画,用于演示WebP的支持状况。|link=:File:3-Color Animated Gears.webp}}

得到:

三色齿轮动画,用于演示WebP的支持状况。

另外,插入WebP动图的页面请在页顶使用{{webp动图}}(本名{{Animated webp}})注明。而要浏览有Webp的页面,建议使用Google ChromeFirefox(65.0开始)浏览器浏览。

优点 缺点
  • 支持24位全彩动图。
  • 动图压缩率较高。
  • MediaWiki内核的百科全书兼容性不佳,无法被当作图片识别。
  • 与很多手机浏览器兼容性亦不佳。
  • 支持该格式的编辑器亦不多。

SVG

参见:矢量图§标准

与前面三种位图格式不同。SVG是矢量图格式的一种,支持动画。[8]但制作较为复杂,不能像位图的动图那样一帧一帧地叠加。并且由于其使用Javascript脚本制作,所以在缩略图状态下(格式为.png)无法正常显示。

优点 缺点
  • 支持24位全彩动图。
  • 矢量图格式,可以无限放大
  • 图片会被MediaWiki内核的百科全书转换为PNG格式的缩略图,只能在文件浏览器中观看。
  • 一般由代码写成,相较于一般的图片编辑很不直观。
  • 无法制作动态的动画截图。(因单帧往往是位图。)

注释

  1. Aja Romano. The GIF is 30 years old. It didn't just shape the internet — it grew up with the internet.. Vox. 2017-06-15 [引用时间: 2018-06-27]. 
  2. Rick Matthews. Choosing between JPG, GIF, and PNG for web images. users.wfu.edu. [引用时间: 2018-06-27]. 
  3. Andrew Smith. APNG Implementation. littlesvr. [引用时间: 2018-06-27]. 
  4. COSTEA LESTOC. Google Chrome will support animated PNGs without extensions. WindowsReport. 2017-04-30 [引用时间: 2018-06-27]. 
  5. TH. APNG那些事. 凹凸实验室. 2016-11-07 [引用时间: 2018-06-27]. 
  6. Compression Techniques. developers.google.com. [引用时间: 2018-06-27]. 
  7. WEN. 探究WebP一些事儿. 凹凸实验室. 2016-06-23 [引用时间: 2018-06-27]. 
  8. Animation. W3.org. 2011-08-16 [引用时间: 2018-06-27].