しばた工務店 Weblog

しばた工務店で借りているサーバーが最近重くなって、表示が遅くなったり、タイムアウトになることが多くなってきた。

しばらく様子を見ていたけど、いっこうに改善される気配はナシ。11月にこのサーバーに変えたときは、こんなことなかったんだけどなあ。

xreaはSSHが使えるので、uptimeコマンドで調べてみたら、ロードアベレージが30とか40とかになってるし、topコマンドを使ってみると、httpdさんがずらーっと並んでる状態。

こりゃアカン、ということで、サーバーを引っ越すことにしたよ。

っても、同じxreaのサーバーだけど。

別の会社のレンタルサーバーも検討してみたけど、過負荷サーバーに当たるか、当たらないかはどうやら時の運のようだし。
xrea同士の方が引越しはラクなので、xreaの別のサーバーに引っ越したよ。

前回と違って、今回はサイト内の構成を変えなかったので、そんなに時間はかからなかった。

新サーバーのロードアベレージを見てみたら、フツーに1以下になってたよ。ふう、やれやれ。

以下は、今回の手順の覚書。
続きを読む »

IE6でも気にせずPNGを使えるようになったので、画像をPNGに差し替えようと作業していて気づいたんだけど。

PhotoshopでPNGファイルを作成して、IEで表示すると、元の画像と異なった色で表示されるのね。全体的に色が明るいというか。画像単体では気づかなかったけど、他の要素と並べると、はっきり色が違う？？

いろいろググって調べてみたんだけど、PNG内部のチャンクに保存されているガンマ情報が原因らしい。
このガンマ情報を削除してやればちゃんと表示されるんだけど、Photoshopでは、この情報を削除することができない（ーー）。

Fireworksなどで保存しなおしてやればいいんだけど、それだけのために他のソフトを立ち上げるのもなあ～。つか、こんな問題、世界中で困ってるはずだから、プラグインがあるんじゃないの？

…で、見つけたのが、Photoshop用のプラグイン「SuperPNG」。
登録が必要だけど、フリー。すっばらしい。

http://www.fnordware.com/superpng/

「別名で保存」のファイル形式の中に「SuperPNG」と表示されるので、従来のPNGとは別に使うことが可能っす。
Photoshop 5.5用とあるけど、CSでもCS2でも問題なく使えたよ。

1色しか透過色を設定できないGIFと違って、PNGはきれいな透過が表現できる画像フォーマットなんだけど、いかんせん、IE6以前では透過がサポートされてない。
IE独自のフィルターを使えば、一応使うことは可能なんだけど、いちいち設定するのもめんどくさい。

なんかラクチンな方法はないかなあ～と思って探していたら、iepngfix.jsというステキなライブラリをユンサンのサイトで発見。
http://blog.l-xs.com/yungsang/2007/02/png_ie_ie7.html

試してみるとバッチリ透過されたので、ありがたく使わせてもらうことにした。

このブログのタイトル部分「しばた工務店」の文字などは、このライブラリを使って透過してるよ。

以下は、WordPressのテーマの中で使うためのメモ。

1. header.phpの</head>のすぐ上の部分に下記のコードを追加。

2行目の"src="の部分は絶対パスで記述しておいた。
※それぞれの環境に合わせてパスを書き換えておくこと。

<!--[if IE]>
<script type="text/javascript" src="http://shibata-koumuten.com/wp/wp-content/themes/hoge/js/iepngfix.js" charset="utf-8"></script>
<style type="text/css">
.iepngfix {
  behavior: expression(IEPNGFIX.fix(this));
}
</style>
<![endif]-->

2. iepngfix.jsをindex.phpの下のjsフォルダにアップ

3. 透過させたいPNGのタグに class=”iepngfix”と指定

classを指定するのは、imgタグでも aタグでもOKだった。

※PNG画像にwidthとheightを指定しないと崩れて表示されるので、htmlかcssの中でサイズを指定しておくこと。