Twitter Cards #twtr_hack
Upcoming SlideShare
Loading in...5
×

Like this? Share it with your network

Share
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
5,380
On Slideshare
2,126
From Embeds
3,254
Number of Embeds
11

Actions

Shares
Downloads
6
Comments
0
Likes
6

Embeds 3,254

http://samuraism.jp 1,646
http://api.techmood.jp 1,450
http://androidcat.seesaa.net 93
https://twitter.com 48
https://www.google.co.jp 5
http://webcache.googleusercontent.com 3
http://www.feedspot.com 2
http://yusuke.homeip.net 2
http://tweetedtimes.com 2
http://cockerels11.rssing.com 2
http://freerss.net 1

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1.  Twitter Cards  #twtr_hack 2013/2/1 Yusuke Yamamoto
  • 2. Twitter Cardshttps://dev.twitter.com/docs/cards Yusuke Yamamoto
  • 3. Twitter Cardsとは• ツイートにメタ情報を埋め込むための仕様 Yusuke Yamamoto
  • 4. サイトでTwitter Cardsを利用する • http://twitter4j.org/ の例<html> <head> <title>Twitter4J - A Java library for the Twitter API</title> <meta name="twitter:card" content="summary"> <meta name="twitter:site" content="@t4j_news"> <meta name="twitter:creator" content="@yusuke"> <meta name="twitter:url" content="http://twitter4j.org/ja/"> <meta name="twitter:title" content="Twitter4J"> <meta name="twitter:description" content="Twitter4J は TwitterAPI の Java ラッパです。"> <meta name="twitter:image" content="http://twitter4j.org/images/twitter4j.png"> </head> <body>...</body></html> Yusuke Yamamoto
  • 5. Twitter Cardsの仕様• カードの種類指定• summary: デフォルト。ページの要約• photo: 写真• player: ビデオ、オーディオ、メディアプレーヤ <meta name="twitter:card" content="summary"> Yusuke Yamamoto
  • 6. Twitter Cardsの仕様• その他の要素 twitter:url 正規化されたURL twitter:title タイトル twitter:description 説明 twitter:image イメージ twitter:url twitter:image twitter:titletwitter:description Yusuke Yamamoto
  • 7. その他のタグ twitter:site サイトの公式アカウント@スクリーン名 twitter:site:id サイトの公式アカウントユーザID twitter:creator コンテントの作成者@スクリーン名twitter:creator:id コンテントの作成者ユーザID Yusuke Yamamoto
  • 8. Twitter CardsとOpen Graph• Twitter CardsはOpen Graphベース http://ogp.me より Yusuke Yamamoto
  • 9. Twitter CardsとOpen Graph要素の対応 Twitter Cards要素 Open Graph要素 twitter:url og:url twitter:title og:title twitter:description og:description twitter:image og:imagehttps://dev.twitter.com/docs/cards → Overview of all Twitter Card Tags Yusuke Yamamoto
  • 10. Open Graph対応でFacebookフレンドリーに Yusuke Yamamoto
  • 11. Twitter Cardsまとめ• とりあえず指定しておくべき要素 twitter:card summary og:url ページURL og:title ページタイトル og:description ページ説明 og:image ページイメージ• 早めの申請を! Yusuke Yamamoto
  • 12. Twitter Cardsのテスト• https://dev.twitter.com/docs/cards/previewでテスト Yusuke Yamamoto
  • 13. Twitter Cardsの申請• https://dev.twitter.com/form/participate-twitter-cards より申し込み Yusuke Yamamoto
  • 14. Twitter Cardsの申請• 申請完了画面• レビューは通常5∼10営業日 Yusuke Yamamoto
  • 15. Twitter Cardsの申請• 承認通知メール twitter-card-support@twitter.com より通知 Yusuke Yamamoto