Guides › How to edit and preview an HTML file in your browser
How to edit and preview an HTML file in your browser
Maybe you have an email template, a small web page or a saved snippet, and you want to change a line and check how it looks. Many people paste the file into an online HTML viewer, which means uploading the content to someone else’s server. You can do the same job locally. This guide shows how, and what to watch for.
Two jobs: editing the source and seeing the result
An HTML file is text. Editing it means changing that text. Previewing means letting a browser draw the page the text describes. They are different steps, and the easiest workflow keeps both within reach.
Preview a local HTML file in your browser
The simplest check is to open the file itself: drag it onto a Chrome or Edge tab, or press Ctrl + O and choose it. After each edit and save, press F5 to refresh. This gives the most faithful result, because the browser also loads the file's own style sheets, scripts and images from their folders.
Edit and preview in BookmarkFiles
- Add the
.htmlfile with Add File or drag it onto the editor. - Edit the code in the editor. Use Wrap to wrap long lines and the magnifier buttons to change the text size.
- Click Preview, which appears above the editor for HTML files, to see the page drawn. Click Edit to return to the code.
- Press Ctrl + S to save the changes into the original file.
What the preview can and cannot show
- Scripts do not run. The preview is isolated, so JavaScript in the file is switched off. It is a visual check, not a test of behavior.
- Relative files are not found. A style sheet or image linked as
style.cssorimages/logo.pnglives next to the file on your disk, and the preview cannot reach it. Styles written inside the file and images with full web addresses do appear. - Web resources can still load. If your HTML refers to an image or font on the internet, the preview fetches it, just as a browser would.
For a final check of a full page, save the file and open it in a normal browser tab.
Is it safe to use an online HTML viewer?
Many online HTML viewers and editors work by sending your code to their servers. That is fine for a public snippet, and a poor idea for a client's email template, internal page or anything with names and addresses in it. Read the site's privacy policy, and check what leaves your browser. BookmarkFiles reads and writes the file locally and does not upload its contents. The safety guide explains how to verify this yourself.
Common problems
- Styles are missing in the preview. They are probably in a separate file. Open the saved file in a normal tab to see them.
- Accented or non-English characters look wrong. Make sure the file is UTF-8 and the page contains
<meta charset="utf-8">. See the encoding guide. - A button does nothing in the preview. Scripts are off by design. Test it in a normal tab.
Frequently asked questions
Can I edit an HTML file in Notepad?
Yes, HTML is plain text, so Notepad works. It has no preview, so you would refresh a browser tab after each save.
Does the preview send my HTML anywhere?
The preview itself is drawn in your browser. The only requests are for resources your HTML refers to by web address, such as an online image.
Why is my CSS file not applied in the preview?
Linked style sheets are separate files that the preview cannot read. Put the CSS inside a style tag to see it in the preview, or check the final page in a normal tab.
Related guides
- How to open and edit a .txt file in Chrome or Edge
- Is it safe to open local files in a web page?
- Fix garbled text in .txt files: EUC-KR to UTF-8
Ready to try it? Open BookmarkFiles in Chrome or Edge on a desktop computer.