Twitterカードバリデーターとは何ですか?その使用方法は?

公開: 2022-04-08

では、Twitterカードバリデーターとは何ですか?

それを知るには、まず、Twitterカードとは何かを理解する必要があります。

気分が悪くならないでください。 Twitterカードを知らないのはあなただけではありません。

ほら、Twitterはあなたのコンテンツマーケティングの夢を実現するための優れたプラットフォームです。

ソーシャルメディアの統計によると、Twitterには3億5000万人以上のアクティブユーザーがいます。 それはあなたのコンテンツの努力を通して変換するのを待っている質の高いトラフィックの巨大なプールです。

では、どのようにCTRをスパークさせますか? 視聴者をあなたのウェブサイト、ブログ、ランディングページに誘導するのに十分なほど魅力的なツイートを作成するにはどうすればよいですか?

有益で、魅力的で、よく構成されたツイートを作成することによって。 さて、たった280文字の制限で、これらすべてをどのように実行しますか?

そこでTwitterカードが登場します。 Twitterカードを使用すると、文字数の制限を超えることなく、注目を集める情報をフォロワーに伝えることができます。

このブログでは、Twitterカード、Twitterカード検証ツール、およびそれらを使用してTwitterマーケティングを通じて着信リードを拡大する方法についてすべて説明します。

リッピングしましょう!

Twitterカードとは何ですか?

Twitterカードは、リンクツイートをより魅力的で構造化された外観にして、視聴者とのやり取りをより魅力的にするように設計されています。 彼らの没入型体験は、より多くのトラフィックを共有ページに移動する可能性を高めます。

あなたがしなければならないのはあなたのウェブページに数行のコードを追加することです、そして誰かがあなたのコンテンツのリンクを共有するときはいつでも、それは彼らのすべてのフォロワーにツイッターカードとして表示されます。

ここで、Twitterのシステムはツイート内のURLを認識し、サイトをクロールしてカードの種類とコンテンツを取得し、ツイートを構成します。

これまでTwitterカードのことを聞いたことがないかもしれませんが、Twitterフィードで毎日目にするものです。

以下のTwitterカードの例を見てください。 ここで、YouTubeビデオへのリンクがこの美しいプレーヤーカードに置き換えられました。

jonathan-cipriano

Twitterカードは新しいものではありません。 多くの人が以前にそれらを使用して、140文字の制限を超え、より多くの情報を共有していました。 現在、文字数制限が変更されていますが、カードはまだ使用されています。

Twitterカードについてもっと知りましょう。

Twitterカードの種類

Twitterはさまざまなカードオプションを試し、以前は潜在顧客カードを持っていましたが、後で廃止しました。 現在、4種類のTwitterカードを作成するオプションがあります。

各カードは、サポートするメディアの種類に基づいて、異なる視覚体験を提供します。 実装するカードの種類を選択する必要があります。

注: 1ページに1枚のカードしか持てません。

1.Twitterサマリーカード

名前が示すように、サマリーカードには、共有するWebページの適切な概要が表示されます。これには、サムネイル、タイトル、説明、およびページのURLが含まれます。

twiiter-anniversary

サマリーカードは、ブログの投稿、ニュース記事、eコマース製品、レストランのレビューなど、さまざまな種類のWebコンテンツを紹介するための優れた方法です。

カード自体の簡単な説明は、ユーザーがツイートをクリックしてコンテンツに移動するための優れた召喚状として機能します。

Twitterサマリーカードをサイトに追加するにはどうすればよいですか?

サマリーカードを追加するには、以下に記述されたコードを適切な属性でWebサイトのヘッダーに貼り付ける必要があります。

  • まず、カードの種類を定義します。
<meta name="twitter:card" content="summary" />
  • 次に、カードが帰属するアカウントの@usernameを入力します。
<meta name="twitter:site" content="@username" />
  • 次に、コンテンツページの鮮明なタイトルを書きます。 AndroidおよびiOSアプリのタイトルは、2行に切り捨てられ、Web表示では1行になります。 したがって、70文字未満にしてください。
 <meta name="twitter:title" content="Title of your webpage" />

コンテンツページを適切に要約するための200文字の説明。 説明としてタイトルを使用しないことを忘れないでください。 それは無駄になります。

 <meta name="twitter:description" content="Description" />
  • 次に、Twitterカードに表示する画像のURLを指定します。
 <meta name="twitter:image" content="image URL" />

最良の結果を得るには、次の寸法と文字数制限を使用してください。

タイトル:70文字

説明:200文字

サポートされている画像のサイズ:アスペクト比1:1、最小サイズ144X144ピクセル、最大4096×4096ピクセル。

画像サイズ:5MB未満

2.大きな画像のTwitterサマリーカード

要約カードを考えますが、大きな画像があります。

大きな画像のサマリーカードは、通常のサマリーカードと同じ機能を備えていますが、大きな画像を追加できる点が異なります。

chandraveer-singh

ブランドは、Webページの視覚的要素を強調するためにそれを使用します。 大きな構造化された画像は、混雑したTwitterタイムラインの中で優れたスクロールストッパーになる可能性があります。

大きな画像のTwitterサマリーカードをサイトに追加するにはどうすればよいですか?

以下は、ツイートに大きな画像を含むサマリーカードを実装するためにサイトに追加する必要のあるメタタグです。

 <meta name=”twitter:card” content=”summary_large_image”> <meta name=”twitter:site” content=”@yourwebsite”> <meta name=”twitter:creator” content=”@yourtwitterhandle”> <meta name=”twitter:title” content=”your title”> <meta name=”twitter:description” content=”your description.”> <meta name=”twitter:image” content=”image URL">
<meta name=”twitter:card” content=”summary_large_image”> <meta name=”twitter:site” content=”@yourwebsite”> <meta name=”twitter:creator” content=”@yourtwitterhandle”> <meta name=”twitter:title” content=”your title”> <meta name=”twitter:description” content=”your description.”> <meta name=”twitter:image” content=”image URL">

大きな画像のサマリーカードの寸法:

タイトル:70文字

説明:200文字

サポートされている画像のサイズ:アスペクト比2:1、最小サイズ300×157または最大4096×4096ピクセル。

画像サイズ:5MB未満

3.Twitterアプリカード

Twitterは、Webサイトのコンテンツを宣伝するだけでなく、アプリケーションを宣伝してインストールを促進するための優れた場所でもあります。 結局のところ、Twitterユーザーの80%がモバイルデバイスでプラットフォームにアクセスしています。

アプリカード機能を使用すると、アプリケーションの宣伝がより面白くなります。 アプリカードは、 Twitterでアプリを宣伝してダウンロードを増やすのに最適な方法です。

名前、アイコン、説明、さらにはアプリケーションの価格や評価などの情報が表示されます。

social-media-tool

ちなみに、アプリケーションがアプリストアで公開されていることを確認してください。 そうしないと、Twitterはアプリカードを作成するために必要なデータを引き出すことができません。

あなたのサイトにアプリカードを追加する方法は?

  • アプリカードを追加するには、次のコードをWebページのHTMLに貼り付けます。
 <meta name=”twitter:card” content=”app”> <meta name=”twitter:site” content=”@yourwebsite”> <meta name=”twitter:description” content=”your description”>
<meta name=”twitter:card” content=”app”> <meta name=”twitter:site” content=”@yourwebsite”> <meta name=”twitter:description” content=”your description”>
  • デフォルトでは、Twitterは米国のストアからデータを取得するため、アプリが別の国で利用できる場合は、以下のタグを使用して国名を定義します。
 <meta name=”twitter:app:country” content=”your country like US”>
  • 次に、App Storeでアプリケーションの名前、アプリID、およびURLを定義します。
 <meta name=”twitter:app:name:iphone” content=”your iphone app name”> <meta name=”twitter:app:id:iphone” content=”your iphone app ID”> <meta name=”twitter:app:url:iphone” content=”your iphone app URL”>
<meta name=”twitter:app:name:iphone” content=”your iphone app name”> <meta name=”twitter:app:id:iphone” content=”your iphone app ID”> <meta name=”twitter:app:url:iphone” content=”your iphone app URL”>
  • iPad向けに最適化されたアプリのタグ。 アプリがiPad用に最適化されていない場合は、iPhoneの場合と同じ方法でタグを入力します。
 <meta name=”twitter:app:name:ipad” content=”your ipad app name”> <meta name=”twitter:app:id:ipad” content=”your ipad app ID”> <meta name=”twitter:app:url:ipad” content=”your ipad app URL”>
<meta name=”twitter:app:name:ipad” content=”your ipad app name”> <meta name=”twitter:app:id:ipad” content=”your ipad app ID”> <meta name=”twitter:app:url:ipad” content=”your ipad app URL”>
  • GooglePlayに存在するアプリに同じパラメータを定義します。
 <meta name=”twitter:app:name:googleplay” content=”your googleplay app name”> <meta name=”twitter:app:id:googleplay” content=”your googleplay app ID”> <meta name="twitter:app:url:googleplay" content="your Google Play app URL ">
<meta name=”twitter:app:name:googleplay” content=”your googleplay app name”> <meta name=”twitter:app:id:googleplay” content=”your googleplay app ID”> <meta name="twitter:app:url:googleplay" content="your Google Play app URL ">

アプリカードで覚えておくべき寸法:

タイトル:アプリIDから取得

説明:200文字

画像:iTunes /GooglePlayストアにアップロードする画像のサイズは1MB未満である必要があります

4.Twitterプレーヤーカード

ビデオはコンテンツマーケティングの王様であり、Twitterスペースのようなオーディオプラットフォームの出現により、オーディオもTwitterマーケティングの最前線に立ち始めました。

幸いなことに、プレーヤーカードは両方のメディアタイプをサポートし、Twitter周辺のユーザーにより豊かな体験を提供します。

彼らは何をしますか?

プレーヤーカードは、リンクにあるビデオまたはオーディオを自動的に引き出し、タイムラインまたはフィードですぐに再生できるため、ユーザーはマルチメディアを操作するためだけにアプリを離れる必要はありません。

cartier

このカードは、新製品のビデオ、ポッドキャストスニペット、舞台裏、ブランドイベントを宣伝するための優れた方法です。

サイトにプレーヤーカードを追加するにはどうすればよいですか?

以下はサンプルコードです。WebページのHTMLに貼り付ける必要があります。

 <meta name="twitter:card" content="player" /> <meta name="twitter:site" content="@username" /> <meta name="twitter:title" content="Title of your video" /> <meta name="twitter:description" content="Description." /> <meta name="twitter:image" content="Image URL" /> <meta name="twitter:player" content="https://yoursite.com/container.html" /> <meta name="twitter:player:width" content="Width" /> <meta name="twitter:player:height" content="Height" />
 <meta name="twitter:card" content="player" /> <meta name="twitter:site" content="@username" /> <meta name="twitter:title" content="Title of your video" /> <meta name="twitter:description" content="Description." /> <meta name="twitter:image" content="Image URL" /> <meta name="twitter:player" content="https://yoursite.com/container.html" /> <meta name="twitter:player:width" content="Width" /> <meta name="twitter:player:height" content="Height" />

さまざまなプラットフォームでプレーヤーカードのエクスペリエンスをテストするためのより深い理解と手順については、こちらにアクセスしてください。

Twitterカードバリデーターの使い方は?

カードを選択してタグをWebサイトに公開したら、次のステップはすべてが正しく機能しているかどうかを確認することです。

どうやってそれをしますか? たった2つの簡単なステップでTwitterカードバリデーターの助けを借りて:

card-validator

ステップ1 :TwitterカードバリデーターのWebページに移動します。

ステップ2 :メタタグを使用してページのURLを貼り付けます。 「プレビューカード」ボタンをクリックします。

すべてが正常に機能している場合、カードプレビューには、カードがTwitterフィードにどのように表示されるかが表示されます。 さらに、メタタグの数、カードの種類、およびカードが正常に読み込まれたことの成功メッセージに関する情報が表示されます。

card-preview

一方、カードが見つからない場合やその他の問題がある場合は、ログセクションにエラーメッセージが表示されます。

log

結論

Twitterカードが古いからといって、機能しないわけではありません。 メディアが添付されたツイートは、通常のツイートよりもうまく機能することが統計的に証明されています。 Twitterカードがあなたのために不思議に働くための手がかり。

マーケティング戦略に沿った適切なTwitterカードは、Twitterプロファイルの可視性、エンゲージメント、および全体的な美学を高めることができます。

したがって、このアイデアに賛同し、チームと話し合い、バックエンド開発者を機能させるようにしてください。

さらに、私のように、Twitterがあなたのブランドを作り上げたり壊したりする可能性があると信じていて、流れを変えることに真剣に取り組んでいる場合。 今日SocialPilotを試してみてください!