1. HTML is very forgiving. HTML also provides a comment mechanism <!-- --> between which anything will be ignored from a browser perspective.

2. JPEG also allows for comments and other embedded metadata which won't show up in the displayed image.

3. Start the file with a JPEG header and metadata section, then switch between HTML and JPEG using the comment functionality mentioned above

Essentially!

"But wait, why is it shown as an image in one context and as a web page in another?"

The answer is in the question: Context. If you expect a JPEG you will get a JPEG, and same for HTML.

JPEG images allow comments. The html is stored in the comment. Browsers assume they are reading an HTML file and loads the comment. When the browser thinks it is reading an image, like in an <img> tag, it reads the image ignoring the comment.