공부하자
반응형 웹(Responsive Web)과 모바일 해상도 본문
반응형 웹(Responsive Web)
: 스마트 폰 발달에 따라 발달한 것으로 디스플레이 종류에 따라 화면의 크기가 자동으로 최적화되도록 조절되는 웹페이지.
반응형 웹과 적응형 웹 ?
반응형 웹은 하나의 페이지를 디스플레이 종류에 따라 크기가 자동으로 최적화
적응형 웹은 디스플레이의 사이즈에 따라 웹 페이지가 존재한다. 크게 PC, 탭, 모바일로 나뉘어 제작된다.
모바일 해상도를 확인 할 수 있는 사이트
Vendor object iPhone XS | Viewport Sizes and Pixel Densities for Popular Devices
Vendor detail view type Apple iPhone 8 Plus iOS 5.5 13.9 1080 1920 1080 401 100% MDPI 16 : 9 100 Vendor object 0 Phone Apple iPhone 7 Plus iOS 5.5 14.0 1080 1920 1080 401 100% MDPI 9 : 16 100 Vendor object 0 Phone Apple iPhone XR iOS 6.1 15.5 828 1792 828
screensiz.es
모바일 기기 대비 해상도가 더 높기 때문에 제작시 해상도를 참고하여 제작하여야한다.
예를 들어 아이폰 6 기준 '375px*667' 사이즈이나 지원하는 해상도는 두배인 '750*1334'를 지원한다.
해상도를 기준으로 디자인 작업 및 코딩 작업을 해야 기기에서 선명한 이미지를 확인 할 수 있다.
요즘엔 고해상도의 기기가 더 많아져 사이즈 대비 3배 높은 해상도를 지원하는 경우가 많아 이를 기준으로 작업하는 것이 좋다.
'ETC' 카테고리의 다른 글
다양한 웹폰트 (0) | 2021.02.08 |
---|---|
다양한 제이쿼리 레퍼런스를 정리해둔 사이트 (0) | 2021.01.23 |
api 란? & 카카오맵 연결하기 (0) | 2021.01.11 |
Json과 ajax, ajax로 데이터 값 가져오기 (0) | 2021.01.10 |
비주얼 스튜디오 코드&깃허브 연동하기(Mac) (0) | 2020.11.30 |