All ContentsCategoryAbout

유용한 크롬 확장 프로그램(Chrome Extension) 추천

10 June, 2020 - etc - 3 min read

크롬 확장 프로그램(Chrome Extension)

구글 크롬 확장 프로그램(Google Chrome Extension)은 크롬 브라우저를 기반으로 동작하는 애플리케이션이다. 따라서 HTML, CSS, JavaScript로 제작되며, 구글 계정을 갖고 있다면 누구나 크롬 웹 스토어를 통해 설치할 수 있다. Chrome 웹 스토어

모두에게 유용한 확장 프로그램

Momentum

momentum momentum

모멘텀(Momentum)은 구글의 새창을 기반으로 하는 싱글페이지 애플리케이션이다. 사용자 위치 기반의 현재 시간, 날씨 등을 제공하고, 투두리스트로써의 기능도 갖고 있다. 새창을 열 때마다 새롭게 바뀌는 배경 이미지를 보는 재미도 있다.

Momentum - Chrome 웹 스토어

Todoist

todoist

기본에 충실한 투두리스트 애플리케이션이다. 미니멀한 디자인에 스마트폰(애플리케이션 별도 설치 시)과 연동이 가능하다는 점이 유용하다.

Todoist: 할일 목록 및 작업 관리자 - Chrome 웹 스토어

Google Arts & Culture

art & culture

나로 하여금 모멘텀을 삭제하게 만든 일등공신이다. 새창을 열 때마다 동서고금을 막론한 세계의 명화들을 감상할 수 있다. 작품명과 제목은 물론이고 해당 작품을 소장하고 있는 미술관 정보까지 알 수 있다. 나처럼 이렇게나마 비루한 교양 수준을 키우고 싶은 사람들에게 추천한다.

Google Arts & Culture - Chrome 웹 스토어

Google Dictionary

google dictionary

구글이 만든 구글 사전이다. 영영, 한영, 영한 모두 지원한다. 물론, 번역 애플리케이션도 웹 스토어에 존재하지만, 이건 내 마지막 자존심이다. 그리고, 종종(?) 만나게 되는 생소한 영단어를 더블 클릭 하는 것만으로 빠르게 확인할 수 있기 때문에 빠르게 컨닝하고 시치미 떼기에 좋다.

Google Dictionary (by Google) - Chrome 웹 스토어


웹 개발자에게 유용한 확장 프로그램

Wappalyzer

wappalyzer

Wappalyzer는 '이 웹사이트는 어떤 프레임워크를 썼을까?', '서버로는 무엇을 쓰고 있을까?' 싶을 때 유용한 확장 프로그램이다. 간단하게 특정 웹사이트를 구성하는 여러 서비스들을 알 수 있다. 평소 눈여겨 보던 사이트는 무엇으로 만들어졌나 확인해보자.

Wappalyzer - Chrome 웹 스토어

Blue Button

blue button

클릭 한 번으로 해당 웹사이트의 HTML, CSS, JS 정보를 모두 알 수 있으며, 이미지 정보까지 알 수 있다. 물론, 개발자도구로도 모두 알 수 있는 내용이긴 하지만, Blue Button은 친절하게 정리해서 시각화까지 해준다.

Blue Button | the webpage X-ray - Chrome 웹 스토어

ColorZilla

colorzilla

ColorZilla의 존재를 모를 때에는 웹에서 발견한 색상의 값을 알아내기 위해 캡쳐를 하고, 포토샵으로 불러내 스포이드 툴로 찍어봐야 했다. 하지만 ColorZilla와 함께라면 이제 그런 수고는 안 해도 된다.

ColorZilla - Chrome 웹 스토어

headingsMap

headingsMap

웹 접근성을 고려한 웹 페이지 설계에 관심이 있다면, headingsMap의 설치를 추천한다. 접속 중인 웹 페이지의 모든 헤딩태그들을 선형구조로 한눈에 파악할 수가 있다. 평소 주의 깊게 보던 웹 사이트가 있다면 headingsMap으로 확인해보자.

headingsMap - Chrome 웹 스토어

OpenWAX

openwax

OpenWAX 역시 웹 접근성 공부에 특히 유용한 확장 프로그램이다. 제목 뿐만 아니라 대체 텍스트 사용 현황부터 적절한 명도 대비, 링크 텍스트까지 접속 중인 웹 사이트의 웹 접근성 수준을 확인할 수가 있다. 이를 통해 웹 접근성이 고려되지 않은 웹 페이지를 발견하고 “나는 이러지 말아야지”하며 반면교사 삼도록 하자.

OpenWAX - Chrome 웹 스토어

Page Ruler

pageruler

웹 페이지 요소들의 사이즈와 태그를 확인할 수 있는 확장 프로그램이다. 해당 위치에 마우스 포인터를 올리는 것만으로 쉽게 확인이 가능하며, 부모 태그와 자식 태그까지 알 수 있다.

Page Ruler - Chrome 웹 스토어

Web Developer

web developer

정말 유저 타겟팅에 충실한 이름이 아닐 수 없다. 확장 프로그램 이름이 Web Developer다. 무슨 말이 더 필요할까. 웹 사이트의 CSS를 모두 지우고 HTML만 본다던가 하는 등의 일을 할 수 있다.

Web Developer - Chrome 웹 스토어

WhatFont

whatfont

이름 그대로 웹에서 만나는 폰트들을 손쉽게 확인할 수 있게 해주는 확장 프로그램이다.

WhatFont - Chrome 웹 스토어

© 2023 intzzzero, Built with

Gatsby