最近「jQuery」という、なんと読むか分かりにくい言葉をよく目にする人も多いのではないでしょうか? 動的な表現ができるこのjQuery(じぇいくえりー)、たとえば、フンワリと表示されるメニューや、ジワジワと切り替わる写真スライドショー、アニメーションする背景などを表現するのにも使われています。これらの動きは、BiNDクラウドならば簡単に取り入れられます。
jQueryはJavaScriptという最も有名なWeb言語で作ったブログラムを、Webデザイナーやプログラマーがすぐに使えるように小分けに分類してあるプログラム集です(使いやすくセットしてあるものを「ライブラリ」と呼びます)。
jQueryは、とくにアニメーションやリアルタイムのインタラクティブ操作ができるプログラムがたくさん用意されていて、インタラクティブないまどきのWebサイトには欠かせない技術です。
jQueryでユーザー体験・サイトの印象をアップ!
jQueryを使ったサイトでは、マウスオーバーに対して「シャキッ」「ふんわり」などさまざまなイメージでメニューを表示したり、画面をスクロールさせることができます。また、スクロールに応じて画面に変化を加えるなどもできます。こういった効果は「なんかカッコいいサイトだな」と見た目の印象をよくするだけではありません。
マウスの動きによって、色が変わったり画像が大きくなったり、コンテンツが動きに合わせて反応すると、「使いやすい」「もっと見たい」と思われるサイトになります。つまり、見ている人のストレスをなくし、心地よく見せるということは、再び見に来て貰うための「おもてなし」になるのです。
直感的に使っていて気持ちのいい動きというのがあります。jQueryでそういった動きをサイトに取り入れることができます。サイト内で多数の写真などを小気味よく見せたいときのスライドショーなどがいい例です。
▼下記、BiNDクラウドのスライドショー作成機能「SHiFT」より。
インデックスシート:多数のサムネイル画像を見せることができるスライドショー。一気に見れるので画像の数が多くてもストレスを感じさせません。
また、ダイナミックな動きでアーティスティックなサイトにしたい場合は、「Parallax」「Ken Burns」などの動きを取り入れるのもおすすめです。
▼BiNDクラウドで作れるナビゲーションメニュー
マウスオーバーで動くメニューは、階層が深いページへもダイレクトに導線できます。
▼マウスオーバーで切り替わるタブ機能。限られたエリアに多くの情報を載せられます。コンテンツ量が多くてもページを移動させず見せられるので、無駄な離脱を防げます。
jQueryの表示動作は、モダンブラウザと呼ばれる幅広い環境で美しい再生やインタラクティブ性が保証されます。さらにはモバイルデバイスでも再生が可能です(モバイルデバイスではマウスオーバーは、タップになります)。iPhoneやAndroidなどの閲覧者が増えるいま、個別に対応しなくても済むのはうれしいですね!
BiNDならば、写真と文字を入れるだけの操作で、これらのjQueryのアニメーションが作成できます。
BiNDクラウドは初年度無料から。一度試してみませんか?
POINT
- jQueryは、Webに動きを加えたり、インタラクティブな効果を加えるためのプログラムのライブラリ
- 見た目におしゃれなだけでなく、Webサイトの使い勝手を向上するためのプログラムもある
- BiNDクラウドでは、最新のjQueryライブラリを利用したスライドショーやメニューが簡単に使える