SWELLの1カラム設定方法を徹底解説！成約率を上げる3つの型

SWELLの1カラムレイアウトの設定や2カラムとの使い分け、LPの活かし方まで詳しく解説いたします。

SWELLで1カラムレイアウトを使うメリット

ブログ型とサイト型、SWELL 1カラムの役割の違い

ざっくり言うと、ブログ色が強いサイトはサイドバー付きの2カラム、会社やサービスの紹介がメインのサイトは1カラムが多いです。イメージしやすいように、違いを表にまとめました。

レイアウト	よくある用途	特徴	向いているケース
2カラム（サイドバーあり）	ブログ記事一覧、カテゴリー別記事	関連情報やプロフィールを常に表示できる	記事数が多く、いろいろな記事を回遊してほしいブログ
1カラム（サイドバーなし）	トップページ、LP、サービス紹介ページ	余計な要素を減らし、本文に集中してもらえる	メッセージやサービス内容をストレートに伝えたいページ

私がSWELLで1カラムを使って「これは良い」と感じたのは、サービス紹介ページやプロフィールページです。サイドバーがあると、自己紹介や料金表のすぐ横に広告や新着記事が並んでしまい、どうしても視線が散ります。

1カラムにすると、読んでほしい順番で情報を縦に並べられるので、ストーリーを持たせやすく、スクロールしているうちに自然とゴールのボタンまで読んでもらいやすくなります。

SWELL 1カラムが向いているページの具体例

SWELLの1カラムレイアウトと相性がいいページは、大きく分けると次のようなものです。

• 固定ページで作るトップページ（サイト型トップ）
• サービス紹介ページ、料金ページ（LP風の構成）
• 自己紹介・プロフィールページ
• 制作実績・ポートフォリオページ
• 問い合わせ、資料請求などのコンバージョンページ

逆に、日々更新するブログ記事は2カラムのままでも大丈夫です。関連記事やカテゴリーを常に表示できた方が、PVや滞在時間が伸びやすいケースも多いです。

SWELLの1カラムレイアウトは、「集中して読んでほしいページ」「ゴールまで迷わせたくないページ」に使う、と決めておくと判断しやすくなると思います。

SWELL 1カラムを使う前に知っておきたい基本設定

固定ページと投稿ページの違いをサクッと整理

SWELLの1カラムレイアウトを活かしたいのは、主に「固定ページ」です。固定ページと投稿ページの違いを、簡単な表にしました。

種類	役割	例	特徴
投稿ページ	ブログ記事、最新情報	ブログ記事、コラム	カテゴリーやタグで整理され、一覧ページに自動で並ぶ
固定ページ	あまり内容が変わらない案内ページ	トップ、プロフィール、問い合わせ	メニューに自分で追加する、表示順も自由に決められる

SWELLで1カラムのサイト型トップページを作りたい場合は、「トップページ用の固定ページ」を新しく1つ作るイメージです。そして、そのページを「このサイトの表紙」に指定してあげます。

サイト全体のサイドバー設定で1カラムの土台を作る

SWELLには「サイト全体でサイドバーをどうするか」という設定と、「ページごとに個別でどうするか」という設定の2段階があります。

• 全体設定で「基本のルール」を決める
• 固定ページや投稿ページごとに、必要なら個別で上書きする

私のおすすめは、次のような方針です。

• 投稿ページ（通常のブログ記事）：サイドバーあり（2カラム）
• 固定ページ：基本はサイドバーなし（1カラム）

こうしておくと、SWELLで1カラムにしたい固定ページを作るたびに、余計なサイドバーを消す手間が減りますし、レイアウトの統一感も出しやすくなります。

SWELL 1カラムトップページの作り方ステップ

トップページ用固定ページを作成する手順

まずは、トップページとして使う固定ページを用意します。やることはシンプルで、WordPressの管理画面から固定ページを1つ追加するだけです。流れを表にまとめました。

ステップ	やること	ポイント
1	固定ページを新規追加	タイトルは「ホーム」や「トップページ」など、自分が見て分かりやすい名前にする
2	パーマリンクを短くする	スラッグを「home」「top」など短めにしておくとURLがすっきりする
3	ひとまず下書き保存	中身はあとからブロックで組めばOKなので、最初は空でも問題なし

同じタイミングで、「ブログ記事一覧用の固定ページ」も1つ作っておくと便利です。タイトルを「ブログ」や「お知らせ」にしておけば、あとでメニューに入れるだけで一覧ページとして使えます。

SWELL 1カラムにするための表示設定とカスタマイザー

トップページ用の固定ページを作ったら、次はそれを「サイトの表紙」に指定します。そのあと、SWELLの1カラムレイアウトで表示されるように整えていきます。

大まかな流れは次の通りです。

ここまで設定できれば、トップページにアクセスしたときに、サイドバーが消えたすっきりした1カラムレイアウトになっているはずです。もしまだサイドバーが表示されている場合は、次のページ単位の設定も確認してみてください。

固定ページでSWELL 1カラムを指定する

SWELLには、固定ページや投稿ページの編集画面ごとに「このページだけサイドバーをどうするか」を決められる項目があります。

• 固定ページの編集画面を開く
• 画面下の「SWELL設定」または右側の設定パネルを確認する
• レイアウト関連の項目で「サイドバーを表示するかどうか」を選ぶ
• 「サイドバーなし」「1カラム」などの選択肢を選択する

ここで1カラムのレイアウトを選べば、そのページだけサイドバーなしの表示になります。トップページ用固定ページはもちろん、サービス紹介やLPとして使いたいページも、同じように1カラムにしておくと、サイト全体の印象が揃いやすくなります。

ブロックで1カラムのサイト型レイアウトを組む

SWELLで1カラムにすることを決めたら、あとは中身のレイアウトづくりです。私がよく使う基本パターンは、次のような流れです。

これをブロックエディターとSWELLの独自ブロックを組み合わせて作っていきます。例えば、ヒーローエリアにはカバーブロックやフルワイドブロック、サービス説明にはカラムブロックやボックス、実績紹介にはカード風のデザインブロックを使うと、それらしく整った「サイト型トップ」の見た目になります。

最初から完璧を目指す必要はないので、「とりあえずシンプルな構成で1ページ作ってみる」くらいの気持ちでOKです。あとから少しずつ入れ替えていけば、自然と自分のサイトらしいSWELLの1カラムレイアウトに育っていきます。

SWELL 1カラムをもっと活かすデザインとUXのコツ

読みやすいコンテンツ幅と文字組みの目安

1カラムにすると「せっかくなら横幅をめいっぱい使いたい」という気持ちになりますが、文章の横幅が広すぎると、どうしても読みづらくなります。私が実際にいくつか試して、しっくりきた目安をまとめました。

デバイス	コンテンツ幅のイメージ	行の長さ
PC	画面中央にすっきり収まる程度の幅	1行あたり60〜70文字前後
タブレット	画面の7〜8割程度	1行あたり40〜50文字前後
スマホ	画面いっぱいでOK	1行あたり30〜35文字前後

SWELLの1カラムレイアウトでPCの横幅を広げすぎると、テキスト主体のページでは横にズラッと長い文章になりがちです。カスタマイザーや追加CSSでコンテンツ幅を少し絞ってあげると、雑誌の本文のような読みやすい印象に近づきます。

スマホでの見え方を前提にしたブロック配置

SWELLで1カラムにしたページのほとんどは、スマホで読まれると考えておいた方が現実的です。PCで見てきれいでも、スマホでゴチャっとしていると意味がありません。私が意識しているポイントは、次の通りです。

SWELLの1カラムレイアウトは縦スクロールが基本なので、「上から下に読み進めていくうちに、自然とゴールのボタンにたどり着く」イメージでブロックを並べていくと、ストレスなく最後まで読んでもらいやすくなります。

サイドバーなしでも回遊率を上げる導線設計

1カラムにすると、サイドバーからの内部リンクがなくなります。その代わりに、本文の中やフッターで読者を案内してあげることで、PVを落とさずにすみます。

例えば、サイト型トップページならこんな配置が考えられます。

• コンセプトの下に「詳しくはこちら」ボタンを置き、サービスページへ誘導する
• 実績の下に「制作事例一覧へ」ボタンを設置する
• ページの最後に「最新ブログ記事一覧」ブロックを表示する

SWELLにはボタンブロックや投稿リストブロックが用意されているので、1カラムレイアウトでも十分な回遊導線を作れます。サイドバーを消したぶん、「このページを読み終わった人に、次に何をしてほしいか」をはっきりさせることが大事です。

SWELL 1カラムでよくある失敗とトラブル対策

レイアウトが崩れる・2カラムのままになるとき

「1カラムにしたつもりなのに、なぜかサイドバーが残る」「スマホで見ると変な位置にサイドバーが出ている」という相談はかなり多いです。代表的な原因と対策を表に整理しました。

症状	よくある原因	対策
サイドバーが消えない	全体設定で「固定ページのサイドバーあり」になっている	カスタマイザーのサイドバー設定を見直し、固定ページをサイドバーなしにする
特定のページだけ2カラムのまま	ページ個別のSWELL設定でサイドバーありになっている	該当ページのSWELL設定で1カラムを選び直す
スマホでレイアウトが崩れる	追加CSSやレイアウト系プラグインが干渉している	追加CSSやプラグインを一時的にオフにして、原因を切り分ける

基本的には、「サイト全体の設定」と「ページ個別設定」のどちらか、もしくは両方を見直せば解決するケースがほとんどです。SWELLの1カラムレイアウトはテーマ側でレスポンシブ対応まで考えられているので、独自のCSSを足しすぎると逆に崩れやすくなる点にも注意しておきたいところです。

サイドバーを全部消したらPVが下がったとき

勢いで「全部1カラムにしてしまった」というパターンもよくあります。トップページやLPならまだしも、すべてのブログ記事まで1カラムにすると、関連記事やカテゴリーからの回遊が減り、PVが落ちることがあります。

そんなときは、次のように戻してみてください。

• 投稿ページ（ブログ記事）は、いったんサイドバーありの2カラムに戻す
• 固定ページのうち「ゴールに直結するページ」だけ1カラムを維持する
• サイドバーには、カテゴリ一覧や人気記事、プロフィールなど、回遊しやすい情報を置く

SWELLの1カラムレイアウトはあくまで「一点集中させたいページ」に使うのがおすすめです。アクセス解析などの数字も見ながら、1カラムと2カラムのバランスを少しずつ調整してみてください。

1カラムか2カラムか迷ったときの判断基準

最後に、「このページ、SWELLで1カラムにすべきか？」と迷ったときの判断基準を簡単な表にまとめます。

ページの目的	おすすめレイアウト	理由
ブログ記事を読んで回遊してもらいたい	2カラム	関連情報やカテゴリが常に表示され、回遊しやすい
サービスの内容をじっくり読ませたい	1カラム	余計な要素を減らし、本文に集中してもらえる
自己紹介や理念をしっかり伝えたい	1カラム	ストーリーを縦に流しやすく、読了率も上げやすい
制作実績を一覧で見せたい	1カラムまたは2カラム	カード型レイアウトにするなら、1カラムでも見やすい

「このページのゴールは何か」を先に決めてから、1カラムにするか2カラムのままにするかを選ぶと、レイアウトの選択で迷いづらくなります。

よくある質問

Q1. SWELLで1カラムにすると、SEO的に不利になりませんか？

A. 単純に「1カラムだから不利」「2カラムだから有利」ということはありません。大事なのは、SWELLの1カラムレイアウトにしたことで本文が読みやすくなっているか、内部リンクがきちんと張れているかどうかです。サイドバーを消したぶん、本文やフッターで関連記事やサービスページへ丁寧に誘導していれば、むしろユーザーにとって親切なページになります。

Q2. トップページだけSWELLで1カラムにして、他は2カラムでも大丈夫ですか？

A. もちろん問題ありません。むしろ、トップページやLPを1カラムにして、それ以外のブログ記事は2カラムのままにする構成はおすすめの形のひとつです。トップページで「このサイトは何をしているのか」をクリアに伝えつつ、記事に入ったらサイドバーからいろいろ回遊できるようにしておくと、全体としてバランスが良くなります。

Q3. SWELLの1カラムページに、広告やバナーはどこまで入れていいですか？

A. 1カラムのページは、あくまで「読んでほしい流れ」を優先するのが基本だと私は考えています。スクロールするたびに広告が挟まると、せっかくのストーリーが分断されがちです。入れるなら、本文の途中ではなく「セクションとセクションの区切り」に1つずつ、あるいはページの最後にまとめて配置するくらいにしておくと、読みやすさと収益のバランスが取りやすくなります。

まとめ

ここまでのポイントを整理します

今日からできる最初の一歩としては、まず「どのページをSWELLの1カラムレイアウトにしたいのか」を紙やメモアプリに書き出してみてください。そのうえで、その中からトップページ用の固定ページを1つ決めて、表示設定とサイドバー設定を変えるところまで一気にやってみましょう。

1ページでもSWELLで1カラムのサイト型トップが形になると、他の固定ページも同じノリで整えやすくなりますし、「自分のサイトらしさ」がぐっと出てきます。