I recently found an animated GIF image that was given a .jpg extension and served with the Content-Type image/jpeg. Despite this my browsers managed to display the image and let it animate. Does it matter which Content-Type (and extension?) an image is given, as long as it's image-related?

Sounds really weird, as a jpg file can't be animated. Can you show us the file?

Search for "animated jpg" and see if you can find an answer.

Or maybe it's something like what's discussed at Javascriptkit's codingforums: http://www.codingforums.com/showthread.php?t=134269

In my understanding the actual file is still a GIF, and its internal GIF header: http://www.onicos.com/staff/iz/formats/gif.html overrides both the JPEG Content-Type and .jpg file extension.

But when I give the same file a .txt-extension and upload to the server, Opera and Chrome shows a static image, IE7 shows a half-broken animation, while FF and Safari asks me what to do with it. When I open the file offline all of the above browsers show its content as characters, except Safari which refuses to open it. Apparently an offline image file's internal header is ignored when the file has a .txt extension.


Sorry no, but you should be able to test it with any animated GIF. Just rename it to ".jpg" (not with an image editor, of course) and the server should send it with a JPEG Content-Type header.


No, the image linked there seems to be served with a GIF Content-Type despite the .jpg extension, which I guess is not normal server behavior.

In Unix, a file, any file, is a sequence of bytes. A file can have any name, made from (more or less) any characters exluding '/' (the directory separator), but including '.' which has no particular significance. Various applications may use "file extensions", but these are just conventions for those applications. (In CP/M - MS-DOS a filename consisted of an 8-character part and a 3-character "extension".)

Apache is just another application, and it uses any "file extension" as a default indicator of the file type, sending the appropriate http header unless instructed otherwise.

So when you put a file with a .txt name, Apache sends a 'text' header, and browsers interpret it as a "viewable bytestream" file, which they display as a series of characters.

If you open a local file, there is only the filename to go on, and (reasonably) your browser interprets something.txt as a text file. There is no "header" as such in an image file (remember the definition of a Unix file); there is usually a "magic" character combination, including at least one not obviously printable character, in the first few bytes of the file. So a program expecting to read an image file should immediately notice that the magic bytes are wrong -- and in most cases it will probably look for magic bytes belonging to other formats it knows about. That's why the browser can reasonably guess that what purports to be a jpeg file is actually a gif.

Things were not always thus: the Mac has some "metadata" associated with any file which says what the "type" of the file is (don't know the details : "resource fork", is it?) And in older mainframe systems, often a file was a structured set of fixed length records. In many ways the flexibility of the Unix "file" idea is what makes it so usable.



It's perfectly normal behaviour if the server has been instructed to send a gif content header. Just as this page: http://imaginatorium.org/ecco/ includes a stylesheet generated by a php program:

<link rel=stylesheet href="eccocss.php?x=150&amp;y=200" type="text/css">

I couldn't be bothered to remember how to make Apache parse .css file through PHP, so I just use .php for the filename, and send the right header.

I used the sample file from codingforums. I changed it to .txt and .jpg, as it already had a .gif extension when I downloaded it.
The .txt file is shown as text in Safari, with the first few bytes clearly being gif (GIF89a).
Using .jpg, Safari sends a GIF Content-Type header, though returning an error in the Web Inspector, the animation still shows fine.


The "type" of file is stored in the data fork. The resource fork stores icons, menu definitions, etc. See http://en.wikipedia.org/wiki/Resource_fork