a href 、img src 、p 、div等など、HTMLでは様々なタグを使いますが、これらは基本的に何かの語句を省略した表記になっている…のは何となく理解出来ますが、その基(元)となっている単語は一体何なんだろうと思い調べました。
デザイナーやコーダー、ブロガーなどウェブサイト制作に関わっている方は普段何気なく使っているHTMLですが、レイアウトだけを考えてタグを使うのではなく、意味を理解した上で適切な使い方をすると、しっかりと検索エンジンにも内容の意図が伝えられますので「SEOフレンドリー」なサイトが作れそうですね。
ただ、W3CのHTML仕様書に何を略しているかの公式な定義はないので、用途から予測したり他のプログラムでも使われているコードから判断しています。
なお、「HTML」は何の略かというと「HyperText Markup Language」(ハイパーテキスト マークアップ ランゲージ)。
「URL」は「Uniform Resource Locator」(ユニフォーム リソース ロケーター)です。
タグ | 由来 | 説明 |
---|---|---|
a | anchor | 錨を意味するアンカーでした。囲まれいるテキストは「アンカーテキスト」。 HTML以外でもアンカを文字って「安価(あんか)」というネット用語があります。 |
href | hyper reference | リンクする際のaタグやiframeと一緒に使われるhrefはハイパーリファレンスでした。 |
img | image | 予想通りのimageです。 画像を表示させるときのimg srcの「src」は何かというと、次の項目で! |
src | source | imgと一緒に使う「src」はsourceでした。 情報ソースとかのソースです。 |
p | paragraph | ひとつの段落を囲むpタグは、節や段落を意味する「パラグラフ」です。 |
div | division | ブロックとして囲むときに使うdivは境界や仕切りを意味する「ディビジョン」です。 |
alt | Alternative text | imgと一緒に使い、「画像の説明になるようなテキスト」として使うalt。 alternateは「代わり」という意味があり、alternative textは「代替テキスト」と略されます。 スクリーンリーダーを使う視覚障害者の方向けに、画像がどんな内容なのか理解してもらうために書くものです。 一時期SEOに有効との事で画像とは関係ない文字を書くスパムが流行りましたが、現在は通用しません。 |
h | heading | H1、H2、H3…のhです。 「表題」「見出し」などの意味の英語「heading」(ヘッディング)を略していました。 |
br | line break | 改行してくれるbrタグです。ラインブレイクなので「次の行へ」って意味合いになります。 「改行」はnew lineかnew paragraphというそうです。 |
b | bold | 太字で表示してくれるbタグ。 strongやemは強調・アクセントの意味合いで使いますが、bはあくまで見た目だけの役割になります。 |
em | emphasis | 強調の意味がある「エンファシス」。 弱い強調はem、強い強調はstrongで使われていましたが、HTML5ではstrongは重要な箇所、emはフレーズのアクセントとして使用します。 |
hr | horizontal rule | 水平線を表記してくれるタグ。「水平な罫線」という意味です。 読み方は「ホリゾンタル ルール」です。ガラケー用サイトではよく使いますがPCやスマホではあまり使いませんよね。 |
valign | vertical align | tableを組んだ時にthやtdの枠内で、文字を上下どちらか寄せではなく中間に表示してくれるタグです。 CSSではvertical-alignが同じ役割を担っています。 |
col | column | table内でcolgroupの子要素として使うcolは、列を意味する「カラム」でした。 |
dl | Description list(Definition lists) | 「定義タグ」とか「定義リスト」と呼ばれてるタグですね。HTML4.01では「defines an item in a definition list」で、HTML5だと「defines a term/name in a description list」と説明されていています。 もう定義タグではなくなってしまったんですね。 |
dt | defines a term/name in a description list | dl内で定義・説明する用語を書くdtです。 |
dd | describe a term/name in a description list | dl内のdtに対する説明を書くddです。 |
del | delete | 消すとか削除を意味するデリート。 削除された内容を囲むタグです。 ブラウザによりますが囲んだ部分の文字に打ち消し線が引かれて表示されます。 |
s | strikethrough text | 囲んだテキストに打ち消し線を表示します。 HTML5で廃止されました。 代用はdelタグになります。 |
i | italic | イタリック体の略です。 |
iframe | inline frame | 他で存在しているコンテンツをそこに呼び出して表示させるiframeはインラインフレームでした。 |
ins | insert | 新たにテキストを追記する時に使うinsは、挿入を意味するインサートでした。 |
keygen | key generation | 「key-pair generator」とも。 keygenの読みは「キージェネ」ってのが一般的によく使われてるかと思います。 |
ul | unordered list | リストタグと呼ばれてるulとol。 前者は番号なしのアンオーダーリストでした。 |
ol | ordered list | 番号付きのリストolはオーダーリストでした。 |
li | list item | ul、olの子要素として使うliはリストアイテムでした。 |
meta | Meta-information | head内で使うメタタグですが、「○○間の」「○○を含んだ」「○○の後ろの」等の意味がある接頭語で、ギリシャ語が元になっているようです。 |
thead | table header | table内のヘッダに当たる部分を示すtheadはテーブルヘッダーでした。 |
tbody | table body | table内のメインになる部分を示すtbodyはテーブルボディでした。 |
tfoot | table footer | table内のフッターの当たる部分を示すtfootはテーブルフッターでした。 |
th | table header cell | tableでセルの見出しに使うthは、テーブルヘッダーセルでした。 |
td | table data cell | tableでセルの内容を書くtdはテーブルデータセルでした。 |
pre | preformatted text | 囲んだテキストとそのまま表示してくれるpreはプレフォーマット テキストでした。 整形済みテキストと訳されます。 |
q | quotation | blockquoteのタグとの違いですが、blockquoteはブロック要素で長文に、qはインライン要素で短いテキストに使います。 |
rb | ruby body | ルビを振る事ができるrubyタグ内で使うrbはルビーボディでした。 ルビの対象になる文字を囲みます。 |
rt | ruby text | ruby内で表示させたいルビを囲むタグです。 ルビーテキストでした。 |
rp | ruby parentheses | rubyに対応していないブラウザだけに表示させるタグです。 ルビーパレンシスでした。 |
rbc | ruby body container | HTML5で廃止されたrtcは、ruby内でグループ化するタグ。 ルビーテキストコンテナーでした。 |
rtc | ruby text container | ruby内で2つのルビを振るためのタグ。 HTML5でも採用されています。 |
samp | sample | プログラムなどで出力された部分をサンプルとして示すタグ。 サンプルの略でした。 |
sup | superscript | 上付き文字を表示するためのタグ。 スーパースクリプトでした。 |
sub | subscript | supの上付きに対して、subは下付き文字を表示するためのタグ。 サブスクリプトでした。 |
u | underline | アンダーラインを引くためのタグでしたが、html5では意味合いが変更されて、本来とは違う表記等を示すラベルとして使います。 リンクと間違え安いこともあり非推奨とされています。 |
kbd | keyboard | ユーザが入力する要素を表示させるkbdはキーボードでした。 |
abbr | abbreviation | 省略形や略語の意味を持つ「アブリビエーション」です。 title属性と一緒に使用して、略語である事を示します(titleには正式名を入力)。 |
var | variable | 変数を意味するバリアブルでした。 varで囲んだ部分が変数である事を示します。 |
nav | navigation links | やはりのナビゲーションでした。 |
nobr | no break | 改行させたくない場合に使うnobrです。 |
wbr | word break opportunity | nobrで囲まれた部分で改行してもいい箇所示します。 改行候補なだけで必ずしも改行されるわけではありません。brのように閉じタグはありません。 |
param | parameter | objectの中で子要素として使うparamはパラメータでした。 |
bdo | Bi-Directional Override | 属性のdirにrtlで右から左に、ltrでその逆方向から文字を表示できるタグ。 バイディレクショナルオーバーライドでした。 |
bdi | Bi-directional Isolation | 他テキストの文字方向に依存しないで表示出来るタグ。 バイディレクショナルアイソレーションでした。 |