タグ

Web制作とogpに関するnetamixのブックマーク (5)

  • FacebookのOGP設定を確認する方法 | note | non-standard world, Inc.

    OGP(Open Graph Protocol)は、FacebookをはじめGoogle+、mixiなどのソーシャルメディアに対して、外部サイトの情報を投稿するための規格です。 これがきちんと設定されていることで、ソーシャルメディア上でサイトのURLがシェアされた時に、そのサイトやページの情報が、サムネール画像付きで適切に表示されます。 ソーシャルメディアからのサイト流入が増えている昨今、OGPをきちんと設定しておくことは重要なポイントです。 自分のサイトのOGPがきちんと設定されているか、確認する方法をご紹介します。 Facebook デバッガーの使用 Facebookで”いいね!”を押された際に表示されるサムネール画像をはじめ、OGPが正しく設定されているかを確認できる、Facebook公式のツールです。 Facebook デバッガー の使い方 1. Facebook デバッガーにアク

    FacebookのOGP設定を確認する方法 | note | non-standard world, Inc.
  • Twitter Cardsを設定して自社サイト情報をツイートに出す2つの手順(OGP済みなら10分でOK) | 初代編集長ブログ―安田英久

    今日は、Twitter格的に展開を進めている「Twitter Cards(ツイッターカード)」を表示するための、サイトの変更方法を解説します。Facebookでシェアされたときの表示を指定する「OGP」を設定しているサイトなら、10分で完了するような内容です。 2012-09-06: 申請後しばらくしたら、自分のアカウントでカードが表示されるようになり、Web担のサイトのURLでカードが表示されるようになりました。 Twitter Cards(カード)とは?Twitter Cardとは、Twitterが進めているツイート表示のリッチ化の仕組みのこと。ツイート内にURLが含まれている場合に、ツイートの詳細表示でそのページのタイトルや概要、アイコン写真などを表示するものです。 このカード表示は6月にスタートしたのですが、まだすべてのTwitterアカウントで有効になっているわけではなく、カ

    Twitter Cardsを設定して自社サイト情報をツイートに出す2つの手順(OGP済みなら10分でOK) | 初代編集長ブログ―安田英久
  • Getting started with Cards

    <g> <g> <defs> <rect id="SVGID_1_" x="-468" y="-1360" width="1440" height="3027" /> </defs> <clippath id="SVGID_2_"> <use xlink:href="#SVGID_1_" style="overflow:visible;" /> </clippath> </g> </g> <rect x="-468" y="-1360" class="st0" width="1440" height="3027" style="fill:rgb(0,0,0,0);stroke-width:3;stroke:rgb(0,0,0)" /> <path d="M13.4,12l5.8-5.8c0.4-0.4,0.4-1,0-1.4c-0.4-0.4-1-0.4-1.4,0L12,10.6L6.2

    Getting started with Cards
    netamix
    netamix 2013/11/18
    Twitterにリンクを投稿すると、タイムライン上の表示にリンク先の詳細情報を表示してくれるmetaタグ。URLだけでなく、タイトルや概要、画像のサムネイル表示
  • OGPの仕様追加:記事にひもづくFBページや個人アカウントとの連携を強める

    2013年06月21日02:32 by oklahomer OGPの仕様追加:記事にひもづくFBページや個人アカウントとの連携を強める カテゴリ 先日の開発ブログで、OGPの仕様追加が公開されました。これを用いることで、記事がニュースフィード上に流れるとき、その記事にひもづくFBページへのいいね!や個人アカウントのフォローを促すことができるようになります。 方法 方法は簡単で、Facebookページを紐づけるならarticle:publisherを指定 <meta property="article:publisher" content="https://www.facebook.com/cnn" /> 個人アカウントを紐づけるならarticle:authorを指定します。 <meta property="article:author" content="https://www.faceb

    OGPの仕様追加:記事にひもづくFBページや個人アカウントとの連携を強める
  • これだけは知っておきたいOGP (Open Graph Protocol) | NEX.FM

    Life is too short to worry about laundryOGP (Open Graph Protocol)。 facebook、mixi、GREEなどのSNSで使われている共通の仕様のことだが、重要な役割を担っている割に、あまり知られていない。今後のソーシャル時代に備え、確実におさえておきたい事項に間違いないので紹介する。特にウェブ制作をしていたり、サイトにいいね!ボタンを設置している方には、すぐにでも導入をおすすめする。 OGPとは OGPを簡単に説明すると、「このウェブページは、こんな内容です」ということを明言するための仕様だ。 誰に明言しているかというと、それは例えばfacebookに、だ。 facebookでは、あるウェブページがいいね!された時に、 「○○さんがリンクについていいね!と言っています」 とウォール上に投稿されることになるが、これはOG

  • 1