2011年に登場したパララックス効果は、ウェブデザインのトレンドと融合した。 ウェブデザインのトレンド.その後、新たなトレンドが生まれ、また消えていったが、パララックスエフェクトはそのままでなく、ウェブデザインの基本的な要素になった。 ウェブデザイン.
ウェブサイトを ウェブページを作成するパララックス効果は、ナビゲーション体験にダイナミックさを加える優れた方法です。この記事では、パララックス効果とはどのようなものなのか、またその例を紹介します。
1.視差効果とは何か？
視差効果（パララージュとも呼ばれる）は、そのオブジェクトにあるイメージやテクスチャが、そのサイトの他の部分よりも大きく移動する視覚的効果です。このため、透明なオブジェクトは、他のオブジェクトや遠くのオブジェクトとの相対的な位置関係が変化する。
このテクニックは、光学的な錯覚に基づくものである。その結果、私たちは、より遠くにあるものが、より近くにあるものよりも、よりレンズのように見えるという感覚を得る。
視差効果は、リアルな効果を得るために、さまざまな媒体で多くの時間を費やしてきた。その最初の用途は、ブランカニベスやディズニー・スタジオの3つのアニメーションなど、伝統的なアニメーションを思い起こさせるが、スーパーマリオのようなビデオゲームでも使われている。CSSとHTMLの発展により、パララックス効果は今やウェブデザインの世界を完全に征服している。続きは、5つの ウェブページの例をご覧ください。
2.視差効果の例
大村ノーラン
大村ノーランハワイ在住のフォトグラファーで、写真と潜水ビデオのスペシャリスト。彼の独創的な視差効果により、冒頭のシンプルなページデザインに深みと動きが加わっている。
ページを大きく分割することで、このサイトを訪れた人々は、ページに広がる水中世界の素晴らしいイメージを目にすることができる。このような画像は、視差の効果を利用し、また散乱の効果を明らかにすることで、一枚一枚が静かに重なり合っている。
インダストリアル
ジュエリーデザイナーのウェブサイト ヒラ・ラウェット・カルニは、パララックス効果を利用して、さまざまな要素で構成された魅力的なデザインを作り出しています。画像とテキストを重ね合わせ、緩急のある画像を組み合わせることで、このウェブサイトは常に変化し、変化しながら新たなコンポジションを形成している。
フランキー・ラトフォード
デジタル・デザイナーの個人ページ フランキー・ラトフォードは、色彩と輝きとエネルギーに満ちている。 ページの上部中央には、視差効果で動くさまざまなフォンドがあり、フランキーは常に無表情でいる。この写真の後ろには、フランキー・フランキーの名前が上方に向かって小さく表示され、その後に、フランキー・フランキーの簡単な略歴が続き、フランキー・フランキーの名前が繰り返される。ウェブ・ページの残りの部分では、パララックス効果を他の情報セクションでも使用しています。
ハナ・クニゾワ
ロンドンのフォトグラファー、 ハナ・クニゾヴァ自身の 写真ページ写真、モード、ソーシャル・フォトグラフィなど、それぞれの専門分野の写真を紹介している。写真はパララックス効果により、次々と切り替わります。さらに、画像はページのメニューと同じように複製され、画像が別のページにつながる特殊な内部ナビゲーションシステムを作り出します。
3.Wixサイトに視差効果を適用する方法
パララックス効果をウェブページで有効にするために、Wixは画像、色、または近接ビデオを使ったフレームを使用しています。様々なフレームを組み合わせることで、パララックス効果がさらに高まります。
エディタで'要素を追加'をクリックし、次に'カテゴリ'をクリックしてください。枠の色、画像、動画を変更するには、'枠の色'をクリックしてください。文字色の変更'.
メニューの設定で、'をクリックします。積算除算効果'をクリックし、必要な効果を選択します：'パララックス'.
モード'で効果を確認する前'.
もう一つの選択肢は、どちらかを選ぶことだ。 ウェブプラントパララックス効果をデザインに組み込んで、あなたのニーズに合わせることもできます。例えば、ページがずれるほど色が薄くなり、エスニックなグラフィックが施されたこのデザインは、ソフィスティケートされた印象を与えます。