【ブロガー必見！】Wordpressでサイト型トップページの作成方法

Wordpressでサイト型トップページの作成の最適化手順とは、正しい初期設定と手順の遵守により、トラブルを未然に防ぎながら最大限のパフォーマンスと効果を引き出す重要なプロセスである。

WordPressでサイト制作していると、トップページのデザインに悩みますよね。

トップページは、大きく「ブログ型」「サイト型」の２種類に分けられ、サイト型のトップページはSEOに有利とされています。

この記事では、SEO効果を最大化するために、ユーザビリティの優れたサイト型トップページの作成方法と最適化の全貌を完全図解します。

ぜひ、オリジナリティあふれるトップページを作り上げてみてください。

サイト型トップページとは

サイト型トップページは、ビジネスや団体のウェブサイトで最も重要なエントリーポイントの一つです。

このページの設計は、訪問者に対してサイトの目的や提供する価値を即座に伝えることが目的であり、ブランドのイメージを強化し、サイト内の他のセクションへの興味を引き出すように構成されています。

サイト型トップページの特徴

サイト型トップページには、以下のような特徴があります。

• 目的の明確化

サイト型トップページは、ビジネスの主な目的や使命を訪問者に明確に伝えるよう設計されています。これには、ビジュアル要素、キャッチコピー、そして直接的なメッセージングが含まれます。

• 効率的なナビゲーション

訪問者が求める情報へスムーズにアクセスできるよう、効率的なナビゲーションシステムが設置されています。メニューは直感的で、ユーザーが迷うことなく情報を見つけられるようになっています。

• コンバージョンの最適化

サイト型トップページは、訪問者をリードや顧客に変換するための要素を含んでいます。これには、コンタクトフォーム、購入ボタン、資料請求フォームなどがあります。

• ビジュアルとコンテンツのバランス

強力なビジュアルと有益なコンテンツの組み合わせにより、訪問者の関心を引きつけ、情報を効果的に伝えます。

ブログ型とサイト型の違い

ブログ型トップページとサイト型トップページは、主にコンテンツの提示方法と目的において異なります。

• ブログ型トップページ:

最新のブログ投稿がフィーチャーされ、コンテンツは定期的に更新されます。この形式は、読者との継続的なエンゲージメントを促進し、新鮮なコンテンツを提供することに焦点を当てています。

• サイト型トップページ:

企業や団体の主要な情報、サービス、製品に焦点を当て、訪問者に対して特定のアクション（購入、問い合わせなど）を促します。コンテンツは比較的固定されており、訪問者にとっての入口や案内役を果たします。

Wordpressでサイト型トップページを作成する方法

固定ページをトップページに設定する方法

WordPressでは、通常は投稿一覧がトップページに表示されます。しかし、サイト型のトップページを作る場合は、固定ページをトップページに設定する必要があります。

固定ページをトップページに設定する方法は、以下の手順で行います。

• 「設定」→「表示設定」を開きます。

• 「フロントページの表示」を「固定ページ」に変更します。

• 「フロントページ」にトップページにする固定ページを選択します。

• 「変更を保存」をクリックします。

サイト型トップページ用のテーマを選ぶ

サイト型トップページを作成するためには、テーマ選びも重要です。サイト型のトップページを作成するには、多くの場合、サイト型トップページ用のテーマを選ぶことが望ましいです。

サイト型トップページ用のテーマには、特にトップページをカスタマイズしやすい機能が備わっていることが多いです。

おすすめはこのサイトでも利用している、Wordpressテーマ「SWELL」です。SWELLはサイト型トップページをかんたんに作れるようにカスタマイズされています。

ページビルダープラグインを利用する方法

ページビルダープラグインを利用することで、直感的にトップページのデザインをカスタマイズすることができます。

ページビルダープラグインを利用することで、専門的な知識がなくても、簡単にトップページをカスタマイズすることができます。

代表的なページビルダープラグインには、以下のものがあります。

• Elementor

• WPBakery Page Builder

• Beaver Builder

カスタムフィールドを活用する方法

カスタムフィールドは、WordPressでサイト型トップページを作成するために役立つ機能の１つです。

カスタムフィールドを利用することで、独自のフィールドを追加し、ページ内に必要な情報を追加することができます。例えば、商品の価格や特徴、スタッフの紹介などを追加することができます。

カスタムフィールドを利用するには、以下の手順を実行します。

• ポスト編集画面でカスタムフィールドを有効にするために、画面右上の「オプション」ボタンをクリックします。

• 「カスタムフィールド」をクリックし、「名前」および「値」の2つのフィールドを入力します。名前はフィールドの名前、値はそのフィールドに表示する値を入力します。

• カスタムフィールドを保存するために、ポストを更新する必要があります。

• カスタムフィールドをテンプレートファイルで表示するには、以下のようなコードを使用します。

<?php
$custom_field = get_post_meta( get_the_ID(), 'カスタムフィールド名', true );
if ( ! empty( $custom_field ) ) {
    echo $custom_field;
}
?>

ここで、「カスタムフィールド名」の部分に、実際に追加したカスタムフィールドの名前を入力します。このコードを使用することで、ページ内にカスタムフィールドの値を表示することができます。

カスタムフィールドを利用することで、サイト型トップページに独自のフィールドを追加し、ページ内に必要な情報を追加することができます。

カスタムフィールドを使用する場合は、コードの知識が必要になるため、初心者には難しい場合があります。

サイト型トップページのデザイン要素

サイト型トップページを作成する際には、いくつかのデザイン要素を考慮する必要があります。以下では、主要な要素について説明します。

ヒーローセクションの作成

ヒーローセクションは、サイトの第一印象を決める重要な要素の一つです。このセクションは、ビジュアル的に魅力的で、サイトの主要なコンセプトや価値提供を伝えることができます。

ヒーローセクションは、以下のような要素で構成されます。

タイトル	明確かつ簡潔なタイトルを選び、ビジュアルと相まって、ユーザーに印象的な体験を提供します。
サブタイトル	タイトルの下に続く説明的なテキストで、サイトの主要なコンセプトを補足します。
背景画像	ヒーローセクションに適切なビジュアルを提供することができます。この背景画像は、サイトのブランディングを反映するように選択する必要があります。
コールツーアクション（CTA）	このセクションの最後に、ユーザーに何か行動を促すCTAを配置することができます。例えば、お問い合わせフォームや商品の購入ページなどが挙げられます。

サービス紹介エリアの設置

サイト型トップページでは、ビジネスやサービスに焦点を当て、特徴やメリットを強調することが必要です。サービス紹介エリアは、そのための重要な要素の一つです。

サービス紹介エリアは、以下のような要素で構成されます。

アイコン	それぞれのサービスに対応するアイコンを用意し、視覚的に説明することができます。
タイトル	明確でわかりやすいタイトルを選び、ビジュアルと相まって、ユーザーに印象的な体験を提供します。
説明	それぞれのサービスに関連する説明を簡潔かつ分かりやすく記述します。

ポートフォリオや実績紹介エリアの設置

ポートフォリオや実績紹介エリアは、自社の実績や得意分野をアピールするための重要な要素です。これらをサイト型トップページに設置することで、訪問者に会社の強みをアピールすることができます。

ポートフォリオや実績紹介エリアを設置する方法はいくつかありますが、代表的な方法を以下に紹介します。

• ギャラリープラグインを利用する方法 Wordpressには、ギャラリープラグインが数多く存在します。これらのプラグインを利用することで、ポートフォリオや実績紹介エリアを簡単に作成することができます。プラグインによっては、スライダー機能やフィルタリング機能も備えているものがあり、より見やすく使いやすいデザインにすることができます。

• カスタム投稿タイプを利用する方法 Wordpressでは、カスタム投稿タイプを作成することができます。カスタム投稿タイプを作成して、ポートフォリオや実績紹介エリアを独自に設計することができます。また、カスタム投稿タイプには、カスタムフィールドを設定することができるため、より柔軟なデザインにすることができます。

• ページビルダープラグインを利用する方法 ページビルダープラグインを利用することで、ポートフォリオや実績紹介エリアを自由に設計することができます。ページビルダープラグインには、豊富なウィジェットが用意されているため、デザイン性の高いポートフォリオや実績紹介エリアを作成することができます。

ポートフォリオや実績紹介エリアを設置する際には、以下の点に注意することが重要です。

• わかりやすいカテゴリ分けを行う

• 画像や文章を工夫して、訪問者にアピールする

• トップページからすぐにアクセスできるようにする

• レスポンシブデザインにする

これらのポイントを意識しながら、ポートフォリオや実績紹介エリアを設置することで、訪問者にアピールするサイト型トップページを作成することができます。

お客様の声やテストモニアルエリアの設置

お客様の声やテストモニアルエリアは、ビジネスの信頼性を高める重要な要素の一つです。このエリアをサイト型トップページに設置することで、ビジネスに対する信頼感を高め、新規顧客の獲得につなげることができます。

お客様の声やテストモニアルを掲載するには、以下の手順に従います。

STEPお客様からの許可を得る お客様の声やテストモニアルを掲載する前に、お客様からの許可を得る必要があります。掲載することに同意しているかどうかを確認し、同意が得られた場合にのみ掲載してください。

STEPコンテンツを収集する お客様の声やテストモニアルを収集するには、アンケートフォームや電子メールによるアンケートなど、さまざまな方法があります。収集したコンテンツは、テキスト形式で入力されたものや、動画や音声形式で提供されたものなど、形式に関わらず、サイト上に掲載することができます。

STEPデザインを検討する お客様の声やテストモニアルを掲載するエリアのデザインは、サイトのデザインに合わせて検討する必要があります。例えば、お客様の声やテストモニアルをスライドショー形式で表示する場合、サイトのカラースキームに合わせたスライドショーのデザインを検討する必要があります。

STEPコンテンツを掲載する お客様の声やテストモニアルを掲載するには、WordPressのカスタム投稿タイプを使用すると便利です。カスタム投稿タイプを使用すると、テキスト、画像、動画、音声など、さまざまな形式のコンテンツを掲載することができます。

STEPアピールポイントを強調する お客様の声やテストモニアルを掲載する際には、アピールポイントを強調することが重要です。例えば、お客様の声を掲載する際には、どのようなサービスや商品についての声かを明確に示してアピールポイントを強調します。

まとめ

今回は、WordPressでサイト型トップページの作成方法をお届けしました。

サイト型トップページは、サイト全体をまとめる重要なページでSEOに効果があり、ブログ型トップページとは異なり、自由度が高くデザインの訴求ができます。ぜひ、挑戦してみてください。

このサイトでも利用している、Wordpressテーマ「SWELL」は、サイト型トップページをかんたんに作れるようにカスタマイズされているのでおすすめです。

🦊 あわせて読みたい！草壁シトヒ公式ブログ攻略アーカイブ

• 【山本りとサロン評判】口コミと入会メリットを本音レビュー
• 【ゆるSEO】個人ブログが10万PV達成するための完全攻略法