
<header>
<h1>これが私のサイトタイトル</h1>
<nav>
<ul>
<li>りんご</li>
<li>ごりら
</header>
こんなヘッダーを左カラムとして置いていますがサイトタイトルがボックスの幅より長いため自動的に改行されてしまいます
そこで<br>またはwhite-space:preで以下の2通りの記述をするのは望ましくないとされていたり、悪いことだたりするのでしょうか?
具体的にはサーチエンジンのクロウラーが検索結果の上位に来させないようにしたり・・・
<h1>これが私の<br>サイトタイトル</h1>
または
<h1 style="white-space:pre">
これが私の
サイトタイトル
</h1>
ご回答よろしくお願いします
No.1ベストアンサー
- 回答日時:
何かサイトデザイン的な問題で、見出しが改行されるのが不都合なら、CSS等で調整が必要ですが。
長い見出し自体に質問者さん自身が特に何も問題が無いと思っているのなら、変な改行タグ(brなど)を入れないで、そのまま平文のままの方がむしろ良いです。後、「white-space:pre」は全く持ってオススメ出来ませんね。それで見栄えが良くなったと思ってるのは製作者だけで、実際にサイトを利用する人たちにとっては見難いことこの上ないですから。見出しが露骨に本文と関係ない、いわゆる「釣りタイトル」で無いのなら、サーチエンジンの評価が下がる様な事も無いので、何も弄る必要はありません。
つまり…
<h1>これが私のサイトタイトル</h1>
~のままでOK。余計な事はしない方向性で。
No.3
- 回答日時:
デザイン的に改行させたいのなら、brよりもspanの方が良いです。
brは何らかの区切り(文の区切りや、住所の区切りなど)を示します。
<h1><span style="display:block">これが私の</span><span>サイトタイトル</span></h1>
<wbr>というのがありますが、日本語ではOperaしか対応していないようです。
(wbrタグを使う為の条件があるのかもしれませんが。今後OperaのレンダリングエンジンがWebkitになるので、wbrが効かなくなる可能性もあります。)
<h1>これが私の<wbr>サイトタイトル</h1>
ただ、brとwbrの意味関係がよくわかりません。
http://www.w3.org/TR/2012/CR-html5-20121217/text …
例を見ると、私の使い方(英単語の区切り、日本語の言葉/節/詞の区切り、禁則処理)と同じように思えるのですが。。。
適切な位置で改行させた方が、私はかっこいいとおもいますけどね。デザイナーならこれくらいのこだわりがあっても、むしろ当然だと思います。
(添付画像はOKWaveサイトにあった広告バナースクリーンショットを改変しました)
ただし、これがSEOに対してどのような影響があるかはわかりません。
SEO会社なら調査されているかもしれませんが、
おそらく同程度のSEOを施したサイトを100個くらい作って、<span>や<wbr>あり、なしで半分ずつにして統計を取るくらいの事をしないと、問題ないか、デザインを諦めるべきか、というのはわからないと思います。
相当な作業になると思いますので、無料で聞くのは無理じゃないでしょうか。
ともあれ情報商材は詐欺も多いようですのでご注意下さい。

少し前にベストアンサーを決めてしまいましたが、早く見れていればこちらにしたかったと思います、ご回答ありがとうございました
display:blockは<h1>もすでにブロックレベルだったので思いつきませんでした
試してみようと思います
ありがとうございました
No.2
- 回答日時:
質問のタイトルと、書かれたソースが一致しません。
>見出しを改行させることはしないべきか
とっても難しい日本語です。「見出しは非改行であるべきか?」、改行させないほうが良いのか??と読み取れます。
それでいて、
>以下の2通りの記述をするのは
なのに、
・サーチエンジンのクロウラーが検索結果の上位に来させないようにしたり・・・
・<h1>これが私の<br>サイトタイトル</h1>
・<h1 style="white-space:pre">
と三つの案が出されていたり・・
ひょっとして、指定された位置以外で改行させたくない??ということ?
HTML5ではBRは
【引用】____________ここから
The br element represents a line break.
br elements must be used only for line breaks that are actually part of the content, as in poems or addresses.
 ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ここまで[4.6 Text-level semantics — HTML5( http://www.w3.org/TR/2012/CR-html5-20121217/text … )]より
「brは改行を意味し、改行自体がその段落の内容であるときのみ使う」と言う事です。
<h1>これが私の<br>サイトタイトル</h1>
は改行自体が<h1></h1>の内容として意味があるならまったく構いませんが、常に改行されてしまいます。
<h1 style="white-space:pre">
これが私の
サイトタイトル
</h1>
この場合は、HTML的には一続きの内容です。(半角スペースや改行はHTMLでは空白文字で複数あるときを含め、単語境界としてみなされます。よって、このHTML自体は特に問題はないでしょう。それをスタイルシートで「整形済み」と表現することとはまったく別問題で、スタイルシートは意味的に考えませんから・・
ただ、文書構造上で内容的に異なるのでしたら
<heder>
<hgroup>
<h1 style="width3em">山歩き</h1>
<h2 style="width6em">富士山に登る</h2>
</hgroup>
・・・
として、
header h1{float:left;}
header hgroup:after{content:"";display:block;clear:left;}
とか・・
結論から言うと、内容が分からないので、どうしたらよいかがアドバイスできない。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
このQ&Aを見た人はこんなQ&Aも見ています
関連するカテゴリからQ&Aを探す
おすすめ情報
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
改行できる・できない入力ボッ...
-
Title表示時間の調節は?
-
長いURLを途中で改行(折り返す...
-
<TD><input type="text"></TD>...
-
H1タグに改行の<br>を使う
-
VBE でスペースと改行を見える...
-
textareaを非表示
-
\\n \\r \\t について
-
テーブルの中にスペースを入れたい
-
html上で改行するとスペースが...
-
「:」について
-
文字の最後に半角空白が勝手に...
-
span要素にのみwhite-space: no...
-
Hタグを改行禁止にしてspanのよ...
-
カーソルを合わせると説明を表...
-
ddの行の折り返しをしたいです...
-
Labelでは1行しか書けない
-
<br style="clear:both;">って...
-
連続した<span>の改行
-
iframe内で、指定文字数での改行
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
H1タグに改行の<br>を使う
-
Hタグを改行禁止にしてspanのよ...
-
テーブルの幅を固定するとnowra...
-
\\n \\r \\t について
-
改行できる・できない入力ボッ...
-
XMLの改行方法とリンクの仕方
-
テキストエリア内の改行もその...
-
ddの行の折り返しをしたいです...
-
テキストエリア内の改行禁止
-
長いURLを途中で改行(折り返す...
-
Dream Weaverの改行時にTabキー...
-
Windowsのformでtextareaに入力...
-
<br style="clear:both;">って...
-
文字の最後に半角空白が勝手に...
-
VBE でスペースと改行を見える...
-
preタグがプロの現場であまり使...
-
liタグの自動改行をやめたい!
-
エクセルVBA テーブルのフィー...
-
「:」について
-
テキストエリアの幅を10桁まで...
おすすめ情報