Chrome과 Firefox는 빠른 속도뿐만 아니라 손쉬운 사용자 지정이 가능하다는 점에서 많은 사랑을 받고 있습니다. 대표적인 예로, 별도의 확장 프로그램이나 애드온 없이 브라우저 자체 기능만으로 전체 웹페이지 스크린샷을 캡처할 수 있습니다. 이번 글에서는 확장 프로그램 설치 없이 Chrome과 Firefox에서 전체 웹페이지 스크린샷을 찍는 방법을 소개합니다.
두 브라우저 모두 개발자 도구(Developer Tools) 안에 웹페이지 전체를 한 번에 캡처할 수 있는 기능이 내장되어 있습니다. 이 기능을 활용하면 현재 화면에 보이는 영역뿐 아니라 스크롤해야 확인할 수 있는 페이지 전체를 하나의 이미지로 저장할 수 있어, 스크롤링 스크린샷과 유사한 효과를 얻을 수 있습니다.
1. Firefox에서 전체 웹페이지 스크린샷 찍기
Firefox 브라우저를 실행하고 스크린샷을 찍고 싶은 웹페이지를 엽니다.
브라우저 우측 상단에 세로 줄 세 개 아이콘으로 표시된 '메뉴(Menu)'를 클릭한 뒤, 목록에서 '웹 개발자(Web Developer)' 옵션을 선택합니다.
이어서 '반응형 디자인 모드(Responsive Design Mode)' 항목을 찾아 선택합니다.
그다음 페이지에서 마우스 오른쪽 버튼을 클릭하고 '스크린샷 찍기(Take a Screenshot)'를 선택합니다.
즉시 두 가지 옵션이 화면에 나타납니다.
- 전체 페이지 저장(Save Full Page) : 스크롤 전체를 포함한 페이지 전체 영역 저장
- 보이는 영역 저장(Save Visible) : 현재 화면에 보이는 부분만 저장
원하는 옵션을 선택한 뒤, 스크린샷을 원하는 위치에 다운로드하거나 복사하여 사용하면 됩니다.
2. Chrome에서 전체 웹페이지 스크린샷 캡처하기
먼저 Chrome 브라우저를 실행하고 캡처하려는 웹페이지로 이동합니다.
화면 우측 상단의 점 세 개 아이콘('메뉴')를 클릭하고, 표시된 옵션 목록에서 '도구 더보기(More Tools)'를 선택한 후 '개발자 도구(Developer Tools)'를 엽니다.
개발자 도구 창에서 다시 점 세 개 아이콘을 클릭한 후 '명령 실행(Run Command)'을 선택합니다. 참고로 Windows에서는 Ctrl + Shift + P, macOS에서는 Cmd + Shift + P 단축키로도 바로 실행할 수 있습니다.
명령 입력창에 'Screenshot'이라고 입력하면 관련 명령 목록이 표시됩니다. 이 중 'Capture full-size screenshot(전체 크기 스크린샷 캡처)'을 클릭합니다.
스크린샷 저장 안내가 나타나면 컴퓨터 내 저장 위치를 지정하고 '저장(Save)' 버튼을 클릭하면 완료됩니다.
이것으로 끝입니다!
이렇게 하면 확장 프로그램이나 애드온 없이도 Chrome과 Firefox 브라우저에서 웹페이지 전체 스크린샷을 간편하게 캡처할 수 있습니다.
Chrome과 Firefox에서 스크린샷을 찍을 때 활용할 수 있는 브라우저 확장 프로그램을 찾고 있다면 관련 글을 참고해 보세요.