html999 » はじめてのOGP設置方法とどこまで設定するかを考える
いまさら感ありますが、はじめてOGPを設定する機会があったのでまとめます。 （薄い知識でお届けします） そろそろ企業サイト（かため）のようなWebサイトでも、Faviconとセットくらいの感覚で設定するようおすすめした方がよさそうです。 （注意：OGPの仕様がころころかわるので、すぐに間違いになる可能性があります！だいたい2013年の4月頃に調べた内容を元にしています。気づいたところがあれば更新していく予定） ※og:imageの推奨サイズが変更になっていたので修正しました（2014/12/07追記） OGPとは SNS向けの記述で、<head>～</head>内に記述するmeta情報。 facebookなど（他にもmixi、Google＋などが対応しているらしい）で、そのページがシェア（facebookの「いいね！」とか）されたときにSNS上で表示される情報を指定するためのもの。 どんな
OGP画像シミュレータ | og:image Simulator
OGP画像シミュレータとは？ FacebookのOGP画像は正方形で表示されたり横長で表示されたりするため、デザインがとても大変。 そんな時に便利なのがこのOGP画像シミュレータ。 デザインしたOGP画像をドラッグ&ドロップし、タイムライン上でどう見えるかシミュレートしてみましょう。 https://ogimage.tsmallfield.com/ 1200 x 630 px 以上推奨 https://developers.facebook.com/docs/opengraph/creating-object-types/#properties 最低でも 600 x 315 px、また大きければ大きいほど良いため 1200 x 630 px 以上の画像サイズが推奨されています。画像がクリッピングされるのを防ぐため、縦横比をなるべく1.91:1に近づけるようにしましょう。 （2014年01月
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
FacebookのOGPを簡単に確認するためのChrome拡張作ったよー : 異聞録
5月17 FacebookのOGPを簡単に確認するためのChrome拡張作ったよー 一昨日、FacebookのOGPを簡単に確認するための ブックマークレットを作りました。 FacebookのOGPを簡単に確認するためのブックマークレット作ったよー 昨日、AMNのエンジニアの松村さんがFirefoxアドオン版を作りましたので、 悔しくて、Google Chrome拡張機能版も作ってしまいました。 FacebookのOGPcheckerのFirefoxアドオンを作ったよ。 ということで、こちらからどうぞ。 Chrome ウェブストア - OGP Checker ツールバーと右クリックから見ているページのOGP を1クリックで確認しに行けます。 インストール時に「マニフェストが無効です」というメッセージがありますが、 何故か、ページを更新して、もう一度試すと、普通にインストールできたりします。
フェイスブック、ミクシィ、グリーで使われている OGP (Open Graph Protocol) とは何か - IT戦記
みなさん、こんにちは お元気ですか？僕は元気です。 さて 最近よく、「いいね！」ボタンや「ミクシィチェック」ボタンによって、ウェブページを紹介し合う文化が少しずつ定着してきたなーと思います。 そんな中で、今後重要になってくるんじゃないかと思われる OGP （Open Graph Protocol）と言われる仕様があります。今日はそのことについて書いてみたいと思います。 OGP? おーじーぴー？？とはなんでしょうか。 OGP とは 簡単に言うと「このウェブページは何のことを書いているか」という情報を、プログラムから読める形で HTML に付加する記述方法のことです。 まあ、普通のウェブページは人間が読めばだいたい何のことが書いてあるか分かりますよね。 ですが、プログラムは人間ほど頭が良くないので、そのウェブページ内の文章だけではそのページが何のことについて書かれているページなのか正確に識別す
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
tslab.net
オリジナルフォントが作れるiPad用フォント作成アプリ「iFontMaker」｜linker journal｜linker