副業

【衝撃】ブログにツイートを埋め込みするとページが重くなる【解決策紹介】

消去、消す、delete
ブロガー
ブロガー
う~ん…ブログにツイートを沢山埋め込むと、やっぱ重くなるなー..

これって気のせいじゃないよね?他の人はどうしてるんだろ?

 

どうも、えいとです。

今回は、こんな疑問に回答していきます。

 

まず大前提として、何も対策を取らずにツイートを複数埋め込むと、ページの読みこみ速度は重くなります。

 

・ページの読み込み速度は2秒以内が適正

・3秒を超えると直帰率が大幅に跳ね上がる

というデータがあるので、このまま放置するとかなりの読者を逃がすことになります。

【関連記事】>>直帰率と離脱率の違いとは?GoogleアナリティクスはPV数を見るツールじゃありません

 

で、具体的な今回の対策を先に言うと、埋め込みコードの一部を削除するだけです

3秒で出来るくらい簡単なので、パパっと終わらせちゃって下さい

 

また、一応ですが「ツイートの埋め込み方法」から解説して行きますので、すでにご存じの場合は「目次」をクリックしてページを飛ばしてください。

ツイートの埋め込み方

まずは、ツイートの埋め込み方法を解説します。

各ツイートの右上にあるタブをクリックしてください。

ツイート

 

クリックをしたら、「ツイートを埋め込む」を選択します。

ツイート埋め込み

 

 

話を戻しますが、「ツイートの埋め込み」をクリックするとページが移り変わります。

ツイート埋め込み2

 

「コードをコピー」をクリックした後は、それをブログに貼り付けるだけです。

  • WordPress(ワードプレス)→テキスト
  • はてなブログ→html

 

「画像」や「リプライ」がある場合は、コードをコピーする画面にて

  • メディアを含めるか
  • 元のツイートを含めるか

のチェック欄が表示されるので、必要に応じてチェックを入れましょう!

中央寄せ、右寄せ

えいと
えいと
補足として、ツイート位置のカスタマイズ方法をご紹介します!

 

デフォルトの状態だと、ツイートは左寄せで埋め込みされます。

ツイート埋め込み左寄せ

 

少々バランスが悪く感じるので、「中央」or「右」に寄せたい人も多いはず。

そんな時はコピーしたコードの赤枠部分にちょこっと追記します!

ツイート埋め込みコードカスタマイズ①

 

赤枠の”twitter-tweet”という部分。

ここを“twitter-tweet tw-align-center”ってコードにすると「中央寄せ」になります!

また、“twitter-tweet tw-align-right”にすれば「右寄せ」になります。

埋め込み後は不要なコードを削除

消去、消す、delete

 

さて、本題です。

えいと
えいと
ここからはページが重くなる原因を解説していくよ~!

 

ツイートの埋め込みコードを見ると、最後にスクリプトコードがあります。

埋め込みツイート、スクリプトコード

 

このスクリプトコードは、

えいと
えいと
Twitterのフォーマットで表示させてくれ~!頼むよ~!!

ってTwitterにお伺いをたてに行く役割を持ってます。

 

複数のツイートを埋め込みすると、その度に動いてしまうのでページが重くなっちゃうんですよね。

ただ、このスクリプトコードは最初のツイートのみにあれば十分です。

2つ目以降のツイートでは削除しちゃいましょう!

 

めっちゃ簡単だ~!

 

劇的にページ速度が改善するわけではないですが、ツイートの埋め込みが多いなら絶対にやっておくべきです。

ページ速度を測定

ところで、自分のブログのページ速度を計測したことってありますか?

URL打ち込むだけで計測できるので、一度やってみてください

→【外部リンク】PageSpeed Insights

 

PCPC速度スマホ

モバイル速度

 

えいと
えいと
僕のブログはスマホ対策が必要ですね・・・(汗)

【おまけ】他人のツイートは勝手に使ってOK?

ツイート、Twitter

 

他の人のツイートって勝手に利用してもいいの?

と悩んでる人も多いはず。

 

なので、最後にこの悩みに回答します。

 

結論から言うと、勝手に使って問題ありません。

Twitterのサービス規約に明記されています

→【外部サイト】Twitter サービス利用規約

 

長いので簡潔にまとめるとこんな感じです↓

①ツイートを投稿したら、Twitterの運営会社がそのツイートを自由に利用することに同意したとみなす

②ツイートされたコンテンツは、Twitterの埋め込み機能を利用するなら、他のユーザーが他の媒体で使うのに問題はない

 

えいと
えいと
スクショで使うのはダメなので、埋め込みコードを利用していきましょう~!

 

また、他の人のツイートを埋め込みする際に、僕が使っていたテクニックも紹介します。

 

1,000人以上の方のツイートを埋め込む場合は、本人にDMかリプライで「使っても大丈夫か?」という連絡をしてました。

フォロワーが一定数以上いる人は、宣伝になるので快くOKしてくれます。

 

で、ここからがポイントで、記事を投稿する際はその方にメンション付きでツイートしてました。

そうすると、事前に連絡を取っていたこともあってか、「リツイート」or「いいね」をしてもらえます!

 

僕がお世話になった方々

 

記事の説得力も増すので、遠慮せずにツイートを使っていきましょう~!

 

 

以上、「【衝撃】ブログにツイートを埋め込みするとページが重くなる【解決策紹介】」でした

 

Twitterで過去のツイートを期間orキーワードで検索する方法【図解】

Twitterでツイートを予約投稿するならSocialDogがおすすめ【使い方を図解】

ヘッダー画像を無料で作成しよう!高クオリティーに仕上がるおすすめサイト「Canva」