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

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

1. 개발자모드 실행 방법

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

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

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

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

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

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

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

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

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

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

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

3. 동기화 설정하기

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

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

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


Similar Posts

  • 아이폰 디스플레이 및 밝기 설정(&라이트모드 다크모드 2가지 모드)

    아이폰은 설정 화면의 디스플레이 및 밝기 설정탭으로 들어가면 아이폰 라이트모드 다크모드를 각각 설정을 할 수 있습니다. 아이폰 디스플레이 및 밝기 설정 탭으로 접속하면 첫 화면에서 바로 확인할 수 있습니다. 전 구매하자마자 다크모드를 사용해서 눈의 편안함을 추구하고 있습니다. 디스플레이 및 밝기 설정 탭의 기능들을 하나 씩 알아보겠습니다. 목차1. 개발자모드 실행 방법2. 크롬 개발자도구 한국어…

  • [Google Analytics GA4] 구글 애널리틱스 GA4 설치하기

    구글 애널리틱스 GA4로 사이트의 기본적인 접속 통계 및 실시간 사용자를 확인 할 수 있습니다. GA4 신규 생성 방법에 대해 알아 보겠습니다. GA4 신규 세팅을 위해서는 운영중인 URL이 있는 웹사이트가 있어야 합니다. ※ 애널리틱스 카테고리는 [계정]과 그 하위 카테고리인 [속성]에서 거의 모든 설정을 한다고 본 후에 시작하는 것이 좋습니다. 목차1. 개발자모드 실행 방법2. 크롬…

  • [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 서브폴더 두 가지 설정을…

  • 낙장 도메인이란?

    워드프레스 및 Ghost CMS 등으로 블로그를 시작하는 경우가 많이 늘고 있습니다. 검색 엔진 최적화(SEO)를 위해 낙장 도메인 구매를 고려하는 분들이 많은 것을 유튜브 및 해외 사이트에서 빈번히 확인할 수 있습니다. 목차1. 개발자모드 실행 방법2. 크롬 개발자도구 한국어 변경 및 다크모드 설정3. 동기화 설정하기✅ 낙장 도메인이란? 도메인 등록 후 연장 비용을 지불하지 않아 도메인의…

  • [SEO] 검색엔진 최적화 기본 용어 5가지 및 최적화를 기본적인 필수 사항

    웹사이트로 광고 수익을 창출하거나 온라인 쇼핑몰에서 물품을 판매한다면 검색엔진 최적화는 필수입니다. ‘검색엔진 최적화 기본 용어’에 대해 알아 보겠습니다. 구글·네이버와 같은 검색 사이트에서 유료 광고 외에도 원하는 글이나 상품이 글 상단 or 첫페이지에 나온다면 그만큼 광고비를 아낄 수 있고 마케팅에서 많은 이점을 누릴 수 있기 때문입니다. 목차1. 개발자모드 실행 방법2. 크롬 개발자도구 한국어 변경…

  • [구글 렌즈] 구글 이미지 검색 방법(PC&모바일 앱)

    PC 또는 모바일에서 가지고 있는 이미지와 비슷한 이미지를 찾아야 하는 경우에 보통 구글 렌즈를 이용한 이미지 검색 기능을 활용합니다. 구글 이미지 검색을 하는 이유는 보통 특정 장소의 동·식물, 미술품과 같은 작품에 대해 텍스트로 물어볼 수 없는 이유가 있습니다. 이를테면 식물원에 갔는데 어떤 식물인지 궁금하지만 텍스트로 검색해서 확인할 수 없는 경우에 모바일 크롬의 구글…