SeesaaブログでRetinaディスプレイは対応できるのか?

 FC2コントロールパネル

SeesaaからのRetinaディスプレイの問い合わせでの回答はこうでした。
(私なりに簡単に変換しています)

<body>へのタグの入力ですとHTML編集でできます。HTMLやCSSの個別のブログカスタマイズはサポートの対象外となります(抜粋)。

このような内容で、シーサーサポートから返信いただきました。

要するに、明確な回答はありませんでした。
ならば、自分で検証あるのみです。

 

 シーサーサポート様、返信ありがとうございました。

 

【retina.js】をアップロードしてみる

 

公式サイトRetina.jsからzipファイルをダウンロードして、ファイルマネージャーでretina.jsファイルをアップロードする。

次にテンプレートの設定>htmlの編集で</body>の直前に
<script type=”text/javascript” src=”/scripts/retina.js”></script>
を書き込むのだが、アップロードされるフォルダーがはっきりしない。

それならと、画像ファイルのURLから探ってみる。
でも、画像ファイルの保存先は判明するが、対応できないようだ。
それもそうか、納得してretina.jsはあきらめる。

 

【img要素srcset属性を試してみる】

 

htmlのバージョンを確認してみる。 まだ、あきらめるつもりはない。

 

 

なるほど、XHTML1.0で書いている。
img要素srcset属性が動くかもしれない?
(XHTML1.0にはのっていなかった)

 

画像ファイルを2種類用意します。

例:gazousmall.jpg サイズ100x100pixelとgazoubig.jpg サイズ200x200pixel

ふたつのファイルをファイルアップロードしてください。

小さい画像(gazousmall.jpg)を追加してみると、

 

 

 

 

このように表示されます。

 

ここにsrcset属性を追加します。

 

 ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓

 

 

 

最後までお疲れ様でした。

これで完成です!!

 

 

さあ、Retina対応ディスプレイで確認しましょう。

Retina対応ディスプレイ一覧

  • iPhone4以降
  • iPad(第3世代以降iPad Airを含む)
  • iPad mini2以降
  • MacBook Pro(2012年6月以降)
  • iMac Retina 5Kディスプレイモデル
  • Android(フルHD解像度のフラッグシップモデル)
  • Windows8.1と4Kディスプレイ

 

 

SeesaaブログはRetinaディスプレイに対応できるのか?のまとめ

 

管理人亘が推奨しているretina.jsの対応は無理でした。
しかしながら、img要素srcset属性のタグで対応することができます。
ファイルのURLをファイルアップロードで確認して変更することで対応できます。

 

  1. 画像ファイルを2種類(大小)用意します。
  2. 画像ファイルを2種類(大小)をファイルアップロードします。
  3. 画像ファイル(小)で記事に挿入します。
  4. 画像ファイル(大)のURLをファイルアップロードで確認してコピーします。
  5. 3の挿入した画像ファイルのhtmlにsrcsetを追加します。

 

あなたのSeesaaブログも今回の作業でRetinaディスプレイに対応できました。

不明な点はお問い合わせください 😀

 

Seesaaブログとは、、、

Seesaa ブログ同社運営による無料ブログサービス。月間で1100万人が利用する。アップロードは2GBまで可能(テキストは無制限)。モブログやポッドキャスティングに対応し、アクセス解析やドメイン設定が出来ると言った無料でありながら多機能であることが特徴。出典Wikipedia

 

更新を 続ける糧は コメントだ
あなたからのひとことをお待ちしています。

お探しの画像は見つかりましたか?
他にもこんな画像もございます。

ビジネス素材風景花

空事務用品 お金 その他