OnlyOne (オンリーワン)

2013 年 11 月 28 日

準備中ではありますが、サイトを形成する多くのページを WEB サーバーアップロードしました。OnlyOne（オンリーワン）軽井沢の雑貨屋さん https://onlyonekaruizawa.jp/

商品詳細ページにて、縮小画像をクリックして複数の写真を切り替える仕組みを採用しましたが、オリジナルサイズの写真を読み込むのに遅延時間が発生します（サーバーの性能？帯域を絞られている？）。これが気になるので、ページを読み込むときにオリジナルサイズの写真もバックグランウドで読み込む仕様に変更しました（ヘッダーに JavaScript を設置して）。メリットは、サムネイルをクリックして写真の切り替えがスムーズになった事です。デメリットは、オリジナルサイズの写真を必要としないユーザーにまで、全ての写真のダウンロードを強いることです（バックグラウンドで）。

その後も画像を取得できない場合が多く、ヘッダーで処理するのが問題かと思い、ヘッダーからソースの最後に JavaScript を移動しました。しかし・・・

Service Temporarily Unavailable
The server is temporarily unable to service your request due to maintenance downtime or capacity problems. Please try again later.

サービスは一時的に利用できません。サーバーが一時的にメンテナンス ダウン タイムまたは能力問題のためのあなたの要求をサービスすることができます。もう一度やり直してください。

サーバーの同時接続数を制限しているのか？サーバーのメンテナンス中なのか？サーバーの信頼性が低いのか？ 原因は分かりませんが、無料サーバーなので致し方ないことなのかも知れません。有料版へのアップグレードで、この問題を改善できるのかも不明です。問題は、バックグラウンドで画像を読み込ませる前から、この問題が発生していたことです。

↑どうやら深刻な問題のようです。バックグラウンドで読み込みしないページでも、画像取得に失敗しています。まるで、同時接続数に制限がある OS 付属の無料 IIS を利用しているような現象です。10 枚に満たない写真のページでこれが繰り返されるため、FC2 の無料ホームページサービスは実用性に乏しいと思われます（テキストのみで構成するなら問題ありません）。

今まで、自宅サーバーで好き勝手やってきたので、無料サーバーはテスト程度しか使ったことがありませんでした。有料版にアップグレードしても、容量の問題と広告の有無が改善されるだけで、サーバーの性能に関する事に触れられていません。つまり、他社の有料レンタルサーバーに変更するしかなさそうです。

その後、バックグラウンドで画像を読み込むのを廃止して、画像が読み込み中であることが少し分かる仕様に変更しました。もちろん、問題は解決しないため、CSS Spriteを使うことになりました。

つまり、個々の画像をダウンロードさせるのではなく、1 枚にまとめてダウンロードさせ、CSSで background-position を指定する方法です。

カテゴリーページに掲載する商品写真も一枚にまとめました。

これにより、画像が取得出来ない状況を低減させることに成功しました。しかし、本音を言えば CSS Sprite を使いたくありません。結局、ノーマルが一番便利なのです。追加することなのない、完結したホームページを公開するならともかく、商品の追加や移動が必要なショッピングサイトには不向きです。しかし、サーバーの性能を考慮して、使わざるを得ない状況です。

Tweet