読者です 読者をやめる 読者になる 読者になる

Yukihy Life

ゆきひーによる日常生活をアウトプットするブログ 映画・TOEIC・教育ネタとだいぶ物理とWeb制作

【お知らせ】当ブログで配布していたSNSボタンに関して重大なミスがありますので修正をお願いします

Web制作 不具合連絡
スポンサーリンク

 

不具合の発生と、それによりコードを編集していたのでお知らせです。

 

 

f:id:ftmaccho:20150707215737j:plain

具体的な不具合

最初に皆さんに提供していたボタンで可能性のある現象として、以下のものが見られます。

  1. Twitterから入りシェアをしようとすると、URLが貼られない
  2. 日本語URLの記事をシェアしようとすると、エンコードされていないURLが貼られてしまう
  3. 特定のPC×IEブラウザで、Twitter画面が開けずにエラーになってしまう

それぞれ簡単に説明を加えます。

1.Twitterから入りシェアしようとすると、URLが貼られない

普通にはてなブログやブラウザから入ってTwitterからシェアしようとすると問題なくできるのですが、スマホのTwitterアプリから入って

f:id:ftmaccho:20150706120830j:plain

ボタンを押してシェアしようとすると…

f:id:ftmaccho:20150706121011j:plain

上の図のようにURLが貼られていない!というものです。Twitterからリンクに入った人はTwitterでシェアしやすいと思うので、これは結構致命的でした。

 

2.日本語URLのシェア

僕は以前、日本語URLの方がSEOに強いと聞いていたので、昔の記事で日本語URLを採用していました。

例えばこの記事「今週見た映画と感想〔2月第2週〕 - Yukihy Life

この記事のURLは日本語表記にしているので

http://www.yukihy.com/entry/2015/02/14/今週見た映画と感想〔2月第2週〕

となると思いきや、実際は日本語部分はエンコードされて

http://www.yukihy.com/entry/2015/02/14/%E4%BB%8A%E9%80%B1%E8%A6%8B%E3%81%9F%E6%98%A0%E7%94%BB%E3%80%942%E6%9C%88%E7%AC%AC2%E9%80%B1%E3%80%95

のようになります。

 

しかしシェアボタンでシェアをすると、

http://www.yukihy.com/entry/2015/02/14/今週見た映画と感想〔2月第2週〕

のように意味のないURLが貼られる可能性がありました。日本語URLの記事がある方は、シェアができなかったと思います。

 

余談ですが日本語URLは、今ではそこまでSEOには関係がないと言われてるそう。シェアされたときのURLがただ長くなるだけなので、日本語URLにはしない方が無難です。(現在日本語URLの記事があっても、変更したりしないでくださいね!シェア数などが0になってしまいます)

つい最近出された記事でこんなのもありました。

 

3.特定のPC×IEブラウザで、Twitter画面が開けずにエラーになってしまう

これは僕も友人のパソコンを使って見せてもらったのですが、確かにインターネットエクスプローラーで見るとシェアができないものがありました。

しかしそのパソコンにGoogleChromeを入れて見ると普通にシェアができたので、シェアボタンというよりはブラウザに問題があったようです。

 

実際ググってみるとIEブラウザにはTwitterやFacebookが開けないというような事例がよくあるそうです。

 

で、当ブログで配布していたシェアボタンは、IEブラウザからシェアできないという、かなり致命的な欠陥がありました。これは本当に申し訳ないです。

 

具体的な変更点

具体的に変更する必要があるのは、HTMLのTwitter部分です。コードで言うと、コード4とコード6(と、それらに対応している追加コード(3Dボタンでしたらコード4(3)など))です。

その中のTwitter部分のhrefの中を変えています。今までの全てを変えるのが面倒な方は、そこの部分のみ変えれば大丈夫です。

 

ただ元記事のコードも、より最適化するように随時更新をしているので(詳しくは追記をご覧ください)、もう一度コピペするのも良いかもしれません。

ボタンを設置したら、自分でうまく機能しているかの確認をお願いします。

 

これも余談ですが今回の問題点として、記事タイトルにしろURLにしろエンコードされていないというのがありました。エンコードの仕方が良く分からなくって2日間くらいjQueryのコード作ってたら、この記事を書いてる2時間前くらいに、はてなだと一瞬でエンコードできると知って爆死しました。

→参考:記事ごとに任意のブログパーツなどを配置する - はてなブログ ヘルプ

  

最後に

最後に、不具合や追記が多くなってしまい、申し訳なく思っています。ただ素人が作ったものですので、今後も追記する可能性がありますのでご了承ください^^;。

また、不具合を指摘してくださった方々に感謝申し上げます。特に実験台のようにしてしまったコトリ(id:defender_21)さん、ありがとうございます笑。

 

不具合などありましたらご連絡いただけると嬉しいです。

 

関連記事