平素は、はてなブログMediaをご利用いただきありがとうございます。
はてなブログMediaでは、今後のリリースで、記事一覧ページのサムネイルについて、配信する画像の仕様を変更します。これにより、対象となるブログはサムネイル画像のトリミング位置が変わります。
対象となるブログ・変更箇所
- 全ブログが対象です
- 変更箇所は記事一覧ページの記事サムネイルです
- 記事一覧ページとは、以下のページのことです
記事一覧ページ
| 記事一覧ページ | トップページのURL/archive |
| 〃（年間） | トップページのURL/archive/2012 |
| 〃（月間） | トップページのURL/archive/2012/01 |
| 〃（日付ごと） | トップページのURL/archive/2013/01/09 |
| 〃（カテゴリー） | トップページのURL/archive/category/カテゴリー名 |
| 〃（著者ごと） | トップページのURL/archive/author/ユーザ名 |
※特に、サムネイルの縦横比を正方形から変更している変更など、なんらかのCSSを独自に適用しているブログに影響があります
確認手順
以下の方法で仕様変更後の表示を確認してください。
ブログのトップページURLに、 /archive?use-original-aspect-thumbnail=1 を加えたページを表示する。
例) https://business.hatenastaff.com/archive?use-original-aspect-thumbnail=1
仕様変更の実施日
2019年10月23日（水）を予定しております。以降は /archive にアクセスすると、上記確認ページで表示される通りのサムネイルになります。
仕様変更までにお客様に行っていただくこと
仕様変更後の表示確認ページを確認し、デザインテーマの修正が必要と判断された場合は、個別にご対応お願いいたします。
※特にCSS変更の影響が大きいブログに対しては別途弊社からご連絡しております。
仕様変更の詳細
記事一覧ページに表示されるサムネイルのbackground-imageを「500x500pxの正方形」から「記事アイキャッチ画像の縦横比を保持したまま長辺500pxにリサイズ」に変更します。
これにより、画像の表示領域をCSSで長方形にしているブログにおいて、より元画像の印象に近いサムネイルが表示されるようになります。
例: https://developer.hatenastaff.com/archive
ただし、サムネイル画像のCSSを特に変更していないブログは、見え方に変化はありません。
例: https://staff.hatenablog.com/archive
仕様変更の背景
記事一覧ページのサムネイルはデフォルトで正方形で表示するため、記事アイキャッチ画像が長方形だった場合、内部的に画像両端をトリミングしていました。しかし、上記例のように、サムネイル部分のCSSを長方形に変更して運用されているブログが一定数ある実態を鑑みて、内部的なトリミングを廃止することにいたしました。
なお、本仕様はサムネイル画像のCSS変更を推奨するものではありません。デザインCSSはご自身の責任でのご利用をお願いしております。
FAQ
元の仕様に戻す方法はありますか？
現在のところございません。
サムネイルの解像度を上げる方法はありますか？
ございません。データ通信量を最適化する関係で一律長辺500pxとしております。
トップページやサイドバーのモジュールサムネイルにも影響しますか？
影響しません。記事一覧ページのみです。
【10月23日追記】archiveページサムネイルのトリミング仕様が変わりました
本機能は予定通り、2019年10月23日（水）に正式リリースいたしました。
引き続き、はてなブログMediaをどうぞ宜しくお願い致します。