프론트엔드

[반응형 웹] 어떤 해상도의 기기가 가장 많을까? 해상도 점유율 확인하기

seomoon 2022. 2. 10. 17:25

https://gs.statcounter.com/screen-resolution-stats 에서 해상도별 점유율을 확인할 수 있다.

Edit Chart Data를 눌러서 차트 형식 등을 변경할 수 있다.

내가 작업 중인 프로젝트는 데스크탑만 지원할 예정이기 때문에 차트를 편집해 데스크탑 해상도 점유율만 확인해봤다.
1920x1080, 1366x768 두 해상도의 점유율만 합쳐서 40퍼센트 이상으로 압도적이다.

이렇게 해상도 점유율을 확인했다면, 점유율이 높은 해상도 위주로 내 프로젝트가 화면에서 어떻게 보이는지 체크해보면서 개선할 수 있다. 

 크롬 개발자 도구의 Toogle Device Toolbar를 사용해
특정 해상도에서 웹 페이지가 어떻게 보이는지 확인해볼 수 있다.


Toogle Device Toolbar를 사용하려면 개발자 도구 상단 왼쪽에서 두 번째 아이콘을 클릭하면 된다. Element 탭 왼쪽에 있다.

 

velog(https://velog.io/write?id=1da8ec93-8ccf-42ae-a4fa-8bdcc69ce6fe)에서 이동해온 글입니다!