アメーバブログに問い合わせをしたのですが、返事は2週間経ってもありませんでした。
ならば、自分で検証あるのみです。
【retina.js】をアップロードしてみる
公式サイトRetina.jsからzipファイルをダウンロードして、ファイルマネージャーでretina.jsファイルをアップロードする。
画像ファイルしか対応できないようだ。
それならいいやで納得してretina.jsはあきらめる。
【img要素srcset属性を試してみる】
htmlのバージョンを確認してみるが、そもそもテンプレートの編集が存在しない。
タグを入力して試してみるしかなさそうだ。
画像ファイルを2種類用意します。
例:gazousmall.jpg サイズ100x100pixelとgazoubig.jpg サイズ200x200pixel
ふたつのファイルをファイルアップロードしてください。
小さい画像(gazousmall.jpg)を追加してみると、
<a href="http ://stat.ameba.jp/user_images/あなたのIDなどの情報/ファイル名.jpg"><img src="http ://stat.ameba.jp/user_images/あなたのIDなどの情報/ファイル名.jpg" alt="" width="サイズ" height="サイズ" border="0" /></a>
このように表示されます。
ここにsrcset属性を追加します。
<img src="http ://stat.ameba.jp/user_images/あなたのIDなどの情報/ファイル名.jpg" alt="" width="サイズ" height="サイズ" border="0" />
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
<img src="http ://stat.ameba.jp/user_images/あなたのIDなどの情報/ファイル名.jpg" srcset="http ://stat.ameba.jp/user_images/あなたのIDなどの情報/ファイル名.jpg 1x,http ://stat.ameba.jp/user_images/あなたのIDなどの情報/ファイル名.jpg 2x" alt="表示できない時の画像の説明" width="サイズ" height="サイズ" border="0" />
最後までお疲れ様でした。
これで完成です!!
さあ、Retina対応ディスプレイで確認しましょう。
Retina対応ディスプレイ一覧
- iPhone4以降
- iPad(第3世代以降iPad Airを含む)
- iPad mini2以降
- MacBook Pro(2012年6月以降)
- iMac Retina 5Kディスプレイモデル
- Android(フルHD解像度のフラッグシップモデル)
- Windows8.1と4Kディスプレイ
アメーバブログはRetinaディスプレイに対応できるのか?のまとめ
管理人亘が推奨しているretina.jsの対応は無理でした。
しかしながら、img要素srcset属性のタグで対応することができます。
ファイルのURLをファイルアップロードで確認して変更することで対応できます。
- 画像ファイルを2種類(大小)用意します。
- 画像ファイルを2種類(大小)をファイルアップロードします。
- 画像ファイル(小)で記事に挿入します。
- 画像ファイル(大)のURLをファイルアップロードで確認してコピーします。
- 3の挿入した画像ファイルのhtmlにsrcsetを追加します。
あなたのアメーバブログも今回の作業でRetinaディスプレイに対応できました。
不明な点はお問い合わせください 😀
アメーバブログとは、、、
アメーバブログ 日本で第1位の規模のブログサービスである。アメーバ全体の会員数は2012年時点で2000万人。ブログのアクティブユーザーは2009年11月時点で約115万人/月。日本のユニークビジターは2009年11月時点で220万人/月ページビューは2億3000万/月。その他の調査でも三強と言われている。女性の比率が高い(約7割)といわれているが、実際の男女比率は5:5である。 2011年6月末時点で、会員数1,645万人が登録している。メディアミックスなどクロスメディアの手法を使ってマスメディアと連携し、ユーザーやページビューを増やしてきた。『実録鬼嫁日記』や『きらきら研修医』はブログが書籍化され、後にテレビドラマ化された。芸能人や有名人などタレントブロガーの多さも売り物である。ミスキャンパスのブログ、芸能事務所ごとのブログスペースなどを設け、管理している。また、原宿アメーバスタジオを持ち、毎回著名ゲストを呼んで公開生放送によるWEB配信を行ない、ブログと連動させている。出典Wikipedia