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

공정위 광고 문구 Ver 3.1
공정위 광고 문구 Ver 3.2(모바일 전용)

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

1. 개발자모드 실행 방법

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

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

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

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

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

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

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

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

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

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

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

3. 동기화 설정하기

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

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

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


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

Similar Posts

  • [SEO]검색 엔진 결과 페이지-SERP란? | 10가지 SERP 리스트

    검색엔진최적화(SEO)에 대한 관심이 한국에서도 늘어나는 추세입니다. 구축한 웹사이트를 단순하게 광고하는 방식이 아닌 자연 검색 트래픽으로 방문자를 늘리는 방식이지요. 구글은 사용자 경험을 포함 정보성 글을 중요하게 생각하며 AI가 등장한 이후 더더욱 이 추세는 강해지고 있습니다. 웹사이트의 글(Post)이 구글 첫 페이지부터 나오는 자연 검색 결과를 포함한 다양한 검색 엔진 결과 페이지(SERP:Search Engine Result Page)에는 어떤…

  • DOM(Document Object Model) 구조와 정의

    대부분의 웹페이지는 HTML로 구성되어 있지만, 우리가 브라우저에서 상호 작용하는 것은 단순한 정적인 HTML 문서가 아닙니다. 웹페이지는 브라우저에 의해 DOM(Document Object Model)이라는 구조화된 객체 모델로 변환되며, 이 DOM을 통해 JavaScript는 페이지의 내용을 읽고 수정할 수 있습니다. DOM은 웹의 핵심 작동 원리이자 프로그래밍 가능한 웹의 뼈대입니다. 버튼 클릭, 폼 입력, 실시간 데이터 변경 등 우리가…

  • [Windows] 윈도우 자음 한자 특수문자 조합 모음

    윈도우 자음 한자 특수문자 조합 모음표입니다. 자음에서 한자를 사용한 특수 기호는 아래와 같습니다. 1. 윈도우 자음 한자 특수문자 조합 모음 입력 특수 기호 [ ㄱ ] + [ 한자 ]   ! ' , . / : ; ? ^ _ ` |  ̄ 、 。 · ‥ … ¨ 〃­ ― ∥ \…

  • POP3 IMAP 차이점은 무엇인가요?

    이메일 프로토콜 시스템 POP3 IMAP 차이점은 무엇일까요? POP3(Post Office Protocol version 3)의 경우 TCP/IP 기반으로 이루어진 프로토콜로 메일 서버에서 수신한 이메일을 컴퓨터로 가져오기 위해 사용 됩니다. POP3는 원래 컴퓨터 한 대에서만 사용하도록 설계된 오래된 프로토콜입니다. IMAP((Internet Message Access Protocol)와 같이 양방향 동기화 통신을 사용하는 최신 프로토콜과 달리 POP3는 일방향 전자메일 동기화만 지원이 됩니다. 1….

  • 크롬 개발자 도구 성능 탭 활용

    웹사이트의 성능을 정확하게 평가하려면 단순한 속도 점수보다, 브라우저가 실제로 렌더링과 스크립트를 어떤 순서로 처리하는지를 살펴보는 것이 더 중요합니다. 크롬 개발자 도구 성능 탭은 페이지 로딩 과정과 사용자 상호작용에 따른 성능 저하를 시각적으로 분석할 수 있는 도구입니다. 렌더링 지연, 자바스크립트 실행 순서, LCP·FCP·CLS와 같은 Core Web Vitals 지표까지 모두 한 화면에서 확인할 수 있어,…

  • 저작권 없는 무료 이미지 다운로드 사이트 추천 LIST 35+@-라이선스 확인

    블로그나 상업용으로 이미지를 사용해야 하는데 저작권 때문에 유료 이미지를 사용하지만 유료 이미지 사이트를 사용하는 것에는 한계가 있습니다. 예를 들어 한 달에 발행하는 뉴스·블로그 글이 이용하는 유료 이미지 사이트의 이미지 수를 초과하는 경우입니다. 저작권 없는 무료 이미지 사이트를 같이 사용하는 방법을 고려할 수 있습니다. 무료이미지 상업용 사용 조건 등은 어떻게 되는지 확인해 보겠습니다. 스톡…