ウェブサイトやブログに埋め込んだtwitterの画像が表示されない原因の1つ
当ブログにtwitterのツイートボタンを設置したかったので、twitterの公式サイトで生成した埋め込み用のHTMLタグ、JavaScriptソースを当ブログに埋め込んでみたところ、「tweet」というテキストが表示されるのみで、ボタン用の画像が表示されなかった。
「tweet」というテキストをクリックすればtweetはできるので、見た目以外の問題はなさそうだが、見た目が気になって仕方がない。
解決方法がないかとGoogleで検索をしていると、JavaScriptソース内に「charset="UTF-8"」というようにUTF-8の文字コードの指定を追記すると改善するなどの情報があったので試してみたが、改善しなかった。
どうしたらよいかさっぱり分からなかったが、何となく、普段使っているInternet Explorer 11(IE11)ではなく、Google Chromeで閲覧すると、普通に画像アイコンが表示されていた。
ブラウザ依存だったようだ。
IE11は、これから長くMicrosoftがサポートするだろし、まだまだ使っている人は多いだろうから、IE11で見えないのはおかしいなぁ、と思ってIE11の設定を見ていると、当サイトのドメイン名が「互換表示に追加したWebサイト」に入っていることに気づいた。
設定したのは、何年も前の私本人だろう。
互換設定がなされていると、IE11よりも古いIEで動作するため、とりあえず、当サイトのドメイン名を「互換表示に追加したWebサイト」から削除したところ、IE11でもツイート用の画像が表示されるようになった。
twitterが古いIEへのサポートを打ち切っているらしい、ということは、この現象から何となく分かった。
古いIEを使っているつもりはなくても、私のように互換モードになっていて、知らぬ間に(または過去に設定したのを忘れて)古いIEで自分のサイトを使っていると、今回のように、ハマるようなことが今後もあるかもしれない。
IEの互換モードは便利な面もあるけれど、困った問題も起きてしまうので、今後、もうちょっと気をつけないといけないな、と思った。
今回、このことが分かるまでに1時間ぐらいの時間を使ってしまった......。