HTML
Web・開発HTMはHTML文書に使われる短い拡張子です。保存したWebページは、同名の素材フォルダーを参照していることがあります。ブラウザーでの表示とエディタでのソース確認を使い分け、CSS・画像・リンク先も一緒に確認します。PHPなどのサーバー処理をHTMだけで再現することはできません。
- 主な用途
- Webページの文書構造
- 中身の種類
- テキスト
目次・よくある質問・根拠資料を見る
内容の最終確認: · 編集:Kai
開き方・操作手順
使っている環境や目的の項目を開いて、手順を確認してください。
操作名・対応状況はアプリ・OS・版によって異なります。変更する前に原本を残してください。
開けないとき:症状から確認
- 画像・装飾がない:相対パスの参照先とCSS・画像の付随フォルダーを確認します。HTMLだけのコピーでは不足することがあります。
- 文字化け:保存時の文字コードとcharset指定を合わせます。UTF-8として誤って上書きする前に元の文字コードを確認します。
- ローカルでは動かない:file URLでは機能や読み込みが制限される場合があります。制作手順で必要なWebサーバーを確認します。
- リンクが元サイトへ戻る:相対リンクと絶対URL、base要素を確認します。
- 大文字・小文字を変えて画像が消える:公開先のファイル名と参照を正確に合わせます。
- 保存時と表示が違う:外部CSSや動的取得のデータが残っているか確認します。
HTML → PDF / 印刷用コピー
- 必要な画像やCSSが表示されることを確認し、ブラウザーの印刷からPDF保存を選びます。
- 改ページ、背景、リンク、長い表の切れをプレビューで確認します。
- 表示内容が欠けていないか印刷プレビューと出力PDFの両方で確認します。
PDFではフォームやJavaScriptの動作は通常再現されません。HTML原本と付随素材を残します。
保存ページで保持できるもの
HTMは文書の構造です。ページを保存しても、検索サーバー、購入処理、ログイン状態まで複製されるわけではありません。動作に必要な依存先を整理します。
確認例:page.htmがpage_files/photo.jpgを参照する場合は、両方の相対配置を保ちます。画像だけ別の場所へ移すと参照が切れます。
この手順の根拠:WHATWG · HTML Living Standard / Microsoft · HTML in Visual Studio Code
PDFへ渡す前に確認する点
印刷プレビューで長い表、背景画像、折りたたみ内の本文を確認します。閲覧用PDFと、再編集できるHTM・素材一式を別に保管します。
この手順の根拠:WHATWG · HTML Living Standard / Microsoft · HTML in Visual Studio Code
関連形式との違い
| 形式・方法 | 役割 | 確認する点 |
|---|---|---|
| HTM / HTML | Web文書 | 素材とリンク |
| 素材フォルダー | 画像・CSS等 | 相対配置 |
| 印刷用の表示 | 動的機能は別 |
取り扱いと安全性
不明なHTMLは先にエディタで確認します。ブラウザーではスクリプトや外部通信が動く場合があるため、ログイン情報を求めるページを安易に信用しないでください。
よくある質問
HTMとHTMLで表示内容は変わる?
通常は同じ文書形式ですが、サーバー設定やリンク先のファイル名は区別されます。公開済みURLをむやみに変更しません。
HTMLをTXTへ改名するとコードが消える?
内容は変わりません。テキストとして読むだけです。
PDF化したら検索やフォームも動く?
通常、Webページの動作は引き継ぎません。
添付フォルダーを削除してよい?
画像やCSSの参照先か確認します。HTMを残しても必要な素材が消えると表示が欠けます。
クリックすると別サイトへ行くのは故障?
保存文書でも外部URLを持つことがあります。ソース内のリンク先と目的を確認します。
形式の基本情報:正式名称・MIME type・管理団体
- 名称
- HyperText Markup Language
- 管理・仕様
- WHATWG
- MIME type
- text/html
公式・一次情報
- 標準仕様HTML Living Standard
HTML文書・要素・外部リソースの扱いを定義する仕様です。
WHATWG · リンク確認: - ソフトウェア公式HTML in Visual Studio Code
HTMLの編集・書式・検証・プレビューの資料です。
Microsoft · リンク確認: