広告

posted by fanblog
ブログのカスタマイズにチャレンジしてみたけど、
「なかなか自分の思い通りの結果にならない」という事が
結構あるのではないでしょうか?

今回は、カスタマイズ実行時のトラブル対処法を例に、私なりの
考えるヒントを紹介したいと思います。







はじめに


 今回の記事内容は、予定しているカスタマイズ記事を書き終えた後に、
 補足的に書こうと思っていたものです。

 タイミング的に、「」、ある程度まとめておいたほうが良いかなと感じたので、
 記事にしました。

 「私なら〜」とか上から目線のタイトルをつけていますが、そんなに大層なことは
 していません。
 皆さんも普段から行なっている、ごく一般的な問題解決手法だと思います。

 また、今回の内容の関連記事として、カスタマイズの質問に対する回答記事、
 私がカスタマイズでトラブった時の対処記事を紹介します。

 この記事と合わせて参考にして頂ければ嬉しいです。




 頂いた質問にお答えするコーナー
  頂いたカスタマイズの質問の回答記事です。
  補足説明を含め、計4回の連載記事になります。





 カスタマイズトラブルの認識から解決までの流れ
  私が直面したカスタマイズトラブルの事象と、
  その解決までの記事です。

  ・現在発生している不具合について
  ・解決編1 Dropboxの同期問題
  ・解決編2 prototype.jsのバージョン問題
  ・解決編3 他サーバー(Dropbox)参照問題




問題解決までの基本ステップ


 朝起きたら、ちょっと頭が痛い、喉が痛い、咳がでる…。
 一日の始まりが体調不良だとブルーになりますよね。

 こんな時、皆さんはどうしますか?



  



 まずは、「」の状況を認識するのではないでしょうか。
 熱はあるのか、喉は腫れていないか等々。

 そして、ふと原因を考えるのです。
 「最近寝不足だからな〜。」「そういえば、昨日帰宅してからうがいしてないな」等々。

 その後、原因・症状に応じた対処をとります。
 症状が軽く支障がなければ、今後睡眠をしっかりとるでしょうし、うがいもするでしょう。
 症状が重いようなら、薬で対処したり、病院に行くことでしょう。



  



 この思考のプロセスは、カスタマイズでトラブルが発生した場合も同じです。
 具体的には、以下の手順で問題を解決していくことになります。

  1. 問題の認識
  2. 調査分析
  3. 解決策の立案
  4. 解決策の実施
  5. 結果の評価

 今回は、先日いただいたカスタマイズの質問を元に、この手順を実践してみます。



1.問題の認識


 頂いた質問はこのような内容でした。





 カスタマイズをしていると、この手の問題は比較的よく発生します。
 その為、具体的な調査をせずとも、ある程度原因を推測出来ます。


  「タグをちゃんと閉じてないんじゃないの?」


 という感じに。
 これは慣れるしかありません。

 ただ、思い込み、先入観ほど怖いものもありません。
 しっかり、調査・分析を行なっていきます。



2−1.調査


 それでは、実際に問題記事の調査をしていきます。
 しかし、困ったことに記事を見るかぎり、質問内容のような現象が
 再現しないんですよね。

 試しにこちらからコメントを打って確認してみたのですが、
 やはりデフォルトの文字色で表示されています。



  



 その後、問題箇所の画像を提示してもらったのですが、
 なるほど、おかしいです。



  



 ここでピンと来ました。
 以前にも、カスタマイズしている時にこんなことがあったのです。
 使用しているブラウザによって見え方が違うことが。

 私は普段「Google Chrome」というブラウザを使用しています。
 そして、現在一番使われているブラウザは「Internet Explorer」です。
 困ったことに、たとえ同じ記事であっても、この「Internet Explorer」と
 それ以外のブラウザで表示内容が変わることがよくあるのです。

 特にCSSを使ったレイアウト周りはひどいです。



 【ファンブログ】βテスト中につき…【カスタマイズ】
  ブラウザ間におけるレイアウトの調整は
  ほんと苦労しました。

  最後はもう諦めましたが…。





 そこで、主要ブラウザで該当記事を確認してみました。
 結果は以下の通りです。

 無事再現させることが出来ました。



  



2−2.分析


 さて、問題の事象が再現しました。
 あとは、何が問題か、具体的に落としこんでいきます。

 始めに行ったことは、問題箇所の絞り込みです。
 問題の記事を見るかぎり、今回の事象はこの記事でしか発生していません。
 他の記事は、通常通りデフォルトの文字色が適用されています。

 ここから、問題箇所はテンプレート等の問題ではなく、今回追加した記事本文にあることが
 特定できます。



  



 次に、問題の事象を細かくみてみます。
 文字色がおかしいのは、コメント欄より前のトラックバックの表示からのようです。



  



 ファンブログにおけるトラックバックは、記事本文の直後にあります。
 やはり、記事本文のタグの閉じ忘れのような気がします。
 そこで、文字色のコードを検索し、色を設定している箇所を特定します。
 カラーコードの取得には、このフリーソフトを使用しました。



 Color Picker
  使いたい色や気になる色があった時、
  このツールを使えばカラーコードを取得できます。

  そして、そのカラーコードをブログのHTMLで
  指定してあげれば、その色を使用することが
  できるわけです。



  


  使われているカラーコードは、”FFCCFF”と判明しました。
  あとは、このコードでHTMLを検索し、色を設定している場所を特定します。

  ここですね。(わかりやすいように改行をいれています)



  



 色を指定しているタグが正しく閉じられてません。
 おそらくこれが原因でしょう。






【スポンサード リンク】






この記事へのコメント

   
×

この広告は30日以上新しい記事の更新がないブログに表示されております。