ホームページ制作、HP作成の大阪キューブ

こんにちは！
新人平田のWeb用語紹介です(＾０＾)

前回は、Webサイトの中でもトップページの構造について説明しました！

今回は、webサイトのデザインにおける
機能や効果に目を向けていきたいと思います。

●ロールオーバー

画像にポインターを乗せると、色が変わったり、
画像が変わったりすることがありますよね！

これをロールオーバーと呼びます。

この機能によって、画面に動きが出るので
ユーザーの興味を引くことができます。

キューブのWebサイトのグローバルメニューに
ポインターを乗せてみてください！

https://cubecube.net/

アイコンや文字の色が少し変わるようになっています。

●アコーディオン方式

こちらは、

webページにおいて、表示しきれない大量のコンテンツを非表示で並べ、
メニュー部分をクリックするなどして、必要な部分を表示、他を非表示させるような仕組みを指します。

（株式会社コニファのマメ知識より引用
http://www.conifer.jp/coni_mame365.html）

アコーディオンを思い出してください！

あんな風に、必要なときにはビヨーンと伸びる機能になっています。

例えばこのように、メニューの「商品情報」をクリックすると
詳しいカテゴリが表示されたりします。

スマートフォンサイトのように情報量をしぼらないといけないときなど、
アコーディオン方式を用いれば、ユーザーが欲しい情報だけさらに詳しく見せることができます。

●パララックス効果

なかなか聞きなれない言葉ですね！

Webデザインにおけるパララックスは、スクロールといった動作に応じて、
複数のレイヤー（層）にある視覚要素を異なるスピードで動かすことで視差を生み出し、
立体感・奥行きを演出する手法のことを指します。

（MICROWAVE　2013/12/02「パララックス」をはじめとする「スクロールエフェクト」の魅力とは
より引用　http://www.micro-wave.net/column/technology/parallax.php）

説明だけ聞いてもかっこいいですね（笑）
こちらのWebサイトを見てみましょう！

http://www.bagigia.com/

スクロールしていくと、これまでのWebサイトとは全く違う感覚ですよね！
ページを降りていく感覚がないなと思っていると横にスクロールしてみたり･･･

このWebサイトもパララックス効果を使っています。

http://www.muji.com/jp/airpurifier/

このように、遊び心のあるWebサイトはついつい見てしまいます！
ユーザーの滞在時間をのばすのに効果的です。

以上今回は、

【ロールオーバー、アコーディオン方式、パララックス効果】

の３語のご紹介でした（＾＾）