My animated avatar, and tips on using images on GitHub README.md and some other social media websites.
Version 1.0 was made in 2000s with Adobe Flash.
Current version, v8.0, was made in 2014.
The SVG file is exported from Flash without animation. It is planned to re-add the animation with JavaScript to the SVG file.
Notes on social media:
- β Google, Medium, Stackoverflow, Dev.to users can use animated GIF as their profile avatar.
- π Although Google accepts animated GIF, but it is sometimes rendered as still image.
- β GitHub, GitLab, Reddit, Gravatar do not accept animated GIF.
- π€ Twitter used to accept animated GIF before 2012. Old user with an animated GIF avatar can keep it.
You can't set width and height on images by using GitHub Flavored Markdown, in order to do so, you have to use HTML:
<img src="https://github.com/tomchen/my-avatar/raw/master/tomchen.gif" alt="Tom Chen's animated GIF avatar" title="Tom Chen's animated GIF avatar" height="110px" width="110px">
You can't use aria-label
in HTML or Markdown.
These image URL references are all acceptable:
https://github.com/tomchen/my-avatar/raw/master/tomchen.gif
https://github.com/tomchen/my-avatar/blob/master/tomchen.gif
https://raw.githubusercontent.com/tomchen/my-avatar/master/tomchen.gif
../tomchen.gif
Unicode character π
and GitHub Flavored Markdown :blush:
render as exactly the same π whose HTML code is:
<g-emoji class="g-emoji" alias="blush" fallback-src="https://github.githubassets.com/images/icons/emoji/unicode/1f60a.png">π</g-emoji>
SVG files' SMIL and CSS animation can be shown correctly, but JavaScript code will not be executed (explanation).