プログラミングをしているとHTMLに触れる機会はよくあります。そういったHTMLタグ(<b>など)の名前から英単語を覚えてみましょう。
記事の英語難易度は「初〜中級」です。
今回はbuttonやformなど、フォームに関連する英単語の1回目です。
サンプル全体
今回取り上げるタグの表示サンプルをまとめて示します。
▼ HTMLのサンプル
<form oninput="result.value=votes.valueAsNumber">
<fieldset style="border:solid;padding:10px;">
<legend>好きな作家</legend>
<input type="radio" name="sakka" id="akutagawa">
<label for="akutagawa">芥川龍之介</label><br/>
<input type="radio" name="sakka" id="dazai">
<label for="dazai">太宰治</label><br/>
<input type="radio" name="sakka" id="natsume">
<label for="natsume">夏目漱石</label>
</fieldset>
<br/>
投票数を入力:<input type="number" name="votes" value="1" style="border:solid;">
<br/>
入力数:<output name="result"></output>
<br/>
</form>
<br/>
<button type="button" style="border:solid;padding:10px;border-radius:10px;">投票する</button>
▼ 実際の表示
<button>
<button>は文字通り「button」で、「ボタン」という名詞です。プログラミング必須英単語600+の前提英単語100に入っている単語です。
サンプルだと最下部に記載されています。
<fieldset>
<fieldset>は「field」と「set」からできている言葉です。
まず「field」は「フィールド」という名詞です。記入欄のことです。プログラミング必須英単語600+でベーシック300に入っています。一般英語としては、「分野」、「競技場」、「畑」、「戦場」、「現場」といった意味もあります。
次に「set」は「セット」という名詞です。「一式」や「一揃い」のことです。動詞の「設定する」が前提英単語100に入っています。
fieldset要素は、フォームに関係する要素をまとめてセットにするのに使われます。サンプルにあるように、legend、input、labelの各要素がセットにまとめられ、実線で囲まれています。
<form>
<form>もそのまま「form」です。「フォーム」という名詞で、前提英単語100に入っています。ユーザーが提出する「申し込み用紙」や「書式」のニュアンスです。
一般英語としては、名詞の場合は「形態」、動詞の場合は「形成する」や「組織する」といった意味もあります。
サンプルを見ると、最上位のform要素の下にさまざまな要素が配置されています。
<input>
<input>も文字通り「input」です。「入力」という名詞、または「入力する」という動詞です。ベーシック300に入っています。
なお反意語は後に登場するoutputです。
サンプルから分かるように、「input type=”radio”」や「input type=”number”」など、input要素にはいくつかのタイプがあります。
<label>
<label>はやはり「label」です。「ラベル」という名詞、または「ラベルを貼る」という動詞で、ベーシック300の英単語です。
label要素はインターフェイス要素の説明文に使われます。例えばサンプルを見ると、芥川龍之介のラジオボタンのラベルは「label for=”akutagawa”」です。
<legend>
<legend>もそのまま「legend」です。「(グラフなどの)凡例」や「(挿絵などの)説明文」という名詞です。
一般英語としては、「伝説」や「言い伝え」の意味があります。
legend要素には、親であるfieldset要素の説明文が記載されます。サンプルを確認すると、fieldset要素全体が実線で囲まれており、その説明として「好きな作家」というlegend要素のテキストが表示されています。
<output>
<output>もそのまま「output」です。「出力」という名詞、または「出力する」という動詞で、ベーシック300の英単語です。
前述のように、反意語はinput(入力、入力する)です。
output要素は、ユーザーの操作結果や計算の結果などを表示するための要素です。サンプルを見ると、「投票数を入力:」でユーザーが数字を入力できるようになっています。ここで入力した数字が「入力数:」の直後にあるoutput要素内に出力されています。
英単語まとめ
- button【名詞】ボタン
- 前提英単語100
- field【名詞】フィールド
- ベーシック300
- 一般英語だと、「分野」、「競技場」、「畑」、「戦場」、「現場」
- form【名詞】フォーム
- 前提英単語100
- 一般英語だと、「形態」(名詞)、「形成する」、「組織する」(動詞)
- input【名詞/動詞】入力/入力する
- ベーシック300
- 反意語はoutput
- label【名詞/動詞】ラベル/ラベルを貼る
- ベーシック300
- legend【名詞】凡例、(挿絵などの)説明文
- 一般英語だと、「伝説」、「言い伝え」
- output【名詞/動詞】出力/出力する
- ベーシック300
- 反意語はinput
- set【名詞】セット
- 動詞の「設定する」が前提英単語100
[筆者紹介]