ご自由にお取りください1
うちの近くに謎のご自由にお取りくださいコーナー
夜だから少なくなってた。
今度は朝に見てみよ。
そもそもいつ更新されてるんだろう。
誰がなんのために
毎日記録しよ
OGPタグを設定してtwitterにはるリンクをいい感じに
対象
はじめに
下にtwitterにリンクを張って投稿したときのスクリーンショットがあります。 1つはリンクのテキストだけしか表示されていません。一方2枚目の方は画像とページのタイトルや説明がありいい感じですね。
実は２つともリンクを張って投稿したいるだけなのですがこのように違いが出てしまうのです。 それではどうして違いが出るのか説明します。
OGPタグ
この２つの違いはブログのページに「OGPタグ」を設定しているかしていないかの違いです。 OGPタグでページのタイトルや説明、画像を設定することでtwitterやfacebookのSNSにリンクを張った際に SNSのほうでOGPタグの情報を読み取っていい感じに表示してくれます。
OGP Open Graph Protocol - SEO最新用語集│SEO Pack
OGP とは Open Graph Protocol (オープン・グラフ・プロトコル)の略称です。 Facebook、Twitter、mixi、google+などSNSと連携し、シェアされたときに、ページのタイトル、URL、概要、画像（サムネイル）を正しく伝えるためにHTMLソースに記述するタグ情報です。 OGPが設定されていと、SNS上でのクリック率が上がります。
wordpress(ワードプレス)での設定方法
ここからwordpressで簡単にOGPタグを設定する方法を解説していきます。
プラグインのインストール
wordpressの記事に簡単にOGPタグを設定できるプラグインがあるのでインストールして有効化します 「Open Graph for Facebook, Google+ and Twitter Card Tags」というプラグインです。
記事ごとにOGPタグを設定する
投稿の編集ページでタグの情報を設定していきます。
ポイントは設定する画像の名前に日本語を使わないほうがいいです。うまくいかないことがあります。
また最後に更新するのを忘れずに
Twitterに投稿! ・・・する前にチェック
ここまで来たらwordpressの記事のリンクをtwitterに貼ればいいのですが、 しっかりできているのかtwitterに投稿する前に確認することをおすすめします。
以下リンクからtwitter公式の確認ツールを利用することができます。
https://cards-dev.twitter.com/validator
投稿
ここまで来たらTwitterに投稿しましょう。 今回ご紹介したtoolを利用してwordpressの集客を効率的に進めていきましょう ！
PWAまとめ
PWAとは
- webアプリケーションにスマホアプリっぽい感じにする
- スプラッシュ画面とかを設定できる
- プッシュ通知とかできる
- fetchイベントをキャッチしてキャッシュの値を返せる(オフライン用の機能)
ManifestとかService Workerとか developers.google.com developers.google.com
導入のメリットとしては一時的なオフライン状態での動作 ページの読み込み速度改善 push通知
バックグラウンド同期はよさげ バックグランド同期は接続が復活したときにバックグランドでリクエストを送ってくれる。 それからユーザがタブを移動したり閉じたりした時にバックグラウンドで送信したいデータを送ることができる ファイルのアップロードとか、設定の変更、ドキュメントの更新、チャットメッセージとかとか
Introducing Background Sync | Web | Google Developers
何か実装してみたいけど、めんどくさい
しんねんだしなにかしなきゃ
