JQuery | logostration blog-ロゴストレーター／フルショウシンゴのブログ

ロゴスタのご注文フォームが新しくなりました。

今回の変更で「より安全に」「より分かりやすく」「より美しく」なりました。

そもそもご注文フォームを独自のものに変えようと思ったのは、独自SSL（データを暗号化通信するサーバ証明書）を導入しようと思ったからでした。これでお客様にはより安全にお申し込みいただけます（以前は共用SSL）。

そして何より他社のレンタルフォームだった為、自由がきかない部分も多く、ロゴスタHPとのデザインの親和性が図りづらい面がありました。つまり「美しくない」。

「美しくない」ものはお客様にとって「分かりづらい」ものです。
色々と探しましたが中々思うようなレンタルフォームは見つからない。
こうなったら自分で作るしかない・・・と思って制作を始めました。

本当は今年の1月には公開する予定だったのですが、忙しくて時間が思う様に取れず、毎日少しずつ、CGIは素人ながらも何とか完成させる事ができました。完成ついでに表示の仕方もLitebox風に表示されるJQueryを実装させるなど凝ってみました。うん、理想的。
多分分かりやすくなったと思うのですが…いかがでしょう？

ロゴスタHP左サイドの「ご注文フォーム」をクリック！→http://www.logosta.com

先日の記事で「ロゴ作成例」のギャラリーを「Jquery」というJavascriptライブラリを使って閲覧しやすいものにした、と書きました。
記事→「サムネイル画像にマウスをのせると別の場所で拡大」

今回トップページの新着ニュースティッカーを以前の文字が右から左へ流れるものから、上から下へスライドして切り替わるものへ変更しました。そこで使用したのが「mootools」です。

「mootools」も「Jquery」同様、軽くて動きが速いJavascriptライブラリのひとつです。
中級〜上級者を対象にしている事、日本語サイトがなく情報が少ない事などからあまり馴染みがありませんが、実装してみるとその動きにはうっとりしてしまうでしょう。

もちろん私はプログラマではありませんから、基本的な仕組みを作ったのは別の方です ^^;

以下のサイトを参考にしていますので興味のある方は覗いてみてください。

SolidStateEveryday

…という動きをする仕組みに「ロゴ作成例」のページをリニューアルしました。

ロゴ作成例はこちらから

今回Javascriptとjqueryを使用して動きのあるギャラリーにしています。
このサムネイル画像が動く仕組みはGoogleの画像検索でおなじみの動きですね。別の場所に拡大（私の場合は全く別画像）を表示する、導入が簡単な仕組みをずっと探していてやっと見つけたので一気に作っちゃいました。興味がある方はソースをご覧ください。

作成例が増えるにしたがってズラッとサムネイル画像を並べるのはお客様にとって閲覧しにくいのではないかと。
私個人的にも他のサイトで縦に縦にスクロールしなくてはいけないページは好きではないので、これですっきりしたかなと思います。

今回は時間がなかったのですが、次回のリニューアルでは業種別に分けて更に閲覧しやすくしたいなー…と思っています。今月末は新しいヒアリングページの公開も予定していますので乞うご期待！

jQueryのタグを付けられた記事一覧 | logostration blog-ロゴストレーター／フルショウシンゴのブログ

安全で分かりやすく、美しい申し込みフォームに変身

関連記事

タグ

今度は「mootools」で新着ニュースティッカーを作ってみた

関連記事

タグ

サムネイル画像にマウスをのせると別の場所で拡大

関連記事

タグ

お名前
アドレス