MIME Type
Definition
The format is a type and a subtype separated by a slash, with optional parameters after a semicolon, as in text/html; charset=utf-8. Types are registered with IANA; anything vendor-specific starts with vnd. and anything unregistered starts with x-. The value travels in the Content-Type response header, and the generic fallback application/octet-stream means no more than unknown bytes, so save them. The file extension is related but not the same thing: on a normal web server the extension is the lookup key used to choose a type, but it is the header the browser obeys. Change the header and the same file behaves differently; change the extension without changing the header and nothing happens at all.
Why It Matters
A wrong Content-Type is the most common reason a page downloads instead of rendering. Serve index.html as application/octet-stream and the browser has no handler, so it saves the file and the visitor sees a download rather than a website. Serve it as text/plain and they get the raw markup, tags and all. Stylesheets and JavaScript modules are stricter still: a browser in standards mode refuses a stylesheet that does not arrive as text/css, so the page loads unstyled with a console message most people never look at, and an ES module rejected on type grounds takes the whole application down with it. The header X-Content-Type-Options: nosniff, which most security guides tell you to send, removes the browser's old habit of guessing its way out of these mistakes.
How It Works
A web server holds a mapping table — nginx ships one called mime.types — and looks up the extension to pick a value for the header. Object stores have no such table, so the type is whatever was set when the object was written, which is why an upload script that omits it leaves everything as application/octet-stream. The browser then dispatches on the received value, optionally consulting Content-Disposition first to decide between rendering and saving. Text types need the charset parameter or accented characters can render as mojibake, since the browser falls back to a legacy encoding. On the upload side, the type reported by a file input is inferred from the name and is trivially spoofed, so servers that care re-detect from the leading magic bytes of the file.
Real-World Example
A designer uploads an SVG logo to 99helpers and links it from a page. Had it been stored as text/plain the image element would show nothing at all, because browsers will not render an SVG served under the wrong label. 99helpers sets image/svg+xml from the extension at upload time, so the logo appears immediately at brightfold.99helpers.site, and the same lookup gives the stylesheet text/css and the web font font/woff2.
Common Mistakes
- ✕Trusting the type a browser reports for a selected file — it is a guess from the name and a determined uploader can send anything
- ✕Omitting charset=utf-8 on text/html, then wondering why apostrophes and accents appear as strings of odd characters
- ✕Serving JavaScript as text/plain or application/octet-stream, which fails the module type check and stops the script loading entirely
- ✕Inventing a plausible-looking value such as application/pdf-document instead of using the registered one
Related Terms
File Extension
A file extension is the short suffix after the last dot in a file name — .pdf, .png, .html, .woff2 — used as a hint about what the file contains. It is part of the name, never part of the data.
Content-Disposition
Content-Disposition is an HTTP response header that tells the browser whether to show a file in the window or save it to disk, and what name to suggest when it saves. It is how one URL can either open a PDF in a tab or start a download.
index.html
index.html is the file a web server returns when a visitor asks for a folder rather than a named file. It is the default document for the site root and for every directory inside it.
Web Asset
A web asset is any supporting file a page pulls in once the HTML has arrived — stylesheets, scripts, images, fonts, icons, videos. The HTML is the page; the assets are everything it asks for next.
Object Storage
Object storage keeps each file as a self-contained object — its bytes, its metadata and a key that names it — inside a flat container reached over HTTP. There is no directory tree and no file handle to open, seek and write.
Put a file online in seconds
Drop in a document, an image, a page or a whole static website and share the link — free, with no build step and no server to set up.
Host a file free →