ブログのデザインが崩れてしまったときの対処法!【パソコン│スマートフォン│タブレット】

はまぞう サポート

2014年04月22日 22:43



ブログを使っているとたまにデザインの崩れがでてきます。その原因と対処法をご紹介いたします。


ここでいうデザイン崩れを具体的に言うと、

 ブログのサイドバーがページの一番下まで落ちてしまう
 一文だけ色を変えようとしたらページ全体の文字色が変わってしまった
 意図しないところで改行してしまっている


等です。

それでは、以下、原因と対処法です。



デザインが崩れる原因は?

肝心の原因はHTMLタグの不備 にあります。

HTMLタグとは?

文字を装飾したり、画像や地図を挿入した際に表示される、下記のような文字列です。

 <タグ>装飾された文字</タグ>

 <画像が表示されるタグ>


ページ上で右クリックし→「ページのソースを表示」すると今見ているページは全てHTMLで構成されていることが分かるかと思います。

このHTMLにはルールがあり、それに反するとデザインが崩れてしまいます。

HTMLタグの鉄則

1.HTMLタグの一部を削除しない

 正: <タグA>○○○</タグA>
 誤: <タグA>○○○/タグA>

こちらについてはHTMLタグの一部を削除してしまうと、その機能が正常に働きません。文章を入力しているとたまに間違えて一部を消してしまうことがあるので気をつけましょう。


2.HTMLタグを交差させない

 正: <タグA>○○○<タグB>○○○</タグB></タグA>
 誤: <タグA>○○○<タグB>○○○</タグA></タグB>



2つのHTMLタグで挟むタイプの場合「箱」のようなイメージを持ってもらい、箱の中に箱を入れたり、隣に並べることはできるのですが、箱の片方だけを他の箱に突っ込むことはできない、ということですね。



デザイン崩れの対処法は?

基本的にHTMLタグを使うタイミングは、

 1.テンプレートのカスタマイズ
 3.カスタムプラグインの編集
 2.記事の投稿


です。

まずはどのタイミングでデザイン崩れが起きたかを考えて、何が原因か切り分けます。

 1の場合はテンプレートを配布しているものに戻す
 2の場合はカスタムプラグインを削除する


※申し訳ありませんが、基本的にテンプレートのカスタマイズとカスタムプラグインの編集は自己責任にて行っていただきますので、サポートセンターにお問い合わせいただいても不備の指摘や修正は致しません。

 3の場合はデザインが崩れている記事を見つけ、全てのHTMLタグに不備がないかチェックします

基本的には上記方法で改善されるはずです。



HTMLタグは正しく使えば色々な可能性がありますので、デザイン崩れを恐れず、色々チャレンジしてみてください。

関連記事