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

Author:jarvis Hours 등록일 Hours 업데이트
공정위 광고 문구 Ver 3.1
공정위 광고 문구 Ver 3.2(모바일 전용)

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

TOC
1mn read
TOC
1mn read
View more

1. 개발자모드 실행 방법

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

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

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

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

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

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

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

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

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

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

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

3. 동기화 설정하기

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

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

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

GA4 설치 방법

ℹ️ 제휴 안내
본 사이트의 콘텐츠에는 제휴 링크가 포함되어 있습니다. 방문자가 이 링크를 통해 상품 또는 서비스를 구매하면 본 사이트는 판매처로부터 수수료를 지급받습니다. 이 과정에서 구매자가 지불하는 금액(이벤트 할인 시 금액이 내려갑니다↓)은 오르지 않습니다. 게시된 가격·할인·재고 정보는 작성 시점 기준이며 실제와 다를 수 있으므로, 구매 전 판매처에서 최종 확인하시기 바랍니다. 상품 선정과 평가는 자체 기준에 따라 작성되며, 수수료 지급 여부가 소개 순서나 평가 내용에 영향을 주지 않습니다.

Similar Posts

  • SEO: 검색 의도(Search Intent) 및 4가지 분류

    Published:jarvis

    구글을 포함한 검색 엔진에서 검색 의도(Search Intent)는 사용자 의도(User Intent)로도 불리며, 사용자가 검색 엔진에서 검색어를 입력할 때 갖는 주요 목표입니다. 일반적으로 4가지 유형이 포함됩니다. 검색 의도의 4가지 분류 사용자 의도는 4가지로 분류되며, 다음과 같습니다. 1. 상업적 의도 사용자가 구글링을 통해 서비스를 구매하려고 하지만 아직 제품을 구매하기 전입니다. ‘고양이 사료 비교’등과 같이 사전 조사가…

  • 웹사이트 속도 측정 사이트 및 도구 TOP6

    Published:i-var uknew

    페이지 로딩 속도는 사용자 경험(UX)에 직접적인 영향을 미치며, 검색엔진의 순위에도 반영됩니다. 특히 Core Web Vitals(LCP, FID, CLS) 지표는 구글이 공식적으로 평가 기준으로 사용하는 만큼, 정기적인 웹사이트 속도 측정과 개선이 필수적입니다. 이 글에서는 실제 웹사이트의 성능을 점검하고, 병목 구간을 파악할 수 있는 대표적인 속도 측정 도구 5가지를 소개합니다. 각각의 장단점과 활용 팁을 함께 정리하여,…

  • 크롬 개발자 도구 네트워크 탭 성능 테스트 가이드

    Published:i-var uknew

    웹사이트의 실제 성능을 분석하려면 단순한 속도 점수보다는 브라우저가 리소스를 어떻게 로드하는지 직접 확인해야 합니다. 크롬 개발자 도구 네트워크 탭은 페이지가 로드되는 동안 발생하는 모든 요청을 실시간으로 추적하여, 병목 구간·캐시 정책·응답 속도를 정확히 파악할 수 있는 가장 강력한 도구입니다. 이 글에서는 네트워크 탭의 주요 항목과 리소스 분석 방법을 단계 별로 살펴보며, 워드프레스와 같은 CMS…

  • 미국 구글 바로가기: 주소 링크 및 우회 접속 방법 3가지 | 해외 구글 바로가기

    Published:jarvis

    한국에서 구글링을 할 때 자료가 미국에 비해 적기 때문에 미국 구글 바로가기 또는 해외 구글 바로가기를 생각하는 분들이 많습니다. 미국 구글 우회 접속 방법을 활용해서 미국의 구글 사이트에서 구글링을 하면 원하는 정보를 보다 수월하게 찾을 수 있습니다. ✅ 미국 구글 바로가기 첫번째 주소는 한국에서 보는 미국 구글 사이트이며, 두 번째는 미국 현지에서 보는…

  • NameCheap DNS 설정 및 레코드 설정 방법

    Published:i-var uknew

    네임칩에서 도메인을 구매했다면, 원하는 회사 또는 네임칩의 기본 DNS 서버를 사용할 수 있습니다. 이 페이지에서 NameCheap DNS 서버 설정 방법을 안내합니다. 먼저 구매한 도메인의 관리 페이지의 도메인 리스트 탭으로 이동합니다. 맨 우측 관리 버튼을 클릭합니다. 1️⃣ NameCheap DNS 서버 설정 먼저 리디렉션 설정(NameCheap Basic DNS 기본 값)은 크게 필요하지 않고, 보통은 도착지가 www보다는…

  • 아마존 어소시에이트란?

    Published:Mimir

    해외 직구가 활성화되어 아이허브 및 아마존에서 직구를 많은 소비자들이 하고 있습니다. Amazon Associates는 아마존의 의 제휴 마케팅 프로그램입니다. 아마존 어소시에이트 가입 방법에 대해 간단히 알아 보겠습니다. 아마존 어필리에이트(어소시에이트) 메인 페이지로 접속 후 회원 가입을 먼저 해야 합니다. 1. 아마존 어소시에이트 개요 아마존 제휴 마케팅 프로그램에 가입하면 제품에 따라 커미션 수입을 받을 수 있습니다….