사용중인 웹 폰트를 쉽게 확인할수 있는 크롬 확장 ( extension ) 프로그램 3 개

1. WhatFont

1. 크롬에서 이 링크를 클릭합니다.
2. 추가합니다.
3. 추가가 끝나면 크롬 우측 위에 이런 아이콘이 보일겁니다.
   
4. 아이콘을 클릭후 확인하고 싶은 웹 페이지의 글자를 클릭하면 아래와 같이 나옵니다.
   
   위 스크린샷을 보면 Koverwatch 라는 폰트를 사용중이고 사이즈는 21px 에 컬러는 #444444 를 사용중인걸 알 수 있습니다.

확인 후 폰트 확인 모드에서 빠져나갈때는 ESC 버튼을 누르거나 화면 우측 상단의 Exit 버튼을 클릭하면 됩니다.

보통 개발자 콘솔을 열어서 확인하게 되는데, 이 앱을 사용하면 좀더 간편하고 알기쉽게 표시해 줍니다.

유의해야 할점은 “이 확장 프로그램으로 봤을때는 나눔 고딕인데 실제로는 돋음체더라.” 라는 경우가 있을수 있습니다.

즉 ‘css 설정은 맞게 들어가 있는데 실제 폰트는 적용되지 않은 상황’ 인데, 이 이 확장 프로그램의 기능은 단순히 css 에 설정되어 있는 폰트 정보를 보기좋게 표시해주는것 뿐입니다.

이런 상황은 자주 있지는 않고 폰트 다운로드 경로가 설정되지 않았다거나 하는 사소한 실수가 원인일 가능성이 높습니다.

2. WhatRuns

이 프로그램은 1의 whatfont 처럼 폰트만 보여주는게 아니라 이 웹사이트가 무엇으로 만들어졌으며 어떤 스크립트 라이브러리를 사용중인지 얄려줍니다.

특히 워드프레스 사이트라면 테마와 플러그인은 뭘 사용중인지  알려줍니다.

마찬가지로 설치하면 아이콘이 나오고 클릭하면 아래와같이 보여줍니다.

버전까지 정확하게 나오지는 않네요. 플러그인도 저렇게 많이 사용하고 있지는 않습니다.

하지만 그 외의 것들은 대부분 맞게 나옵니다.

3. CACHE CLEAR

이건 폰트 확인용은 아니지만 웹 제작 혹은 CSS 나 스크립트를 변경할때 있으면 좋습니다. 버튼 클릭 한번으로 캐시를 삭제해 주는 프로그램입니다.

예를들어 CSS 는 분명 수정을 했는데, 수정한게 웹에는 반영이 안되어있을 경우가 간혹 있습니다.

그럴경우 사용중인 브라우져의 옵션에 들어가서 캐시 삭제를 해야하는데 이마저도 번거롭기에 이 확장 프로그램 버튼 한번으로 삭제하는 것입니다.

참고로 2번 whatruns 와 3번 cache clear 는 파이어폭스 버전도 있습니다.