プログラミングをしているとHTMLに触れる機会はよくあります。そういったHTMLタグ（<b>など）の名前から英単語を覚えてみましょう。
記事の英語難易度は「初〜中級」です。
今回はbodyやheadなど全体構造に関係するタグ名です。
サンプル全体
今回は構造に関わるタグ（要素）なので、HTMLのサンプルは冒頭でまとめて紹介します。
黄色いマーカー部分が今回取り上げるHTMLタグ、青いマーカーは補足説明で使う部分です。
▼ HTMLのサンプル
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="example.css">
<title>サンプルのページ</title>
<base href="https://progeigo.org/"></base>
<style>
p {font-size: 1.5em;}
</style>
</head>
<body>
<p>これが<a href="example.html">リンク</a>です。</p>
</body>
</html>なお構造のため、実際の表示例を見てもあまり有用ではありませんが、ブラウザーでは下記のように表示されます。
＜base＞
<base>は文字通り「base」です。baseは「基底、基部、土台」という名詞、または「基礎に置く」という動詞です。
base自体はプログラミング必須英単語600+に入っていませんが、「based」がベーシック300に含まれています。「ベースの、〜に基づく」という形容詞です。
base要素は、基底URLを指定するのに使います。base要素はhead要素内で指定します。基底URLを指定した後は、そこからの相対URLだけを書くだけで済みます。上記サンプルを見ると、base要素内で「https://progeigo.org/」と基底URLが指定され、本文中のリンク（a要素）にあるのは「example.html」だけです。もし基底URLを使わず、絶対URLで書くなら「https://progeigo.org/example.html」となります。
＜body＞
<body>も文字通り「body」です。
もちろん「体」ですが、IT関連では「本体、本文」という言葉が適している状況もよくあります。なおプログラミング必須英単語600+の前提英単語100に入っている名詞です。
body要素内には文書のコンテンツ（本文）が入ります。
＜head＞
<head>も文字通り「head」です。「頭」の他にも、「最上部」や「見出し」の意味もあります。
head要素には、文書のタイトルやスタイルシートなど、ブラウザーが読み込む情報（メタデータ）を書きます。bodyの前に置かれます（サンプル参照）。
また「header」というよく似たタグもあります。こちらはページやセクションの導入部分に置かれます。headerはプログラミング必須英単語600+のアドバンスト300に入っている「ヘッダー」という名詞です。
＜html＞
<html>はHTML（hypertext markup language）のことです。プログラミング必須英単語600+の頭字語30に入っている言葉です。
まず「hypertext」とは、関連部分にリンクが付いていて参照できるテキストのことです。「markup」はテキスト内に印（mark）を付けること、またはその印です。最後の「language」は「言語」という名詞で、前提英単語100に入っています。
html要素はHTML文書のルート（最上位要素）になります。この下に前述のheadやbodyを1つずつ置く構造になっています。
＜link＞
<link>はそのまま「link」です。
linkは名詞で「リンク」、動詞で「リンクする」で、ベーシック300の英単語です。
link要素はHTML文書と外部リソースとをリンクさせるのに使います。例えばスタイルシートのファイルなどです。サンプルの「example.css」の部分です。
＜meta＞
<meta>は「metadata」や「metainformation」のことです。
「meta-」は「上位の」や「変化の」を表す接頭辞です。そのためmeatadata（メタデータ）やmetainformation（メタ情報）は上位にあるデータ（”データのデータ”）を表します。
例えばmeta要素に指定する属性は、charset（文字コード）です。サンプルの「UTF-8」の部分です。文字コードはHTML文書というデータのデータだからです。
＜style＞
<style>も文字通り「style」です。「スタイル」という名詞で、プログラミング必須英単語600+の前提英単語100の単語です。
styleはさまざまな日本語の訳が該当しうる英語です。例えば、デザイン、文体、様式、品格、やり方といった日本語です。プログラミング関連文書では「スタイル」が適当なケースが多いですが、文脈的に違和感がある場合、別の日本語訳も検討してみましょう。
style要素内では、HTML文書のスタイルをCSSで記述します。サンプルの「p {font-size: 1.5em;}」の部分です。
＜title＞
titleもそのまま「title」です。「タイトル、題名」という名詞です。
titleも別の日本語訳が適切なことがあります。例えばMr.などの「敬称」や、Presidentなどの「肩書き」もtitleです。入力フォームなどでたまに目にします。すぐに「タイトル」とするのではなく、文脈に応じて日本語を選んでください。
title要素に記述したテキストは、ブラウザーのタイトルバーに表示されます。
英単語まとめ
- base【名詞】基底、基部、土台
- basedは「ベースの、〜に基づく」という形容詞でベーシック300
- body【名詞】本体、本文
- 前提英単語100
- head【名詞】最上部、見出し
- 似た単語headerは「ヘッダー」という名詞でアドバンスト300
- HTML【名詞】hypertext markup language
- 頭字語30
- languageは「言語」という名詞で前提英単語100
- link 【名詞／動詞】 リンク／リンクする
- ベーシック300
- style【名詞】スタイル
- 前提英単語100の単語
- title【名詞】タイトル、題名
- 「敬称」や「肩書き」の意味も
[筆者紹介]
