웹 페이지 스크롤 캡처 방법 2가지 (ft. 크롬, 엣지, 웨일)
필요한 정보를 검색하기 위해 웹 사이트를 돌아다니다 보면 가끔 웹 페이지 전체를 캡처해야 하는 경우가 발생합니다.
그런데 화면이 길어서 웹 브라우저 한 페이지를 넘어가는 경우 스크롤을 해야 하는데 기본 캡처 기능으로는 화면을 넘겨서 잘 조절하여 2번 3번 이상 별도의 파일로 캡처를 해야 하는 불편함이 있습니다.
이렇게 웹 브라우저에서 웹 페이지가 화면을 넘어가는 경우에도 자동 스크롤 하면서 전체 페이지를 캡처하는 방법을 알아보겠습니다.
1. 개발자 도구를 활용하여 캡처하기
개발자 도구를 지원하는 크롬, 엣지, 웨일 등의 웹 브라우저에서 공통으로 사용할 수 있는 방법입니다.
- 캡처해야 하는 웹 페이지에서 F12 를 눌러 개발자도구를 실행합니다.
- 개발자도구가 실행된 상태에서 Ctrl+Shift+p 키를 누릅니다.
- Run > 부분에 screenshot 이라고 입력합니다.
- 나열된 4가지 화면 캡처 메뉴 중에서 'Capture full size screenshot' 을 선택합니다.
- 전체 웹 페이지가 하나의 이미지 파일(png) 로 만들어져 저장됩니다. 이때 저장되는 경로는 각 브라우저별 설정된 다운로드 폴더입니다.
캡처한 화면을 보시면 좀 더 쉽게 이해하실 수 있습니다.
1. 캡처를 원하는 웹 페이지를 접속하여 F12(혹은 메뉴 > 도구 더보기 > 개발자 도구) 를 눌러 개발자 도구를 실행합니다.
2. 개발자도구가 실행된 상태에서 Ctrl+Shift+p 키를 눌러서 명령을 입력할 수 있는 prompt 를 호출합니다.
위 캡쳐 화면에서 볼 수 있듯이 Run > 에서 screeshot 을 입력하면 캡쳐 옵션 4가지가 보입니다. 스크롤 하면서 전체 화면을 캡처하고 싶다면 Capture full size screenshot 명령을 선택하면 됩니다.
위 예시는 구글 크롬을 예로 들었지만 마이크로스포트 엣지, 네이버 웨일 모두 거의 동일한 방법으로 웹 페이지 스크롤 캡쳐 혹은 웹 페이지 캡처가 가능합니다.
별도의 외부 프로그램이나 확장 프로그램 없이 간단하게 웹 페이지 전체 화면을 캡처할 수 있습니다. 그런데 웹 페이지가 작성된 방식이나 특성에 따라 캡처된 결과 화면이 잘리거나 캡처되지 않은 부분이 있을 수 있습니다. 이런 경우 웹 브라우저의 확장 프로그램을 이용하면 됩니다.
2. 확장 프로그램 이용하기
크롬, 웨일 브라우저는 동일한 엔진 기반이므로 크롬 웹 스토어에서 동일한 확장 프로그램을 이용하면 됩니다. 마이크로소프트 엣지도 크롬 웹 스토어에서 해당 확장 프로그램을 설치해서 사용해도 되지만, 되도록이면 엣지 Addon (엣지 확장 프로그램) 을 이용하는 것이 더 좋아보입니다.
크롬 웹 스토어에서든 마이크로소프트 엣지 추가 기능 홈페이지에서든 "goFullPage" 를 검색합니다.
goFullPage 확장 프로그램을 설치한후 캡처를 원하는 웹 페이지에 접속한 후 확장 프로그램에서 GoFullPage 를 선택하여 실행합니다.
마이크로소프트 엣지 애드온 사이트에서도 동일 이름의 애드온이 제공되고 있고 사용법 또한 거의 동일합니다.
지금까지 웹 화면 전체 화면을 스크롤 하는 방법을 알아봤습니다. 별도의 외부 프로그램 없이 이 2가지 방법이면 거의 100% 가까이 원하는 화면 캡처가 가능합니다.