[browser] What is a MIME type?

Explanation by analogy

Imagine that you wrote a letter to your pen pal but that you wrote it in different languages each time.

For example, you might have chosen to write your first letter in Tamil, and the second in German etc.

In order for your friend to translate those letters, your friend would need to:

  • (i) identify the language type, and
  • (ii) and then translate it accordingly. But identifying a language is not that easy - it's going to take a lot of computational energy. It would be much easier if you wrote the language you are sending across on the top of your letter - that would make life a lot easier for your friend.

So then, in order to highlight the language you are writing in, you simple annotate the language (e.g. "French") on the top of your letter.

An Example of a letter

How would your friend know or be able to read or distinguish between the different language types you are specifying at the top of your letter? That's easy: you agree upon this beforehand.

Tying the analogy back in with HTML

Because there are different types of data formats which need to be sent over the internet, specifying the data type up front would allow the corresponding client to properly interpret and render the data accordingly to the user.

Why do we have different data formats?

Principally because they serve different purposes and have different abilities.

For example, a PDF format is very different from a picture format - which is also different from a sound format - both serve very different purposes and accordingly are written different prior to being sent over the internet.

Examples related to browser

How to force reloading a page when using browser back button? How do we download a blob url video How to prevent a browser from storing passwords How to Identify Microsoft Edge browser via CSS? Edit and replay XHR chrome/firefox etc? Communication between tabs or windows How do I render a Word document (.doc, .docx) in the browser using JavaScript? "Proxy server connection failed" in google chrome Chrome - ERR_CACHE_MISS How to check View Source in Mobile Browsers (Both Android && Feature Phone)

Examples related to firefox-addon

Drag and drop menuitems Postman addon's like in firefox Convert URL to File or Blob for FileReader.readAsDataURL Getting "net::ERR_BLOCKED_BY_CLIENT" error on some AJAX calls How can I fix WebStorm warning "Unresolved function or method" for "require" (Firefox Add-on SDK) How to add java plugin for Firefox on Linux? Firefox Add-on RESTclient - How to input POST parameters? .setAttribute("disabled", false); changes editable attribute to false What is a MIME type? Parsing JSON from XmlHttpRequest.responseJSON

Examples related to mime-types

Stylesheet not loaded because of MIME-type Is the MIME type 'image/jpg' the same as 'image/jpeg'? Proper MIME type for .woff2 fonts How to check file MIME type with javascript before upload? Correct MIME Type for favicon.ico? Right mime type for SVG images with fonts embedded Which mime type should I use for mp3 Correct mime type for .mp4 What does "Content-type: application/json; charset=utf-8" really mean? Add MIME mapping in web.config for IIS Express