해상도별 웹사이트 디자인시 유용한 기능

구글 실험실에 웹사이트 디자이너들에게 아주 반가운 기능이 추가되었습니다.

Browser Size 라는 기능으로 웹사이트 주소를 입력하면 각 해상도별로 브라우저에서 볼 수 있는 영역을 표시해주는 기능입니다.

백문이 불여일견이라고 직접 살펴보겠습니다.

상단과 좌측에 해상도에 해당하는 수치가 있고 해상도별로 보여지는 영역을 색으로 구분해서 보여주고 있습니다.

해상도별로 나오는 % 수치는 구글을 방문하는 사용자들의 해상도 통계치를 바탕으로 나온 수치입니다. 즉, 99%라는 수치는 웹서핑을 하는 사용자들의 99%가 스크롤 없이 볼 수 있는 영역이 되는 것입니다.

웹디자인 혹은 블로그를 디자인 할때 적어도 50%의 사용자들에게는 가로스크롤이 없는 최적화된 웹사이트를 보여주겠다고 생각했다면.. 주황색 영역에 들어갈 수 있도록 디자인을 하면 되겠습니다. ^^

혹은 꼭 보여주고 싶은 부분(광고라던지.. 공지사항같은..)은 사용자들이 방문하자마자 바로 볼 수 있는 95%영역에 배치한다면 보다 효율적인 배치가 될 수도 있습니다.

다만 아쉬운점은 해상도의 기준이 왼쪽정렬인 사이트에 최적화 되어 있기 때문에 제 블로그와 같이 가운데 정렬을 사용하는 사이트는 이점을 적당히 감안해야한다는 점입니다.

요즘 대부분의 사이트가 가운데 정렬을 사용하는 것 같은데.. 다음번 업데이트에는 이점을 고려했으면 좋겠습니다.

(아직 실험실단계의 기능이니 더 좋아질것입니다. ^^)

.

.

.

전에 블로그 해상도를 변경하면서 1024x768 까지는 가로 스크롤없는 화면을 보여주려고 pc의 해상도를 조절해가며 작업했던 생각이 스치고 지나가네요..

앞으로 대세는 모바일 웹서핑이니 나중에 모바일 화면에 최적화된 블로그 화면을 만들때 이 기능을 활용할 수 있었으면 좋겠습니다. ^^

블로그 운영하시는 분들이나 웹디자이너분들은 앞으로 Browser Size 기능을 주목해보세요~