<br>タグは使わないほうが良いらしい…(^^ゞ

皆さんこんにちは。パソ吉です。

 

昨日、英語の勉強方法のまとめ代わりに記事を書いていたのですが、スマホで表示したところデタラメな改行が為されていて、ただでさえ読みづらい文章が「もう読んでイラレネー」な文章になってしまいました。

今回はこの事件の原因について書いていきたいと思います。

 

たぶん短いまとめ記事になります。(ま、これから書くのでわかりませんけど…)

うう、ついつい[Shift+Enter](多くのエディタで改行と設定れている)の押しちまう。

まとめ


はい。これだけです。最初に言ってしまいますね。

  • <br>タグはスタイリング目的に使用しない

  • 特にスマホで見ると崩れまくる


な、なんだって、<br>や<br/>は多用してはいけないらしい


ブログを書き始めて2年とちょっと(お休みもしていたけど)。

私は見やすくなると思って、話が変わるとき(読者に気持ちを一度リセットして読んでいただきたい場合)、しばしば改行していました。
例)

みなさんお久しぶりです。パソ吉でございます。
今日は、鼻水だらだらの頭が痛い痛いので、完全に風邪を引いてしまいました。
頭も回りません。。。(-_-;)ぼーっとするというか、気づいたら舟を漕いでいます。そして頭がガンガンしてきて、耳もおかしいです。
思わず、PL(総合かぜ薬)飲んでしまいました。

それで、今回の改行をやめて<p>タグで囲むようにするとこうなります。
例)

みなさんお久しぶりです。パソ吉でございます。

今日は、鼻水だらだらの頭が痛い痛いので、完全に風邪を引いてしまいました。

頭も回りません。。。(-_-;)ぼーっとするというか、気づいたら舟を漕いでいます。そして頭がガンガンしてきて、耳もおかしいです。

思わず、PL(総合かぜ薬)飲んでしまいました。

パソコンで読まれている方で、解像度が比較的高いディスプレイを使っておられる方にはうえのほうが読みやすいかもしれません。

しかし、スマホで読んでみると一目瞭然。おかしな改行によって、読みづらい文章が更に読みづらい(-_-;)

というわけで、気をつけましょうって言うことなんですね。はい。

辞書的サイトさんの説明によると…



br要素は、例えば詩や住所などのように、改行がコンテンツの一部を形成する場合に使用することができます。

その箇所が改段落となる場合には、この要素ではなくp要素を使用します。


次の例では、住所の表記にbr要素を使用しています。これは正しい使い方となります。
<p>〒000-0000<br>
東京都新宿区西新宿0-0-0<br>
TAG indexビル 45F</p>

次の例は、改段落の箇所にbr要素を使用しているため、誤った使い方となります。
<p><label>名前:<input type="text" name="name"></label><br>
<label>メール:<input type="text" name="email"></label></p>

このような場合は、p要素を使って次のように記述します。
<p><label>名前:<input type="text" name="name"></label></p>
<p><label>メール:<input type="text" name="email"></label></p>

出典:TAG index HTML5リファレンス <br>

なるほど。句点「。」は改段落なので、pを使うんですね。

逆に、読点「、」はおk

 

ネット上でよく見るのが、接続詞+読点の時に改行すること。

例えば、
こんな感じ。

しかし、
こんな感じ。

このような場合は、<br>を使っておkと解釈しました。

 

なるほど、気をつけよう…!

この記事へのコメント


この記事へのトラックバック