HTMLとは何か？

HTML（HyperText Markup Language）は、ウェブページを作成するための最も基本的な言語であり、ウェブ開発を学ぶ上で欠かせないものです。テキストや画像、リンク、リストなど、ウェブページに表示する内容をHTMLで記述すると、ブラウザがそれを解釈して画面に表示します。初心者でも非常に学びやすく、楽しく学習を進められる言語です。

事前に必要な知識

HTMLに関する事前知識は必要ありません。ここから始めれば大丈夫です。ただし、コンピュータの基本操作に慣れていることが望ましく、ファイルの管理や取り扱いについて理解している必要があります。

HTMLを紹介します

HTMLは、ウェブページの構造とコンテンツの意味を定義し、構成するために使用される言語です。ブラウザ(Chrome、Safariなど)で表示できるコンテンツを私たちは「ウェブページ」と呼びます。このブラウザに表示されるテキスト、画像、リンク、入力ボックスなど、すべての内容はHTMLで作成されています。つまり、HTMLはブラウザに表示されるウェブページを構成するすべてのコンテンツを定義し、その構造を形成する言語です。

HTMLのみを使用して、ブラウザで表示されるコンテンツ、すなわちウェブページのコンテンツを構成し、構造化することができます。したがって、HTMLはウェブページのコンテンツを構成し、構造化する言語です。

ご参考ください
HTML言語以外にもXML言語もブラウザで表示されますが、ユーザーにとってコンテンツとして有用な情報ではないため、ここでは説明しません。

HTMLはマークアップ言語

HTML（HyperText Markup Language）は、ブラウザに表示されるウェブページに、テキストや画像などさまざまなコンテンツを表示するために「マークアップ（Markup）」を使用します。

マークアップ(Markup)とは、特定の構造を作り、記号や符号などを使って記述することを指し、そのような方法を使う言語をマークアップ言語と呼びます。HTMLは、ウェブページに表示するテキスト、画像、リンク、リストなどをマークアップを使って記述するマークアップ言語です。

HTMLのマークアップはさまざまな「要素（Elements）」を使用します

HTMLのマークアップは、あらかじめ決められたさまざまな要素を使用します。これらの要素は、ブラウザのコンテンツを構成する要素であるため、「要素（Elements）」と呼ばれます。それぞれの要素でコンテンツを構成し、要素はそれぞれ特徴や機能を持ってコンテンツを表現できます。たとえば、タイトルに関連するテキストはタイトル用の要素を使い、リストはリスト用の要素を使います。このような要素をHTMLの構文とフォーマットで構造を作りながら記述することを「HTMLをマークアップする」と言います。

HTML要素でマークアップはどう行うか？

HTMLのマークアップは、HTML文書に記述(表記)します。HTML文書とは、HTMLをマークアップするための文書で、ファイル形式で言うと拡張子が「.html」のファイルです。このHTML文書にHTMLの要素を使ってマークアップを行います。HTML要素でマークアップを行う際には、HTML言語であらかじめ規定されている構造とルールに従ってマークアップを行う必要があります。

HTML要素でマークアップした例を見てみましょう。

HTML HTML文書にHTML要素をマークアップした例です。 
<!DOCTYPE html>
<html lang="ja">
    <head>
        <meta charset="UTF-8">
        <title>ドキュメントのタイトル</title>
    </head>
    <body>
        <!-- ウェブページの内容 -->
    </body>
</html>
  • <!DOCTYPE html>：この部分は文書の種類を宣言するもので、ブラウザが最新のウェブ標準仕様に従い、正しくレンダリングされるようにする役割を果たします。
  • <html>：HTML文書の最上位の要素です。すべてのHTML要素は要素内に含まれている必要があります。
  • <head>：HTML文書のメタデータとヘッダー情報を定義する部分です。この部分はブラウザに文書に関する情報を伝えたり、外部スタイルシートやJavaScriptファイルなどをリンクすることができます。
  • <meta charset="UTF-8">：この部分は文書の文字エンコーディングを定義するメタタグで、主にUTF-8エンコーディングが使用されます。これにより、多言語の文字を正しく表示することができます。
  • <title>：この部分はウェブページのタイトルを定義します。ブラウザのタブタイトルや検索結果などに表示されます。
  • <body>：HTML文書の本文内容を定義する部分です。ウェブページに実際に表示される内容はこの部分に記述され、テキスト、画像、リンク、表、フォームなどさまざまな要素が含まれることがあります。

このような基本的な構造を持つHTML文書を作成すると、ブラウザはその文書を正しく解釈してウェブページとして表示します。

HTMLにはさまざまな要素があります。テキスト、画像、リンク、入力ボックスなど、ウェブページを構成するこれらの要素は、HTML言語においてあらかじめ定義されたルールと推奨されている構文や書式に従ってマークアップする必要があります。これらの構文や書式では、各要素をどのような構造でマークアップするかについても詳しく定められています。

HTMLの多様な要素と構文・書式

私たちが目にするほとんどのウェブサイトには、テキスト、リスト、画像、リンク、入力ボックス、ビデオなど、さまざまなコンテンツが含まれています。これらのコンテンツは、HTML要素によってマークアップされています。このように、HTMLには多様な要素が存在します。

HTMLを学ぶということは、さまざまな要素や構文、書式を習得することを意味します。

このようなさまざまな要素は、適当にマークアップするのではなく、HTML言語であらかじめ規定されている規則や推奨されている構文および書式でマークアップしなければなりません。

ウェブページに表示するテキスト、画像、リンク、リストなどの内容をHTML要素でマークアップすると、ブラウザがそれを解釈してウェブページに表示します。ブラウザには、Chrome、Safari、Firefoxなどさまざまな種類があります。もしこれらの異なるブラウザが、それぞれ独自の方法でマークアップされたHTML要素を解釈して表示したら、どうなるのでしょうか？また、解釈できなかった場合、どうなるのでしょうか？

このような事が発生すると、HTMLを使用するウェブ開発者だけでなく、ウェブサイトを利用するユーザー、そしてこれらのウェブと連携したアプリケーションにおいても、大きな問題や不便が発生する可能性があります。そこで、このような問題が発生しないように、標準（推奨）ガイドラインが提案されています。

HTMLのさまざまな要素、構文、および書式は、ウェブのための標準を開発し推進するために、ウェブの創設者である「ティム・バーナーズ＝リー」を中心に組織されたワールド・ワイド・ウェブ・コンソーシアム（World Wide Web Consortium、略称はWWWまたはW3）で管理されていましたが、2019年以降は、アップル、モジラ、グーグル、マイクロソフトなどで構成されるウェブ・ハイパーテキスト・アプリケーション・テクノロジー・ワーキング・グループ（Web Hypertext Application Technology Working Group、WHATWG）で管理されています。

HTML標準案の継続的な更新

1989年にHTMLが発明されて以来、現在までHTMLは継続的に更新されています。1991年にはHTML1.0が発表され、2014年にはHTML5.0がリリースされ、その後も更新が続けられています。現在、最新のHTML5バージョンは世界中で標準として採用されています。この標準案は「仕様書」とも呼ばれています。

最新のHTML5標準案

HTMLの要素や関連する構文および書式は、HTML標準案に基づいて追加、修正、削除されることがあります。

codingEverybodyは最新のHTML5標準案に従っています。

参考資料