• 0k
  • 0
ウェブデザイン \ 2016年3月29日

Wixサイトで使える優れたWebデザインアイディア

個性豊かでバラエティーにとんだWebデザイン。いくつもある選択肢の中からアイディアを組み合わせることで、数えきれないほど美しいホームページが誕生しています。

無料ホームページ作成ツールを提供している Wix では毎日、ユーザーが作成した何千ものサイトを拝見し、そのデザインに感動しています。今回は、中でも美しいWixサイトを紹介しつつ、そのデザインアイディアを自分のホームページに取り入れる方法をお伝えしたいと思います。

優れたWebデザインアイディア

カッコイイ画像と楽しい文章の組み合わせ

ハッとするほど素敵な画像と、わくわくするようなキャッチコピーが揃ったホームページは、芸術ともいえるほど。例えば、Butcher & Sons のホームページを見てみてください。見た目にも美しい写真や、テキストと画像のバランスの取れたデザインの美しさに、一見スペイン語のサイトということすら気が付かないかないほど。その出来栄えは、菜食主義者でさえも、ハンバーガーに唾をのんでしまうほど。

カッコイイ画像と楽しい文章の組み合わせ

■実践方法
Wixエディタを使い、画像、ボックス、色を組み合わせることで、あなたもこのデザインを実現できます。軽めでふわっとしたレイアウトだけでなく、ガツンとくる刺激的なデザインにもトライしてみてはどうでしょう?

このデザインが気に入った方は、こちらのテンプレートを使ってみてください!

固定ヘッダーで完璧なウェブサイトを

サイト訪問者にページをスクロールダウンしてほしい反面、メニューを常に表示して、ページ間を移動しやすくしたい、というジレンマに陥ったことはありませんか? 最善の解決策としては、サイトのヘッダーを固定する方法です。

女性向けアプリやwebサービスの開発・運営を行っているパペルック株式会社のWixサイトは、固定ヘッダーを取り入れた良い例です。どのページでもヘッダーを固定しており、メニューが常に目に入り、訪問者にとって使いやすいデザインになっています。

固定ヘッダーを使ったホームページ

■実践方法
固定ヘッダーを使う場合に、守っておきたいルールとしては、全てのページで表示されるパーツですので、機能的でありつつ、優れたデザインにする必要があります。まずは、固定ヘッダーの上手な使い方をご覧ください。

GIFアニメーションで楽しさをプラス

GIFアニメーションが嫌いな人はいないはず。動きのある要素を追加することで、ホームページのデザインが一段と楽しいものに仕上がります。ただし、正しく使わなければ、単に煩わしいものになってしまいます。

Jaxx は ロゴにGIFを上手に利用し、訪問者にサイト、そして自分のことを印象づけることに成功しています。

GIFアニメーションを使ったホームページ

■実践方法
GIF アニメーションは、画像と同じように追加することができます。エディタの左側から、追加>画像>「画像をアップロード」ボタンをクリックして、コンピュータから GIF ファイルをアップロードしてください。Wixの推奨する画像ファイルについては、こちらからご確認いただくことができます。

マウスオーバーエフェクトを活用

マウスオーバーエフェクトとは、マウスを乗せると動きや色が変わるインターラクティブなウェブデザインのことです。そんな魅力的なエフェクトを Wixサイトでも実践できるんです! マウスオーバーすると見た目が変わり、訪問者にちょっとしたサプライズをすることができます。

Naomi さんのWixサイトでは、このエフェクトを使って、マウスオーバーすると、白黒の写真に色が宿るという工夫をしています。まずは一度、彼女のサイトを訪れてみてください。その素晴らしさが一目で分かるはずです!

マウスオーバーエフェクトを活用

■実践方法
この機能を使うことで、いろいろなことができます。マウスオーバー効果を自分のサイトに取り入れ、カスタマイズする方法については、こちらのページをご覧ください。

優れたランディングページを作成

一般的に、ランディングページの目的は、「訪問者にページ内の情報を素早く読んでもらい、注文、資料請求、問い合わせなどのコンバージョンを得ること」です。従って、優れたランディングページは、情報が順序良く並んでおり、見た目にも美しいものでなくてはいけません。

例えば、ケチャップブランドHeinz のこのページは、クリアなデザインで、ページの意図がすぐに伝わるデザインになっています。

優れたLP(ランディングページ)を作成

■実践方法
Wixでなら、美しくて、売上にも繋がるランディングページを1時間以内で作成することができます。こちらの記事にコツをまとめていますので、参考にしてみてください。

シンプルかつプロフェッショナルに

迷った時は、シンプルにするのが一番。多すぎる文字や画像、バナーなどが詰め込まれた、うるさいデザインのホームページは、見た人を混乱させてしまいます。

例えば、きれいでスッキリしたレイアウトの株式会社 ボタンデザインさんのホームページは、伝えたいメッセージをとても分かりやすく表現しています。

シンプル、新鮮かつプロフェッショナルに

■実践方法
まず、サイトにどんな情報が必要かを考えましょう。コツはコンテンツを必要最小限にとどめること。情報が多過ぎると、閲覧者が最も大切な情報を見過ごしてしまう可能性が大きくなります。まずは、スッキリした状態からスタートしてみてください。

オンラインビジネスをはじめる準備はできましたか?Wixで無料ホームページを作成しましょう


今すぐ Wixブログ を
無料購読しよう!

Wixブログを購読しよう 役立つ情報をいち早くゲット!

正しいメールアドレスを
入力して下さい

正しいメールアドレスを
入力して下さい Email already exists

正しいメールアドレスを
入力して下さい Invalid email

Wixブログを購読 \ 

WebデザインやWix新機能についての
最新情報を無料でお届けします!

正しいメールアドレスを
入力して下さい

正しいメールアドレスを
入力して下さい Email already exists

正しいメールアドレスを
入力して下さい Invalid email