webdevqa.jp.net

iOS10メッセージリンクプレビュー画像

メッセージがFacebookOpen Graphと同様の構文を使用してメタディスクリプションや画像などを設定するかどうかを知っているiOS10ベータテスターはいますか?

私はサイトを構築していて、iOS10がリリースされたときにそれを準備したいと思っています。

これが私が話しているものの種類です:

<!-- Facebook Meta -->
<meta property="og:title" content="Site | Title of Page" />
<meta property="og:image" content="http://www.domain.com/im-content/social-post-images/facebook image.png" />
<meta property="og:url" content="http://www.domain.com" />
<meta property="og:site-name" content="Site | Title of Page"/>
<meta property="og:type" content="website" />
<meta property="og:description" content="Here is a description of my site that will show up in the Facebook card." />

そして、これが私が制御しようとしている画像/情報です:

enter image description here

11
Jon

少なくとも Open GraphTwitter Card を使用しています。

デモ

オープングラフ

マークアップ:

<meta property="og:image" content="https://www.j-26.com/assets/facebook.jpg"/>

プレビュー:

enter image description here


Twitterカード

マークアップ:

<meta name="Twitter:image" content="https://www.j-26.com/assets/Twitter.jpg"/>

enter image description here


注目すべき発見

私はテストしました このページ TwitterカードとOpen Graphを使用して、iOSはOpenGraphを好むようでした。テストページでは、TwitterカードのマークアップはOpen Graphマークアップの前に配置されTwitterカードに使用される画像は小さいOpenGraphで使用されているものよりも。サイズが小さく、配置が早いにもかかわらず、iOSはOpenGraphからの画像を表示することを選択しました。

13
John R Perry