Double-click, drag it in, or use the open-file shortcut — that part takes seconds. The useful part is what to do when it opens blank, unstyled, as a wall of code, or in Notepad instead of the browser. Four symptoms, four different causes, and how to tell them apart in the Console.
You have an .html file. Someone emailed it, a colleague dropped it in a shared folder, or an AI tool handed it to you as a download. You want to see the page, not the code behind it.
Opening it takes a few seconds. Most of this post is about the next minute, when the page comes up blank, or plain, or as a wall of tags. Each of those has a different cause, and you can usually tell which one you have without reading any code.
Any of these works:
.html files. If something else opens, right-click the file and choose to open it with Chrome.Ctrl+O on Windows, ChromeOS and Linux, Cmd+O on a Mac, then pick the file.Once it's open, look at the address bar. It now starts with file:/// followed by the folder path on your disk. Keep that prefix in mind, because most of what goes wrong below comes from it.
If what you actually wanted was the source rather than the page, Chrome's View page source shows it: Ctrl+U, or Cmd+Option+U on a Mac.
Usually Chrome opened it fine and something else went wrong. People describe four different problems with this same sentence, so start by matching what's on your screen:
| What you see | What's usually going on |
|---|---|
| It opened in Notepad, TextEdit or a code editor | Another program is set as the default for .html |
| A blank white page | A script the page depends on didn't load |
| Text is there, but the layout is plain or images are broken | The page expected files from a folder you don't have |
| Chrome shows the HTML tags as text | The file isn't really an .html file |
For the last three, open the Console before you change anything: Ctrl+Shift+J on Windows, Cmd+Option+J on a Mac, or right-click the page, choose Inspect, then the Console tab. The first red line usually tells you which row you're in.
The file is fine. Your computer just has a different default program for .html, which happens a lot after installing a code editor. Open it with Chrome once (above). To make that stick, change the default app for .html files in your system settings, or in the file's own "open with" options, so it applies to every .html file rather than just this one.
Blank almost always means a script failed before it drew anything. There are two common ways that happens.
The page loads its framework from the internet. Plenty of AI-exported pages aren't really self-contained. When we exported a small Claude artifact as standalone HTML in October 2026, the file was 1.4 KB, and React, which draws the whole page, loaded from cdnjs. With a connection, it showed a counter and a button. With the network switched off, the same file opened as a completely empty page, and the Console said React is not defined after two failed requests to cdnjs. A network that blocks that CDN does the same thing. In the Console this shows up as a failed request to an outside address. Reconnect and reload, and if that fixes it, the file needs that connection every time it opens.
Chrome blocks part of the page because it came from file://. Two common patterns work on a web address and fail from your disk:
<script type="module" src="./app.js">fetch('./data.json')In both cases Chrome refuses the request when the page was opened from file://, and the Console says so. For a module script the message looks like this:
Access to script at 'file:///…/app.js' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: chrome, chrome-untrusted, data, http, https.
and for the data file:
Fetch API cannot load file:///…/data.json. URL scheme "file" is not supported.
Nothing is wrong with the file. It was written to be served from a web address, not opened from a folder. If you made it, serve the folder locally instead of double-clicking. One way, from inside that folder, is python3 -m http.server, then open http://localhost:8000. If someone sent it to you, ask for a single-file version instead.
The text is there but the page looks like a 1990s document, or every image is a broken icon. The page points to files beside it, such as styles.css or images/logo.png, and you only have the .html. The browser looks next to the file, finds nothing, and draws what it can. In the Console these show up as Failed to load resource: net::ERR_FILE_NOT_FOUND, one line per missing file.
You need either the whole folder, usually sent as a .zip you unzip first, or a version with everything packed into one file.
If the tags themselves appear as text in a Chrome tab, check the real filename. Windows and macOS can both be set to hide file extensions, so report.html may actually be report.html.txt, and Chrome shows a .txt file as plain text whatever is inside it. Turn on file extensions, rename the file so it ends in .html, and open it again.
If the code only appears when you open the file from an email or from Google Drive, that isn't happening on your computer. Those apps preview the file instead of running it. That case has its own write-ups: an HTML attachment opening as raw code, and Google Drive showing your HTML file as code.
Usually because they never opened it the way you did. The person who built it probably viewed it through a development preview or a local server, at an http://localhost address. You double-clicked it, so you got file://.
A page opened from file:// has no proper origin. Chrome reports it as null, which is why the module and fetch requests above get refused. Saved data behaves differently too. How localStorage behaves for local files isn't defined by any standard and varies between browsers, so a page that remembered your settings on their machine may forget them on yours.
The opposite case, where the page works from your desktop and breaks once it's a link, is a different problem with different causes. That one is covered in it works when I open the file, it breaks once it's a link.
When the page draws properly in your Chrome, only you can see it. The address is a path on your disk, and nothing is serving it to anyone else. Paste that file:/// address into a message and the other person gets an error.
Letting someone else open it is a separate step: the page needs a web address. When you get there, it's worth deciding who should be able to open the file before you pick where to put it, because a findable address and an unguessable one are different choices.
If you only want to see a page someone pasted to you as code, without saving a file at all, the online HTML viewer draws it in your browser.
When the page is ready for someone else, drop the .html file and get a private link that opens in their browser the same way it opens in yours. No account needed for files up to 3 MB; anonymous links expire after 7 days.
A Stripe Payment Link takes the money, but the file is your job. Stripe's two after-payment options, three ways to hand over a guide or template without a backend, which of them can be forwarded (all of them), and when a platform like Gumroad, Lemon Squeezy or Payhip is the better tool.
An annual report gets read in March by donors on their phones, printed for the board, and reopened in September by a funder. How a PDF attachment, a page on your website and a single replaceable link each hold up over that year, and how to fix a typo after it's out.
We ran one sponsorship-packet prompt in Claude and checked the result on a phone. Here is the prompt, a table of what the AI used, made up or left blank on the page, and the one-word edit that marks a tier SOLD OUT.
miinideck turns a single HTML file into an unguessable link with optional password and expiry. Default-private, never indexed.