OGP画像の見え方を簡単操作でシミュレート！ - tsmallfield's diary
デザイナーのみなさんはOGP画像をデザインする機会がたくさんあると思います。 でもFacebookだと、OGP画像が正方形で表示されたり横長で表示されたりで、 レイアウトが大変ですよね。。。 そんな時に便利なのがこちら！！ og:image Simulator http://ogimage.tsmallfield.com/ 作成したOGP画像が、Facebookのタイムライン上でどのように表示されるかを、 簡単操作でシミュレートできるWEBアプリです。 使い方はとっても簡単！ 画像をブラウザにドラッグ＆ドロップするだけ。 正方形の場合と、横長の場合とでどのように表示されるかプレビューできます！ また、裏ワザ的な使い方として、 Facebook で http://ogimage.tsmallfield.com/ をシェアする際に 赤丸のボタン（複数のOGP画像の中から選ぶボタン）を操作するこ
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月
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
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アカウントで有効になっているわけではなく、カ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
