TCDのWordPressテーマ「AVALON」を導入しているサイトを探してみました。
公式デモサイト以外で、AVALONがどう使われているかを見ておくのも参考になると思いますよ。
AVALONは、フル画面の画像が大きくスライドするのが特徴のテーマです。
商品を大きく表示したいサイトに向いています。AVALONはバーやレストランをイメージしていますが、それ以外のサイトでも数多く使用されています。
ただし、フルサイズの画像の上に文字を表示することになるので、画像と文字を上手く扱わないと見にくくなります。いろいろなサイトを見ると、画像で文字が読みにくいことがありました。工夫が必要ですね。
では、公式デモサイトと、一般の導入サイトを見ていきたいと思います。
★おすすめテーマはこちら↓ WordPressのおすすめテーマベスト３を選びました＞＞
公式サイトでテーマの使い方を確認
公式デモサイトでは、大人のバーをイメージしたサイトになっています。
暗い画像を使用して、その上の白い文字を浮かび上がらせています。その白文字も、フェードしたり、移動したりして印象的な現れ方をします。
WordPressテーマの中で、バーをイメージするテーマはなかなかありません。
AVALONは、黒背景に白文字を鮮やかに表示するのが美しいので、黒背景とバーのイメージがちょうど合ったんでしょうね。
このテーマは、フェードして現れる白文字の表示が美しいと思います。
AVALONの使用サイト事例
AVALONといえば、トップページのフルサイズ画像です。その画像の上の文字の表示の仕方が２通りあります。
一つ目は、画像を少し暗くして白文字を浮かび上がらせる方法。二つめは、画像の明るさはそのままで黒文字を表示する方法です。
公式デモサイトは、少し暗めの画像に、さらに黒の透明を重ねているかもしれませんね。それで白文字を印象づけていますね。
では、AVALONのテーマ使用サイトを見ていきましょう。
※キャプチャー画像とリンク先サイトのデザインが違う場合は、テーマが変わった可能性があるのでご注意ください。
フラワーショップ
出典：花たま
花たま様のサイトはこちらです。
花屋さんのサイトです。花は大きな画像で表示したいですよね。
画像を半透明の黒で暗くして、その上に白文字を浮かび上がらせています。これはデモサイトと同じ使い方ですね。
花は半透明の黒によって彩度が落ちますが、その分、文字が美しく表示されています。
花は彩度は落ちたとは言え、美しさは充分に伝わってきますので、こういう使い方もいいと思います。クリックすれば、色鮮やかな記事に移動しますしね。
レストラン
出典：憩家
憩家様のサイトはこちらです。
本格鉄板焼きステーキのサイトです。料理も大きな画像で表示すると美味しそうですね！
デモサイトと同様に、半透明の黒で暗くしています。AVALONは、バーがテーマに合うのは分かっていましたが、レストランも合いますね。
やっぱり、「少し暗くしておいて、白文字を浮かび上がらせる」という手法が、料理の高級感を出していると思います。
病院
出典：重清内科外科
重清内科外科様のサイトはこちらです。
病院のサイトです。画像を暗くせずに使用しています。
こちらのサイト様のように、背景が白衣のようにシンプルなら、白文字に影を付けることによって見やすくさせる方法もあります。
色がたくさんあったり、ごちゃごちゃしている背景だと、影をつけても文字は見にくくなります。
そういえば、クリックするボタンだけ色を変えられるんですね。
ヘアサロン
出典：Hair Salon Milial
Hair Salon Milial様のサイトはこちらです。
ヘアーサロンのサイトです。画像を暗くせずに使用しています。
こうした使い方の場合、人物と文字が重なると見にくくなってしまいます。こちらのサイト様は、人物を左に配置して右側に余白を作り、そこに文字を配置しています。
こういう使い方をすれば、画像を明るいまま、文字も見やすいトップページにすることができます。
ヘアーサロンやネイルサロンでこのテーマを考えている方は、こういう使い方も良いのではないでしょうか。
また、ほとんどのサイトでは、フルサイズ画像を何枚か使用していましたが、こちらのサイト様のように「コンセプト」や「ブログ」のようなコンテンツを配置するのもいいですね。
WordPressテーマAVALONのまとめ
AVALONは工夫すれば、いろいろなサイトに使用することができます。迫力のフルサイズ画像を使用したサイトを作りたい方にお勧めです。
注意が必要なのは、トップ画面の文字が見にくいサイトになってしまわないか、という点ですね。
いろいろなサイトを見た感じからすると、少し暗くして文字を目立たせる方がこのテーマには合っていると感じました。
また、暗くするのは半透明の黒だけでなく、他の色も使うことができます。半透明の緑色や青色を使っているサイトもありました。
自分のサイトに合うカラーを使うのもいいと思います。
★飲食のテーマはこちらもどうぞ↓
Tree（カフェやレストラン）
HAKU（日本酒やお茶などのブランド構築に）
TOKI（寿司や天ぷらなどの伝統料理に）
DIVA（バーなどの夜のお店）
Switch（カフェやレストランなど）
KADAN（和風レストランなど）
TENJIKU（料理のギャラリーを使いたい時に）
この記事へのコメントはありません。