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

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

1. 개발자모드 실행 방법

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

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

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

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

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

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

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

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

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

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

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

3. 동기화 설정하기

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

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

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


Similar Posts

  • Breadcrumbs: 구조화된 네비게이션과 SEO를 위한 Schema

    웹사이트의 콘텐츠가 많아지고 규모가 커질수록, 사용자는 자신이 어디에 있는지 헷갈리기 쉽고, 검색엔진은 페이지 간 구조적 관계를 파악하기 어려워집니다. 이와 같은 경우 장 강력한 해결책이 바로 Breadcrumbs입니다. 브레드크럼은 단순한 네비게이션 기능을 넘어서, 검색엔진 최적화(SEO)와 사용자 경험UX을 동시에 강화하는 중요한 도구입니다. 특히 Schema 마크업을 통해 구조화된 데이터를 제공하면, 구글과 같은 검색엔진은 사이트의 계층 구조를 더…

  • HTTP란? HTTP 헤더와 상태코드 2xx 등의 의미

    HTTP(HyperText Transfer Protocol)는 W3에서 정보를 주고 받을 수 있는 프로토콜입니다. 하이퍼 텍스트 전송 프로토콜은 웹 브라우저와 같은 통신 플랫폼에 웹 사이트를 로드할 때 사용되며 인터넷에서 데이터(HTML, CSS, 이미지, 비디오 등)를 전송하는데 사용되는 프로토콜입니다. 목차1. 개발자모드 실행 방법2. 크롬 개발자도구 한국어 변경 및 다크모드 설정3. 동기화 설정하기 HTTP 요청 정보 HTTP 요청에는 보통 5가지의 정보를 확인할…

  • 애드센스와 제휴 마케팅을 통한 블로그 수익 미래: 언제까지 가능할까?

    티스토리 또는 워드프레스나 구글 블로거, 그리고 Ghost CMS, 드루팔 등 다양한 CMS와 웹 사이트를 개인이 운영할 수 있는 만큼의 자료가 인터넷에 있습니다. 그럼 블로그 수익 미래 전망은 앞으로 어떻게 될지 알아 보도록 하겠습니다. 목차1. 개발자모드 실행 방법2. 크롬 개발자도구 한국어 변경 및 다크모드 설정3. 동기화 설정하기 1. 애드센스 및 제휴마케팅 보통 블로그를 운영할…

  • ERP란 무엇인가? | About 이카운트 ERP

    ERP는 “Enterprise Resource Planning”의 약어로, 기업 자원 계획이라는 의미를 가지고 있습니다. 전사적 자원 관리(ERP)는 재무, 회계, 자재 관리, 생산 관리, 인사 관리, 판매 및 마케팅 등의 다양한 비즈니스 프로세스를 통합하여 효율성을 극대화하는 소프트웨어 유형입니다. 전사적 자원 관리를 도입함으로써 생산·주문 섹터를 마케팅과 연동하여 실시간으로 조회하고 생산·주문 일정을 조율할 수 있어 보관 비용과 재고 관리에 발생하는…

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

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

  • [SEO] 구글 키워드 플래너 사용법

    검색 엔진 최적화를 통해 구글 첫 페이지 상위 노출을 목적이라면 수 많은 요소가 있지만 키워드 리서치는 필수로 진행해야 할 사항입니다. 무료 키워드 툴 중 하나인 구글 키워드 플래너를 이용해서 키워드 조사 하는 방법에 대해 알아 보겠습니다. 순차적으로 키워드 플래너에 대해 확인해 보도록 하겠습니다. 목차1. 개발자모드 실행 방법2. 크롬 개발자도구 한국어 변경 및 다크모드…