【HTML】brタグの読み方と使い方例

<br>は、「ビーアール」タグとweb界隈では言われています。Break(ブレイク)の略です。意味は「改行」で、文面を読みやすくするのに使いますが、スマホファーストな時代で変な改行は読みにくい場合があるので注意が必要です。

HTML5での使い方例

<br>要素は、テキストや画像を改行したい場合に入れます。挟み込まないタイプで改行をしたい所に添えるだけです。

実際にテキストエディタで記入する場合は、ソースの最後に添えています。ソースの行の頭につけているのは今まで出会った事がないかも。。。

おまけ：XHTML1.0での使い方例

XHTL1.xでは<br />と書きます。HTML5でも同じ結果が出ますが、マークアップ的にドキュメントタイプを確認して、どちらが正しいかを見れば良いです。

HTML4(<br>)　※元々なかったね。
↓
XHTML1.x(<br />)　※スラ閉じが現れた！意味的には分かる。
↓
HTML5(<br>)　※また戻った(結局どちらでも問題はないそうですが・・・)。

<br>タグまとめ

<br>タグは、最初にも触れましたが、スマホなどの兼ね合いであまり使わない方が良いと感じています。

主な理由

1. スマホで変な改行になり、読みにくくなる
2. ソースコードも読みにくい
3. そもそも改行の読みやすさは個人差があり、<p>タグで固めた方が文法的にも良い

1.は、cssを利用して改行を無効化することもできます。

が、スマホで改行したくなった場合などでまたややこしく(class属性でもいいですがソースが汚くなるし嫌い)なるのであまり使わない方がいいかも。

それよりも文面を読みやすくする方を改善した方がいいです。

初心者向けの本として

サイトのページを作るにあたって、よく使うタグってそこまで多く無いです。基本の30前後と、あとはCSSのテクニックとページデザインからある程度、頭の中でソースを構成できていれば、できたも当然。逆にいうと基本で正しいタグの使い方をしないとまー時間がかかる。

そんな中、webに関わって10年以上のおじさんが、部下に伝えている内容は「今どきか？誤っていないか？」を確かめる時に、よく使う方法として本を読むようにしています。ネットで調べても良いんですが、画面から離れて集中するには良いです。

最近読んだ中では、下記の二つが分かりやすくておすすめです。