8
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

【検証忘備録】Retina 3倍Retina

Posted at

##始めに
ニートから見習いエンジニアに転職して約1ヶ月。
HTML、CSSと格闘する毎日。
そんな中、スマホ用のサイトを構築する事になった時のお話。

##3倍Retina!?

今回スマホ用のサイトを構築するに当たって、要件の一つにRetina対応があった。
Retinaについて調べてみると、3倍Retinaなる物の存在を知り、
どのように違うのか気になったので検証してみた。

###そもそもRetinaとは

Retinaディスプレイ(英語:Retina Display)は、アップル製品のうち、100〜160ppi程度であった従来のディスプレイ解像度の、およそ倍の解像度、高画素密度のディスプレイを指す名称である。「Retina」(レティナ)は英語で「網膜」という意味で、画素が細かく人間の目で識別できる限界を超えている[1]、ということから命名された。

”Retinaディスプレイ”『ウィキペディア (Wikipedia): フリー百科事典』
更新日時:2019年6月6日 (木) 07:11  URL: http://ja.wikipedia.org

ざっくりと説明すると、画像を描画する点の集まりが今までの倍!
より鮮明に綺麗に表示されるという事。

###ここで疑問が…
通常のRetinaですら人の目で識別できる限界を超えるほど画素が細かいのに、
さらに画素の細かい3倍Retinaは必要なのか…?
他のエンジニア方もあまり気にしていなかったみたい…

###実際にやってみた
今回は先輩のiPhoneXをお借りして検証。
等倍の画像、Retina対応の画像、3倍Retina対応の画像を並べて比較してみた。

See the Pen agOqoB by ShunyaTsukamoto (@ShunyaTsukamoto) on CodePen.

###結果
等倍とRetinaの違いははっきりと確認できるが、
Retinaと3倍Retinaの違いはぱっと見では分からなかった。

強いて言うならば、Retinaと3倍Retinaを拡大、比較した際に、
光の加減が少し違うかもしれないという違いだけだった。

###感想
個人的には今の所3倍Retinaは必要無いように感じた。
ただ、今後要件の上がる事があるかもしれないので
頭の片隅に置いておく事にする。

8
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
8
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?