HTMLでコメントを書く方法【初心者向け】

HTMLについて今さら聞けない！という初心者のために、HTMLの基礎を紹介する記事です。

今回は、HTMLでコメントを書く（コメントアウトする）方法について解説します。

そもそもHTMLの記述方法がわからない場合は、HTMLの書き方について解説した記事を読むとさらに理解が深まります。

 

なお本記事は、TechAcademyのオンラインブートキャンプWebデザイン講座のHTMLカリキュラムをもとに執筆しています。

 

なお、今回の記事の内容は動画でもご覧いただけます。

テキストよりも動画の方が理解しやすいという場合はぜひご覧ください。

 

 

HTMLのコメントアウト

コメント（コメントアウト）とは、プログラミングなどでコードを読み返すときに内容をわかりやすくするための覚え書きです。コメントで囲まれた部分はプログラムではないとみなされ、コンピューター上で実行・反映されない部分となります。

 

たとえば、長いコードを書くときや複数人でコードを書くときに、コメントアウトで注意事項が添えられていれば、コードを探す手間が省けます。またプログラムの一部をコメントアウトすることによって、その動作をスキップさせることができるので、開発中にコードの確認を行いたいときにもよく使われます。

のちに自分でページをメンテナンスするときにも非常に有効になりますのでぜひ覚えておきましょう。

 

 

では実際に書いてみましょう。

HTMLにおけるコメントの書き方は下の通りです。

<!– ここにコメント –>

（※コメント前後の半角スペースはなくてもかまいません。）

この例では、<!– ここにコメントを入れます –>といったコメント書いています。

この内容はWebブラウザで出力しても表示されないことがわかりますね。

書き方はこれだけなので、すぐに覚えてしまいましょう。

 

HTMLでコメントを書く場合の注意点

HTMLでコメントを書く場合、次のことに注意していただくと良いです。

次のどの場合も、HTML文法エラーになってしまいます。

1.コメントの中で-という記号を使用しない

コメントの中で-という記号を使用する習慣がついてしまうと、コメント中にもかかわらず、–>と記載するミスに繋がりかねません。

また、環境によっては、-が連続で記載されることを、コメント行の終了と認識してしまうこともあります。

2.コメントタグを記載した後、全角入力にする

コメントの内部では、全角日本語の入力を行うことが多いと思います。

そのため、コメントタグ自体も＜！－－という全角日本語入力した後、変換機能を利用して<!–という記載にされる方もいらっしゃいます。

しかし、<!–に変換し忘れた場合は、＜！－－という全角日本語のまま、HTML上に記載されることになります。

 

今回はHTMLでコメントを書く方法についてご紹介しました。

HTMLについてさらに学びたい場合は、HTMLでiframeを使う方法も合わせてご覧ください。

 

この記事を監修してくれた方 中本賢吾（なかもとけんご） アジマッチ有限会社　代表取締役社長 開発実績：PHPフレームワークを利用した会員制SNS・ネットショップ構築、AWSや専用サーバー下でLinuxを使用したセキュアな環境構築、人工知能を利用したシステム開発、店舗検索スマホアプリ開発など。 その他にも地域の職業プログラマー育成活動を行い、2018年には小学生がUnityで開発したオリジナルAndroidアプリをGooglePlayでリリース。ゲームで遊ぶより作ろうぜ！を合言葉に、小学生でも起業できる技術力を育成可能で有ることを証明し続けている。

TechAcademyでは、初心者でもオリジナルWebサイトを公開できるオンラインブートキャンプWebデザイン講座を開催しています。

挫折しない学習方法を知れる説明動画や、現役エンジニアとのビデオ通話とチャットサポート、学習用カリキュラムを体験できる無料体験も実施しているので、ぜひ参加してみてください。