2006/12/28 木曜日

擬似「進行状況バー」

Filed under: 日記, ネットショップ「綺麗印影」 — 番頭 @ 18:32:31

商品ページから「この商品の購入を検討する」ボタンを押すと、ZenCartの商品ページへと飛びます。ここで約1分。セット商品などオプションが多い商品は3分以上の読み込み時間がかかります。

読み込み中の間は画面は全く変わらず、いつ開くかわからない… といった状況はかなりストレスが溜まります。

もちろん、読み込み時間を短縮することが最善なのですが、それはすぐに出来そうにないため、苦肉の策を施しました。

 

ZenCart商品ページ読み込み中の間、進行状況を示すアニメーションバーを作成いたしました

と言っても進行状況と完全に連動してアニメーションさせることは不可能なので、あらかじめ読み込み時間を測定しておき、その時間よりやや長い時間でバーが右端にたどり着くように設定しております。

 

ちなみにこれも作成にかなり時間を掛けました。 

アニメーションバーを作成する方法として、gifアニメやFLASHが考えられました。
しかし、前者は滑らかなアニメーションにすることが不可能に近いですし、後者はインストールされていないPCでは見ることが出来ない(いまどきインターネットを見る人の大半がFLASHインストール済みでしょうが、弊店のターゲットには年配の方がおられるため、無視できないと思いました)と言う欠点があります。

そのため、javascriptというプログラムを用いて対処いたしました。javascriptは現在ほとんどのPCに標準で組み込まれているため、何も知らない人でも高い確立で見ることが出来ると判断したのです。

ちなみに、最初はjavascriptで一定時間ごとにバーの幅を長くするプログラムを作ろうと下のですが、仕様上それが無理であることがわかったため、仕方なく幅1ドットのバーを一定時間ごとに挿入し続けると言う方法で解決いたしました。 

 

他にも色々対策は考えてあったのですが、今年で来たのはここまででした。

不完全なままの締めくくりとなったのは残念ですが、来年こそショップをオープンさせたいと思っております!

ようやく

Filed under: 日記, ネットショップ「綺麗印影」 — 番頭 @ 17:56:10

前回の記事「ピンチ!」から20日以上も経過してしまいました。

なんとかピンチに対処すべく、ない頭を絞って大きく2つの対策を施しました。

そのうちの一つが左の画像です。商品紹介ページを新たに作成しました

 

何故新たに商品紹介ページを作成したのか? ですが…

これまで商品の紹介は、ショッピングカートシステムであるZenCartに組み込んでいたのですが、当ショップではかなり複雑なシステム構成にしてしまったため、ZenCart内でのページ移動はとても時間がかかります。

商品を色々見ようと違うページを開こうとするたびに何十秒と待たされるのはこの上ないストレスです。

そのため、新たに高速で開けるまったく別の商品ページを作り、ストレスなく商品を見ていただくように変更しようと考えたのです。

左のページニ移動していただくとわかりますが、URLの最後に「hanko_no=1」とあります。この数字を1~60まで変化させることで、個人印全タイプの紹介を見ることが出来ます。
(本来は各商品へのリンクを作るべきなのですが、間に合いませんでした…)

60ページ全てをチェックしたわけではないのですが、調べたところ各ページを開くまでの時間は5秒以内のようです。そのため、手軽に商品選びをしていただけます。

このページは、商品によって画像の枚数を変えたり、オプションの内容を変更するなど、細かい仕様が施されております。プロのプログラマからすれば朝飯前の内容でしょうが、プログラムを勉強して数ヶ月のド素人が「何とかなるだろう」と思ってやり始めたので、かなり大変でした。

 

ちなみに、「この商品の購入を検討する」ボタンを押すと、ZenCart内の商品ページに飛ぶので、ページが変わるのに時間がかかります。

これについて、もう一つの対策を施しております。
その内容については、次回お話します。(クリックすればすぐにわかりますけどね)

次のページ »

HTML convert time: 1.372 sec. Powered by WordPress ME