ブログを始めるまでhtmlって言葉は知っていても使い方なんて全然分かりませんでしたし、自分が使うことになるとは思ってもみませんでした。
ただ少しはデザインをいじってみたいという気持ちはありますし、どうやらブログをやるには不可欠なものらしい・・・
とりあえずブログを運営していく上で自分が実際に使用することになったhtmlタグの備忘録兼コピペ用として、また自分と同じhtmlなんて全くわからなかった人のために、よく使うhtmlタグをまとめていこうと思います。
HTMLとは
そもそもhtmlとはなんぞやと。HyperText Markup Languageの略称で、ハイパーテキストという仕組みを利用して、開始タグ＜要素名＞と終了タグ＜／要素名＞で囲うようにマークを付けてあげることで、様々な機能を文書に付与してweb上で表示できるようにする仕組み。
よく使うHTMLタグ
- ブログの本文を記述する
<p> </p>
ParagraphのP。段落を構成し、一度終了タグで閉じてから開始タグを記述すれば改行されて次の段落から始まる。
- 改行する
<br/>
BReakのbr。
- 見出しをつける
<h3> </h3>
Headingのhに見出しの種類に合わせて数字が入る。はてなブログではh3から使う。
見る人のためだけでなく、検索エンジンにも記事の構造がわかりやすくなるように使用すべきで、文書を太字にしたり強調したい場合は別のタグを使う。（後述）
はてなブログでは大見出しがh3、中見出しがh4、小見出しがh5となっており、見出しの関係性を守った構造にしなければならない。例えば、中見出しの中の文章をさらに見出しを使って幾つかに分ける場合、中見出し⇨ 大見出し-大見出し-大見出し、という構造にしてはならず、この場合は中見出し⇨小見出し-小見出し-小見出し、とすべき。
- 水平な線を入れる
<hr/>
Horizintal Ruleのhr。
- 文章を論理強調する
<em> </em>
EMphasisのem。文章を視覚的にもシステム的にも強調する。
<strong> </strong>
文章をより強く強調する。
- 文章を視覚的に強調する
<b> </b>
Boldのb。文章を太字にする。
- 文章をクリックすることで特定のページに飛ぶようにする
<a href=" URL " target="_blank"> </a>
Anchorのa。hrefはhyper reference。タグの間に文章を記述することで、その文章をクリックすると他ページに飛べるようにすることができる。
targetには他にも、right、_self、_parent、_top等を指定することで、開き方等を変えることができる。html5ではリンクの到達地点にidを設定して（例：<h3 id="123">）、そこに飛ばすことができるようになった。その場合、<a href="url#123">とする。
- アフィリエイトの商品や広告のバナーを横に並べる
<table><tr><td>アフィリエイトのリンク1</td><td>リンク2</td>繰り返し </tr></table>
trは行、tdはセル。例えば2行2列にしたい場合は、
<table><tr><td>アフィリエイトのリンク1</td><td>リンク2</td> </tr><tr><tb>リンク3</tb><tb>リンク4</tb></tr></table>
とすれば良い。
- Youtubeの動画を再生時間指定で埋め込む
<iframe frameborder="0" allowfullscreen="" src="YoutubeのURL?start=動画の秒数" width="560" height="315"></iframe>
【随時更新予定】