HTMLファイルをMicrosoft Edgeで開きたいけど、「どうやって開けばいいの？」「ダブルクリックしても別のブラウザが開いてしまう」「もっと便利な開き方はないの？」と悩んでいませんか？
HTMLファイルは、Webページを構成する基本的なファイル形式で、Web開発をする方だけでなく、学校の課題やオンラインで配布されたドキュメントなど、様々な場面で扱う機会があります。
この記事では、Microsoft EdgeでHTMLファイルを開く7つの方法を、初心者の方にも分かりやすく詳しく解説します。基本的な方法から、開発者向けの便利なテクニックまで、あなたの用途に合った最適な方法が見つかるはずです。
HTMLファイルとは？基礎知識
まず、HTMLファイルについて簡単に理解しておきましょう。
HTMLの基本
HTML（HyperText Markup Language）は、Webページを作成するためのマークアップ言語です。
- 拡張子：.html または .htm
- 内容：テキスト形式で、タグと呼ばれる記号を使って文書構造を記述
- 表示：ブラウザで開くと、視覚的に整形されたWebページとして表示される
HTMLファイルの2つの開き方
HTMLファイルには、2つの異なる開き方があります。
1. ブラウザで開く（表示用）
→ 整形されたWebページとして表示される
→ 一般的な閲覧や確認に使用
2. テキストエディタで開く（編集用）
→ HTMLコードそのものが表示される
→ コードの編集や確認に使用
この記事では、主に「ブラウザで開く方法」について解説します。
方法1：ダブルクリックで開く（最も基本的）
最もシンプルで一般的な方法です。
手順
- エクスプローラーでHTMLファイルを探す
- ファイルをダブルクリック
これだけです！EdgeがWindowsの既定のブラウザに設定されていれば、自動的にEdgeで開きます。
注意点
ダブルクリックで別のブラウザ（ChromeやFirefoxなど）が開いてしまう場合は、ファイルの関連付けを変更する必要があります。詳しくは「方法7：既定のブラウザに設定する」をご覧ください。
方法2：右クリックメニューから開く
特定のブラウザを選んで開きたい場合に便利な方法です。
手順
手順1：右クリック
HTMLファイルを右クリックします。
手順2：「プログラムから開く」を選択
表示されたメニューから「プログラムから開く」をクリックします。
手順3：Microsoft Edgeを選択
アプリの一覧から「Microsoft Edge」を選択してクリックします。
一覧にEdgeが表示されていない場合は、「別のプログラムを選択」または「その他のアプリ」をクリックすると、さらに多くのアプリが表示されます。
この方法が便利な場面
- 複数のブラウザがインストールされている環境
- 一時的に別のブラウザで開きたいとき
- 既定のブラウザを変更せずに特定のブラウザで開きたいとき
方法3：ドラッグ&ドロップで開く
すでにEdgeが起動している場合、最も手軽な方法です。
手順
手順1：Edgeを起動
Microsoft Edgeを開きます。
手順2：ファイルをドラッグ
エクスプローラーからHTMLファイルをEdgeのウィンドウ内にドラッグします。
手順3：ドロップ
Edgeのウィンドウ内（タブバーやページ表示エリア）でマウスボタンを離します。
ファイルがEdgeで開きます。
ポイント
- 新しいタブで開かれます
- 複数のファイルを続けて開くときに効率的
- すでに開いているタブを上書きせずに開ける
方法4：ショートカットキーで開く（Ctrl+O）
Edgeの機能を使って、ブラウザ内からファイルを開く方法です。
手順
手順1：Edgeを起動
Microsoft Edgeを開きます。
手順2：ファイルを開くダイアログを表示
「Ctrl」キー + 「O」キー（アルファベットのオー）を同時に押します。
注意：「Ctrl」+「0」（数字のゼロ）ではありません。これを押すとズームが100%にリセットされるだけです。
手順3：ファイルを選択
「ファイルを開く」ダイアログが表示されるので、開きたいHTMLファイルを探して選択します。
手順4：開く
「開く」ボタンをクリックします。
覚えておくと便利
この方法は、Edgeを使っているときにローカルファイルを素早く開きたい場合に便利です。
方法5：file:// URLをアドレスバーに入力
ファイルのパスが分かっている場合、直接URLとして入力できます。
file:// プロトコルとは
file:// は、ローカルファイルシステム上のファイルにアクセスするためのURLプロトコルです。
URL形式
file:///ドライブ:/フォルダパス/ファイル名.html重要なポイント
file:の後にスラッシュが3つ（///）必要- Windowsのパス区切りは通常「\」（バックスラッシュ）ですが、URLでは「/」（スラッシュ）を使用
- ドライブレター（C:など）の後にコロンが必要
具体例
例1：Cドライブのファイル
file:///C:/Users/taro/Documents/test.html例2：Dドライブのファイル
file:///D:/web/index.html例3：日本語を含むパス
file:///C:/Users/太郎/ドキュメント/サンプル.html手順
手順1：ファイルパスを確認
エクスプローラーでHTMLファイルを見つけ、アドレスバーに表示されているパスをコピーします。
または、ファイルを右クリック→「プロパティ」で場所とファイル名を確認します。
手順2：URLに変換
パスを以下のルールで変換します。
- 最初に
file:///を追加 - バックスラッシュ（\）をスラッシュ（/）に置き換え
例：
C:\Users\taro\Documents\test.html
↓
file:///C:/Users/taro/Documents/test.html手順3：Edgeのアドレスバーに入力
変換したURLをEdgeのアドレスバーに入力し、Enterキーを押します。
この方法のメリット
- ファイルパスが分かっていれば素早くアクセスできる
- ブックマークに登録できる
- スクリプトやドキュメントにURLを記載できる
方法6：コマンドラインから開く（上級者向け）
コマンドプロンプトやPowerShellからEdgeでHTMLファイルを開く方法です。
コマンドプロンプトの場合
基本形式
"C:\Program Files (x86)\Microsoft\Edge\Application\msedge.exe" "ファイルのフルパス"具体例
"C:\Program Files (x86)\Microsoft\Edge\Application\msedge.exe" "C:\Users\taro\Documents\test.html"PowerShellの場合
基本形式
Start-Process -FilePath "C:\Program Files (x86)\Microsoft\Edge\Application\msedge.exe" "ファイルのフルパス"具体例
Start-Process -FilePath "C:\Program Files (x86)\Microsoft\Edge\Application\msedge.exe" "D:\test\index.html"バッチファイルの作成
頻繁に同じHTMLファイルを開く場合、バッチファイルを作成すると便利です。
手順1：メモ帳を開く
手順2：以下の内容を入力
@echo off
"C:\Program Files (x86)\Microsoft\Edge\Application\msedge.exe" "C:\path\to\your\file.html"手順3：保存
「open-with-edge.bat」のような名前で保存します。
拡張子を必ず .bat にしてください。
手順4：実行
バッチファイルをダブルクリックするだけで、指定したHTMLファイルがEdgeで開きます。
この方法が役立つ場面
- 自動化スクリプトの一部として使用
- 開発環境の起動処理に組み込む
- 複数のHTMLファイルを一度に開く
方法7：Edgeを既定のブラウザに設定する
HTMLファイルをダブルクリックしたときに常にEdgeで開くようにする方法です。
Windows 11の場合
手順1：設定を開く
「スタート」→「設定」（歯車アイコン）をクリックします。
手順2：アプリの設定へ
左側のメニューから「アプリ」を選択します。
手順3：既定のアプリ
「既定のアプリ」をクリックします。
手順4：Edgeを検索
検索ボックスに「edge」と入力し、「Microsoft Edge」をクリックします。
手順5：既定に設定
「既定値に設定」ボタンをクリックします。
または、下にスクロールして「ファイルの種類」から「.html」と「.htm」を個別にEdgeに設定することもできます。
Windows 10の場合
手順1：設定を開く
「スタート」→「設定」をクリックします。
手順2：アプリを選択
「アプリ」をクリックします。
手順3：既定のアプリ
左側のメニューから「既定のアプリ」を選択します。
手順4：Webブラウザーを変更
「Webブラウザー」の項目を見つけ、現在設定されているブラウザ名をクリックします。
手順5：Edgeを選択
表示されたブラウザの一覧から「Microsoft Edge」を選択します。
Edge内から設定する方法
手順1：Edgeを起動
手順2：設定を開く
右上の「…」→「設定」をクリックします。
手順3：既定のブラウザー設定へ
左側のメニューから「既定のブラウザー」を選択します。
手順4：既定に設定
「既定に設定」ボタンをクリックします。
Windowsの設定画面が自動的に開くので、上記の手順で設定を完了します。
開発者向けの便利な方法
Web開発をする方向けの、より高度な開き方をご紹介します。
Visual Studio Codeから開く
手順1：拡張機能のインストール
Visual Studio Codeで「Live Preview」または「Live Server」拡張機能をインストールします。
手順2：HTMLファイルを右クリック
エクスプローラーペインでHTMLファイルを右クリックします。
手順3：ブラウザで開く
「Open with Live Server」または「Show Preview」を選択します。
開発者ツール付きで開く
方法A：F12キーを使用
- EdgeでHTMLファイルを開く
- 「F12」キーを押すと開発者ツールが開く
方法B：右クリックメニュー
- ページ内で右クリック
- 「検証」または「要素の検査」を選択
IEモードで開く（互換性が必要な場合）
古いWebシステムとの互換性が必要な場合、EdgeのIEモードを使用できます。
手順1：IEモードを有効化
- Edgeの「…」→「設定」→「既定のブラウザー」
- 「Internet Explorerモードでサイトの再読み込みを許可」を「許可」に設定
- Edgeを再起動
手順2：ファイルをIEモードで開く
コマンドラインから以下を実行：
"C:\Program Files (x86)\Microsoft\Edge\Application\msedge.exe" --ie-mode-file-url "C:\test.html"HTMLファイルを編集してから開く
HTMLファイルを編集した後、ブラウザで確認する一般的なワークフローです。
メモ帳で編集する場合
手順1：メモ帳で開く
HTMLファイルを右クリック→「プログラムから開く」→「メモ帳」を選択します。
手順2：編集
HTMLコードを編集します。
手順3：保存
「ファイル」→「上書き保存」（Ctrl+S）で保存します。
手順4：ブラウザで表示確認
保存したHTMLファイルをダブルクリックするか、Edgeのタブで開いている場合は「F5」キーで再読み込みします。
ワークフローのコツ
同時に開いておく
- メモ帳（編集用）とEdge（表示確認用）を同時に開いておく
- メモ帳で編集→保存→Edgeで再読み込み（F5）の繰り返し
効率的な配置
- モニターを分割して、左にメモ帳、右にEdgeを配置
- または、Windows 11/10のスナップ機能を使用
トラブルシューティング
HTMLファイルを開く際によくある問題と解決方法です。
Q1：ダブルクリックしても別のブラウザが開く
解決策
「方法7：既定のブラウザに設定する」を参照して、Edgeを既定のブラウザに設定してください。
または、毎回右クリックメニューから「プログラムから開く」→「Microsoft Edge」で開く方法もあります。
Q2：Ctrl+Oを押しても何も起こらない
原因と解決策
- 数字のゼロを押している
→ アルファベットの「O」（オー）を押してください - 古いEdge（Legacy版）を使っている
→ 最新のChromiumベースのEdgeに更新してください
Q3：file:// URLを入力してもページが表示されない
解決策
- URL形式が正しいか確認
file:///C:/path/to/file.html（スラッシュ3つ）- バックスラッシュではなくスラッシュを使用
- ファイルパスに日本語や特殊文字が含まれている場合、エンコードの問題が発生することがあります
→ ファイルを英数字のみのパスに移動してみてください
Q4：HTMLファイル内のリンクが動作しない
原因
Edgeでは、セキュリティ上の理由から、ローカルファイル（file://）からローカルファイルへのリンクに制限があります。
解決策
- 「ローカルファイルリンクの有効化」拡張機能をインストール
- IEモードを使用
- ローカルWebサーバーを立てる（開発者向け）
Q5：HTMLファイルをEdgeにドラッグ&ドロップできない
解決策
- Edgeのウィンドウが最前面にあることを確認
- タブバーまたはページ表示エリアにドロップ
- アドレスバーではなく、ページ内にドロップ
ショートカットとキーボード操作まとめ
Edgeで便利なショートカットキーをまとめました。
ファイル操作
| 操作 | キー |
|---|---|
| ファイルを開く | Ctrl + O |
| 名前を付けて保存 | Ctrl + S |
| 印刷 | Ctrl + P |
ページ操作
| 操作 | キー |
|---|---|
| 再読み込み | F5 または Ctrl + R |
| 強制再読み込み | Ctrl + F5 または Ctrl + Shift + R |
| ソースコード表示 | Ctrl + U |
開発者ツール
| 操作 | キー |
|---|---|
| 開発者ツールを開く | F12 または Ctrl + Shift + I |
| 要素の検査 | Ctrl + Shift + C |
HTMLファイルを開く際のセキュリティ注意点
ローカルHTMLファイルを開く際のセキュリティについて理解しておきましょう。
信頼できるファイルのみ開く
- 出所不明のHTMLファイルには悪意のあるスクリプトが含まれている可能性があります
- メールの添付ファイルなど、送信者が不明なHTMLファイルは開かないでください
ダウンロードしたファイルの確認
インターネットからダウンロードしたHTMLファイルには「ゾーン識別子」という情報が付加されます。
確認方法
- ファイルを右クリック→「プロパティ」
- 「全般」タブの下部に「セキュリティ」項目があれば、ダウンロードファイル
- 信頼できる場合は「許可する」にチェックを入れて「適用」
JavaScriptの実行
HTMLファイルにはJavaScriptが含まれている場合があります。
信頼できないファイルの場合、JavaScriptを無効にしてから開くことも検討してください。
よくある質問（FAQ）
Q1：HTMLファイルとHTMファイルの違いは？
基本的に同じものです。どちらもHTML形式のファイルです。
歴史的に、古いWindowsでは拡張子が3文字まで（.htm）という制限がありました。現在は4文字の拡張子（.html）が主流ですが、両方とも同じように扱われます。
Q2：HTMLファイルを開いたときに画像が表示されない
原因
画像ファイルへのパスが相対パスで記述されている場合、HTMLファイルの場所を移動すると画像が見つからなくなります。
解決策
HTMLファイルと画像ファイルを同じフォルダ構成のまま移動するか、HTMLコード内のパスを修正してください。
Q3：複数のHTMLファイルを一度に開きたい
方法
- エクスプローラーで複数のHTMLファイルを選択（Ctrlキーを押しながらクリック）
- 右クリック→「プログラムから開く」→「Microsoft Edge」
- それぞれ別のタブで開きます
Q4：HTMLファイルをEdgeで開くと文字化けする
原因
HTMLファイルの文字エンコードが正しく設定されていない可能性があります。
確認方法
- HTMLファイルをメモ帳で開く
<head>セクション内に以下の記述があるか確認
<meta charset="UTF-8">- なければ追加して保存
Q5：Edgeで開いたHTMLファイルを編集したい
EdgeからHTMLファイルを直接編集することはできません。
方法
- ページ内で右クリック→「ページのソースを表示」でコードを確認
- 編集したい場合は、テキストエディタ（メモ帳など）で開く必要があります
まとめ
Microsoft EdgeでHTMLファイルを開く7つの方法を詳しく解説してきました。
7つの方法のおさらい
- ダブルクリック：最も基本的で簡単
- 右クリックメニュー：ブラウザを選んで開ける
- ドラッグ&ドロップ：Edgeが起動中なら最速
- Ctrl+O：Edge内から開くときに便利
- file:// URL：パスが分かっていれば直接アクセス
- コマンドライン：自動化や開発に有用
- 既定のブラウザ設定：常にEdgeで開くようにする
用途別おすすめ方法
| 用途 | おすすめの方法 |
|---|---|
| 普段使い | ダブルクリック（既定のブラウザ設定） |
| 一時的に別のブラウザから | 右クリックメニュー |
| 複数ファイルを次々開く | ドラッグ&ドロップ |
| Edge使用中に開く | Ctrl+O |
| ブックマークしたい | file:// URL |
| 開発・自動化 | コマンドライン |
開発者の方へ
- Visual Studio Codeの拡張機能を活用
- 開発者ツール（F12）を使いこなす
- ライブリロード機能で効率化
セキュリティ注意点
- 信頼できるファイルのみ開く
- ダウンロードファイルは出所を確認
- 不明なファイルのJavaScriptには注意
HTMLファイルを開く方法は一つではありません。状況に応じて最適な方法を選ぶことで、作業効率を大きく向上させることができます。
まずは基本的なダブルクリックとドラッグ&ドロップをマスターし、慣れてきたらショートカットキーやコマンドラインも活用してみてください。
この記事が、あなたのHTMLファイル操作のお役に立てば幸いです！
コメント