スマートフォンサイトを表示する

  1. TOP
  2. みんビズ制作講座 集客を考えてみよう : 第1回 META要素・OGPを登録してみよう

エキスパートコラム

みんビズ制作講座:集客を考えてみよう(全2回)

第1回:META要素・OGPを登録してみよう

執筆:原 一宣。(株式会社Gazi工房)

2012年9月5日更新

  • このエントリーをはてなブックマークに追加

閲覧数11,237views

このコラムをPDF形式でダウンロードする

「集客を考えてみよう」では、みんビズを使って作成したホームページに集客をするための基本的なテクニックを解説します。第1回目では、META要素・OGPの設定方法を紹介します。

META要素を設定しよう

META要素とは

META(メタ)要素とは、ホームページの特定の場所に記述することによって、ページにさまざまな情報を付加することができるものです。例えば、ブラウザがページを解析するための情報、検索ロボットに対する指示のため等に使われています。
みんビズでは、このMETA要素が以下の3つに分類され、指定することができます。

  1. ページタイトル
  2. ページ内容詳細
  3. タグ(キーワード)

ページタイトルを設定しよう

ページのタイトルを変更することができます。
ページタイトルとは、下図のようにブラウザでページを開いた時に画面の最上部に表示されている文字です。お気に入りに登録する際や、検索エンジンの検索結果にも表示されるので、他のホームページと差別化を図る上でも重要なものです。
何について語られているページなのか一目で理解できる内容やアピール文を織り込むと効果的です。

ヒント:
ページタイトルに含めるべきものとして、ホームページ名、会社名、主要な取り扱い品やサービス、所在地等の要素をページの内容に合わせて含めると良いでしょう。

  1. ログイン後、右のツールボタンから「設定」を選択します。

  2. 「検索エンジン」から「ページタイトル」を選択します。

  3. ページタイトルが変更可能な状態になりますので、ページタイトル・ホームページタイトルにそれぞれ文字を入力します。

  4. 編集が終わったら入力した内容を確認し、「保存」ボタンをクリックし完了です。

ヒント:
ページタイトルはみんビズのホームページ全体のタイトルを指し、ホームページタイトルは個別のページタイトルとなります。

ページ内容詳細を設定しよう

ページ内容詳細とは、ホームページの紹介を225文字以内で入力できる機能です。
ここに入力された内容は、検索エンジンに反映されます。ホームページに閲覧者を誘導するために、誰に対してもわかりやすく、ページに関連したキーワードを駆使した紹介文を入力します。

  1. ログイン後、右のツールボタンから「設定」を選択します。

  2. 「検索エンジン」から「ページ内容詳細」を選択します。

  3. ページ内容詳細が編集可能な状態となりますので、ページの紹介文を入力します。 「全般」の部分にはホームページ全体の紹介文として内容を入力します。 ナビゲーションの編集で登録された個別ページに関しても入力することができます。(JimdoFreeでは、個別ページへのページ内容詳細の入力はできません。)

編集が終わったら入力した内容を確認し、「保存」ボタンをクリックし完了です。

ヒント:
ページ内容詳細には255文字を入力することが可能ですが、検索エンジンでは255文字は反映されません。100文字以内での入力をお薦めします。

タグ(キーワード)を設定しよう

みんビズで作成したホームページに関連するタグ(キーワード)を入力することができます。このタグは、検索エンジン(メタタグ)で利用されます。例えば、居酒屋さんのホームページの場合、 タグは 「居酒屋, 宴会, ビール」 などが最適となります。

  1. ログイン後、右のツールボタンから「設定」を選択します。

  2. 「検索エンジン」から「タグ(キーワード)」を選択します。

  3. タグ(キーワード)が編集可能な状態となりますので、ページに関連するキーワードを入力します。(複数のキーワードを入力する場合、半角カンマで区切ってください。)「一般」の部分にはホームページ全体のキーワードを入力します。また、ナビゲーションで登録された個別ページに関しても、それぞれに適切なキーワードを入力することができます。(JimdoFreeでは、個別ページへのキーワードの入力はできません。)

    ヒント:
    アピールしたいキーワード順に入力し、多くとも10キーワード以内にとどめるのが良いでしょう。

  4. 編集が終わったら入力した内容を確認し、「保存」ボタンをクリックし完了です。

OGPを設定しよう

OGPとは

OGP(Open Graph Protocol)は、フェイスブックを始めミクシィやグーグルプラス等のSNSで「シェア」や「いいね!」で共有された際に、画像や紹介文を表示させるMETA(メタ)要素です。OGPを適切に設定することで、SNSを通して多くの人に記事を見てもらう機会が高くなり、結果的にホームページの集客につながる施策になります。

OGPのコードを貼り付ける

  1. ログイン後、右のツールボタンから「設定」を選択します。

  2. 「ウェブサイト」から「ヘッダー部分の編集」を選択します。

  3. ヘッダー部分が編集可能な状態となります。 以下のコードの「 " 」で囲まれた部分をご自身のホームページに合わせたものを入力し、貼り付けます。「og:type」は「article」・「blog」・「website」の中から選んで入力します。
  4. 入力が終わったら、「保存」ボタンをクリックします。

<meta property="og:type" content="ページのタイプ(種類)">
<meta property="og:title" content="ページのタイトル">
<meta property="og:url" content="ページのURL">
<meta property="og:image" content="表示したい画像のURL">

ヒント:
OGPに設定する画像は、フェイスブックにおいて200×200px以上(ミクシィは180px以上)の正方形の画像が推奨されています。(2012年8月20日現在)
また、独自レイアウトのファイルアップロード機能やコンテンツメニューの「写真」からアップロードした画像は、システムの都合上定期的にURLが変更になるため、外部サーバーにアップロードしておくことをおすすめします。(OGPに設定する画像は、必ずしもホームページ内で使用している必要はありません。)

OGPが設定できたか確認をしよう

OGPの設定ができたら、実際にフェイスブック等で共有して画像、タイトル、URL、説明が正しく表示されているか確認してみましょう。なお、「ヘッダー部分の編集」に入力した内容はすべてのページに適用されるため、ページごとに設定を変えることはできません。

ヒント:
OGPを設定してもフェイスブックにキャッシュが残り、設定が反映されない場合があります。そのような時は「デバッガー」というツールを使ってキャッシュをクリアすることができます。 使用方法は、OGPを設定したページのURLを入力するだけとなっています。

次回第2回「リスティング広告」では、Google アドワーズを利用した広告の掲載方法について解説します。

  • このエントリーをはてなブックマークに追加
このコラムをPDF形式でダウンロードする

原 一宣。(はら・かずのり)

原 一宣。(はら・かずのり)

株式会社Gazi工房 代表取締役/JimdoExpert
http://gazikobo.co.jp/

1974年、福島県福島市生まれ。東北福祉大学社会福祉学部社会福祉学科卒業。山形県川西町在住。食品加工会社、電子基板製造会社を経て、フリーランスでWeb制作活動を開始。
2007年に株式会社Gazi工房を設立。Webサイトの企画・設計、制作業務に従事。
イラストやキャラクターデザイン、地域づくりの企画・助言、パソコン教室なども行う。
元東北芸術工科大学 非常勤講師。クリエイティブユニット「gabs」メンバー。
CSS Nite in FUKUSHIMA実行委員。

著書『HTML5+CSS3の新しい教科書 基礎から覚える、深く理解できる。』(共著、エムディエヌコーポレーション)、『ああしたい、こう変えたいが手にとるようにわかるCSS基礎』(同)。

ああしたい、こう変えたいが手にとるようにわかるCSS基礎

  • はじめてWEB 大感謝祭!~新規加入または2年目更新をし、アンケートに答えてギフト券をもらおう!~
  • Jimdoリメイク | プロがあなたのホームページを今なら45,000円(税抜)でリニューアル!
  • 問い合わせ件数をアップさせるなら!「通話料無料・わかりやすい番号」のフリーコール
  • 文具、通信、オフィスのことなら何でもお任せ!まとめてオフィス

ホームページを作るのがはじめてのかたはまずこちらをご覧ください

コラム週間アクセスランキング[期間:2017/3/12~2017/3/18]

おすすめコンテンツ

はじめてWEBおすすめ本

創業・経営のお役立ち情報

  • ソウギョウノート

    飲食・小売・サービス業の開業スケジュールから、融資申込に必要な書類までをカンタン作成

  • 経理通信

    経営者と経理ご担当者必見!中小企業・小規模事業者のための経理サポートサイト

  • まとめてオフィス

    文具、通信、オフィスのことなら何でもお任せ

  • フリーコールS

    問い合わせ件数をアップさせるなら!「通話料無料・わかりやすい番号」のフリーコール

  • auオフィスナンバー

    事務所開設するなら固定電話番号で信頼アップ
    今ならキャンペーン実施中!