- ブログを継続できるか自信がない
- 有料テーマを使いこなせるか不安
- 初心者にSWELLはむずかしそう
こんなお悩み解決します♪
SWELLとCocoonどちらも上位ランクの大人気のテーマです。
ゆきどうしても初期費用をおさえたいならCocoon
ゆきデザインにこだわり収益化をめざすなら最初からSWELLです！
その理由
Cocoonは無料と思えない機能で人気だがデザインは少しものたりない
SWELLは17,600円と高いがその価値は十分で使うほどに満足感があがる
SWELLの操作はかんたんで初心者と思えないクオリティと品のあるおしゃれなブログにできます。
でも費用を考えるとやっぱり悩むところですよね…
そこでこの記事ではSWELLとCocoonを比較し、それぞれの特徴を解説します。
SWELLとCocoon比較一覧表
比較内容をクリックすると記事へ移動します
| 比較内容 | SWELL | Cocoon |
|---|---|---|
| 開発者 | 了さん(@ddryo_loos) | わいひらさん(@MrYhira) |
| 人気ランキング | 1位 | 2位 |
| デザイン性 | ハイセンス | シンプル |
| 価格 | 17,600円(税込) | 無料 |
| カスタマイズ性 | とても良い | 良い |
| 操作性 | かんたん | 一部CSS操作が必要 |
| SEO対策 | 基本施策 (新機能の更新が頻繁) | 基本施策 |
| サポート | あり (SWELLER’Sフォーラム) | あり (Cocoonフォーラム) |
| 公式サイト | 詳細をみる | 詳細をみる |
WordPress有料テーマSWELLの特徴
WordPress有料テーマSWELLの特徴を紹介します。
SWELLの特徴
①デザインがおしゃれ
SWELLはだれもが一目ぼれするハイセンスでおしゃれなデザインが魅力的なテーマです。
開発者である了さんのSWELLにかける思いとセンスのよさがとても伝わります。
みためが大事なのは、長くブログを継続するための重要ポイント。
毎日ブログを開くのが楽しみでわくわくするのがSWELL最大の特徴です。
SWELL公式デモサイト
SWELLのデモサイトは6種類。デザインが苦手でもおしゃれなデモサイトがあるので安心です。
②ブロックエディタ完全対応
SWELLはブロックエディタに完全対応しているので操作がしやすいです。
ブロックエディタとは
- 記事やページに装飾して編集する機能
- 見出し・装飾・画像挿入などレイアウトが直感的にできる
- HTMLやCSSの知識がなくてもブログ記事が書ける
記事作成画面
SWELLのエディター設定
ブログの全体カラーにあわせマーカーの色やふきだし画像を自由にでき、オリジナル感がだせます。
③カスタムブロックが豊富
SWELLはブロックエディタで使えるSWELL専用オリジナルブロックも豊富です。
よく利用するオリジナルブロック
| ふきだし | アイコン付きのふきだしで会話調やひとこといれたいときに便利 |
| 関連記事 | ほかの記事を紹介したいとき関連記事としてブログカードで表示できる |
| ボタン | リンク先へのボタンとして設置でき色とデザインもさまざま |
| キャプションボックス | キャプション(見出し)つきでみやすくするボックス |
| Q&A | 「よくある質問」でQ&A方式で使えるブロック |
| ステップ | 申し込み手順などステップ形式で説明する時に使えるブロック |
ほかにも全20種類以上のオリジナルブロックで執筆が楽しくなる便利ブロックばかりです！
④表示速度が速い
SWELLはキャッシュ機能など高速化機能を標準搭載しているので表示スピードが速いです。
- キャッシュ機能
- ページ下のコンテンツ遅延読み込み
- 画像・動画・iframeへ自動でLazyload付与
- メインスタイルのインライン読み込み
- JavaScriptの遅延読み込み
- 使用しているブロックに合わせたCSSの読み込み機能
ブロガーにとってWebサイトの表示スピードは生命線であり重要なポイントです。
⑤広告の設置や管理がかんたん
SWELLはGoogleアドセンス広告やアフィリエイト広告もしっかりした機能があります。
- 広告タグの管理機能
- 広告タグを呼びだすブロック
- インフィード広告の設置
- 記事ない広告の簡易呼びだし
- PC/スマホで出し分けの広告アイテム
- 自動広告ユニット専用の設定項目
- アドセンス申請コードのかんたん設置
- ads.txtファイルの編集機能
たとえばアフィリエイトのボタンもかんたん操作で作成できる
オリジナルブロックのSWELLボタンでかんたんにきれいなアフィリエイトボタンの設置ができます。
⑥新機能のアップデートが頻繁
SWELLは変化にあわせたアップデートが迅速ですぐに対応してくれるのも安心です。
最近ではステマ規制のPR表記機能も追加アップデートされ、対応がとてもはやい印象を受けました。
⑦質問やコミュニティの場がある
SWELLはテーマの購入者限定で利用できるとSWELLフォーラムや専用ディスコードがありコミニティに参加できます。
ディスコードではアップデート最新情報が知れるのはもちろん、SWELLを利用する人同士のコミュニケーションとしても利用できるのがうれしいです。
有料テーマSWELLをおすすめするのはこんな人
紹介した特徴からSWELLをおすすめする人は以下です。
- おしゃれなデザインにこだわる
- 記事の装飾は見栄えよくしたい
- 速度・SEOも高品質を求める
- ブログを継続して収益につなげたい
SWELLは有料の価値が何倍もあると実感できるテーマです。
そして第一印象を決めるハイセンスなデザインは今後のブログ運命を決めるといっても過言ではありません。
WordPress無料テーマCocoonの特徴
つぎにWordPress無料テーマCocoonの特徴を紹介します。
Cocoonの特徴
①無料で利用できる
Cocoonは無料で利用できるWordpressのテーマです。
Cocoon以外にも無料テーマは数多くありますが、Cocoonほど機能面ですぐれている無料テーマはないです。
記事の装飾などブロックエディタでは有料テーマとおなじくらい、便利な機能がそろっています。
②最小限のシンプルデザイン
Cocoonは「繭(まゆ)」を意味し、白にこだわり白を基調としたシンプルデザインが人気です。
「白いテーマがいちばん読みやすいから」と開発者わいひらさんのユーザー目線にたつ姿勢が感じられます。
ただCocoonのは最小限のシンプルなデザインを好む人にむいており、とことんこだわる人にはものたりなさがあるかもしれません。
しかし無料テーマとは思えず「中をみてみるとすごかった」と印象を受けるテーマです。
③内部SEO対策・高速化対策
Cocoonは基本のSEO対策は実施されておりページ高速化対応にも力をいれています。
Cocoonが対策の内部SEOは以下です。
Cocoonの内部SEO対策
- ページ高速化機能搭載
- モバイルファースト
- ワンクリックでAMP対応
- ワンクリックでPWA対応
- PC/モバイルのソースコードが100％同じ
- W3CのHTML5バリデーションエラー0
- W3CのCSSバリデーションエラー0
- 基本的な構造化データタグの適用
- 構造化データエラー0
- メタディスクリプション記入欄の設置
- HTMLアウトラインの最適化
これほどしっかりあればSEO対策も安心です。
④完全レスポンシブスタイル
Cocoonは100%レスポンシブスタイルに対応しています。
レスポンシブスタイルとは
ブログはスマホで読まれるケースが圧倒的に多いです。
Cocoonはモバイルフレンドリー(スマホでの読みやすさ)にも重点を置いていて、その点は完璧といえます。
⑤豊富なスキン(テンプレート)
Cocoonはブログをデザインできるスキン(テンプレート)が100種類以上とかなり豊富です。
Cocoonデモサイト
シンプルで全体的に「ブログ型」が多い印象で、日記ブログや雑記ブログにむいています。
⑥広告リンクがかんたんに貼れる
CocoonはGoogleアドセンスなど収益を目的とする広告リンクをかんたんに貼れます。
アドセンス広告は1つのコードを貼るだけで、さまざまなフォーマットをえらべる仕組みです。
- アドセンス自動広告(手動設定併用可)
- レスポンシブ広告
- バナー広告
- レクタングル広告
- ダブルレクタングル広告
- ラージスカイスクレーパー
- 記事広告
- リンクユニット広告
また、以下のようにAmazonや楽天市場・Yahooショッピングのリンクもかんたんに作成できます。
⑦画像付きふきだし機能が便利
Cocoonはデフォルトで画像付きのふきだしが準備されています。
デフォルト以外にも、Cocoonの管理画面(ダッシュボード)から設定できます。
管理画面
すきな画像やタイトルを使ったオリジナルのふきだしを作るのも可能です。
無料テーマCocoonをおすすめするのはこんな人
紹介した特徴からCocoonをおすすめする人は以下です。
- 初期費用をおさえ無料ではじめたい
- デザインは気にしない
- 速度・SEOに対応していれば十分
- シンプルで最小限に使いたい
とにかく最初は費用をかけたくない人にCocoonをおすすめします。
しかし途中でテーマ変更する作業は大変なので、これからブログで稼ぎたい目的があれば最初から有料SWELLにしておくべきです。
有料SWELLと無料Cocoonを徹底比較
ここから具体的な有料SWELLと無料Cocoonのちがいをみていきましょう。
比較内容をクリックすると記事へ移動します
| 比較内容 | SWELL | Cocoon |
|---|---|---|
| 開発者 | 了さん(@ddryo_loos) | わいひらさん(@MrYhira) |
| 人気ランキング | 1位 | 2位 |
| デザイン性 | ハイセンス | シンプル |
| 価格 | 17,600円(税込) | 無料 |
| カスタマイズ性 | とても良い | 良い |
| 操作性 | かんたん | 一部CSS操作が必要 |
| SEO対策 | 基本施策 (新機能の更新が頻繁) | 基本施策 |
| サポート | あり (SWELLERS’ フォーラム) | あり (Cocoonフォーラム) |
| 公式サイト | 詳細をみる | 詳細をみる |
比較①｜人気ランキング
気になるランキング結果ではSWELL1位、Cocoon2位、どちらも大人気のテーマであるのがわかります。
日本のWordPressテーマシェア率（2023年1月）
ランキング結果をみてもSWELLとCocoonがいかに愛用されているか想像できますね。
2023年WordPress人気テーマランキングTOP10
クリックで開閉できます
| 1位｜SWELL(¥17,600) |
| 2位｜Cocoon(無料) |
| 3位｜SANGO(¥11,000円) |
| 4位｜JIN(¥14,800) |
| 5位｜Lightning(無料) |
| 6位｜AFFINGER6(¥14,800) |
| 7位｜Emanon Premium(¥0〜27,800) |
| 8位｜THE THOR(¥16,280) |
| 9位｜Snow Monkey(¥16,500円/年) |
| 10位｜AFFINGER5(¥14,800) |
Cocoonと比べSWELLはカスタマイズできる幅が広いです。もし操作に迷っても使用している人が多いのでWeb上で解決策がみつかりやすいです。
比較②｜デザイン性
まずSWELLとCocoonのデザイン性について比較します。
SWELLとCocoonの公式サイトのトップページ
デザインの特徴比較
SWELLとCocoonの大きなちがいはデザイン性にあります。
- SWELLはサイト型に適しているデザイン
- Cocoonはブログ型に適しているデザイン
| サイト型 | トップページにメイン画像がありカテゴリー別に投稿記事がある |
| ブログ型 | トップページにが最新の順で投稿記事がずらりと並んでいる |
こだわったデザインを追求できるのはSWELL、最小限のデザインができるのがCocoon
テンプレートの数
| SWELL | Cocoon |
| 6種類 | 100種類以上 |
SWELLは6種類しかないので選択しやすくCocoonは豊富な数からえらべる
比較③｜価格
比較2つめは「価格」です。
ライセンス
| SWELL | Cocoon |
| 100%GPL (1度の購入で複数サイト利用OK) | 100%GPL (自由に利用OK) |
はじめてブログ開設をする人にとって、SWELLの17,600円は「高い」イメージです。
しかしSWELLを使いはじめると、初心者と思えないデザイン・使いやすい機能、SWELLを知るほどに満足度があがります。
17,600円の価格の何倍もあると心の底から実感できる最高レベルで後悔しないテーマです。
比較④｜カスタマイズ性
つぎにカスタマイズについてそれぞれを紹介します。
SWELLとCocoonのカスタマイズ項目
SWELLでカスタマイズできること
クリックで開閉できます
| WordPress設定 | サイト基本情報・ホームページの設定 |
| サイト全体設定 | カラー・デザイン・NOIMAGE画像・タイトルデザイン・コンテンツヘッダー・お知らせバー・パンくずリスト・ページャー・スマホ開閉メニュー・下部固定ボタンメニューの設定 |
| ヘッダー | 背景色・文字色・ヘッダーロゴ・レイアウトデザイン・トップページ特別設定・ヘッダーの追従・ヘッダーバー・キャッチフレーズ・グローバルナビ・ヘッダーメニュー・検索ボタン・メニューボタン・カスタムボタンの設定 |
| フッター | カラー・コピーライト・その他の設定 |
| サイドバー | 表示と位置の設定 |
| トップページ | メインビジュアル・記事スライダー・ピックアップバナー・その他設定 |
| 投稿・固定ページ | タイトル・PR表記・アイキャッチ画像・コンテンツデザイン・目次・SNSシェアボタン・記事下エリアの設定 |
| アーカイブページ | タイトルの表示位置・コンテンツ内タイトルデザイン・タームナビゲーションの設定 |
| 記事一覧リスト | リストレイアウト・投稿情報の表示・カテゴリー表示・サムネイル画像の比率・マウスホバー時・タブ切替・投稿一覧から除外するカテゴリー・タグの設定 |
| SNS情報 | SNSリンク(fb・インスタ・X・TikTok・楽天ROOM・LINE・Pinterest・Github・YouTube ・Amazon欲しいものリスト・Feedly・RSS ページ・お問い合わせページ ページ)の設定 |
| 高度な設定 | headタグ終了直前・bodyタグ開始直後・bodyタグ終了直前に出力するコードの設定 |
| メニュー | フッター・ヘッダー・グローバルナビ・ピックアップバナー・メニュー位置の設定 |
| ウィジェット | ヘッダー内部・スマホ開閉メニュー下・トップページ上部・下部・フッター直前・フッター1,2,3の設定 |
| 追加CSS | 追加CSSコードの設定 |
Cocoonでカスタマイズできること
クリックで開閉できます
| サイト基本情報 | タイトル・キャッチフレーズ・サイトアイコンの変更 |
| 背景画像 | 背景画像の設定 |
| メニュー | フッター・ヘッダー・ピックアップ・メニューの位置の設定 |
| ウィジェット | サイドバー・サイドバースクロール追従・固定ページタイトル上/下・本文上/中/下・固定ページSNSボタン上/下・コンテンツ上部/下部・フッター左/中/右・フッター(モバイル)の設定 |
| ホームページ | ホームページ表示の設定 |
| 追加CSS | 追加CSSコードの設定 |
| エクスポート/インポート | 書き出し・インポートの設定 |
カスタマイズの比較ポイント
- SWELLは細かいところまでカスタマイズできる
- Cocoonは最小限の重要箇所にしぼったカスタマイズができる
カスタマイズの数から、こだわりのSWELLとシンプルなCocoonなのがわかりましたね。
比較⑤｜操作性
SWELLとCocoonの操作のしやすさを比較してみます。
SWELLの投稿画面
Cocoonの投稿画面
小さなちがいはありますが、SWELLとCocoonどちらも操作がしやすいのは比較しがたいです。
比較⑥｜SEO対策
SEOについて、SWELLとCocoonのちがいと対策を施している内容は以下です。
SWELLのSEO対策の内容
クリックで開閉できます
- 検索エンジンが理解しやすいHTML構成
- 初期状態のHtml Checkerエラーなし確認
- JSON-LDによる構造化マークアップ機能
- レスポンシブタイプ
- パンくずリスト
- メタタグ出力にプラグインSEO SIMPLE PACKを利用
- テーマに高速化機能を内蔵
- 広告タグ管理機能
- 管理中の広告タグを簡単に呼び出せる専用ブロック
- インフィード広告の設置
- 記事内広告の簡易呼び出し
- PC/スマホで出し分け可能な広告ウィジェットアイテム
- 自動広告ユニット専用の設定項目も用意
- アドセンス申請コードもカスタマイザーで簡単設置
- ads.txtファイルの編集機能
CocoonのSEO対策の内容
クリックで開閉できます
- ページ高速化機能搭載（テーマ機能だけでPageSpeed Insights90点後半が取れる）
- モバイルファースト（モバイルフレンドリー）
- ワンクリックでAMP対応
- ワンクリックでPWA対応
- PCとモバイルでソースコードが100％同じ完全レスポンシブ
- W3CのHTML5バリデーションのエラー0
- W3CのCSSバリデーションのエラー0
- 基本的な構造化データタグの適用
- 構造化データエラー0
- メタディスクリプション記入欄の設置
- HTMLアウトラインの最適化
比較するとSWELLこだわりの高速化機能、検索結果のリッチスニペット表示に必要な構造化データのマークアップも自動なのがプラスですぐれています。
ただSWELLもCocoonも基本のSEO対策はしっかり実施されているので安心です。
比較⑦｜サポート面
SWELLとCocoonでは公式サイトにそれぞれのフォーラムがあります。
フォーラム
過去の質問内容から解決策をみつけたり質問を投稿できる場所
SWELLのフォーラム内カテゴリ
- SWELLに関する質問
- 不具合の報告
- 要望
フォーラム内検索でキーワード検索できる
SWELLはディスコードコミュニティあり
質問に対し開発者の了さんはじめ、コミュニティのメンバーの方々が教えあうのもいいところ
Cocoonのフォーラム内カテゴリ
- 雑談
- テーマの質問
- 不具合報告
- 要望
- カスタマイズ相談
- カスタマイズ依頼
6つのカテゴリとサイト内検索が便利
SWELLとCocoonを知る人たちの口コミ評判
ここではSWELLとCocoonを経験した人に絞り、口コミや評判を調査しました。
SWELLとCocoonを経験した人の口コミ評判
クリックで開閉できます
- 無料ならCocoon、有料ならSWELL
- 最初はCocoonであとからSWELLにしたけど移行の手続きが大変
- 本気でブログをするなら最初からSWELL
との意見が多くありました。
WordPress有料テーマSWELLの導入方法
SWELL導入の3ステップ
- SWELL公式サイトでテーマを購入する
- SWELLER’Sに会員登録・ログインする
- SWELLのテーマをダウンロードする
SWELLのマイページ画面にログインする
SWELL本体最新版と子テーマをダウンロードする
親テーマ・子テーマを保存する
SWELLをインストールする手順
テーマをダウンロードしたあとはWordPressにインストールします。
ここからWordPressの画面で操作
- テーマの新規追加・アップロード
- 親テーマをインストール
- 子テーマをインストールし有効化
- SWELLの認証
WordPress管理画面(ダッシュボード)にログイン
テーマのアップロードファイルを選択をクリック
親テーマをインストール
今すぐインストールクリックする
インストール完了を確認
親テーマの有効化はクリックしない
子テーマをインストール
今すぐインストールクリックする
インストール完了を確認→有効化
子テーマを有効化する
SWELLのユーザー認証が完了する
SWELLER’Sで登録したメールアドレスを入力認証リクエストを送信
メールアドレスに届く認証用URLへアクセスログイン認証を完了
メール内容にあるURLをクリックする
認証画面を確認
ダッシュボード画面ではこのように表示される
SWELLが反映されているか確認してみる
WordPress無料テーマCocoonの導入方法
Cocoon導入の3ステップ
- Cocoonダウンロードページにアクセスする
- Cocoon親テーマをダウンロードする
- Cocoon子テーマをダウンロードする
親テーマのダウンロードまで下にスクロール
親テーマダウンロードする
親テーマのダウンロードまで下にスクロール
子テーマをダウンロードする
Cocoonをインストールする手順
テーマをダウンロードしたあとはWordPressにインストールします。
ここからWordPressの画面で操作
- テーマの新規追加・アップロード
- 親テーマをインストール
- 子テーマをインストールし有効化
- SWELLの認証
ダッシュボード外観テーマ新規追加をクリック
テーマのアップロードファイルを選択をクリック
親テーマをインストール
今すぐインストールクリックする
インストール完了を確認
親テーマの有効化はクリックしない
まとめ｜WordPressを本気でやるならSWELLにしよう
WordPressの有料テーマSWELLと無料テーマCocoonのデザインや機能について比較しました。
まとめ
SWELL
- おしゃれなデザインにこだわる
- 記事の装飾は見栄えよくしたい
- 速度・SEOも高品質を求める
- ブログを継続して収益につなげたい
Cocoon
- 初期費用をおさえ無料ではじめたい
- デザインは気にしない
- 速度・SEOに対応していれば十分
- シンプルで最小限に使いたい
ブログは本気度があがるほど、テーマへのこだわりが強くなります。
わたしがSWELLをえらんだきっかけは、ブログをはじめるときにはいった最初のオンラインサロンで推奨され、デザインのすばらしさに一目惚れしたからです。
テーマのなかでSWELLはお高めですがその何十倍の価値があると実感しています。
車や洋服のように高額でも本当にすきで買ったものは後悔せず、ずっと大切に愛用するのと同じです。
挫折しやすいといわれるブログを長く継続していくためにも、SWELLは欠かせないアイテムで優秀なパートナーです。
＼SWELLの公式サイトはこちらです／
