[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. 크롬 개발자도구 한국어…

  • [Chrome] 크롬 개발자도구 기능 개요

    크롬 개발자도구의 주요 기능은 웹 개발자가 웹사이트의 코드 테스트 및 디버그 작업을 할 수 있습니다. 파이어폭스, 마이크로소프트 엣지, 크롬 등 웹 브라우저에는 크롬처럼 ‘웹 개발 도구(Web development tools)’가 포함되어 있습니다. 크롬 개발자도구 기능은 개발자에게 유용한 도구임이 분명합니다. ‘devtools‘이라는 줄임말로 많이 사용되고 있습니다. ※디버그(debug) 디버깅 or 디버그는 컴퓨터 프래그램 개발 중 발생하는 시스템의 버그를…

  • [SEO] google 유용한 콘텐츠(업데이트 2022년 8월 25일)

    2022년 8월에 google 유용한 콘텐츠 업데이트는 검색엔진 용 콘텐츠를 먼저 설정하는 것이 아닌 사용자 중심 콘텐츠를 만드는 것에 집중할 수 있도록 하고 있습니다. 구글 자체 검색엔진 최적화 가이드 및 권장사항을 따르지 말아야 한다는 것이 아닌 사용자에게 초점이 맞춰진 콘텐츠 여부에 중점을 둔 것이라 할 수 있습니다. 목차1. 개발자모드 실행 방법2. 크롬 개발자도구 한국어…

  • [SEO] Black Hat SEO란? | 구글 웹 검색 스팸 정책 | 워드프레스 저품질 방지를 위한 15가지 점검 사항

    블랙햇 SEO(Black Hat SEO)는 부도덕한 방법으로 상위 노출과 유기적인 트래픽을 노리는 검색엔진최적화 전략을 의미합니다. 블랙햇의 유래는 서부 영화에 나오는 악당들이 검은 모자를 쓰고 등장하는 것에서 유래되었습니다. 단기적으로 성과를 낼 수 있지만 장기적인 관점에서 낮은 품질의 콘텐츠 등으로 인식될 수 있습니다. Black Hat SEO의 반대인 White Hat SEO와 Grey Hat SEO가 있습니다. 목차1. 개발자모드…

  • 글로벌 SEO 비교 사이트 4군데

    글로벌 SEO 비교 사이트를 찾고 있다면 SimilarWeb, Ahrefs SEMrush, Moz와 같은 인기있는 웹사이트를 추천합니다. 이 사이트들은 트래픽 및 키워드 순위 정보를 제공하여 전 세계적인 SEO 분석을 가능케 합니다. 이 중에서 웹사이트 순위 정보도 제공하는 사이트는 SimilarWeb, Alexa, SEMrush와 같은 사이트들입니다. 이러한 사이트들은 글로벌 SEO 분석에 도움이 되는 강력한 도구로, 인기와 신뢰성이 높습니다. 목차1….

  • [SEO] 사이트맵(SiteMap) 정의 | 구글, 네이버, 빙 사이트맵 제출 방법

    검색엔진최적화SEO를 진행할 때 처음에 접하게 되는 단어중 하나가 사이트맵SiteMap입니다. Sitemap이란 무엇이며, 어떤 용도로 사용되는지 알아 보겠습니다. 목차1. 개발자모드 실행 방법2. 크롬 개발자도구 한국어 변경 및 다크모드 설정3. 동기화 설정하기 사이트맵 정의 Sitemap이란 구글 및 네이버와 같은 검색 엔진 봇이 색인을 진행할 페이지를 나열한 XML 파일입니다. 이름처럼 웹 사이트를 방문한 크롤러(봇)에게 지도와 같은 역할을…