DEV Community

Cover image for This Image is Also an HTML Webpage
Ben Halpern
Ben Halpern

Posted on

This Image is Also an HTML Webpage

Here is an image:

Also an HTML page

But it is also an HTML page. Here is the markup for the above image:

<img src="" />
Enter fullscreen mode Exit fullscreen mode

Now try visiting that webpage:

Pretty cool, eh?

I did not make this. I am just showing you because it is cool.

Here is an explanation of what is happening:

  1. The file is a valid jpeg file with some html in metadata.
  2. The server responds with Content-Type: text/html, making browser interpret the response body as html.
  3. Browser ignores jpeg header until it sees and starts to render the html.
  4. The html in the jpeg metadata ends with "<!--" , which starts html comment.
  5. The html has that renders the file as image.

I found this hack fascinating, and I hope you did too.

Top comments (0)