이미지가 흐려보여.. 혹시 당신 레티나 디스플레이?

minkyeongJ·2022년 4월 19일
0

개발 tips

목록 보기
5/20

애플이 만든 디스플레이, 레티나 디스플레이

일단 Apple이 정의하는 바에 의하면 사람의 눈으로 픽셀이 보이지 않을 수준으로, 고밀도 디스플레이를 두고 영어 단어로 망막에 해당하는 "Retina" 라는 단어를 붙여서 망막(Retina) 디스플레이라고 칭한다.
한때 300 PPI가 넘을 경우 사람의 눈으로는 픽셀이 보이지 않는다는 뜻에서 망막(Retina) 디스플레이 라는 용어를 사용했다. 하지만 iPad와 Mac에 적용되면서 그 기준은 260ppi로 낮아졌다.

간단히 말하면 디스플레이에서 같은 면적에 화소수가 많아졌다는 것이다.
화소: 이미지를 표현하는 최소의 단위

레티나 디스플레이의 문제점

일반 디스플레이든 레티나 디스플레이든 실제 화면상에 보여주는 크기는 같아야 한다. 그렇게 되면 레티나 디스플레이는 같은 면적에 비해 화소수가 많기 때문에 보여지는 이미지 크기를 맞추려 이미지를 억지로 늘리게 되고, 결국 화질이 깨지게 되는 문제점이 발생한다.

문제의 해결

이 문제를 해결 할 수 있는 방법은 간단하다. 애초에 큰 사이즈의 사진을 사용하면 된다! 우리가 원래 보여지고자 하는 사진의 2배 크기되는 이미지를 말이다.

앞으로 화면에서 이미지가 흐리게 보일 땐 당황하지말고 큰 사이즈의 이미지를 사용하자.

profile
멋진 프론트엔드 개발자를 위하여!

0개의 댓글