とあるweb屋の仕事術

とあるweb屋の仕事術

10年以上現役のweb製作屋さん。web製作雑務全部やる。

OGP画像(og:image)の表示確認に便利!OGP画像シミュレータ

OGP画像(og:image)の表示確認に便利!OGP画像シミュレータ

SNS戦国時代のいまでは

webサイト、webページでの

OGPタグの設定は欠かせません。

今回はそのOGPタグのひとつ、

OGP画像の作成に便利なサービスを紹介します。

 

SNSでどのように表示されるかは

実際にTwitter、Facebook、LINEなどに

投稿して確認しますよね。

開発者・製作者はかならず実機・実環境での

確認は絶対にしますが、その前に問題ないか

シミュレーションしたい。

そんなとき便利なサービスがこちら。

 

ogimage.tsmallfield.com

作成したOGP画像をアップロードすると

さまざまなUIパターンでどのように表示されるかを

シミュレーションすることができます。

 

実サイトで確認する前に、

問題がないかざっと確認するのに重宝しています。

 

あくまでシミュレーターなので、

各SNSやサービスでどのように表示されるかは

実機で確認するのが開発者の努め。

 

以下、雑談。

最近だとSlackやSkypeなどのチャットツールなどで

URLを貼るとリンクプレビュー機能でOGP画像が

表示されたりもします。

 

他サイトのOGP画像はどんなの画像が

設定されているのかの確認するのには

チャットにURLを貼る、というのが

手っ取り早くておすすめです。

 

OGPタグについてはこちらの記事が参考になります。

digitalidentity.co.jp