SNSのボタン読み込みを高速化する方法なら自作ボタンが一番速くなる

Twitterやフェイスブック、ライン、はてぶなどのSNSの共有ボタンは、ブログやサイトにとって、今や無くてはならない要素の一つになりました。

サイトの性質によって必要なSNSボタンは変わってきますが、Twitterやフェイスブックは必須と言っても過言ではないでしょう。

でも、大問題が一つ。SNSの共有ボタンはページの読み込み時間を遅くする原因なんです。

SNSボタンの読み込みを高速化させる方法

外部のSNSボタンを読み込むときに時間がかかってしまうので、読み込みをさせず、自前でボタンを用意すれば表示を高速化させることが出来ます。

各SNSの共有リンクを下記に用意しました。このリンクを使ってボタン化するもよし、テキストリンクで使うも良し、なんでもOKです。リンクなので読み込み時間なんて存在しませんから高速！

ワードプレス用のリンクを掲載していますが、ワードプレス以外で使用したい場合は、<?php the_permalink(); ?>を共有したいURL、<?php the_title(); ?>を共有するときに表示したい文字列に変更すればOKです。

Twitterの共有リンク

Twitterの共有リンクの挙動確認
SNSのボタン読み込みを高速化する方法なら自作ボタンが一番速くなる

https://twitter.com/share?url=<?php the_permalink(); ?>&text=<?php the_title(); ?>

フェイスブックの共有リンク

Twitterの共有リンクの挙動確認
SNSのボタン読み込みを高速化する方法なら自作ボタンが一番速くなる

https://www.facebook.com/sharer/sharer.php?u=<?php the_permalink(); ?>

はてなブックマークの共有リンク

はてなブックマークの共有リンクの挙動確認
SNSのボタン読み込みを高速化する方法なら自作ボタンが一番速くなる

http://b.hatena.ne.jp/entry/<?php the_permalink(); ?>

Googleプラスの共有リンク

Googleプラスの共有リンクの挙動確認
SNSのボタン読み込みを高速化する方法なら自作ボタンが一番速くなる

https://plus.google.com/share?url=<?php the_permalink(); ?>

LINEの共有リンク

LINEの共有リンクの挙動確認
SNSのボタン読み込みを高速化する方法なら自作ボタンが一番速くなる

※LINEはスマホでリンクをクリックするとアプリが起動して共有することが出来ます。

http://line.me/R/msg/text/?<?php the_permalink(); ?>

Pocketの共有リンク

Pocketの共有リンクの挙動確認
SNSのボタン読み込みを高速化する方法なら自作ボタンが一番速くなる

http://getpocket.com/edit?url=<?php the_permalink(); ?>

Pinterestの共有リンク

Pinterestの共有リンクの挙動確認
SNSのボタン読み込みを高速化する方法なら自作ボタンが一番速くなる

http://www.pinterest.com/pin/create/button/?url=<?php the_permalink(); ?>

まとめ

SNSの共有ボタンは表示が遅い！めちゃくちゃ遅い！特にフェイスブックのいいねボタン。昔からホントに馬鹿みたいに遅くて苛つかされて諦めて現在に至っています。

SEOにおいてもページの読み込み速度が遅いことはデメリットであることはGoogleも公式に認めています。外部のボタンが表示速度を落としていても例外なくデメリットになるんです。

共有数などを手軽に出したい場合は、各SNSが出しているボタンを使う方が作業は少なく済みますが、ホントに共有数とかいる？ゼロなんてザラでしょ？このブログも共有数ゼロとかザラですよ…

共有してくださいよ。そしたら共有数を表示しても高速にボタン表示できる方法記事にするので。。。