スクロールバーでセンタリングがズレる

~butch/zakki/ 以下は同じフレーム同じ雛形なのに、FireFoxで見てると、ページによってはセンタリングがずれてページがピコっと動くことがあって、気持ち悪かった。cssを疑ってピクセル指定しなおしたりしても変わらず。
ググれ、カス。
だった。検索したらあっさり見つかった。
FireFoxなど、タテスクロールが起こる場合にだけスクロールバーが現れるので、スクロールバーの幅の分横幅が変わって、センタリングのやり直しになるから、ズレる。なので、最初からどのページもスクロールバーが出てればいい、らしい。定番は以下。
html {} に、height:100% margin-bottom:1pxを指定して常にスクロールバーを出させる。
いろいろあるもんだ。
[更新]2026-02-04 09:25:03
IE6に吐血

原因不明、IE6で見るとクラッシュ。なんじゃそれ、と。mshtml.dllが悪いのか、とか、SP1だから、とかだろうと、延々WindowsUpDateをしてみたり。結果なんの変化もなし。変わらずページを表示させるとクラッシュして落ちやがる。Javascriptをはずしてみたりしてもクラッシュする。しかたないんで、HTMLをひとかたまりずつ入れたり出したりして、どのあたりでクラッシュするのか見てみたら。
HTMLの中のコメントが原因だった。
…アリエナイ。たしか前にも同じように、コメントが原因だったことがあったけど、クラッシュまでするとは、とんでもない話だ。
な ん の た め の コ メ ン ト じゃ
マイクjロソフトは、もうソフトを作るのはやめてくれ。
[更新]2026-02-04 09:25:41
Javascriptはいかんなあ。

なにかと便利に使えるんだけど、classの挿げ替えとか、随所にあるdocument.writeは、そのつどブラウザにレンダリングを要求することになるんだろうから(=素人考え)、負荷がかかってページ表示が遅くなる重くなる。実際に、javascriptを殺してページを見ると体感できるほどページ表示が速くなった。倍は早くなったんじゃないかな。
とはいえ、ページ表示にJavascriptはガッツリ組み込んでるし、そいつを極力外していくとなると、改修作業が大変になりそうだけど。
てことで、仕事がらみの方の改修はひたすら地味地道な力仕事になりそうな予感。でも、それでレスポンスが向上するならOKだな。
1月にリニューアルしたウチの読書SNSの方は、もう細かなバグつぶし程度で、安定期停滞期、かな。動きがないのはさびしいんで、ケータイ版をまともにしたいところ。yahooとかmixiとか大手サイトのケータイ版のHTMLを覗ければたぶんラク。ケータイサイトのHTMLとかタグについての解説本とかわかりやすいサイトが意外に見つけられず。もともとケータイのキーボードでなにかしようというのがムリだと思っていて、気乗りしない、てのもあったしねえ。
zaurusの代わりにモレスキンの手帳を持ち歩くようになってみると、ケータイでアクセスしたいかな、と。
なんだかヘロヘロヨレヨレイライラの今日この頃。どこかでリセットしないとパンクしそうだぜ、ちくそお。
[更新]2026-02-04 09:27:46
速度最優先

サイトのレスポンスチェックにストップウォッチまで持ち出して、調べてみる。ブラウザが表示終わりましたでストップにするか、ファーストビューが出たらとりあえずストップするかというのもあるけど、表示が終わった時点でストップする。
改めてHTMLとCSSを覗いてみると。
ほぼ間違いなくコンテンツの量、HTMLの量の問題で、ブラウザに負荷をかけてるんだよなぁ。スタイル指定の時の便宜・保険のためのタグや、その場しのぎのための無駄なタグが多すぎる。それはココで散々言ってるように、既知、わかっていたこと。んで。コンテナトップレベルに指定したらその中は基本的にはクラスなどは使わない、という方向でシェイプアップ。HTMLを30Kほど削ったら表示は1~2秒早くなって実感、驚く。
最近のパソコンだとそんなに差は出ないんだけど、3年程度前のパソコンだとその差ははっきり。
うーむ。すごく当たり前の結果、だ。
ウチの読書SNSはすべて動的表示で、DBの設計がタコなもんで、ページ表示に1秒ほどかかってしまう。HTMLの量とかタグがどーしたというのは当てはまらない。重いページだと5秒ぐらいはかかる。ほんとはこんな遅いのは論外。mixiがやっぱり重いんで、このぐらいでいいか、と目をつぶったんだけど、なんとかしたいところだなあ。
なんだかだるさも抜けず、もちべえさんもすっかりいらっしゃらず、鬱な今日この頃。とほほ。

素直な絵馬にほっとするよなあ。
[更新]2026-02-04 09:28:06
css web標準?

建国記念日だ。由来は知らないけど、祝日なのはめでたいのでツッコミはない。とはいえ、なんか風向きも悪く首筋が寒いので、今日はマジメにウチで調べもの…って、どうしょうもなければふたたびみたびの青空所属だけど。
仕事がらみのサイトのテコ入れ構想があって。前回はプログラマ氏の書いたHTMLとCSSに、わたしがひとりでプロパティを指定してた(?)ので、なしくずしというか、ひとり上手というか、手前勝手というか。
今回はcssのシェイプアップとそれによる表示速度UPを目指せ、という話。HTMLの構造も変更したほうがいいし、デザインもすっきりさせる、んで、今回は関わる人間が複数になる。
なので、cssの書き方とか統一しようね、と。
調べてみるといろいろあって、今さらおのれの無知・不明を恥じてみる50目前の年男だ。
今のCSSは。
丁寧にパッケージするため、ブログのテンプレートでありがちな<div>要素の数段重ねが多数。そこにJavascriptであれこれするにはDOMを辿るのに、たぶんコストが高くてブラウザに負荷をかける、と思う。なので、ここをすっきりさせる。
IE6でのレイアウトの崩れを押さえ込むのに、いたるところでアンダースコアプロパティを使っている。たぶんこんな無駄なものを読むとブラウザは不機嫌になる、と思う。なのでこいつを追い出す。
そもそも、どちらも、cssとかHTMLの見通しを悪くしてメンテしずらくなってるし。
読書SNSのリニューアルでも、IE6は専用のスタイルシートを読ませるようにして、妙なプロパティがなくなって、すっきりくっきり。IE6のことを考えずにスタイルシートを書いていって、IE6でおかしなところは後で専用シートに書けばいいだけなので、らくちんだった。
(先月公開した読書SNSのリニューアルは、それでもかなりWEB標準というのを意識してCSSを書いたつもりだったけど、今日調べただけでも、みっともないスタイルシートになってんなあ)
こまかいところでは。cssのプロパティの記述順ぐらいは決めておこう。Mozilla.orgのスタイルシート順がいいかな。
[更新]2026-02-04 09:28:23

