マウススクロールによる効果色々

webサイト上でのスクロールによる効果の呼び方をすぐ忘れるので、自分用にメモ。

パララックス

スクロール時に複数の要素が異なるスピードで動くことで、視差効果（奥行きや立体感）を感じさせる効果。

この効果自体がページを読みづらくさせてしまうので、適切な余白が必要不可欠になります（パララックス効果のメリハリとしても必要）

そのため、ページに掲載する要素をかなり絞り込む必要があります。

読ませる要素がぎっしり入ったページに使うのにはお勧めしません。

スクロールスナップ

スクロールすると1画面ごとにパキっと切り替わる効果。

パララックスで中途半端なスクロール状態で表示させないために、この効果と複合させているサイトが多いです。

画面の縦横比に関係なく1画面ずつスクロールしてしまうため、両方の状態でレイアウトが崩れないように、1画面の掲載要素は少なめにしておく必要があります。

スクロールコントロールを閲覧者から奪ってしまうので、ユーザビリティの面からは否定意見もある効果です。

スクロールエフェクト

要素が画面内に入ったらフェードインやスライドインしてくる効果。

サイト下部に動きがあると、続きを見たくなる人間の心理を利用したエフェクトです。

あまり過剰にエフェクトをかけると読みづらくなるので、控えめに効果をかけるのがコツ。
パララックスもスクロールエフェクトの1種なので

何かスクロール時に効果が欲しい場合は「スクロールエフェクト」

視差効果が欲しい時は「パララックス」

と指定すると良いと思います。