WP Retina 2xでRetina画像対応を比較してみた

Retinaディスプレイに対応するためにWP Retina 2x プラグインをインストールしました。
画像は記事挿入時に半分以下で表示できるように大きめのサイズをアップロードしておきます。
ココではわかりやすい比較ページとして紹介します。

4種類の画像で比較紹介します。
WP Retina 2x プラグイン対応画像は《WP Retina 2x》の文字を挿入しています。

※WP Retina 2xプラグインは次の4種類でRetinaディスプレイに対応します。 

  • Picturefill
  • IMG Rewrite
  • Retina.js
  • Retina-Images

現在はPicturfillで検証しています。

 

上側が【Retinaディスプレイ対応】した表示です。
下側は【Retinaディスプレイ非対応】表示です。
150 x 150px

wpretina1-2x

wpretina1

 

上側(もしくは左)が【Retinaディスプレイ対応】した表示です。
下側(もしくは右)は【Retinaディスプレイ非対応】表示です。
320 x 240px

wpretina2-2x

wpretina2

上側が【Retinaディスプレイ対応】した表示です。
下側は【Retinaディスプレイ非対応】表示です。
640 x 480px

wpretina3-2x

 

wpretina3

 

上側が【Retinaディスプレイ対応】した表示です。
下側は【Retinaディスプレイ非対応】表示です。
1280 x 960px

wpretina4-2x

wpretina4

 

くらべてみていかがでしょうか?

上側が【Retinaディスプレイ対応】は表示サイズの倍のサイズの画像です。
下側は【Retinaディスプレイ非対応】は表示サイズの画像です。

1280 x 960px以外はくっきりVS ボケボケではないですか?
1280 x 960pxは記事の幅が600なので最初から2倍以上の解像度があります。
上下の画像が一緒に見えるのもそのせいです。

 

これからはRetina(高精細、高DIP)が主流になってくると予測されます。

 

まとめ

 Retinaディスプレイに対応したサイトやブログはまだまだ少ないのです。

でも、RetinaディスプレイはiPhone、iPad、iPadmini、MacBookProに

搭載しているので、日に日にシェアは拡大しています。

しかもアップル製品だけがRetinaに対応しているわけではありません。

Windows8.1も高DIP対応になりました。

アンドロイド系の新製品も高DIP搭載で続々発売されています。

ソニー、サムスン、シャープ、富士通などの各メーカーのフラッグ
シップモデルはフルHD 解像度に対応しています。

 

レティナディスプレイ(英語:Retina Display)は、アップル社製製品のうち、高精細ディスプレイを搭載したモデルに与えられる名称、およびディスプレイそのものを指す名称である。「Retina」は英語で「網膜」という意味で、画素が細かく人間の目で識別できる限界を超えている、ということから命名された。
レティナディスプレイは、前のディスプレイと比べ、画面解像度とコントラストが4倍ほどに達し、もっと鮮やかで深い色になる。 出典 ウィキペディア

 

投稿日:2015年2月12日 更新日:

執筆者:


comment

メールアドレスが公開されることはありません。

プロフィール

料理人慶(ビジネス慶)と申します。
Windows3.1にはじまりWin95と続きMacOSXに至ります。パソコンを仕事につかってお客様のサポートまで仕事になりました。現在はフリーで仕事をしています。今はソーシャルメディアに没頭中。このブログを訪問してくれる読者さんが困っていることを探して紹介していきます。現在はMacが左でWin7が右で仕事して、IT情報をいかにわかりやすくするかにこだわって記事を書いています。料理は30年の誰にも習わない我流。週末料理当番で作った料理をメインにのせていきます。ツッコミ、ご意見いつでも連絡ください。

詳しいプロフィール

慶チャンネル