[Chrome] 크롬 개발자도구 실행과 한국어 변경 방법

구글에서 만든 크롬 브라우저는 개발을 도와주는 ‘크롬 개발자도구’가 있습니다. 개발자 도구(Developer tools)를 이용해서 HTML, CSS, JavaScript의 생산성을 높일 수 있습니다. 개발자를 위한 도구이지만 글자 크기, 색, 간격과 같은 값을 확인할 수도 있고 웹사이트의 속도를 PC뿐만 아닌 모바일 버전으로도 확인할 수 있는 장점이 있습니다.

1. 개발자모드 실행 방법

실행 방법은 2가지가 있습니다. 검수하려는 웹사이트에 접속 후 맥에서 [command+option+I], 윈도우에서는 [ctrl+shift+I]를 눌러 실행하면 됩니다. 제일 많이 사용하는 단축키는 [F12]이겠죠. 직접 접속 할 때는 크롬 앱의 우측 상단 [더보기] > [도구 더보기] > [개발자 도구]를 클릭하면 확인할 수 있습니다.

크롬 개발자도구-더보기 메뉴에서 실행하기

2. 크롬 개발자도구 한국어 변경 및 다크모드 설정

개발자도구를 한국어로 변경 후 사용할 수 있습니다. 개발자도구의 기본 인터페이스입니다.

크롬 개발자도구-기본 인터페이스(영어)

크롬 개발자도구 실행 후 우측 상단 톱니바퀴 모양 [설정] 버튼을 클릭합니다.

크롬 개발자도구-우측 상단 설정 버튼

개발자 도구 설정 화면의 기본 인터페이스입니다.

크롬 개발자도구-설정 기본 인터페이스(영어)

Language를 클릭해서 한국어 변경 및 크롬 개발자도구 테마를 다크모드로 변경할 수 있습니다. 설정 변경 후 창을 닫아 주면 됩니다.

크롬 개발자도구 설정-한국어 변경 및 다크모드 설정

3. 동기화 설정하기

PC에서 설정한 것을 집에 가서 노트북 등으로 작업을 해야 하는데 재 설정을 해야 한다면 번거로울 수 있습니다. 동기화 설정이 가능합니다. 기본 환경설정 하단에 보면 [설정 동기화 사용]을 체크해서 사용할 수 있습니다.

크롬 개발자도구 환경설정-동기화 사용하기

개발자도구의 가장 기본적인 설정 법에 대해 알아 봤습니다.


Similar Posts

  • [SEO] 서브도메인 VS 서브폴더 2가지 설정 중 SEO에 더 유리한 것은?

    서브도메인 VS 서브폴더 SEO에 어떤 방식이 유리한지 알아 보겠습니다. 먼저 Subdomain에 대해 간략히 설명하자면 인터넷에서 특정 사이트에 접속했을 때 www.domain.com에서 shop.domain.com이나 blog.domain.com과 같이 서브도메인으로 연결되는 경우를 확인한 적이 있을 겁니다. shop이나 blog와 같은 Subdomain 외에 www.domain.com/shop과 www.domain.com/blog와 같이 서브폴더(하위 디렉토리 or 하위 폴더)로 주제를 나누는 방법이 있습니다. 서브도메인 VS 서브폴더 두 가지 설정을…

  • SEO: 구글 허밍버드 알고리즘

    구글 허밍버드(Hummingbird)는 검색 결과 개선을 위해 2013년에 구글이 업데이트한 알고리즘 코드명입니다. 허밍버드는 검색자의 키워드가 포함된 웹페이지를 표시하는 대신 검색자의 의도를 이해하고 일치 시킬 수 있도록 돕는 것을 목표로 합니다. 검색 엔진 중 특히 구글은 사용자 경험(UX)을 최적화하기 위해 정기적으로 알고리즘을 조정하지만 Hummingbird는 Panda(2011) 및 Penguin(2012)보다 더 의미 있는 알고리즘이었습니다. 목차1. 개발자모드 실행 방법2….

  • 무료 VPN 추천 TOP5&유료 TOP3 | VPN이란?

    VPN이란 가상 사설망(Virtual Private Network)이란 뜻을 가지고 있으며, 공용 네트워크를 사용할 때 보호된 네트워크 연결 설정을 제공합니다. 주요 기능은 인터넷 트래픽을 암호화하여 온라인 상의 공용 네트워크 IP(공용 IP)를 보호하게 됩니다. VPN에 대한 정보와 가볍게 사용할 수 있는 VPN 종류 및 추천할 수 있는 무료 VPN에 대해 알아 보겠습니다. 목차1. 개발자모드 실행 방법2. 크롬…

  • SEO를 위한 타이틀 태그: H1 태그와 차이점과 올바른 사용법

    타이틀 태그는 구글 등의 검색 엔진에서 검색 엔진 결과 페이지(SERP)에서 링크로 표시됩니다. 타이틀 태그(Tltle Tag)란 웹페이지 제목을 지정하며, HTML 요소입니다. 타이틀 태그 SEO(검색엔진최적화)를 위해 웹페이지의 콘텐츠에 대해 정확하고 간결한 설명을 필요로 합니다. SERP에 나오는 방식은 아래와 같습니다. 확인된 것처럼 [검색엔진 최적화(SEO)란 무엇일까? 라는 글에서 제목 및 메타 디스크립션을 확인할 수 있습니다. 제목 태그는…

  • [Chrome App-PC] 세이프 브라우징 설정 방법

    Google의 데스크탑 및 모바일 앱인 Chrome 세이프 브라우징은 유저가 위험한 웹사이트를 탐색하는 중 위험한 파일을 다운로드 하려고 할 때 사용자에게 경고하는 구글의 서비스입니다. 랜섬웨어, 스파이웨어, 바이러스, 웜 및 트로이 목마를 포함한 맬웨어 등의 감염을 사전에 방지할 수 있도록 해 주는 서비스인 것이죠. 크롬 브라우저를 사용하던 중 빨간 화면의 안내 창을 본 적이 있을…

  • 도메인: 정의 및 개념 | 최상위 도메인(TLD)의 종류

    도메인은 원래 ‘영토, 영역, 분야’ 등을 뜻하는 단어로, 오늘날에는 인터넷 주소의 의미로 확장되어 사용되고 있습니다. 도메인은 인터넷에서 웹사이트에 접속할 때 사용하는 사람이 읽기 쉬운 주소입니다. 웹사이트는 본래 고유한 IP 주소(숫자)로 구분되지만, 기억하기 어렵기 때문에 문자 기반의 도메인을 사용하게 되었습니다. 목차1. 개발자모드 실행 방법2. 크롬 개발자도구 한국어 변경 및 다크모드 설정3. 동기화 설정하기 ✅…