목차
1.크롬/EDGE 브라우저 개발자 도구 이용하기
2.모바일 에뮬레이터 이용하여 모바일 화면 보기
3.Naver Wale 브라우저를 이용한 모바일 화면 보기
4. 개발자도구와 에뮬레이터 방식의 장단점
현재 모바일 기기를 사용하는 사람들이 늘어남에 따라 모바일 웹사이트나 앱의 중요성이 높아지고 있습니다. 하지만, 모바일 기기에서는 화면 크기가 작아 디자인 문제나 반응성 문제가 발생할 수 있습니다. 이러한 문제를 해결하고 모바일 사용자들에게 좋은 사용 경험을 제공하기 위해 PC에서 모바일 화면을 확인하는 것이 필요합니다. 이를 위해서는 PC에서 모바일 화면을 어떻게 확인하는지에 대해 알아볼 필요가 있습니다
PC에서 모바일 화면을 확인하는 방법은 크게 3가지가 있습니다. 브라우저가 제공하는 전용 개발자 도구나, 모바일 에뮬레이터 또는 Naver에서 개발한 전용 Wale 브라우저를 이용하는 것입니다. 구체적인 방법은 아래와 같습니다.
1.크롬/EDGE 브라우저 개발자 도구 이용하기
1.브라우저에서 F12 키를 눌러 개발자 도구를 엽니다.
2.개발자 도구에서 왼쪽 상단에 있는 디바이스 모드(Device mode) 버튼을 클릭합니다.
3.디바이스 모드에서는 다양한 모바일 기기의 크기와 해상도를 선택할 수 있습니다. 여기서 "Responsive" 를 선택하 면, 화면 오른쪽에 선택한 크기로 변경된 모바일 화면이 나타납니다.
5.티스토리에 접속하여 모바일 화면을 확인할 수 있습니다.
2.모바일 에뮬레이터 이용하여 모바일 화면 보기
PC에서 실행 가능한 모바일 에뮬레이터를 설치하고 실행합니다.
대표적인 모바일 에뮬레이터로는 Google에서 제공하는 Android Studio, Genymotion 등이 있습니다.
에뮬레이터를 실행한 후, 티스토리에 접속하여 모바일 화면을 확인할 수 있습니다.
3.Naver Wale 브라우저를 이용한 모바일 화면 보기
네이버 웨일 브라우저의 우측 상단의 점3개 메뉴를 들어가면 Mobile 이라고 되어 있는 메뉴가 있습니다.해당 버튼을 누르면 모바일 화면으로 볼 수 있는 창이 하나 뜹니다.그 창에서 티스토리에 접속하면 모바일 페이지로 연결이 됩니다.
4. 개발자도구와 에뮬레이터 방식의 장단점
각각의 방법의 장단점은 다음과 같습니다.
개발자 도구 이용하기
장점:
- 쉽고 빠르게 모바일 화면을 확인할 수 있습니다.
- 브라우저에서 기본적으로 제공하는 기능이므로, 별도의 확장 프로그램 설치가 필요하지 않습니다.
- 다양한 기기 크기와 해상도를 선택할 수 있어서, 다양한 모바일 디바이스에서의 화면을 확인할 수 있습니다.
단점:
- 실제 모바일 기기와 브라우저 동작 방식이 다르기 때문에, 완벽한 시뮬레이션을 보장하지 않습니다.
- 모바일 환경에서 발생할 수 있는 네트워크 지연, 느린 로딩 속도 등의 이슈를 확인하기 어렵습니다.
모바일 에뮬레이터 이용하기
장점:
- 실제 모바일 기기에서 보는 것과 거의 동일한 환경을 제공하여, 더욱 정확한 시뮬레이션을 제공합니다.
- 모바일 기기에서 발생할 수 있는 네트워크 지연, 느린 로딩 속도 등을 확인할 수 있습니다.
단점:
- 별도의 확장 프로그램 설치가 필요합니다.
- 다양한 기기 크기와 해상도를 지원하지 않아, 특정 기기에서만 테스트가 가능합니다.
- 브라우저에서 제공하는 기능이 아니므로, 사용법이 익숙하지 않은 경우 사용하기 어려울 수 있습니다.
따라서, 개발자 도구와 모바일 에뮬레이터 각각의 장단점을 고려하여 상황에 맞게 선택하여 사용하는 것이 좋습니다.
이러한 방법을 통해 PC에서 티스토리의 모바일 화면을 쉽게고 편리하게 확인할 수 있습니다.
티스토리 글 본문 내에서 하이퍼 링크 이동, 하이퍼 링크거는 방법
'블로그' 카테고리의 다른 글
| 구글봇이 좋아하는 글 핵심 정리,검색엔진최적화(SEO) (0) | 2023.02.26 |
|---|---|
| 티스토리 글 PC에서 편집하면서 모바일 화면 확인하는 방법 (0) | 2023.02.26 |
| 티스토리 게시글 방문자 수 조회 방법 (0) | 2023.02.25 |
| 애드센스 가입 및 승인 절차 (0) | 2023.02.25 |
| 애드센스 승인을 위한 글쓰기 팁 핵심 4가지 (0) | 2023.02.24 |