HTMLファイルとは

HTML はプレーンテキスト形式です。どのエディターでも開けます。 同じページの上に、ピクセルと描かれた図形の両方を置けます。 ウェブと編集のために使われます。

拡張子は .html、正式名称は HyperText Markup Language です。ただしどちらも、そのファイルが中に何を持てるかほどには多くを語りません。このページの残りは、その中身についての話です。

WHATWG が作った形式です。 仕様は HTML Living Standard です。

古さが役に立つのは、ごく実務的な理由からです。形式が古いほど、それを覚える時間が多くのプログラムに与えられてきたということだからです。

仕様書がそのまま公開されているので、中身を推し量るのではなく文書を読んで実装できます。この形式が数多くのプログラムに載っているのはそのためであり、20 年前に書かれたファイルが今も開けるのもそのためです。ただし「仕様が公開されている」ことと「使用料が要らない」ことは別の話です。中でコーデックを包んでいる形式では、特許のライセンスは仕様書が答えていない別の問題として残ります。

Visual Studio CodeとGoogle Chromeが読めますし、同じ種類のプログラムならたいてい読めます。

ファイルが開かないとき、形式が悪いことはめったにありません。たいていはプログラムのほうが形式より古いのです。もっと古い形式に変換してしまうのが確実な逃げ道で、このサイトの残りの部分はそのためにあります。

これは今のブラウザーならどれでも読めます。

ですからページに置くのも、メッセージに添えて送るのも、安心してできます。相手が何をインストールしているかを考える必要がありません。

HTML は、開いて手を入れるために作られています。作業が続いているあいだはこの形式でファイルを持ち、完成したものが必要になるたびに、ここから書き出してください。

これが HTML について理解しておくべき一番の要点で、この形式にまつわるほとんどの困りごとはここから来ています。HTML ファイルは文字と構造 — 見出し、段落、表、リンク — を持ち、それ以外のすべてを参照するだけです。デザインされたように見せているスタイルシートは別ファイルで、画像もフォントもスクリプトも、他のサーバーから読み込まれるものもすべて別扱いです。

そのため、単独で保存した HTML ファイルをあとで開くと、見た目のない中身だけが表示されます。装飾のない見出し、消えた画像、1994 年のようなページです。何も壊れてはいません。参照先がそこになかったというだけで、参照している対象自体がもともとファイルの中に入っていなかったからです。

ブラウザーはこの事情を分かっているので、ページを保存すると、対応する名前のフォルダーが一緒に作られ、その中に画像やスタイルシートが入ります。この二つは一緒に移動させる必要があり、HTML だけをメールで送ると、相手には装飾のない版が届きます。

多くのブラウザーは「ウェブページ、完全」や MHTML と呼ばれる、すべてを一つのファイルにまとめる選択肢も用意しています。これは持ち運びの問題を解決しますが、別の問題を生みます。結果として得られるファイルは、同じ系統のブラウザーでしか確実に読めません。人にページを渡すときに実際にうまく機能するのは PDF です。一つのファイルにすべてが埋め込まれ、誰が見ても同じ見た目になります。

文書形式の変換は、たいてい一方の構造をもう一方の構造に対応付ける作業です。HTML から PDF への変換は違います。ファイルの中にはどのくらいの幅にするかという情報が何も書かれていないため、まずレイアウトを組み立てる必要があります。ウィンドウの大きさやスタイルシート、利用できるフォントから、レンダリングを担うソフトがそれを決め、そこで初めてページ上の位置が決まります。

同じページでもツールによって違う PDF ができあがるのはこのためです。スクリプトでコンテンツを組み立てるページが空っぽの結果になることがあるのも同じ理由です。印刷用のスタイルシートが存在する理由もここにあります。よく作られたサイトは紙にした場合の見た目のルールを持っていて、それを尊重する変換ツールは、画面をそのまま写し取るツールよりずっと良い結果を出します。

メールです。ほとんどのマーケティングメールや通知は HTML で書かれていますが、ウェブページよりずっと古く、独特なサブセットに沿っています。レイアウト用の表、インラインのスタイルが使われ、現代的な機能はほとんど使われません。メールクライアントは、開発が長らく止まっているレンダリングエンジンで表示するためです。メールソフトから書き出した HTML ファイルがブラウザーでは崩れて見えるのはこのためで、書き出しの不具合ではありません。

もう一つの大きな用途は文書やレポートです。テスト結果、カバレッジレポート、分析ツールの出力、電子書籍の各章など、何らかのツールが生成するものはたいてい HTML になりがちです。ライセンスなしにどんな機器でも表示できるからです。電子書籍の形式である EPUB も、マニフェスト付きの HTML ファイルを詰めた ZIP です。

HTML ファイルはテキストなので、文字をどう保存するかを誰かが決める必要があり、それはファイル冒頭近くの meta タグで宣言されます。この宣言を間違えると、アクセント記号付きの文字やカーリー引用符、あらゆる非ラテン文字が、疑問符や黒いひし形、意味のない文字の組み合わせになってしまいます。

今では UTF-8 がどこでも通用する答えです。宣言のないファイルは、開く側のソフトに推測されてしまいます。あるブラウザーでは正しく見えるのに別のブラウザーでは崩れて見える場合、たいていこれが原因です。読み込む側ではなく、ファイルの側に情報が欠けているのです。

テキストなのでどんなエディターでも編集できます。コード向けに作られたエディターは二つ余分な利点をもたらします。タグに色が付くので構造がひと目で分かることと、閉じられていない要素があれば、ページの後半が太字になった理由を二十分悩む前に指摘してくれることです。

どんなエディターにもできないのは、ブラウザーが寛容であることから守ることです。HTML には厳密なパーサーがなく、崩れたページは拒否されるのではなく、規則に従って修復され、その修復が意図どおりとは限りません。見た目が正しいことは、マークアップが正しいことの証明にはならず、それを確認するのがバリデーターの役目です。

HTML 自体は安全です。現存する形式の中で最も広く実装されていて、仕様は公開されており、1995 年に書かれた文書も今なお表示できます。危ういのは周囲のものです。コンテンツ配信ネットワーク上のスクリプトに依存したレイアウトや、サーバー上にある画像は、どちらか一方が消えた瞬間に空っぽの殻になります。

アーカイブ用途には PDF に変換してください。レイアウトとすべての素材が一つのファイルに収まり、リーダー以外何も必要としません。HTML も一緒に残しておくと、検索や編集、再描画がまだできるバージョンとして役立ちます。両方を組み合わせるのが確実な答えで、どちらか一方だけでは妥協になります。