모바일 웹 디자인을 위한 디바이스 별 스크린 사이즈

모바일 시장이 보다 강력해짐에 따라 스마트폰에서부터 태블릿까지 세상에 무수한 모바일 기기가 등장했습니다. 여러가지 크기의 모바일 기기가 등장하면서, 당연히 스크린 사이즈 또한 굉장히 여러가지로 세분화 되었는데요. 4인치 세대의 다음 세대로 등장한 4.7인치 화면이 세상에서 가장 유명한 형태를 취하며 가장 보편적인 모바일 스크린 사이즈로 자리 매김을 했지만, 여전히 다양한 디바이스에서 동일한 화면을 보여주기 위한 스크린 사이즈 정리가 필요합니다. 오늘도 모바일 사이즈에 대해 고민하며 작업을 하고 계실 많은 분들을 위해, 스크린 사이즈 정보를 자세히 알려드리고자 합니다!

 

스마트폰 스크린 사이즈

 

태블릿 스크린 사이즈

한 눈에 봐도 정말 다양한 디바이스 환경이 있다는 걸 알 수 있죠? 각각의 단말마다 일일히 분기를 시키려면 공수가 너무 많이 들어가게 되죠.

적절한 사이즈를 기준으로 레이아웃을 동일하게 잡은 뒤, px 단위 또는 %로 잡아주어야 모든 디바이스 환경에서 무리없이 적용할 수 있답니다.

 

유용한 사이트 정보

추가로 소개해드리는 다음 사이트에서는 현존하는 스마트폰, 태블릿 뿐만 아닌 노트북 화면의 스크린 사이즈 정보까지 상세하게 제공합니다.

화면 우측 상단의 필터기능으로 원하는 디바이스의 정보만 추려서 볼 수도 있습니다. 

URL : http://screensiz.es/

 

 

그리고 다음 소개해드리는 사이트는 기기별 모바일 화면에 대한 웹 테스트를 직접 해볼 수 있는 ‘다음 트로이’라는 사이트인데요.

화면 좌측의 분류를 통해 디바이스별 해상도 확인은 물론, 실제 web url을 입력해서 어떻게 작동하는지 바로 확인이 가능합니다. 또한 화면 회전 기능과 반응형 테스트, 멀티스크린 모드로 여러 개의 디바이스를 동시에 비교할 수도 있답니다! 직접 핸드폰에 url을 두드려서 확인할 필요가 없으니 훨씬 간편하죠?

URL : http://troy.labs.daum.net/

 

 

여기까지, 다양한 디바이스 별 스크린 사이즈에 대한 정보를 알려드렸습니다