最近、Bloggerの記事で画像をアップロードしたときのURLが1.bp.blogspot.comからblogger.googleusercontent.comに変更されました。

デフォルトでは新URLが適用されるようになっていますが、以前のURLのままアップロードしたいという方も多いはず。幸い、旧URLのまま画像をアップロードできる方法がまだ使えるのでご紹介します。

ただし、今回の方法もいつまでできるかはわかりません。明日にも使えなくなる可能性は十分ありますので、予めご了承ください。

※現在、こちらの方法も使用できなくなりました。本記事の内容は参考程度に留めてください。

追記：旧URLを取得する新しい方法について記事を書きました。詳しくはこちらをご覧ください↓

【Blogger】画像を旧URL（1.bp.blogspot.com）で取得する方法：便利なブックマークレット付き | IB-Note

画像を旧URL（1.bp.blogspot.com）で取得する新手法をご紹介します。

itblogger-note.blogspot.com

はじめに：新URLに関して

新URLへの仕様変更ですが、正直改悪アップデートと言わざるを得ません。新URLの問題点は主に以下3つ。

まず、致命的なのは読み込みの遅さ。旧URLと新URLで同じ画像を並べてみるので、スーパーリロード（Win: Ctrl + F5, Mac: Command + Shift + R）して違いを見てみてください。

1.bp.blogspot.com

blogger.googleusercontent.com

右側のblogger.googleusercontent.comのほうが明らかに読み込みが遅くないでしょうか？

1枚ぐらいなら大して気にならないじゃん…と思われるかもしれません。確かに、1枚ぐらいであればまだ許容範囲です。が、ブログの全画像を新URLで置き換えたとするとけっこうな違いになります。体感的には、画像が全て表示されるまで1秒前後遅れるイメージ。PageSpeed Insightsのスコアにはあまり影響ないですが、明らかに重くなってる感があります。

次に、URLの問題。新URLでは画像ファイル名が出ないので、見ただけでは何の画像かさっぱりわかりません。しかもやたらと長い。先ほどの画像の新旧URLを比べてみましょう。

https://blogger.googleusercontent.com/img/a/AVvXsEjxTJPgEdjaLME54GHAQqcYRJ9v3XqXDLr2xg8GZm146fAdJV7kBYkcK-h3nLVF55nVgeOpQ70OanRe-qNePxeNJfg4wQ46iudanMfYr4Dx-8wS1AkM720tLtUniPJvOifHLCSfqnR4ozDSYwTg2NE2WS80bDbZdoZenep7wkpLot1usoaIoNoZFNVA=s0

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCeQiRXvfwUOxOkrJ0chBrU60LFCjanZJeF5_l4tOn2cPsAqX3VtJmscJ1VfwXOlGZEqFqPL9Odihg_A_OpVN9P4cO5ml00ca-sH0gpyfjWpMmeQVDlRoDPZ66TDMn6dYJGCPvREwVbTlN/s0/space.jpg

新URL、何が起こった？って感じですよね。同じ画像のURLとは思えない…

このように、新URLはなかなか残念な仕様になっています。唯一、旧URLと違いパラメータが末尾に=XXで追加する形式なので、expr:src='resizeImage(...) + "-rj-l80-e365"'のようにJavaScriptを使わずパラメータを追加できるという特長があります。…が、良くも悪くもそれだけです(´-ω-`)

旧URLでのアップロード方法

ここからが本題です。今回ご紹介する方法は、もともと「after work lab」のheavy-peatさんが発見しツイートされていた方法を参考にしたものです。

まず、Bloggerの管理画面から「レイアウト」→「ガジェットを追加」をクリックし、「画像」ガジェットの設定を開きます。

開いた設定画面で「パソコンから画像をアップロードする」を選択し、「ファイルを選択」でアップロードしたい画像を選んで「開く」をクリック。

アップロードされた画像が表示されるので、その画像の上で右クリック→「新しいタブで画像を開く」をクリックします。

新しいタブに旧URLの画像が開きます(^^)b

違う画像をアップロードしたい場合は、先ほどの画面に戻り「ファイルを選択」で続けてアップロードできます。終わったら、保存せずに「キャンセル」で終了してOKです。

個人的には、この方法が一番楽でやりやすいかなと思っています。今のブログでちゃんと旧URLにならなかったり、管理を分けたい場合は、新しくテストブログを作って試されることをお勧めします。

ちなみに、この方法でアップロードした画像は投稿編集画面の「画像を挿入」でも参照できますが、そちらではblogger.googleusercontent.comになってしまいます。どうしても編集画面では旧URLのまま使用できない運命のようです。

さいごに：表示速度の大切さ

最近いろいろなサイトを見ていて、表示速度の大切さを痛感しています。特に画像はページに占める割合が大きいので、表示にかかる時間がユーザエクスペリエンスに直結してきます。

極端な話、画像サイズがいくら大きくても一瞬で表示されれば軽く感じますし、画像を最適化していても表示に時間がかかってしまうと、なんだか重いな～と感じてしまいます。

ブログの高速化に取り組んでいる方は特に影響を受ける部分だと思うので、画像の表示速度でお悩みの場合はぜひ今回の方法を試してみてください。

参考：【Blogger】画像の URL が新仕様に変わりました | ふじろじっく