웹사이트에서 필요한 이미지를 다운로드하여야 할 경우가 생기는데요. 일반적인 이미지 같은 경우는 마우스 우클릭으로 이미지를 저장받을 수 있지만 특정 이미지 같은 경우는 우클릭해도 이미지 저장 버튼이 없거나 다운로드하여도 웹페이지 전부 다운로드할 때가 있어요.
그래서 이제부터 해당 웹사이트에서 이미지 다운로드하는 방법을 알려 드릴게요.
(디자이너인 저는 클라이언트의 브랜드 웹사이트에서 이미지를 받아서 이벤트 배너를 만들 때 많이 사용했던 방법입니다)
목차
웹사이트 마우스 우클릭 금지 해제하는 방법은 아래 링크에서 확인해보세요.
2021.03.27 - [팁/Web] - 마우스 우클릭 사용금지 해제하기(크롬 브라우저)
01. 웹사이트에서 원하는 이미지 선택해서 다운로드하는 방법
선행 조건 : 크롬 브라우저가 필요
① 이미지를 다운로드할 웹사이트를 브라우저로 실행해서 들어갑니다. (블라자드 웹사이트로 예시로 들겠습니다)
② 키보드 F12 눌러 주거나 마우스 우클릭 후 검사 버튼을 눌러도 됩니다. (개발자 도구를 실행하는 방법입니다)
③ 실행된 개발자 도구의 상단에 마우스 아이콘을 클릭 -> 다운로드하고 싶은 이미지 선택
④ 이미지를 선택하시면 개발자 도구에서 image가 들어간 링크를 확인 -> 해당 링크를 우클릭 후 Open in new tab를 클릭
(웬만해서는 태그나 링크에 image라는 텍스트가 들어가 있어서 찾으시면 돼요)
⑤ 해당 이미지만 있는 새로운 탭이 열림 -> 마우스 우클릭 후 이미지 저장
02. 웹사이트에서 모든 이미지 소스 확인하고 다운로드하는 방법
선행 조건 : 크롬 브라우저가 필요
① 이미지를 다운로드할 웹사이트를 크롬 브라우저로 실행해서 들어갑니다. (블라자드 웹사이트로 예시로 들겠습니다)
② 키보드 F12 눌러 주거나 마우스 우클릭 후 검사 버튼을 눌러도 됩니다. (개발자 도구를 실행하는 방법입니다)
③ 실행된 개발자 도구의 상단에 Sources 버튼을 클릭 -> 여러 폴더 중 img 폴더 찾아서 오픈(선택 이미지에 image 텍스트가 있는 것처럼 웬만한 웹사이트의 이미지는 img의 폴더에 들어 있습니다. 그리고 img는 image의 약자입니다)
④ img 폴더 하단에 있는 파일들이 모두 이미지 파일이고 웹사이트에 들어간 버튼부터 로고, 배경 이미지까지 확인할 수 있어요.
원하는 이미지 파일에 마우스 우클릭 후 Open in new tab를 클릭
⑤ 해당 이미지만 있는 새로운 탭이 열림 -> 마우스 우클릭 후 이미지 저장
03. 크롬 확장 프로그램으로 모든 이미지 한 번에 다운로드하는 방법
선행 조건 : 크롬 브라우저가 필요
① 크롬 확장 프로그램 Image Downloader 설치합니다.
설치 링크 : https://chrome.google.com/webstore/detail/image-downloader/cnpniohnfphhjihaiiggeabnkjhpaldj/related
② Image Downloader 설치하면 나오는 설정 옵션은 Save 클릭합니다.(추후 사용 중에도 언제든지 옵션은 변경 가능)
③ 이미지를 다운로드할 웹사이트에서 Image Downloader 확장 프로그램을 클릭하면 됩니다.
④-1. 원하시는 이미지만 다운로드하여도 되고 여래 개의 이미지를 체크한 뒤 다운로드하여도 됩니다.
a : 옵션을 설정할 수 있음
b : 원하는 이미지 사이즈를 필터링할 수 있음
c : 해당 이미지를 1개를 다운로드할 수 있음
d : 여러 개의 이미지를 체크한 뒤 다운로드할 수 있음
④-2. Select all를 체크하시면 전체 이미지를 다운로드할 수 있습니다.
Tip. 전체 이미지를 편리하게 다운로드하는 방법
전체 이미지를 다운 받을 경우 해당 메시지가 보입니다.
take a quick look at your brower settings.
If the Ask where to save each file before downloading option is checked, proceeding might open a lot of popup windows. Continue with the download?
이미지를 다운 받을 때마다 저장 위치를 물어본다는 의미입니다. 즉, 20개의 이미지를 다운로드할 경우 20번을 물어본다는 뜻입니다.
이럴 때는 '크롬 설정 > 고급_다운로드 > 다운로드 전에 각 파일의 저장 위치 확인'을 해제하면 됩니다. 당연히 이미지 다운로드 위치는 미리 설정해야 원하는 폴더에 이미지를 다운로드할 수 있습니다.
2023.02.08 - [팁/Web] - 유튜브 영상 PC, 모바일에서 다운로드 방법(프로그램 필요 없음)
2021.06.28 - [팁/Web] - UI 디자이너에게 추천하는 크롬 확장 프로그램
2021.07.28 - [팁/Web] - 크롬 확장 프로그램 단축키로 실행하기