본문 바로가기

보이지 않는 더 넓은 세상💻/블로그 운영기

[티스토리] 반응형 블로그 만들 때 고려할 모바일 해상도 점유율


웹페이지를 필요에 따라 종종 만들기는 하는데, 크롬 개발자도구로 살펴보기엔 늘 한계가 있다. 그렇다고 모든 사람이 만족하는 화면을 만드는 것은 나에겐 너무 어려운 일이다. 그래도 모르고 있는 것보다는 알고 있는게 늘 도움이 되기에 기록으로 남긴다.

가로 해상도 비율

대부분 페이지의 90%유입은 모바일이다. 나머지 7-8%가 데스크탑이고 나머지 2-3%가 태블릿이기 때문에, 나는 모바일퍼스트로 제작하는 경우가 많다. 위의 수많은 숫자에서 기본적으로 내가 기억해야할 수치는 4개 숫자다. 

  • 가로 해상도는 360에서 420사이에 모든 수치가 있더라.
  • 세로 해상도는 640에서 846사이에 있더라. 

즉, "px 단위로 짜려면 360*640 이상이 되면 짤릴 수 있다는 것"을 염두에 두어야겠다라고 결론 내렸다. 그렇지 않게 하려면 %로 계산하면 괜찮을 것이다. 그러면 잘릴 위험이 없다. 간혹 글을 쓸때 제목이 잘리는 게 마음에 안 들때가 있는데, 360 혹은 420으로 컷해보면 얼추 다 확인할 수 있겠다는 생각이 들었다.

 

Mobile Screen Resolution Stats Republic Of Korea | StatCounter Global Stats

This graph shows the stats of mobile screen resolutions in South Korea based on over 10 billion monthly page views.

gs.statcounter.com

다른 나라 해상도가 어떨까?

2018~2019 1위 2위 3위 4위
한국 412*846
(18.3%)
360*640
(14.5%)
375*667
(10.1%)
360*740
(9.8%)
중국 360*640
(19.7%)
360*780
(5.3%)
360*760
(3.8%)
360*720
(3.4%)
북미 360*640
(15.5%)
375*667
(14.9%)
414*896
(10.2%)
414*736
(9.1%)
유럽 360*640
(25.3%)
375*667
(11.2%)
360*740
(6.1%)
360*720
(5.2%)
세계 360*640
(24.3%)
375*667
(7.2%)
360*720
(5.2%)
360*760
(4.8%)

우리나라를 제외하곤 대부분 일순위는 360*640 (9:16)이었다. 중국의 경우는 1920:1080이 1순위였는데, 똑같은 9:16 가로 비율이니깐 같다고 생각했다. (실제 같다고 보면 퍼센트는 더 높다.)

375*667 또한 거의 9:16이기 때문에 거의 같다고 생각하면 될 듯하다. 뭐... 그냥 360* 640 비율로 만들면 되는게 아닐까 싶다. 그리고 412*846도 한번쯤 확인해보면 우리나라는 거의 커버되지 않을까 혼자 생각도 해본다. 

우리나라, 어떻게 바뀔까?

갤럭시 노트랑 갤S 가 너무 시장을 많이 점유해서 그런지 가로로 해상도가 넓은 것들이 많아 보인다. 그래도 아직은 Maximum이 414이니깐 그점만 고려해서 조정해보면 되지 않을까 싶다.

그래서 나는...

크롬 개발자 도구에 위의 해상도를 그냥 커스톰화해서 저장해두었다. 6위까지 다 만들어두었으니 될대로 되라지 ㅋㅋㅋ

♡를 눌러주시면 블로그를 작성하는데 큰 힘이 됩니다♪
로그인이 필요없어요.

이 블로그 인기글