Bad content Type

Check MIME types for pages and assets—serve HTML, CSS, JS, and images with the right headers to prevent broken rendering.

Add Test Criteria

Bad Content Type

A Bad Content Type occurs when a webpage or its assets (like CSS, JS, or images) are served with the wrong MIME type — the “media type” that tells browsers how to interpret files. Think of it as a label on a package: if mislabeled, the recipient (browser) may misread or fail to open it properly.

What is a Content Type (MIME Type)?

A MIME type (Multipurpose Internet Mail Extensions type) identifies the nature and format of a file. Browsers rely on it to decide how to handle the content they receive.

For example:

  • HTML pages use text/html
  • CSS files use text/css
  • JavaScript uses application/javascript
  • Images might use image/png or image/jpeg

If the wrong MIME type is set, your page could break, fail to render, or even be blocked for security reasons.

How to Implement Correct Content Types

Proper MIME types are set in your server’s HTTP headers.You can configure them in your server settings (like .htaccess, Nginx config, or application code).

Apache

AddType text/html .html AddType text/css .css AddType application/javascript .js AddType image/jpeg .jpg .jpeg AddType image/png .png

Nginx

types { text/html html; text/css css; application/javascript js; image/png png; image/jpeg jpg jpeg; }

How to Check for Bad Content Types

You can check your site’s content types using:

  • Developer Tools → Network tab (look at “Content-Type” under Headers)
  • Command-line tools like curl -I https://example.com/style.css
  • Online tools such as the Bad Content Type Checker (this page’s tool!)

A correctly configured server should return responses like:

Content-Type: text/html; charset=UTF-8

and not something incorrect like:

Content-Type: text/plain

Why Does Correct Content Type Matter?

  • Browser Rendering: Incorrect MIME types can cause pages or stylesheets to break.
  • Security: Some browsers block scripts or assets with mismatched MIME types.
  • SEO & Performance: Search engines may misinterpret or fail to index resources properly.
  • User Experience: Improperly rendered content leads to broken layouts or missing visuals..

Do’s and Don’ts of MIME Types

✅ Do's
  • Set the correct MIME type for every file served.
  • Always include the charset for text-based files (charset=UTF-8)..
  • Regularly validate your headers after server updates..
  • Use the correct file extensions that match the MIME type..
❌ Don'ts
  • Don’t serve HTML as text/plain — it will display code instead of the webpage..
  • Don’t serve JavaScript as text/html — browsers may refuse to execute it..
  • Don’t rely on browsers to “guess” file types; this can cause security issues.

Good vs. Bad Content Type Examples

Good:
Content-Type: text/html; charset=UTF-8 Content-Type: application/javascript Content-Type: image/png
Good:
Content-Type: text/plain Content-Type: application/octet-stream Content-Type: text/html (for CSS or JS files)

Are Content Types Important for SEO?

Yes. While not a direct ranking factor, incorrect MIME types can prevent Googlebot from properly rendering or indexing your site’s assets — especially JavaScript and CSS. A bad content type can indirectly hurt crawlability, performance scores, and user experience metrics

Conclusion

The Content Type header is a small but critical piece of your web infrastructure. By ensuring your server serves each file with the correct MIME type, you:

  • Prevent rendering and security issues
  • Improve SEO readiness, and
  • Deliver a seamless, consistent experience for users across all browsers.

FAQs on Meta Title

It occurs when the MIME type sent by the server doesn’t match the actual file type (e.g., sending HTML as text/plain).

Use browser dev tools (Network tab) or a terminal command like: curl -I https://example.com/script.js

Yes. Modern browsers block scripts and stylesheets served with invalid MIME types to prevent security risks.

Some servers default to application/octet-stream (generic binary) or text/plain, which is unsafe and can break rendering.

Configure your server to return the correct Content-Type header in HTTP responses. Use .htaccess, nginx.conf, or framework settings to assign proper types.

If you ain’t measuring it,
you aren’t improving it.

Free Signup