TECH 으로 돌아가기
TECH HACKER NEWS 어제 6분 읽기 30 READS

1080p 화면의 실제 뷰포트는 920px — 브라우저 크롬이 삼킨 세로 공간

1080p 화면의 실제 뷰포트는 920px — 브라우저 크롬이 삼킨 세로 공간
SOURCE IMAGE · HACKER NEWS

웹 개발자라면 누구나 "1080p"라는 표현에 익숙하다. 가로 1920, 세로 1080 픽셀의 해상도는 여전히 데스크톱 환경에서 가장 흔한 기준점으로 통한다. 그러나 실제로 웹 페이지가 그려지는 공간, 즉 CSS 픽셀 단위의 뷰포트는 이 숫자와 상당히 다르다. ScreenSize.net이 자사 브라우저 세션을 익명 집계해 공개한 뷰포트 통계 리포트는 그 간극을 구체적인 수치로 보여준다. 1080p 디스플레이에서 브라우저가 실제로 콘텐츠를 렌더링하는 세로 높이는 대략 920px에 그친다는 것이다.

사라진 160px의 정체

1080에서 920으로 줄어든 약 160px은 어디로 갔을까. 답은 화면 자체가 아니라 그 위에 겹겹이 쌓인 UI 요소들이다. 운영체제의 작업 표시줄이나 독, 브라우저 상단의 주소창과 탭 바, 북마크 바, 그리고 환경에 따라 표시되는 각종 툴바가 세로 공간을 차례로 잠식한다. 여기에 디스플레이 배율(스케일링) 설정까지 더해지면 물리적 해상도와 논리적 뷰포트의 차이는 더 벌어진다. 개발자가 디자인 시안에서 흔히 가정하는 '1080px 세로'는 사용자의 실제 화면에서는 거의 존재하지 않는 이상적 수치인 셈이다.

이 차이가 실무에서 갖는 함의는 분명하다. 랜딩 페이지의 히어로 영역이나 로그인 폼, 대시보드의 핵심 지표를 '첫 화면 안에' 배치하려는 이른바 어보브 더 폴드(above the fold) 설계는 1080px가 아니라 900px 안팎을 기준으로 잡아야 한다. 100vh를 그대로 신뢰해 전체 화면 높이의 섹션을 만들 경우, 모바일뿐 아니라 데스크톱에서도 사용자가 기대한 것보다 콘텐츠가 잘려 보이거나 불필요한 스크롤이 생길 수 있다. 세로 공간은 우리가 머릿속에 그리는 것보다 훨씬 빠듯한 자원이다.

DPR과 기기 분류라는 또 다른 변수

리포트는 뷰포트 크기뿐 아니라 디바이스 픽셀 비율(DPR)과 브라우저 분포도 함께 제공한다. DPR은 CSS 픽셀 하나가 물리적 픽셀 몇 개에 대응하는지를 나타내는 값으로, 고해상도 디스플레이와 배율 설정이 보편화되면서 1이 아닌 값이 흔해졌다. ScreenSize.net은 과거 DPR 데이터를 0.05 단위로 정규화해 집계했다고 밝히는데, 이는 임의의 소수점 값이 만들어내는 잡음을 줄이려는 조치다. 이미지 자산의 해상도 전략이나 캔버스·미디어 처리에서 DPR을 다뤄본 개발자라면 이 값의 분포가 왜 중요한지 체감할 것이다.

기기 분류는 상대적으로 신중하게 다뤄야 할 항목이다. 리포트는 디바이스 클래스를 로컬에서 추론하며, 이것이 어디까지나 근사치임을 명시한다. 특히 과거의 태블릿 분류는 신뢰도가 낮다는 이유로 공개 통계에서 제외됐다. 또한 가로 6,000 CSS 픽셀을 넘거나 세로 4,000을 넘는 극단적 뷰포트도 분포에서 빼냈다. 다중 모니터를 하나의 창으로 펼친 경우 같은 비정상적 값이 평균을 왜곡하는 것을 막기 위한 장치로 읽힌다.

프라이버시 설계와 통계의 성격

이 리포트가 눈에 띄는 또 다른 이유는 수집 방식이다. 브라우저 탭은 세션당 최대 한 번만 표본으로 기여하며, 측정값은 월 단위 집계 버킷으로 반올림된다. IP 주소, 사용자 ID, 정밀한 타임스탬프, 전체 유저 에이전트 문자열은 저장하지 않는다고 한다. 나아가 Global Privacy Control과 Do Not Track 신호를 존중한다고 밝혔다. 통계의 유용성과 개인정보 보호를 동시에 노리는 이런 설계는, 데이터 최소화가 규범으로 자리잡은 최근 흐름과 맞닿아 있다.

다만 이 수치들을 해석할 때 반드시 유념할 한계가 있다. 리포트 스스로 강조하듯, 이 데이터는 전 세계 기기나 브라우저의 시장 점유율이 아니라 어디까지나 ScreenSize.net을 방문한 브라우저 세션을 측정한 결과다. 방문자 구성이 특정 성향으로 편향돼 있다면 분포 역시 그 편향을 반영한다. 따라서 '920px'이라는 숫자는 자신의 반응형 기준선을 재점검하게 만드는 유용한 자극이지, 그대로 옮겨 쓸 절대 기준은 아니다. 결국 가장 믿을 만한 데이터는 각자의 서비스에 붙인 실제 애널리틱스에서 나온다. 이번 리포트는 그 측정을 다시 시작해야 할 이유를 던져주는 참고 자료로 보는 편이 적절하다.

SOURCE · HACKER NEWS
원문 전체 보기 → https://screensize.net/reports/viewport-stats
SHARE
NEXT · CHOOSE

변화를 읽었다면,
내가 만들 수익 구조를 고릅니다.

정보를 더 모으는 데서 멈추지 않고, 광고·외주·판매·중개·구독 중 내 상황에 맞는 출발점을 정해보세요.

21가지 수익 구조 살펴보기
처리 중...