HTMLのルールを学習します。要素に追加する属性とは、要素で指定された情報がどこにあるのか、あるいは、要素の役割の細部の指定や機能の拡張などを指定します。記事では、具体的な内容として、「a要素の属性」と「img要素の属性」について解説します。
要素の性質を定義する属性とは
前回の講座では「初心者も知っておくべき8つのタグ要素」を紹介しました。これらの要素には、さらに詳しい指定が必要なものもあります（a要素とimg要素）。具体的には、「属性」を追加して紹介します。
属性とは？
要素に追加する属性は、要素で指定された情報がどこなのか、あるいは、要素の役割の細部の指定や機能の拡張などを指定します。
次に、前回行った「初心者も知っておくべき8つのタグ要素」の中で属性を指定しなければならないものの内容を紹介します。（尚、ここでは、WPが反応しないように不等号を大文字で書いていますが、実際には小文字で記載して下さい）
a要素の属性
a要素は、他のウェブページを参照する「ハイパーリンク（リンクを張る）」を定義するタグです。「どこにある情報なのかの場所を指定します」href属性を追加して次のように記載します。href属性で参照先のウェブページの場所を記します。
＜a href=”リンク先のアドレス”＞テキスト文＜/a＞
ここで、a要素で挟まれた部分の語句や画像は、リンクボタンとして機能します。
img要素の属性
img要素は、画像を表示します。そのため、どの画像なのかなどをsrc属性（画像の場所）や、alt属性（画像の代替テキスト）、title属性などのタグで指定します。
＜img src=”画像ファイルの場所” alt=”代替テキスト”＞
上記のalt属性の代替テキストは、画像が表示されなかった場合に備えたものです。
テキストエディタで実践
では、今回学習した、a要素について、テキストエディタ（ブラケッツ等）で実践してみましょう。
テキストエディタ（ブラケッツ等）を立ち上げて次の内容を打ち込んで下さい（不等号は、小文字にして下さい）。
＜!DOCTYPE html＞
＜html＞
＜head＞
＜meta charset=”UTF-8”＞
＜title＞練習用４回目の講義＜/title＞
＜/head＞
＜body＞
＜h1＞HTML講座４＜/h1＞
＜ｐ＞これは練習用の文章です。これは練習用の文章です。これは練習用の文章です。これは練習用の文章です。これは練習用の文章です。これは練習用の文章です。これは練習用の文章です。これは練習用の文章です。これは練習用の文章です。これは練習用の文章です。これは練習用の文章です。これは練習用の文章です。これは練習用の文章です。これは練習用の文章です。これは練習用の文章です。これは練習用の文章です。これは練習用の文章です。これは練習用の文章です。これは練習用の文章です。これは練習用の文章です。これは練習用の文章です。これは練習用の文章です。これは練習用の文章です。これは練習用の文章です。これは練習用の文章です。これは練習用の文章です。＜/p＞
＜h2＞HTMLを習得するには＜/h2＞
＜ul＞
＜li＞焦らず、ゆっくり、テキストエディタで好きなものを作る＜/li＞
＜li＞楽しみながら取り組む＜/li＞
＜/ul＞
＜p＞勉強だと思わないで、テキストエディタで遊びましょう。＜/p＞
＜p＞＜a href=” https://www.yahoo.co.jp/”＞ヤフージャパンへリンク＜/a＞
＜/body＞
＜/html＞
以上の内容をテキストエディタでプレビュー表示すると、次のようになります。
＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊
＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊
まとめ
HTMLのルールを学習しました。要素に追加する属性は、要素で指定された情報がどこにあるのか、或いは、要素の役割の細部の指定や機能の拡張などを指定します。
「a要素」では、他のウェブページを参照する「ハイパーリンク（リンクを張る）」を定義するタグです。「どこにある情報なのかの場所をhref属性で指定します。」
「img要素」では、画像を表示します。そのため、どの画像なのかなどをsrc属性（画像の場所）や、alt属性（画像の代替テキスト）、title属性などのタグで指定します。
a要素や、img要素には、もっとさまざまな属性があって、さらに詳しく情報を指定することもできますが、ここでは割愛します。自分で、どんどんチャレンジして下さい。
