レスポンシブでアニメーションも美しいWordPressテーマ11選
フラットデザイン、シングルページ、フルスクリーン、パララックス、Retina対応… Webのトレンドを盛り込んだ見応えのあるWordPressテーマを集めてみました。 見栄えのするテーマはデザインやアニメーションの参考にもなりますね。 もちろんどれもレスポンシブ対応。PCでご覧の方はブラウザサイズを変えて変化を確認してみましょう!
レスポンシブなWordPressテーマをあつめてみた
レスポンシブデザインが話題になって久しいですね。
レスポンシブやRetina対応はWordPressテーマでもホットなキーワードです。
ワンソースでレスポンシブがベストな選択かどうかは案件によりけりでしょうが、トレンドはしっかり抑えておきたいところ。
今回あえて有料のものばかりをチョイス。WordPressテーマを探すとき、ついつい無料のやつばっかり探しがちなんですが、こうやって有料のテーマを見るとさすがに見応えありますね。
GE Trends
GE Trends- Responsive Voting WordPress Theme
シャープなアニメーションと美しいレイアウトが目を引く、ファッショナブルなテーマ。アパレル系のサイトなんかに良さそうです。
キービジュアルをスライドさせたときの円形メニューのはけ方も気持ちいい。
Dreamer
Dreamer – Photo & Video Parallax WordPress Theme
長ーいシングルページでパララックス、というのももちろんポイントですが、使われてるフォントのバランス感も絶妙。
モノトーン+オレンジの絞り込んだカラーで、文字のジャンプ率やレイアウトで魅せていくやり方は真似したいところ。
Realnews
Realnews – Stylish and Responsive Magazine Theme
モノクロベースの、ニュースペーパーのようなデザイン。モノクロもWebデザイントレンドのひとつですね。
抑えたカラーと整然としたレイアウトが、知的な雰囲気を出しています。テキストメインの情報系サイトなんかにいいんじゃないでしょうか。
テキストが横にスクロールするやつも、こんなデザインだと株式速報みたいでNEWSな感じがするなーw
OneUp
OneUp – One Page Parallax Retina WordPress Theme
TwitterのBootstrapフレームワーク上に構築されたテーマ。
シングルページでパララックス、美しいデモページという見栄えもさることながら、ドラッグ&ドロップでスピーディにページが作れちゃったりっていう使いやすさも魅力のようです。
ダウンロード上位の人気テーマです。
Salient
Salient – Responsive Multi-Purpose Theme
トップページの横幅いっぱいの動画がインパクト大。(いや、このおじさんがってことじゃなく。)
動画が動きながらのパララックスってあまり見かけないので、とても印象的です。(スマホサイズだとパララックスしないようになってます)
チュートリアル動画やカスタマイズのしやすさもあって、8000近いダウンロード数です。
Raw
RAW – One & Multi Page Multi-Purpose Theme
こちらも動画とパララックスの組み合わせの、シングルページのテーマ。
スクロールしていくと、いろんなところがアニメーションしながら表示されていきます。仕事が細かいな―。
Chroma
Chroma – A Responsive Photography Theme
フルスクリーンが印象的な、写真を見せるのに適したテーマ。
アルバムには自動的に写真にウォーターマークをつける機能も。
Other
Other – Creative Photography WordPress Theme
画像をタイル状に並べる「Masonry」のほか、細長い短冊状に並べる「Vertical」や「Horizontal」などのスタイルが選べ、いずれもグリッドを活かしたレイアウトが美しいテーマ。
画像メインのサイトやポートフォリオなんかに良さそうです。
マウスオーバーのアニメーションも気持ちいい。
Rush
Rush – Multipurpose Creative Responsive Website
「Recent Projects」や「Portfolio」などのページが用意された、ポートフォリオに適したテーマ。
ポートフォリオページはマウスオーバーするとサムネイルがぺろりとめくれたり、ちょっとした仕掛けが楽しい。
Wilder
Wilder – Flat One Page Responsive WordPress Theme
ワンページで、メニューを選択するとページ全体が横にスライドするパターンのテーマ。
中彩度色の色使いが素敵な、モダンなカラーリングです。
こういう、色相差が大きいのにシックにまとめる色使いは、日本のWebサイトではあまり見かけませんね。参考になります。
Concept 1
Concept 1 – Modern and Creative WordPress Theme
Bootstrapのフレームワークで構築されたモダンでクリーンな印象のテーマ。
シンプルなフラットデザインですが、一見単色に見える背景もよく見るとざらっとした質感のテクスチャを使っていたり、控えめなストライプやシャドウをうまく使っていたりするのは、取り入れたい小ワザです。
まとめ
いかがでしたでしょうか?
こうやって見てみると、フルスクリーンで写真を使って、キャッチコピーや見出しをセンター揃え、というのが多くなってる印象です。
デバイスサイズがいろいろになって、センタリングのレイアウトがいろんなデバイスに対応しやすい、っていうのがあるのかもしれません。
Webフォントが当たり前になっているのも海外ならでは。日本語ももっとWebフォントが使いやすくなるといいですよね。
今回ご紹介したテーマはいずれも themeforest で購入可能ですが、 themeforest を覗いてみるだけでもずいぶん刺激になりました。
いずれも$50前後で、思ったより安いんですねー。
がんばって themeforest で自作のテーマを販売する、なんていうのもアリかもしれませんね。