萌娘百科衷心希望新型冠状病毒肺炎疫情早日结束!
  • 你好~!欢迎来到萌娘百科!如果您是第一次来到这里,点这里加入萌娘百科!
  • 欢迎具有翻译能力的同学~有意者请点→Category:需要翻译的条目
  • 如果您在萌娘百科上发现某些内容错误/空缺,请勇于修正/添加!编辑萌娘百科其实很容易!
  • 觉得萌娘百科有趣的话,请推荐给朋友哦~
  • 萌娘百科群119170500欢迎加入,加入时请写明【萌娘百科+自己的ID】~
  • 萌娘百科Discord群组已经建立,请点此加入!
本页使用了标题或全文手工转换

帮助:动图

萌娘百科,万物皆可萌的百科全书!转载请标注来源页面的网页链接,并声明引自萌娘百科。内容不可商用。
跳转至: 导航搜索

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

GIF

一幅GIF动画。

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

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

APNG

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

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

支持APNG格式的浏览器包括但不限于:

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

WebP

参见:Template:image

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

截止MediaWiki 1.31.1 版本(2019年2月17日),MediaWiki程序只能支持静态的WebP图片。要插入动态WebP图片,需要使用{{image}}模板。比如:

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

得到:

File:3-Color Animated Gears.webp
三色齿轮动画,用于演示WebP的支持状况。

另外,插入WebP动图的页面请在页顶使用{{webp动图}}(本名{{Animated webp}})注明。而要浏览有Webp的页面,建议使用Google ChromeFirefox(65.0开始[14])、Opera(12.1开始[15])、Pale Moon(26.0开始)、Microsoft Edge(需要更新到Windows 10, 版本 1809以上[16]或者安装插件[17])浏览器浏览。

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

SVG

参见:矢量图§标准

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

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

参考资料

  1. Tom Merritt. Chronology of Tech History. Lulu.com. 2012: 119 [引用时间: 2019-04-15]. ISBN 978-1-300-25307-5. 
  2. Rocci, Luppicini. The Changing Scope of Technoethics in Contemporary Society. IGI Global. 2018-04-13: 292 [引用时间: 2019-04-15]. ISBN 978-1-522-55095-2. 
  3. Salvador Rodriguez. GIF's 25th birthday: Is it pronounced 'gif' or 'jif'? [Poll]. Los Angels Times. 2012-06-15 [引用时间: 2019-04-15]. 
  4. 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]. 
  5. Rick Matthews. Choosing between JPG, GIF, and PNG for web images. users.wfu.edu. [引用时间: 2018-06-27]. 
  6. Andrew Smith. APNG Implementation. littlesvr. [引用时间: 2018-06-27]. 
  7. COSTEA LESTOC. Google Chrome will support animated PNGs without extensions. WindowsReport. 2017-04-30 [引用时间: 2018-06-27]. 
  8. TH. APNG那些事. 凹凸实验室. 2016-11-07 [引用时间: 2018-06-27]. 
  9. 9.0 9.1 Bramus!. Opera 46 and Chrome 59 now support APNG (Animated PNG). Bram.us. 2017-06-22 [引用时间: 2019-11-20]. 
  10. Radu Tyrsina. Google Chrome will support animated PNGs without extensions. Windows Report. 2017-04-30 [引用时间: 2019-11-20]. Last week Google has launched Chrome 58 which is the latest stable version of the popular web browser. Version 59 is currently in the Dev Channel and it seems that Google has finally confirmed that it’s going to include fully native support for animated PNG files. 
  11. Firefox 3 Animated PNG support. MDN. [引用时间: 2019-11-20]. 
  12. Compression Techniques. developers.google.com. [引用时间: 2018-06-27]. 
  13. WEN. 探究WebP一些事儿. 凹凸实验室. 2016-06-23 [引用时间: 2018-06-27]. 
  14. Martin Brinkmann. Firefox 65 supports Google's WebP Image format. gHacks Tech News. 2018-11-02 [引用时间: 2019-06-11]. 
  15. Addy Osmani. 自动优化图像. Google Developers. [引用时间: 2019-12-08]. 
  16. Stephen Shankland. Google's WebP image format finally finds a browser ally: Microsoft Edge. CNet. 2018-10-03 [引用时间: 2020-03-27]. 
  17. Surur. Microsoft brings support for Google’s .webP image format to Edge. MSPoweruser. 2018-06-15 [引用时间: 2020-03-27]. 
  18. Animation. W3.org. 2011-08-16 [引用时间: 2018-06-27].