こんにちは！ブログ運営半年で月20万超の元サラリーマンブロガーなつです。
かつてはPCが主流でしたが、スマホが一般的になってきて、スマホでからブログを訪れるユーザーも増えてきました。
ちょっとした時間つぶしにスマホで見るトレンドブログなどはもっとスマホからの訪問が多いと思いますし今後も増えていくでしょう。
そこで、スマホの画面でもWordpressブログが綺麗に見える「レスポンシブデザイン」が充実しているテーマをお伝えしていきます。
もくじ
- 1 ワードプレステーマのレスポンシブ対応とは。
- 2 スマホ画面が綺麗に見えるワードプレステーマ例
- 3 スマホのデザインが綺麗なもの一覧 【ブログ用Wordpressテーマ】
- 4 【スマホ画面】綺麗なWordpressテーマ 1. THE THOR
- 5 【スマホ画面】綺麗なWordpressテーマ 2. AFFINGER6（ACTION）
- 6 【スマホ画面】綺麗なWordpressテーマ 3. Diver
- 7 【スマホ画面】綺麗なWordpressテーマ 4. STORK１９
- 8 【スマホ画面】綺麗なWordpressテーマ 5. SANGO（サンゴ）
- 9 【スマホ画面】綺麗なWordpressテーマ 6. Cocoon
- 10 【スマホ画面】綺麗なWordpressテーマ 7. Chill（TCD）
- 11 【スマホ画面】綺麗なWordpressテーマ 8. Hestia
- 12 【スマホ画面】綺麗なWordpressテーマ 9. 賢威 8
- 13 【スマホ画面】綺麗なWordpressテーマ 10. Astra
- 14 【スマホ画面】綺麗なWordpressテーマ 11. Sydney
- 15 【まとめ】スマホ画面が綺麗なおすすめのWordpressテーマ
- 16 初心者だからこそWordpress有料テーマ を使うべき理由
ワードプレステーマのレスポンシブ対応とは。
レスポンシブデザインってよく耳にしますが、具体的にどんなものがレスポンシブデザインなのでしょうか。
スマホ・タブレット・PC画面とそれぞれ画面が異なりますが、この大きさも使い方も違った画面にそれぞれサイトを最適化して表示することです。
それまでは、PCの画面はPC用の作業、モバイルはモバイル用の作業と分けられていたのが、レスポンシブで1つの作業でそれぞれの画面に変えて表示することができるということです。
グーグルでも推奨されていますので、これからのブログ造りには必須となります。
スマホ画面が綺麗に見えるワードプレステーマ例
ブログ作りの時に、どんな見え方になるのか気にしながら設定をしていきます。PCの画面で綺麗にできていても、スマホで自分のサイトを見ると形式が崩れてしまうとユーザーも見てくれなくなります。
PC画面とスマホ画面は大きさが違うので、デザインの構成が変わりますが、それを見やすくしてくれる機能は必要です。
例として、PCの画面のデザインを整えると何もしなくてもスマホ画面が以下のようになります。
レスポンシブと言ってもピンキリですが、最近は無料も有料もスマホを意識してとても綺麗なデザインになるように工夫されています。
ブログの訪問者もスマホからの流入が多く、レスポンシブデザインは絶対に押さえないといけない機能となりました。Wordpressテーマも今では、スマホのレスポンシブ画面の充実は必須となりつつあります。
スマホのデザインが綺麗なもの一覧 【ブログ用Wordpressテーマ】
レスポンシブ対応がどんな感じかわかったところで、スマホ画面もきれいに構成されるワードプレステーマをお伝えしていきます。
（使いやすさや見栄えの良さなど比較してランキングしています。）
ここからは、それぞれのPC画面とスマホ画面がどんな感じになるのか調査してみました。ブラウザなどによっては見え方が若干違いがあるかもしれませんのでご了承ください。
メニュー部分などはパソコンでわかりづらい部分もありますが大まかな雰囲気で確認していただければと思います。
【スマホ画面】綺麗なWordpressテーマ 1. THE THOR
SEO対策を重視される方に最適なWordpressテーマがTHE THOR（ザ・トール）です。発売以来、かなり売れている大人気のテンプレートです。
無料ブログLIONBLOGからの有料化なので、LIONBLOGでの長年のノウハウがギュっとつまっています。
販売会社：フィット株式会社
- 完璧なSEO対策
- 高機能でプラグインほとんど不要
- 高速・上位表示の対策
- 着せ替え機能
- AMP・PWA対応
- ヘッダーに動画・スライダー・静止画が選べる
- お知らせヘッダー
- 注目キーワード表示可能
- 画像にメッシュなど重ねることができる。
- 1～2カラム
- サポート・会員フォーラム
- ランキング
THE THOR（ザ・トール）には、54個の特徴があります。とてもこだわりの強いテーマですし、表示速度にもこだわりがあり、感想の中には短期間で上位表示されたなどの声もあります。
実際私のブログに使っていますが、デザイナーによってつくられた着せ替えデザインは使い勝手がとても良いです。
THE THORのPC画面
THE THOR（ザ・トール）ではデザイン違いのテンプレートが用意されています。上級者はカスタマイズをして凝ったデザインにできますし、初心者はワンクリックの着せ替え機能でプロのようなデザインを作れます。
THE THORのスマホ画面
スマホ画面も写真とラインの色が都会的でおしゃれです。TCDのChillはかわいくて印象的ですがザ・トールはシャープで色使いが印象的です。
アレンジしたレスポンシブ画像
THE THORの場合には、設定した画像がとてもきれいに見えるという利点があります。ヘッダー画像も動画、スライダーなど自由に設定ができます。
↓ 当ブログからWordpressテーマTHE THORを購入くださった方に特典をプレゼントしています。
【スマホ画面】綺麗なWordpressテーマ 2. AFFINGER6（ACTION）
ACTION（AFFINGER6）とは、無料テーマのSTINGERやAFFINGER5（WING）をパワーアップさせたWordpressテーマです。2021年にAFFINGER5からAFFINGER6に変更されました。
機能的には大きく変更はないのですが、デザイン面とグーテンベルク対応が変わっています。元々デザイン面ではかなり触って変更できるのと、着せ替えがカッコいいものがあるので人気があります。
さらに、ブログとアフィリエイトで効率よく収益に繋げるための工夫があります。
販売会社：株式会社オンスピード
- 独自のデザイン補助パーツが豊富
- 口コミパーツ
- AMP対応
- コピー禁止機能
- 広告設置機能
- ランキング作成機能
- 豊富なスライダー
ACTIONもまた、無料テーマからの有料化です。レイアウト自体は普通と変わりませんが、パーツや追加機能がよくできていて、ブロガーが欲しいな～と思う機能が備わっています。
AFFINGERのPC画面
AFFINGERの機能を使って作られた「かわいい系」のサンプル画像です。人気の記事のサムネイルを見てみてください。
ポラロイド写真風にアレンジが自分でできます。さらにその上にセロテープで貼ったような加工もワンクリックでできるようになっています。（サイドバーに丸のサムネイルを作ることも可能）
出典：AFFINGER
AFFINGERのスマホ画面
シンプルですが、色合いの可愛いデザインです。バックの木目やタブの色などがホッコリする雰囲気なので、滞在率も上がると思います。
出典：AFFINGER
例えば、TCDなどでもサムネイルを丸にしたデザインがありますが、AFFINGERでは操作次第でそういった加工もできます。
↓ 当ブログからWordpressテーマAFFINGER6を購入くださった方に特典をプレゼント！
記事を取得できませんでした。記事IDをご確認ください。
【スマホ画面】綺麗なWordpressテーマ 3. Diver
Diverの特徴は、基本のSEO対策や機能に加えて初心者向けの入力補助機能や記事に使える細やかな配慮などが光るWordpressテーマです。私も使っていますが、とにかく記事装飾やブログヘッダー作成などがサクサクできるのでペラサイトにも最適です。
- アイキャッチにYoutube動画が可能
- 入力補助機能
- SEO対策
- 動くマーカー
- 独自タブ
- 画面レイアウトが豊富
- ランキング作成機能
- トグル
DiverのPC画像
タブが多く、整理されているので記事が多くなってきてもこのテーマなら美しく配置できます。派手ではありませんが、コンパクトに綺麗なサイトになります。
出典：Diver
Diverはどのテーマよりも使う人のことを考えたテンプレートです。今のテーマにはほとんど見出しや囲い枠などは装備されていますが、Diverは自分のブログに合わせて「つくる」ことが可能。
Diverのスマホ画面
Diverのスマホの画面も見た感じは華やかですが、作り方はとてもシンプルに出来上がります。ボタンを工夫したりヘッダー画像等も簡単に変更できるので初心者には特におすすめです。
出典：Diver
【スマホ画面】綺麗なWordpressテーマ 4. STORK１９
モバイルファーストというようにカスタマイズを作りこむと忠実にスマホ画面に反映していきます。STORKというWordpressテーマが2019年にSTORK19という名前でリニューアルされています。
新しくなった時に、ブログでは人気の機能、ブログカードが追加されました。
機能的には、THE・THOR（ザ・トール）などよりもかなり少ないですが、その分作業がとても簡単なので初心者には向きます。
販売会社：OPENCAGE
販売金額：11,000円
- ショートコード標準装備
- ランディングページ作成機能
- SNSボタン装備
- ウィジェット機能
- ブログカード
STORK１９のPC画面
ヘッダーの上部、メニューの下にお知らせに誘導する部分がさりげなくあります。印象的なのはヘッダー画像上に誘導ボタンがありURLを指定することにより紹介したいページなどに訪問者を誘導できます。
出典：STORK19
STORK１９のスマホ画面
お知らせ、タイトル、ボタン、スライダーなど忠実にスマホ画面に反映されます。ここには映っていませんが、Androidのスマホ画面では、お知らせの上にメニューボタンが出てきます。
記事を取得できませんでした。記事IDをご確認ください。
【スマホ画面】綺麗なWordpressテーマ 5. SANGO（サンゴ）
サルワカさんが作っているデザイン性に優れたSANGO（サンゴ）。基本の色は水色ですが、赤系、黒系など用意された色番号を設定していけばまた違った雰囲気になります。
販売：サルワカ
販売価格：14,800円
- 100％レスポンシブ
- アニメーション効果
- 内部SEO対策済み
- 30種類以上の見出し
SANGOのPC画面
投稿記事の画面です。元々スッキリした雰囲気がありますが背景を木目に設定するとさらにホンワカしたイメージとなります。
出典：SANGO
SANGOのスマホ画面
スマホ画面の方のバランスも良いですよね。ここではメニューがでてきていませんが、Androidのスマホ画面では設定したメニューが出てきます。
【スマホ画面】綺麗なWordpressテーマ 6. Cocoon
「主役は中身」というだけあってシンプルなのですが、必要なものはきちんとしている無料テーマです。Simplicityの後継版で、シンプルだけれどもできることが多いことや、スキン機能といって「着せ替え」のようなことができます。
- 内部SEO済み
- カスタマイズしやすい
- 完全レスポンシブ
- 無料
- スキン機能
- ランキング作成機能
- 吹き出し機能
CocoonのPC画面
タイトルといいメニューといいかなりシンプルになっています。カスタマイズで背景をつけたので少しメリハリがついています。
出典：Cocoon
Cocoonのスマホ画面
ヘッダー部分が長いので記事部分のみの画像となっています。ヘッダー部分は白地にタイトルとメニューがありますが、PC画面とほぼ同じです。
↓ Cocoonの機能についてこちらの記事が参考になります。
【スマホ画面】綺麗なWordpressテーマ 7. Chill（TCD）
TCDは50種類以上のテーマを作って販売している会社です。Chillはその中でも比較的初期に販売されていたテーマ。
サロン、旅館、神社、医院、フォトグラファー、ブロガーなど
販売会社：デザインプラス
販売価格：Chill 8,980円
- カスタムカラー機能
- スクロール追従型のヘッダーバー
- 広告スペース
- テーマオプションでカスタマイズ
- レスポンシブWeb対応
ChillのPC画面
若干古いテーマですが、ヘッダーやロゴなどを設定するとすごく綺麗ですね。女性向けテンプレートというだけあって画像の隅を微妙にカーブさせて角をとってあります。
出典：TCD
Chillのスマホ画像
グラデーションの2色とその下のグラデーションが美しいのでやっぱり印象的です。使ってみて思うのはホームページのようなので個人ブログよりも何かショップブログのような使い方も良いのではないかと思います。
出典：TCD
Chill（TCD）はとても綺麗なんですが付属パーツがなく、公式から配布される見出しなどのショートコードはモノクロやグレーと地味であまり役にたたないかな・・・と感じます。
なので、もしTCDで自分なりの見出しなどは作らなければいけないので最低限のCSSが使えないといけないですし、見出しはH3からなのでSEO的には不利な部分もあります。
【スマホ画面】綺麗なWordpressテーマ 8. Hestia
WordPressの中から取り出せる無料テーマの中でも人気のあるテンプレートHestia。外国のテーマですが日本語の対応もしています。
- 無料テーマ
- 画像のオーバーレイ
- フロントページが洗練されている
- フォントの変更が可能
- 無料部分は日本語でも対応
- 75ドルでさらに高機能のHestia Proが用意されている。
HestiaのPC画面
ヘッダー部分のパープルが印象的ですが、これはベースになっている色です。
Hestiaのスマホ画面
ヘッダーのど真ん中のタイトルが目立ちます。基本的にはシンプルですので、使いやすいと思います。ただやはり無料テーマだけあって固定バーなどもなく有料との違いがありますね。
【スマホ画面】綺麗なWordpressテーマ 9. 賢威 8
Webライダーという京都の会社が作っているのが賢威です。この賢威というテーマは歴史があり何度もバージョンアップしながら「8」までになっています。
SEO対策を強化し、昔からアフィリエイターに親しまれてきたテーマ。
販売会社：ウェブライダー
販売価格：27,280円（税込）
- レスポンシブWebデザイン
- スライダー
- カスタマイズしやすい
- SEO対策で上位表示しやすい
- 着せ替え機能
賢威のPC画面
賢威では、いろんな職種のために色違いやイメージ違いのデザインが用意されています。それほど多くはありませんが、アフィリエイトなどに適しています。
出典：賢威
賢威のスマホ画面
ヘッダーやSNSボタンがひとめでわかるレイアウト。スッキリしていて読みたい記事にすぐに誘導できるのがポイントです。
【スマホ画面】綺麗なWordpressテーマ 10. Astra
WordPressで用意されている無料テーマで外国の方が作っているテンプレートです。2カラムでもあまりない左側にサイドバーが設置できるのが特徴です。
- レスポンシブ・スマホ対応
- カスタマイザーで初心者も設定しやすい
- カスタムカラー機能
- SEO対策
- 左にサイドバーが設置できる
- 無料
AstraのPC画面
基本部分のみの設定なのでシンプルに見えますがカスタマイズに慣れてくるともう少しデザイン的にも自分好みにできます。
Astraのスマホ画面
タイトルがスッキリ見えますね。背景を設定すると上品な雰囲気になります。シンプルイズベストという言葉がピッタリくるテーマです。
【スマホ画面】綺麗なWordpressテーマ 11. Sydney
無料テーマの中でも人気のあるテーマ「Sydney」。TOPページがとても見やすくて有料テーマのSTORK（ストーク）やJINでもボタンなどは採用されています。
- レスポンシブ・スマホ対応
- カスタマイザーで初心者も設定しやすい
- 高度なオリジナルヘッダーが作れる
- 1カラム・2カラム対応
- SEO対策
- 無料
SydneyのPC画面
タイトルがスライドして出てきますので、見た目に目立ちますし、バックの画像とボタンを工夫することでユーザーに迷わずに見てもらいたい記事に誘導できます。
Sydneyのスマホ画面
ロゴとヘッダー背景を入れただけなのですがヘッダー部分はシンプルでカッコよく配置できます。
無料なので、文句は言えないですが、有料と比べるとどうしても安っぽい雰囲気はありますね～(;´･ω･)
【まとめ】スマホ画面が綺麗なおすすめのWordpressテーマ
11個のレスポンシブデザインのテーマをお伝えしてきましたが、どれを選べばいいのでしょう。タイプ別にまとめてみます。
- お金をかけたくないタイプ
- SEO対策を重視したいタイプ
- デザイン重視したいタイプ
- 高機能のテーマを選びたいタイプ
- 自分自身でカスタマイズしたいタイプ
- 総合的にバランスを重視するタイプ
1. お金をかけたくないタイプ
- Cocoon
- Sydney（シドニー）
- Astra
- Hestia
とにかく安くブログを作りたい方には無料で使えるテーマがおすすめです。有料に近い機能を持っているものもありますし、Cocoonなどは日本の人が作っているので安心です。
2. SEO対策を重視したいタイプ
- THE THOR（ザ・トール）
- AFFINGER6
- Diver
ブログを運営する上でSEO対策は避けて通れません。特に稼ぐブログにするには上位表示ができないと稼げませんのでSEO対策はとても大事です。
今現在どのテーマでもSEO対策はされていますが数と対策においてはTHE THOR（ザ・トール）が一番だと思います。
3.デザイン重視したいタイプ
- AFFINGER6
- Chill（TCD)
- SANGO
- THE THOR（ザ・トール）
- Diver
デザインのみで語るならTCDのテーマが鮮やかで美しいと思います。ただしレイアウトのカスタマイズなどは決まっているので自分で少し触りたい人は他のテーマの方が良いでしょう。
4. 高機能のテーマを選びたいタイプ
- THE THOR（ザ・トール）
- Diver
- Cocoon
- AFFINGER6
ザ・高機能といえばTHE THOR（ザ・トール）です。全て使いきれないくらいの機能があるのですが、初心者のためには「着せ替え機能」を用意してあるという部分で幅広いレベルの人が使えるようになっています。
5. 自分自身でカスタマイズしたいタイプ
- Diver
- AFFINGER6
- STORK
- THE THOR（ザ・トール）
- SANGO
Diverはテーマの中でも使う人のための独自の機能が備わっています。初心者の場合には高機能のテーマが使えないという悩みもあります。Diverでは自分で簡単に見出しやバッジなどを作ることができたり、今見かける蛍光ラインが動くというパーツを装備しています。
6. 総合的にバランスを重視するタイプ
- THE THOR（ザ・トール）
- Diver
- AFFINGER6
- STORK19
THE THOR（ザ・トール）は、54もの特徴があり完璧なSEO対策、高機能、使いやすさ、ストレスのなさなどかなりレベルの高いテンプレートです。
実際私もいくつか使ってみて一番使いやすいのがTHE THOR（ザ・トール）でした。ひとつだけデメリットをあげるとすると「有料」ということです。
上位表示・表示速度を上げて稼ぎたい人はTHE THOR（ザ・トール）がおすすめです。
初心者だからこそWordpress有料テーマ を使うべき理由
無料テーマを使うことで時間の無駄遣いをしていませんか？
- 思い通りのデザインにできない・・・
- なかなか稼げない・・・
- アクセス数が増えない・・・
こんな悩みを抱えていませんか？
稼ぐブログにしろ趣味ブログにしろ検索の上位にこなければなかなか読んでもらえません。もしあなたが稼ぐブログを作りたいなら、初心者の時に初期投資することはとても大事なことです。
Wordpressの有料テーマができる５つのこと
- 検索上位を目指せる
- 見た目が綺麗でおしゃれになる
- 機能が豊富で出来ることが多い
- 会員フォームなどのサポート
- 有名ブロガーも有料テーマを使っている
これまでにあげた5つの有料テーマの特徴を説明していきます。
1. 検索上位を目指せる
ブログを運営していく上で対策をしていかなければいけないのがSEO対策です。検索エンジンのことを考えてブログを最適に合わせていくということがSEO（SearchEngine Optimizationの略）です。
- 情報の信頼性
- ユーザーへの役立つ情報であるか？
- スマホ・PCなどでストレスなく使える
などたくさんの要因がありますが、ブログを訪問した人があなたのブログの多くの記事を読んでくれるようなテンプレートの仕組みも有料テーマでは細やかに考えられています。
2. 見た目が無料テーマ以上に綺麗になる
シンプルが良いか、綺麗なテーマが良いのかそれぞれの好みによります。無料テーマは必要最低限のものを備えていますがやはりシンプルすぎていずれつまらなくなってしまいます。
有料テーマはデザイン性が高く自分の好きなデザインにもカスタマイズしやすいです。
出典：THE THOR 着せ替え「01」
↓ クリックで拡大します
出典：特製THE THORオリジナルアレンジ
3. 機能が豊富でできることが多い
今現在新しい機能として出てきたのが「着せ替え機能」です。過去にも賢威などにはベース色とパターンがありましたが最近ではアフィリなどはっきりと違った用途で使えるように作りこんでいます。
4. 会員フォーラムなどのサポート
なにかわからないことがあった場合、相談できる場所があるだけで安心できます。ここが無料テーマと一番違う部分、有料テーマでは売りっぱなしにしない工夫がされています。
5. 有名ブロガーも多数使用
稼いている有名ブロガーと言われる人のほとんどは有料テーマを使っています。ブログ造りでは内容も非常に大事ですが、文章や扱っている分野が同じ程度ならやはり最後の勝負はテーマの構造などになります。
もしあなたが稼ぐブログを作りたいと考えているならば「有料」テーマも検討してみてください。
カスタマイズで悩んでいる時間、ブログの完成度、上位に表示するメリットなど考えると有料テーマはあなたのお役にたちます。
