화면 전체 스크롤 캡쳐 - hwamyeon jeonche seukeulol kaebchyeo

크롬 화면 전체 페이지 스크롤 캡쳐 방법 소개

안녕하세요. 자유분방입니다. 크롬 브라우저에서 확장프로그램을 이용하여 화면 전체 페이지를 스크롤 캡쳐 하는 방법을 소개드려 보려고 합니다. 크롬스토어에서 간단하게 확장 프로그램만 추가 해주면 되기 때문에, 간편하게 따라하실 수 있을 것 같습니다. 별도 캡쳐를 위한 툴바를 사용하지 않아도 된다는 부분에서 웹상 한정으로 상당히 좋은 기능이라고 생각되어 소개드리게 되었습니다. 그럼 아래 방법을 순차적으로 따라해보시기 바랍니다 :)

화면 전체 스크롤 캡쳐 - hwamyeon jeonche seukeulol kaebchyeo

우선 크롬스토어를 검색하여, 크롬 웹 스토어로 들어가주시면 됩니다.

화면 전체 스크롤 캡쳐 - hwamyeon jeonche seukeulol kaebchyeo

왼쪽 상단 검색창에 Full Page Screen Capture를 검색해주세요.

검색이 번거로우시다면, 아래 링크를 클릭해주세요

화면 전체 스크롤 캡쳐 - hwamyeon jeonche seukeulol kaebchyeo

화면 전체 스크롤 캡쳐 - hwamyeon jeonche seukeulol kaebchyeo

검색해서 나온 Full Page Screen Capture를 크롬에 추가 해주시면 되겠습니다.

상단 붉은색 상자 안 Chrome에 추가를 클릭해주세요

화면 전체 스크롤 캡쳐 - hwamyeon jeonche seukeulol kaebchyeo

그러면 자연스레 확장 프로그램 추가가 뜨게됩니다.

화면 전체 스크롤 캡쳐 - hwamyeon jeonche seukeulol kaebchyeo

화면 전체 스크롤 캡쳐 - hwamyeon jeonche seukeulol kaebchyeo

사용은 크롬 브라우저 우측 상단의 카메라 모양을 클릭해주시면 되요.

화면 전체 스크롤 캡쳐 - hwamyeon jeonche seukeulol kaebchyeo

화면 전체 스크롤 캡쳐 - hwamyeon jeonche seukeulol kaebchyeo

그러면 제가 보고 있던 페이지를 풀 페이지 스크린 캡쳐해줍니다.

화면 전체 스크롤 캡쳐 - hwamyeon jeonche seukeulol kaebchyeo

바로 확인도 가능하고, PDF파일로 저장도 가능해요. 위는 PDF파일로 저장해본 형태입니다.

화면 전체 스크롤 캡쳐 - hwamyeon jeonche seukeulol kaebchyeo

이번 이야기에서는 크롬 브라우저의 확장 기능을 이용하여 풀 페이지 스크린 캡쳐를 하는 방법을 소개드렸습니다. 그리 어렵지 않은 부분이기 때문에 쉽게 따라하실 수 있으시리라 생각되네요. 그럼 이번 이야기는 여기에서 마치도록 하겠습니다. 감사합니다 :)

웹 서핑하다가 마음에 드는 내용이 있으면 캡쳐하시죠? 한 화면 안에 들어오는 내용이면 클릭 한 번으로 캡쳐하기가 쉬운데 만약 전체 내용을 캡쳐하고 싶을 때는 어떻게 하시나요? 전체 페이지 캡쳐 방법을 몰라 한 화면에 내용을 옮겨가며 여러 번 캡쳐를 하셨나요? 이번 포스팅에서는 웹 페이지 전체 스크린샷을 찍는 방법을 알려드리겠습니다. 플러그인, 크롬, 사파리, 파이어폭스 등 다양한 방법으로 전체 캡쳐하는 방법을 알려드릴 테니 아래에서 확인해 주세요.

아이폰에서 전체 페이지 캡쳐를 하려면?

아이폰 전체 화면 캡쳐 - 스크롤 길게 스크린샷 찍는 초간단 방법

awesome screenshot 확장 프로그램

확장 프로그램을 사용하여 클릭 한 번으로 웹페이지 전체를 길게 저장하는 방법을 알려드리겠습니다. 사용하려는 플러그인은 Awesome Screenshot이며 크롬, 사파리, 파이어폭스 등 대부분의 브라우저에서 사용할 수 있습니다. 클릭 한 번으로 전체 페이지를 길게 이미지로 저장하고 싶으면 이 방법을 이용해 보세요.

사용 방법은 크롬 기준으로 설명하겠습니다. 사파리, 파이어폭스도 플러그인만 설치하면 모두 같은 방식으로 작동합니다.

-우선 크롬 웹스토어에서 awesome screenshot 확장 프로그램을 다운받아 주세요.

화면 전체 스크롤 캡쳐 - hwamyeon jeonche seukeulol kaebchyeo
Awesome Screenshot

-확장 프로그램이 설치되었다면 주소창 옆에 awesome screenshot 아이콘이 나타납니다. 만약 보이지 않는다면 퍼즐 모양을 클릭해 설치한 확장 프로그램 목록에서 awesome screenshot 아이콘을 찾아 눌러주세요.

-캡처할 옵션이 나타납니다. 이때 ‘Full Page’를 클릭하여 전체 페이지를 캡쳐합니다.

화면 전체 스크롤 캡쳐 - hwamyeon jeonche seukeulol kaebchyeo
Awesome Screenshot

-잠시 후 웹 사이트 전체 캡처가 완료되고 스크린샷을 편집할 수 있는 창이 나타납니다. 필요한 경우 자르기, 텍스트 입력, 브러쉬 입력 등 간단한 편집을 마치고 완료되었으면 맨 오른쪽 DONE을 누릅니다.

화면 전체 스크롤 캡쳐 - hwamyeon jeonche seukeulol kaebchyeo
Awesome Screenshot

-다음 나타나는 창에서 Download를 누르면 저장할 파일의 위치와 이름을 설정한 후 Save를 누르면 해당 경로로 전체 웹페이지 스크린샷이 내 컴퓨터에 저장됩니다.

크롬 개발자 도구 - 전체 화면 캡쳐

만약 크롬 브라우저를 이용하고 있다면 개발자 도구를 이용하여 전체 페이지를 캡처하는 방법도 있습니다. 별도의 확장 프로그램을 설치하지 않고도 간단한 설정으로 캡처를 할 수 있기 때문에 빠르게 페이지 전체 캡쳐를 하려는 분은 시도해볼 수 있습니다.

-전체 스크린샷을 찍을 페이지 위에 오른쪽 마우스를 클릭합니다.

-검사 (Inspect)를 눌러주세요

화면 전체 스크롤 캡쳐 - hwamyeon jeonche seukeulol kaebchyeo
크롬 개발자 도구

-단축키 Command+Shift+P를 동시에 누릅니다. 윈도우 사용자는 Command 대신 Ctrl 키를 눌러 주세요.

-아래와 같이 나타나는 창에서 screenshot을 입력합니다.

화면 전체 스크롤 캡쳐 - hwamyeon jeonche seukeulol kaebchyeo
크롬 전체 스크롤 캡처

-전체 페이지 캡쳐를 위해 Capture Full Size Screenshot을 선택합니다. 즉시 전체 화면 캡처가 완료되며 내 컴퓨터에 이미지가 저장됩니다.

크롬 개발자 도구로 이동하면 전체 화면 스크롤 캡쳐가 가능합니다. 하지만 오른쪽 마우스가 막혀있는 사이트에서는 오른쪽 마우스가 작동하지 않기 때문에 개발자 도구로 들어가려면 크롬 오른쪽 상단의 점 세 개 아이콘 > 도구 더보기 > 개발자 도구로 이동하면 됩니다. 

사파리 개발자 도구 - 전체 화면 캡쳐

맥북에서 크롬 대신 사파리 브라우저를 이용하고 계신다고요? 사파리에서도 크롬처럼 개발자 도구로 들어가 전체 페이지를 캡쳐하는 방법이 있습니다. 위 방법과 거의 같지만 살짝 다른 부분이 있어 그 방법도 소개해 드릴게요.

-사파리 브라우저에서 캡쳐하려는 사이트에 들어간 후 상단 메뉴에서 Safari > 환경 설정에 들어갑니다.

- 고급 탭으로 들어가 주세요.

화면 전체 스크롤 캡쳐 - hwamyeon jeonche seukeulol kaebchyeo
사파리 개발자 도구 활성화

-화면 하단의 '메뉴 막대에서 개발자용 메뉴 보기'에 체크해 주세요.

-이제 다시 웹 페이지로 돌아가면 아래와 같이 상단에 '개발자용'이라는 메뉴가 생성됩니다. 이곳을 누른 후 '웹 속성 연결'을 누릅니다. 

화면 전체 스크롤 캡쳐 - hwamyeon jeonche seukeulol kaebchyeo
사파리 개발자 도구 불러오기

- 나타나는 개발자 도구 창에서 '요소' 탭으로 이동한 후 아래와 같이 html로 시작하는 곳에 마우스를 올려놓고 오른쪽 버튼을 눌러 ‘스크린샷 캡처'를 선택합니다.

화면 전체 스크롤 캡쳐 - hwamyeon jeonche seukeulol kaebchyeo
사파리 개발자 도구 스크린샷 캡처

-캡처본의 이름과 저장 경로를 선택한 후 저장을 누르면 전체 스크린샷이 내 컴퓨터에 저장됩니다.

사실 사파리 개발자 도구에서 전체 화면을 캡처하는 것은 상당히 번거로워 awesome screenshot 확장 프로그램을 활용하거나 다른 브라우저를 사용하는 것이 낫습니다. 

파이어폭스 - 전체 화면 캡쳐

파이어폭스 사용자라면 좀 더 쉽게 전체 웹페이지를 스크린샷 찍을 수 있습니다. 크롬이나 사파리와 다르게 전체 페이지 캡처 기능이 기본으로 제공되기 때문인데요. 복잡하게 개발자 도구에 들어가지 않아도 전체 페이지를 캡처할 방법은 무엇일까요?

-파이어폭스에서 캡쳐하려는 페이지로 이동 후 주소창 쪽에서 오른쪽 마우스를 클릭 후 '도구 모음 사용자 지정'을 눌러주세요.

-나타나는 화면에서 ‘스크린샷' 아이콘을 클릭한 후 브라우저 상단 메뉴로 쭉 끌어옵니다.

화면 전체 스크롤 캡쳐 - hwamyeon jeonche seukeulol kaebchyeo
파이어폭스 스크린샷

-이 탭을 닫아준 후 캡쳐하려는 웹 페이지로 이동합니다.

-좀 전에 끌어놓은 스크린샷 도구 아이콘을 누르면 아래와 같이 캡처 옵션이 뜨며, 전체 페이지 저장을 선택합니다. 지금 화면에 보이는 내용만 캡쳐하고 싶으면 그 옆의 보이는 내용 저장을 눌러주세요. 

화면 전체 스크롤 캡쳐 - hwamyeon jeonche seukeulol kaebchyeo
파이어폭스 스크롤 캡처

-캡처본이 화면에 나타납니다. Download를 클릭하면 전체 페이지가 내 컴퓨터에 저장됩니다.

엣지 - 전체 화면 캡쳐

엣지 브라우저를 이용하고 있다면 더 간단합니다. 단축키를 이용하면 전체 페이지 캡쳐가 가능합니다.

-엣지 브라우저에서 원하는 페이지로 이동합니다.

-단축키 Command (Ctrl) + Shift + S를 누릅니다.

-아래와 같이 캡쳐 옵션이 뜹니다. 전체 페이지 캡처를 누르면 페이지 전체를 길게 이미지로 캡처합니다.

-저장을 눌러 내 컴퓨터에 이미지로 저장합니다. 기본적으로 저장본은 윈도우의 경우 C:\Users\<user name>\Downloads 맥북의 경우 다운로드 폴더에 저장됩니다.

전체 웹페이지를 스크린샷 찍는 방법에 대해 알아보았습니다. 도움이 되셨나요? 크롬이나 사파리는 개발자 도구에 들어가 전체 페이지를 캡쳐해야 하는 번거로움이 있습니다. 그에 반해 파이어폭스나 엣지의 경우 전체 페이지를 캡처할 수 있는 기능이 기본으로 내장되어있기 때문에 훨씬 더 빠르고 편리하게 페이지를 길게 캡쳐할 수 있습니다. 위에서 소개한 방법 모두 무료로 이용할 수 있는 방법이니 본인이 사용하는 브라우저에 맞게 웹 페이지를 캡쳐해 보세요.