* Did you know that each browser has a frame delay limit for gif images?
* Are you using delays that are supported by your browser when you make animations?
* Find out now!
All the information below is from my own experience. I wasn't able to find anything on the net to back me up, so you'll just have to believe me . If you feel that any of what I've said below seems incorrect then please let me know. Now lets get started!
Did you know that each browser has a frame delay limit for gif images?
This means that if any frames in a gif image have a shorter delay than this limit, the delay for those frames will be given a default value. So an animation that looks great and runs smooth on you animation software, may not run as smoothly once you've uploaded it if you have used frames that are out of the browser's limit.
Why is this important?
It's important to me because spending a lot of time on an animation only to find out that it looks horrible on my browser really sucks. Especially when some frames that are supposed to go faster than other frames, actually go slower!
It's also important to me because when I upload things on deviantArt I want all my watchers to be able to enjoy my work, and not only those who have the same browser as me. This means making animations that don't get messed up in other browsers as well.
If this isn't important to you then you can stop reading now.
The browsers I have tested are:
- Internet Explorer 6 , 7 and 8
- Firefox 2 and 3
- Opera 9.64
- Google Chrome
- Safari 4
If your browser is not in this list, I think it's a pretty safe bet to assume that it has the same limit as Internet Explorer. But I'm just guessing ...
Let take a look at some examples!
Can you see the speed difference between this: and this: ?
The one on the left has a delay of 0.01s per frame and the one on the right has a delay of 0.1s per frame, but if you are using one of the browsers listed above then both of them should look alike (may not be syncronised though).
This is because none of these browers support a frame delay of 0.01s so all frames of the one on the left are set to the default value of 0.1s
So what does your browser support? Lets take a look.
Well Firefox 3 and Opera 9.64 seem to be champions here. Both of them support a delay as low as 0.02s per frame!
So, if you are using one of those, you should be able to tell the speed difference between
this: and this: !
Then we have Firefox 2 which supports frame delays as low as 0.03s per frame!
Finally we have Internet Explorer (7,8 and 9) , Google Chrome and Safari 4 which can only support frame delays as low as 0.06s
Really old versions of Internet Explorer and Opera may be even worse!
So what am I supposed to do about it?
So now you have to choose:
* Using really low frame delays will make it easier to animate fast movements, but not everyone who look at your art may have the appropriate browser to enjoy it, and for them it may look weird.
* By using frame delays supported by all browsers you will be sure that your animations are displayed the same way to everyone, but of course you may not always be able to create the same cool effects.
I've chosen the 2nd option. I've never gone below 0.06s on any frames in any of my animations for over a year now, and it's been working fine for me (You can always make it look like it's going faster than it actually is by placing the right pixels in the right places ^^ )
Here are a few of my deviation that I made before I found out about these limits:
Here I use some frames with delays below 0.06s in each of the animations. So all of them run smoothly on Firefox and Opera, but on all other browsers, the frames that are meant to go really fast are actually the slowest frames.
But FireFox makes my animations go faster than they actually are!
No it doesn't! <__< It's your computer that is playing it too slow. Just be sure to always check your animations in a browser every now and then (especially if you have a slow computer or if your animation has a lot of frames). ^^
I made this because quite a few of you wanted to know, so you better have read it
and I hope at least someone found this helpful
If your browser wasn't mentioned above, you can try to figure out the limit by looking here: [link] . See which of the animations seem slower than they should be.
Thank for reading! and let me know if anything is unclear.