웹사이트에서 글꼴 크기 및 얼굴을 확인하는 방법

디자인에 관심이 있든 특정 웹 사이트의 모양을 좋아하든 사이트에서 사용하는 글꼴 유형과 크기를 알면 이를 에뮬레이트하거나 자신의 웹 사이트에서 사용하는 데 도움이 될 수 있습니다. 이를 달성하는 방법에는 여러 가지가 있으며 여기에서 그 중 몇 가지를 보여 드리겠습니다. 따라서 웹 사이트에서 글꼴 유형과 크기를 확인하려면 계속 읽으십시오!

웹사이트에서 글꼴 크기 및 얼굴을 확인하는 방법

말 그대로 수백만 개의 글꼴이 있으므로 완벽한 글꼴을 찾는 데 필요한 것보다 더 오래 걸릴 수 있습니다. 좋은 것을 발견하면 바로 거기에 무엇이 있는지 찾아야 합니다. 그렇지 않으면 영원히 잃어버릴 수 있습니다. 특히 좋은 글꼴이라면 글꼴 종류에 따라 자신의 웹사이트에서, 오피스 글꼴로, 윈도우 내에서 사용할 수 있다. 일부 글꼴은 저작권이 있어 공개적으로 사용할 수 없다는 점을 염두에 두십시오.

웹사이트에서 글꼴 유형 및 크기 확인

웹사이트에서 글꼴 유형과 크기를 확인하는 몇 가지 방법이 있습니다. 가장 쉬운 방법은 브라우저 자체를 사용하는 반면 다른 방법은 타사 도구를 사용하여 페이지 자산을 식별하는 것입니다. 두 가지 유형을 모두 다룰 것입니다. 먼저 내장 브라우저 방법에 중점을 둘 것입니다.

  1. 모양이 마음에 드는 페이지를 마우스 오른쪽 버튼으로 클릭하고 선택하십시오. 요소를 점검하다 (파이어폭스), 검사 (크롬) 또는 F12개발자 도구 (가장자리). 크롬 웹 메뉴
  2. 선택하다 조사관 (파이어폭스) 또는 계산됨 (Chrome) 새 하단 창에 도달할 때까지 오른쪽에서 아래로 스크롤합니다. 폰트 또는 글꼴 크기. 글꼴 모음, 사용된 특정 글꼴, 크기, 색상 및 페이지에서 정의하는 기타 모든 항목이 표시되어야 합니다. 크롬 검사기 도구

다른 CMS와 다른 웹 디자인은 다양한 방식으로 글꼴 정보를 표시합니다. 몇 가지 웹 페이지에서 이 방법을 시도하면 글꼴이 정의되는 몇 가지 다른 방법을 볼 수 있습니다.

웹 사이트에서 글꼴 유형 및 크기를 확인하는 방법 2

글꼴 유형 및 크기를 식별하는 타사 도구

플러그인이나 북마크릿으로 작동하고 글꼴 유형을 식별할 수 있는 몇 가지 타사 애드온이 있습니다. Safari를 포함한 대부분의 브라우저에서 작동하므로 큰 문제 없이 작업할 수 있는 것을 찾아야 합니다.

개똥 벌레

Firebug는 개발자를 위한 Firefox 전용 디버깅 도구였습니다. 이제는 브라우저에 구애받지 않고 대부분의 브라우저에서 작동할 정도로 인기를 얻었습니다. 글꼴을 포함하여 웹 페이지의 모든 요소를 ​​확인할 수 있는 믿을 수 없을 정도로 다재다능한 도구입니다.

  1. 평소처럼 애드온을 설치하고 페이지에서 일부 텍스트를 강조 표시하고 Firebug 내에서 HTML 탭을 클릭한 다음 오른쪽의 '계산됨'을 클릭하십시오. Firebug는 글꼴 이름, 글꼴 패밀리, 크기, 두께 및 알아야 할 모든 것을 강조 표시해야 합니다.

그러나 Firebug는 2017년부터 중단되었습니다. 이전 버전은 계속 다운로드할 수 있지만 더 이상 업데이트되지 않으며 브라우저가 발전함에 따라 Firebug의 기능이 손실될 수 있습니다.

웹 사이트에서 글꼴 유형 및 크기를 확인하는 방법 3

WhatFont

WhatFont는 웹 페이지의 글꼴을 식별할 수 있는 북마크입니다. 책갈피를 책갈피 막대로 드래그하여 어디서나 거의 모든 글꼴을 식별하는 데 사용하십시오. 무료로 사용할 수 있으며 매우 간단합니다. 원하는 웹 페이지로 이동하여 북마크를 클릭하고 식별하려는 글꼴 위로 마우스를 가져갑니다. 그 위에 글꼴을 알려주는 작은 검은색 상자가 나타납니다.

업데이트되면서 관련 애드온과도 호환되도록 만들었습니다.

다시 말하지만, CMS가 구성되는 방식이나 페이지가 디자인된 방식에 따라 간단한 글꼴 식별 또는 크기, 색상, 무게 등을 제공하는 전체 상자가 됩니다.

글꼴을 식별할 수 있는 많은 북마크 유형 추가 기능이 있습니다. WhatFont는 그 중 하나일 뿐입니다. 하나를 사용합니까? 이 기사가 새로운 기사를 시도하도록 설득했습니까? 아래에 알려주십시오.


$config[zx-auto] not found$config[zx-overlay] not found