noralogコンテンツへスキップnoralognoralogは「一歩を踏み出しかねている誰かの背中を押そう」をコンセプトに体験談やハウツーの例をまとめます。LinksTweetPocketWordPressのビジュアルエディタで記事を書く時に、Enterキーで改行すると、HTML的には<p>&nbsp;</p>というコードによって改行が実現されていますが、どうもこれがあまりよろしい書き方じゃないようでした。WordPressのビジュアルエディアで単に改行をしたい場合はShift+Enterで行うようです。ところが現在では、このBRというタグを使うこと、というより明示的な改行を行うこと自体あまりよくないということを言っている記事もみかけました。いうわけでPタグとBRタグの違いと、Webサイトでの改行についてまとめました。改行と現在のブラウジング環境PタグとBRタグとはPタグもBRタグどちらもHTMLで文書構造を定義するために使うものです。Pタグは、このタグで囲った部分が1つの段落であることを示すために使います。BRタグは、単に明示的な改行を行うために使うものです。PタグとBRタグの共通点は、どちらも改行を行う点です。文書構造的には全く別物です。PタグとBRタグの使い分けHTMLのコーディングについて言えることですが、HTMLでは文書構造のみを定義し、見た目についての定義はするべきではないとされています。いうわけなのでBRタグを連続して使うことなんてありえないことになります。人間がパッと見で「段落が2つある」とわかる文章を、PタグとBRタグでそれぞれつくった場合、HTMLで文書を把握する「クローラー」は「段落が2つある文章」と「改行によって行間に空きのある単一段落の文章」というように全く別の文書として理解します。PタグとBRタグを適切に使い分けないと、クローラーに正しく意図を伝えることができなくなってしまいます。段落として改行したいならPタグを、単に改行したいならBRタグを使うというようにします。紙媒体の場合は、誰が見ても同じように見えますから、見やすいとかんがえられる部分で意図的に改行を入れるのは適切だと思います。デジタル媒体で見る場合には話が変わってきます。現在は、同じWebサイトを見るにしても、パソコン、タブレット、スマホというように色んなサイズの端末が使われます。端末が変われば当然文書が表示される領域も形も違います。パソコンからWebサイトの記事を制作したとき、いくらパソコンで見やすいように改行をしたところで、スマホからアクセスされてしまうと、意図したものと全く違う見え方になってしまうわけです。現在では明示的に改行をすること自体控えたほうが良いのかもしれません。意図的に改行をするなら、例えばパソコンで見ている場合にだけ改行するような仕組みにするなどして、端末による区別を実装する必要があるということになりそうです。ちなみに、これは改行の問題とは関係ありませんが、異なる端末からの閲覧を考慮していなかった例です。これは以前書いた記事ですが、スマートフォンで表示がくずれてしまっています。書いていたときは、パソコンで見ることしか頭になかったようです。コメントをキャンセルメールアドレスが公開されることはありません。コメント名前メールアドレスサイト次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。異なる意見の大切さこの記事を書いた人は......noraイラストや木工が好きなのんびり屋です。足を出すことができない人の背中を押せるようなことができたら良いなぁと思いながらブログをつくっていますー。