HTMLコメントの書き方（コメントアウト）と注意点を解説

プログラミング言語の機能の一つであるコメントは、プログラム上にメモを残しておく形で使えるので非常に便利です。ただし使い方を覚えておかないと、本来表示するべきでないものを表示してしまうことがあります。

またHTMLの場合、コメントアウトがうまくできていないと、メモ書きとして残していた文字列がブラウザで見えてしまったり、一旦非表示にしていたバナーが見えてしまったりとトラブルにつながりかねません。

ここではそんなHTMLのコメントアウトの方法と注意点をご紹介します。

なおコメントアウト以外のHTMLのタグや基礎知識については、こちらの記事も併せてご参照ください。

コメントアウトはプログラムなどに影響がない形で、ソースコードに文字を書きこめるものです。例えば、ヘッダにコメントアウトで最終更新者や最終更新日を記載し、簡易的なバージョン管理をしたり、ページやプログラムの大まかな概要を書いて、コードを理解しやすくするためなどに使います。

なお、コメントアウトしたものはブラウザには反映されないものの、多くのブラウザに搭載されているソースコードを表示する機能を利用することで、簡単に確認することができます。サイトによっては、運営側からのメッセージをコメントで書き込んでいる場合もあるため、気になるサイトのソースコードは確認してみるとよいでしょう。

HTMLのコメントアウトが他のプログラムと違うところは、ソースコードを表示するモードにすると見えてしまう点です。その分だけ記載内容には注意が必要となります。

HTMLでコメントアウトされた文章はブラウザ上に反映されないだけで、ソースコードを表示するモードにしてしまえば、簡単に確認ができてしまいます。気になったページのソースコードが見られるのでHTMLが簡単に勉強できるメリットではあるのですが、本来見えてはいけないものまで見えてしまう可能性を持っています。そのため、公開するのに不適当な文章や、セキュリティに関わるような重要な情報を載せないようにしましょう。

HTMLでコメントを書く際は、ソースコードと共に見られて問題ないものかを公開前に最終チェックすると安心です。

例えば、ソースコードのヘッダにバージョン情報として、最終更新日や最終更新者を入れることがありますが、最終更新者の名前を晒してしまっているのと同じです。便利だからとうっかりサーバの接続IDやパスワードを書いてしまうと、情報漏洩につながります。

他にもよくあるのは書きかけのコードをコメントアウトしておくことです。開発しかけの機能や画面レイアウトを試してみたまま、コメントアウトして置いておくと、それもそのまま見えてしまいます。改修箇所や次回追加を検討している内容がばれてしまうことにもつながり、情報によっては大問題を引き起こしかねません。

HTMLのコメントアウトは他のプログラムとは違い、HTMLを読みやすくするために使うのが安全といえます。

サンプルのような形でコメントを入れ子にすると、入れ子1の後のコメントアウト終了タグ -->で全部のコメントアウトが終了してしまい、後に続く「コメントアウト2 -->」がブラウザで表示されてしまいます。

このように、コメントアウトをネストするとレイアウトが崩れてしまうだけでなく、見せるつもりのないコメントもブラウザに表示してしまうので注意してください。