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

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

1. 개발자모드 실행 방법

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

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

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

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

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

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

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

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

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

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

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

3. 동기화 설정하기

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

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

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


Similar Posts

  • 구글 애널리틱스 애드센스 연결 방법

    애드센스를 사용하다 보면 어느 페이지에서 수익이 나는지 궁금할 때가 있습니다. 애널리틱스 자체적으로는 확인이 어렵기 때문에 구글 애널리틱스에서 볼 수 있게 끔 구글 애널리틱스 애드센스 연결 설정에 대해 알아 보겠습니다. 당연한 이야기이지만 애드센스와 애널리틱스 양쪽에 가입이 되어 있어야 연동이 가능합니다. 목차1. 개발자모드 실행 방법2. 크롬 개발자도구 한국어 변경 및 다크모드 설정3. 동기화 설정하기1. 구글…

  • 클라우드플레어 CDN 설정(Pro 플랜)

    클라우드플레어 CDN을 예전에 사용했었는데 최근 다른 워드프레스 사이트에 재 연결을 하게 되었습니]다. 캐시 플러그인은 현재 사이트와 동일한 조건으로 세팅했는데 무료 플랜은 속도가 현재 사이트에 근접하지 못하고 오히려 느린 결과를 보였습니다.(현재 사이트는 클라우드플레어 CDN이 적용되지 않은 상태입니다) 원래 사이트처럼 동일하게 세팅해서 속도를 높일까 고민하다가 Pro플랜으로 업데이트 했습니다. 확실히 업데이트 후 현재 사이트보다 조금 느리지만…

  • [SEO] 링크 교환이란? | 상호링크, 백링크 교환

    검색 엔진 최적화를 위해 온페이지 SEO만으로는 많은 시간이 소요될 수 있습니다. 오프페이지 SEO 중 하나인 백링크를 생각하게 되며, 링크 빌딩을 위한 링크 교환에 대해 생각하게 됩니다. 링크 교환(Link-Exchange)이란 각각의 다른 웹사이트가 링크를 교환함으로써 링크 주스(점수)를 보내는 것입니다. 상호 링크, 상호 백링크라고도 부릅니다. 목차1. 개발자모드 실행 방법2. 크롬 개발자도구 한국어 변경 및 다크모드 설정3….

  • [SEO] 이미지 메타 데이터가 SEO에 미치는 영향 및 수정 방법

    웹 사이트를 운영하면서 비용이 발생하지 않는 유기적인 트래픽을 획득하려면 웹 사이트 속도, 백링크, 이미지 대체 텍스트 등 다양한 방법을 적용하며 운영하게 됩니다. 웹 사이트 SEO에 약간의 점수를 더 얻고 싶다면 이미지 메타 데이터에 대한 고려를 생각해 볼 수 있습니다. 생성한 콘텐츠가 첫 페이지에 뜨지만 1~3번째 노출하기 위한 여러가지 방법이 있지만 작문 실력 외에…

  • 구글 애널리틱스 서치콘솔 연결 방법

    구글 애널리틱스 서치콘솔 연결 시 사용자가 어떤 방식으로 구글 검색에서 내 사이트를 접속했는지 알 수 있습니다. 이를 기반으로 ‘구글 애널리틱스’에서 접속 한 장소(국가 및 도시)와 구글, 네이버, 다음, 빙 등 접속한 경로를 알 수 있기에 유용하게 사용할 수 있습니다. 그 외에 데이터도 제공하기에 웹페이지에 접속했던 통계를 보다 체계적으로 사용할 수 있게 도와주는 유용한…

  • [SEO] 링크 스팸과 구글 웹 검색 스팸 점수(Spam Score)

    검색엔진최적화를 위한 방법에는 여러가지가 있습니다. 성급한 생각에 정상적인 방법이 아닌 블랙햇 SEO를 기법을 사용하는 경우도 찾아 볼 수 있습니다. 블랙햇 SEO의 일종인 링크 스팸과 구글 검색 노출이 되지 않을 가능성이 있는 구글 검색 스팸 점수(Spam Score)에 대해 알아 보겠습니다. 목차1. 개발자모드 실행 방법2. 크롬 개발자도구 한국어 변경 및 다크모드 설정3. 동기화 설정하기링크 스팸이란?…