ごあいさつ
はじめに
みなさんこんにちは。Webデザイナーを目指してHTML,CSSを勉強中の初心者mikulonともうします。独学で勉強していく中で気が付いたことや学習したことについてまとめていきたいと思っています。
HTMLとは
そもそもHTMLとは。『HTML (HyperText Markup Language)』という言語です。 これでwebページの大まかな構造などを作成することができます。タグでテキストや画像を囲んでブラウザ上で表示できるようにします。
タグについて
ブラウザ上で文字や画像を表示したりするために書くコードがタグです。 テキストを表示するために<p></p>と書いたりします。
ちなみにこのPタグは段落を示します。 タグを下記にまとめました。（ほんの一例です。）
<h1></h1>,<h2></h2>~ ,<h6></h6>
このタグは主に見出しに使います。数字が小さいほどテキストが大きくなりますがテキストのサイズはCSSという別の言語で変更することが可能なため Webサイトのクローラー（検索エンジンのbot）に内容を伝えることがメインです。
クローラーに内容を伝えるとブラウザで検索した際により上位に表示されるようになるためSEO（ブラウザで検索されやすくするための方法のこと）として大切になります。 が今回は取り扱わないので閑話休題
- <h1></h1>
そのサイトのタイトルなどに使用します。一番重要な内容を主にウェブサイトのクローラーに訴えるためにつけます。 複数回使用することも可能ですが基本的にそのwebページ1つに対して１回の使用が望ましいです。
- <h2></h2>
webページの内容の見出しに使います。このタグを複数回使用することも可能です。
- <h3></h3>
webページの内容の子見出しに使います。ｈ2タグのさらに中の見出しなどで使用します。
- <h4></h4>~<h4></h6>
h3よりさらに子要素に使用します。ですが上記で紹介したh1~h3タグの使用が圧倒的に多くこちらのタグはあまり使用されません。
h1タグは以上です。小さい数字から順番に使用します。ｈ1タグは使わずｈ2，ｈ3のみ使用といった使い方もできます。
aタグ
<a></a>タグは別サイトへのリンクやブログ内でのリンクに使用します。
<a href="#">TOPへ</a&;と記載するとブログの一番上へ遷移します。（TOPへの部分は仮テキストなので任意の文字を入れてしまって問題ありません。）TOPに戻る際などに使用できます。 別サイトへリンクする場合は<a href="別サイトのURL">別ページへ</a>
と記載することで遷移先ページへリンクできます。
aタグの後ろにtarget="_blank"を記載するとリンク先ページを新しいブラウザページで開くことができます。リンク元のサイトと別ページでブラウザを開くことができるのでリンク元の自身のサイトへ再度アクセスをしてもらいやすくなります。ただ、アフィリエイトのリンクの場合別ブラウザで展開されると条件達成にならない可能性があるので注意して使用してください。
CSSを利用することでリンクの下線を消したりフォントカラーを変更したり、ボタン風の見た目に変更したりすることも可能です。CSSはそのうち別件でまた記事を記載予定です。
おわりに
ひとまずどうにか覚えたタグを少しだけ紹介してみました。 まだまだ勉強中なのでまた使い方を理解したら記事をあげようと思います。はてなブログ自体が初めてなので色々とつたないかとは思いますが勉強してより良い記事をあげられるように頑張ります。
