POLICYサイトマップSITEMAPCOLUMNコラムALLビジネステクノロジーWebマーケティングWeb制作CATEGORYTOPWebマーケティングいまさら聞けない!OGPとは?2019.03.26Webマーケティングいまさら聞けない!OGPとは?赤猫ツイートwebサイトを制作していざ公開!という時に、「OGP」の設定をし忘れていることはありませんか?この「OGP」の設定、webページやブログの記事をSNS上でシェアしたい、シェアされたい方にとってはとても重要な設定事項です。Protocol」の略。FacebookやTwitterなどのSNSでwebページやブログの記事がシェアされた時、またLINEなどのメッセージ機能でページのURLを送信した時に、そのページのタイトル、URL、概要、画像を表示させる仕組みのことです。OGPを設定するメリットは?OGPを設定することによって、ページや記事の内容を分かりやすくユーザーに伝えることができます。SNSを見ている際、タイムラインに誰かがシェアしたページや記事が流れてくることがあります。その時にページの概要が書かれていたり、関連する画像が一緒に表示されていたら、どんな内容のページなのかが事前に分かりますよね。読んでみようかなという気持ちになり、ついついクリックしてしまった経験が少なからずあると思います。どのように設定するの?HTMLにはメタタグをいう、ブラウザ上には表示されることのない、ホームページの設定などを記述する箇所があります。OGPはそのメタタグの一つなので、タグの中に記述をします。その前に、これからogpを使いますよ!という宣言をする必要があり、その宣言をhtmlタグの中に追加します。http://ogp.me/ns#”という記述を追加しましょう。http://ogp.me/ns#">基本的な記述headタグの中に以下の記述をします。content="サムネイル画像のURL>og:titleページのタイトルを記述します。og:typeページのタイプを記述します。トップページの場合websiteまたはblog、下層ページはarticleです。og:descriptionページの概要として表示される説明文を記述します。og:urlページのURLを記述します。絶対パスで指定してください。og:site_nameサイト名を記述します。og:imageSNSでシェアされた場合に表示される画像を設定します。ここで画像を設定しない場合は、ページ内で使用されている画像からランダムで画像が選ばれて表示されます。Facebook用の記述サイトやブログの管理者をFacebookに伝えるためのタグだそうですが、この記述がなくても上記のみでページの情報は表示されます。この記述をすることによって、Facebookからサイトへのトラフィック分析ができるFacebookインサイトを利用できるようになるようです。content="[app_id]">Twitter用の記述Twitter用に指定するのは、カードのタイプ(大きさ)です。「summary」か「summary_large_image」のどちらかを選んで指定します。画像とテキスト情報が横並びに表示されます。summary_large_image画像が横いっぱいに表示され、その下にテキスト情報が続きます。以上が基本的なOGPの設定です。Webマーケティングホームページ制作したけど、集客できないのはなぜ?5つの改善策こんにちは。Webマーケティングペルソナ設定についてはじめてコラムを書きます、webディレクターのshiyumaです。SEOに影響が出るGoogleのコアアップデートが最近行われました。北堀江GATEビル5Fプライバシーポリシーサイトマップホームページ制作・作成なら大阪のWEB制作.com。