디바이스 사이즈가 정리된 사이트 추천
- 웹 / 모바일 작업하면서 디바이스마다
사이즈 달라서 어떤 기준으로 작업을
해야할지 스트레스 받는데
사이즈 확인 가능한 사이트 입니다.
이걸 통해서 미디어쿼리 사용하면
훨씬 편하겠죠~?
스크린 사이즈라는 사이트에 들어가면
핸드폰 디바이스 또는 태블릿 사이즈별로
나눠져있어서 원하는 기기의 가로/세로 정보들을
확인해 볼 수 있습니다 :)
버튼은 5종류가 있는데
제일 앞에서부터 버튼 설명하자면
1. 검색기능
2. 모바일 사이즈 종류
3. 태블릿 사이즈 종류
4. 모니터 사이즈 종류
5. 옵션 체크리스트
검색 버튼을 누르면 검색창이 나오면서
텍스트를 적을 수 있어요.
[ 전부 영어로 되어있어서 영어로 쳐야해요 ]
예시로 samsung으로 적으니까
samsung 디바이스 위주로 리스트
쫘라라락 나오죠 ㅎㅎ
아 검색할때 엔터키 치시면 안돼요!
텍스트 글만 적어야 검색 결과들이 자동으로 나와요.
모바일 버튼 클릭하면 위에 이미지처럼
모바일 종류별로 리스트로 나오며
가로 세로값 또는 운영체제도 확인할 수 있습니다.
이 사진은 태블릿을 선택했을때
나오는 정보 리스트입니다.
모바일 / 태블릿 뿐만 아니라
모니터 사이즈별로 확인도 가능해요.
이런 정보들을 통해서 기준을
어느정도잡고 작업을 해야할지
정할 수 있어서 좋을것 같아요.
마지막 버튼은 옵션 리스트로
내가 확인할 필요없는 정보들이나
확인하고싶은 내용들로 선택해
자동으로 정리해서 확인 가능한
기능도 있습니다.
이렇게 퍼블리싱 하다가 디바이스들
사이즈때문에 어려워서 헤매고했는데
이제 이 사이트로 편하게 확인
가능할 수 있게 되었답니다.
사이트 링크는 아래에서 확인 가능해요 :)
Screen Sizes | Viewport Sizes and Pixel Densities for Popular Devices
We built screensiz.es to help you quickly find the screen specifications of the most popular devices and monitors currently on the market. The size data comes from Wikipedia, and for a better understanding of Pixel Density, check out this great post by Tee
screensiz.es
'프론트엔드 > 추천 사이트' 카테고리의 다른 글
| 스크린리더 사용해서 테스트 해보기 / Screen Reader Test 방법 (0) | 2022.02.13 |
|---|---|
| [추천사이트]UX - UI 디자인 영감얻기 / 공부하기 좋은 사이트 (0) | 2019.12.30 |
| [추천사이트] 폰트어썸 - 아이콘웹폰트 사용하기 (Icon-Webfont : Fontawesome) (0) | 2019.12.23 |
| [추천사이트] 디자이너 영감 사이트 / 웹사이트 어워드 영감 얻기 (0) | 2019.12.23 |
| [웹사이트 추천] CSS 기초 다지기 (0) | 2019.12.23 |