さて、Web Diary Professionalでアクセスカウンタを表示に続く第２回目です。
前回は表示するまでの手順でしたが、今回は前回で起きた数字部分の表示のずれを解消しちゃおうというのがコンセプトです。
まあその前に、いくらか解析タグの位置やカウンタの表示法を変えてますのでその手順を。
現在は解析タグを一番最後（フッター部）にもって行き、レイアウトの崩れを無くすためOFF-LEFTという技法（詳しくはhttp://www.seo-equation.com/reference/web/off-left.html）を使い、画面外に表示させています。本来ならばこれは聴覚ブラウザなどのためのアクセシビリティのために使うべきなのですが、視覚ブラウザでの表示崩れもアクセシビリティの観点からはよくないと思い、勝手な解釈で使ってます。
で、なぜ一番最後に持って行ったかというと、これもアクセシビリティに関連しますが、音声環境で最初に解析タグを読み込むのは無駄が多いかなと。
つうことで、前の記事の訂正。解析タグは最後にもって行き、display:none；を指定するかOFF-LEFTを使うかが一番だと思います。
次はカウンタのところですが、Web AnalyzeのAnalyze.cgiを弄り、カウンタタグごとJSファイルに記述させ、そのファイルを読み込んでます。そうすることでアクティブスクリプトが有効でない環境ではアクセスカウンタが一切表示されなくなり、違和感無く閲覧できるようにしています。
Analyze.cgiの弄り方は結構めんどいんで今回説明はパス。気が向いたら後ほど。
さて、本題の数字部分の表示のズレに関してですが、気付いてる方もいらっしゃるでしょうが、TOPページではアクセスカウンタが表示されているのに、個別ページ（この記事の固定URLでの表示）では表示されていません。
表示のズレは、IEではJavaScriptのdocument.writeの中に、さらにJavaScriptを使いdocument.writeで表示させようとすると、中の部分が外に飛び出してしまうから、というのが理由のようです。（ソースは自分の経験上）
だから、いっそのことはみ出してしまうなら表示させなくしちゃえというのが今回の方法。やり方はOFF-LEFTの技法を応用し、表示がナビゲーション（id="navigation"）内なら元の位置に表示させ、その外に出た場合は画面外に追いやってます。
このブログの場合、アクセスカウンタの表示タグのclassはaccessなので
div#container .access {
position: absolute;
left: -200px;
top: 0px;
}
div#navigation .access {
position: static;
}
をCSSに付け足してます。こうすることにより、どのページにおいてもすっきり表示させられることが出来るようになります。
実際のところ、ここまでやるのに試行錯誤して結構時間を使いましたが、そこまでやるほどのものではなかったような気もします。
ま、でもサイト作成なんてほぼ自己満足ですから自分がよかったと思えれば万事OKってなわけで。私と同じような表示法を使ってる方いましたら、是非このやり方お使いください。