마케팅 콘텐츠

예쁜 폰트면 될까? 상세페이지 글꼴 고르는 순서

상세페이지 폰트 선택은 본문 가독성, 제목 위계, 브랜드 톤, 상업적 이용 범위 순서로 보면 됩니다. 역할별 글꼴 조합 기준과 무료 폰트 라이선스 확인법을 함께 정리합니다.

상세페이지를 만들 때 폰트는 무엇을 기준으로 선택해야 할까요? 미리보기에서 예뻐 보인 글꼴이 휴대폰 화면에서는 잘 읽히지 않는 경우가 많습니다.

본문용 글꼴, 제목용 글꼴, 가격 강조용 글꼴을 하나씩 더하다 보면 한 페이지에 서너 종류가 섞입니다. 무료라고 받은 폰트가 상업적 이용 불가였다는 사실을 나중에 알기도 합니다.

문제는 폰트를 분위기로만 고르고, 작은 화면에서 잘 읽히는지와 판매용 이미지에 써도 되는지를 따로 확인하지 않고 넘어간다는 것입니다.

하지만 역할별 기준과 라이선스 확인 순서를 알고 있으면 후보를 훨씬 빠르게 좁힐 수 있습니다. 지금부터 고르는 순서대로 살펴보겠습니다.

상세페이지 폰트, 예쁜 글꼴 하나면 충분할까요?

상세페이지 폰트를 고를 때 가장 흔한 방법은 글꼴 사이트에서 미리보기를 넘기다 마음에 드는 것을 고르는 것입니다. 그런데 큰 글씨로 보던 미리보기와 달리, 실제 상세페이지는 대부분 휴대폰 화면에서 작게 축소된 채로 읽힙니다. 미리보기에서 분위기가 좋았던 글꼴이 본문 크기로 줄어들면 획이 뭉개지거나 글자 사이가 답답해 보이기도 합니다.

그래서 폰트는 한 번에 하나를 고르는 일이 아니라 역할별로 나눠 정하는 일에 가깝습니다. 폰트는 분위기보다 역할과 사용 범위를 먼저 정해야 덜 바꾸게 됩니다. 확인할 순서는 다음 네 가지입니다.

  • 본문 글꼴: 작은 화면에서 끝까지 읽히는가
  • 제목·강조 글꼴: 본문과 구분되면서 과하지 않은가
  • 브랜드 톤: 상품 분위기와 어긋나지 않는가
  • 라이선스: 판매용 이미지에 써도 되는가

상세페이지 본문 폰트 고르기 — 작은 화면에서 끝까지 읽히는 글꼴부터

본문 글꼴은 상세페이지에서 가장 많은 글자를 담당합니다. 소재, 사용법, 주의사항처럼 구매 직전에 확인하는 정보가 대부분 본문에 들어가기 때문에, 여기서 읽기가 불편하면 고객은 내용을 건너뛰고 문의 버튼을 누르게 됩니다.

본문에는 획 굵기가 일정하고 글자 모양이 단순한 고딕(산세리프) 계열이 무난합니다. 손글씨체나 장식이 많은 글꼴은 큰 제목에서는 개성이 되지만, 작은 크기로 여러 줄을 이어 읽게 하면 눈이 쉽게 피로해집니다. 명조(세리프) 계열을 본문에 쓰고 싶다면 가는 굵기보다 보통 이상의 굵기를 고르고, 휴대폰 화면에서 직접 확인한 뒤 정하는 편이 안전합니다.

  • 가는 굵기(Thin·Light)는 본문 대신 짧은 보조 문구에만 쓴다
  • 본문은 보통(Regular)이나 중간(Medium) 굵기로 맞춘다
  • 숫자와 영문이 섞이는 스펙 표기는 그 글꼴의 숫자 모양까지 확인한다
  • 휴대폰으로 실제 크기 미리보기를 한 뒤 확정한다

본문 글꼴은 개성보다 끝까지 읽히는지가 먼저입니다. 글자 크기와 줄 길이 기준은 모바일 가독성 글에서 따로 정리했습니다.

상세페이지 제목·강조 폰트 — 본문과 역할을 나눠 두 종류로 제한하기

제목과 강조 문구에는 본문보다 굵거나 성격이 뚜렷한 글꼴을 쓸 수 있습니다. 다만 섹션마다 다른 글꼴을 넣기 시작하면 페이지가 여러 사람이 만든 것처럼 보이고, 정작 강조해야 할 문구가 묻힙니다.

실무에서는 한 페이지 안의 글꼴 종류를 두 개 정도로 제한하는 방식이 많이 쓰입니다. 하나의 글꼴 가족 안에서 굵기만 바꿔 제목과 본문을 나누면 통일감을 지키면서도 위계를 만들 수 있습니다. 강조용 글꼴을 하나 더 쓴다면 가격, 혜택, 핵심 문구처럼 정해진 자리에서만 반복합니다.

  • 제목: 본문 글꼴의 굵은 굵기(Bold 이상) 또는 성격이 뚜렷한 제목용 글꼴 하나
  • 본문: 읽기 편한 고딕 계열 하나
  • 강조: 새 글꼴 대신 굵기·색·배경 박스로 먼저 해결
  • 손글씨·장식 글꼴: 한 페이지에 한두 번, 짧은 문구에만

글꼴 종류를 늘리는 대신 굵기와 크기 차이로 위계를 만들면 강조가 더 분명해집니다.

브랜드 톤에 맞는 글꼴 — 상품 분위기별로 고딕·명조·손글씨 나누기

본문과 제목의 역할을 정했다면 그다음은 상품 분위기와 맞추는 일입니다. 같은 정보를 담아도 글꼴의 인상에 따라 상품이 단단해 보이기도, 부드러워 보이기도 합니다. 아래는 상품 분위기에 따라 자주 쓰이는 조합의 방향입니다.

상품 분위기제목 글꼴 방향본문 글꼴 방향
깔끔·기능 중심 (전자기기, 생활용품)굵은 고딕보통 굵기 고딕
고급·차분함 (화장품, 향수, 선물세트)명조(세리프) 계열고딕 또는 굵기 있는 명조
친근·캐주얼 (간식, 유아용품, 소품)둥근 고딕 또는 손글씨 일부보통 굵기 고딕
자연·수제 (농산물, 수공예)손글씨 또는 부드러운 명조고딕

표는 방향일 뿐 정답은 아닙니다. 상세페이지의 색 조합과 사진 톤이 이미 정해져 있다면 그 분위기와 부딪히지 않는 글꼴을 고르는 쪽이 자연스럽습니다. 제목 글꼴로 분위기를 내고, 본문 글꼴은 읽기 편한 쪽으로 남겨두면 균형을 잡기 쉽습니다.

상업용 무료 폰트 확인 — '무료'와 '상업적 이용 가능'은 다릅니다

글꼴을 정했다면 판매용 이미지에 써도 되는지 확인합니다. 한국저작권위원회 안내에 따르면 저작권법이 보호하는 대상은 글자 모양 자체가 아니라 글꼴 '파일'입니다. 그래서 정품 소프트웨어에 포함됐거나 제작사 누리집에서 적법하게 받은 파일은 문제가 되지 않지만, 출처가 불분명한 곳에서 받은 파일은 침해가 될 수 있습니다.

저작권과 별개로 이용 범위(라이선스)도 봐야 합니다. 같은 안내는 '무료 글꼴'이라는 말만 보고 받았는데 비상업적 용도로만 쓸 수 있게 제한된 경우를 대표적인 문제 유형으로 꼽습니다. 외주로 만든 쇼핑몰 홈페이지에 쓰인 유료 폰트 때문에 내용증명을 받은 상담 사례도 함께 소개돼 있습니다.

  • OFL(오픈 폰트 라이선스): 글꼴 파일 자체를 판매하지 않는 한 상업적 이용과 수정이 가능합니다. 나눔글꼴, Noto Sans KR, Pretendard가 이 라이선스로 배포됩니다
  • 공공누리 제1유형: 출처를 표시하면 상업적으로 이용할 수 있습니다
  • 공공누리 제2·4유형, '개인 사용 무료' 글꼴: 상업적 이용이 제한되므로 판매용 상세페이지에는 쓰지 않습니다
  • 무료 글꼴이라도 로고(CI·BI) 제작이나 임베딩 금지 같은 별도 제한이 있는지 이용 조건을 확인합니다

글꼴 파일은 제작사나 공식 배포처에서 받고, 이용 조건 화면을 저장해 두는 습관이 가장 확실한 대비입니다. 상세페이지를 외주로 맡겼다면 사용한 글꼴 목록과 라이선스를 결과물과 함께 받아 두세요.

상세페이지 폰트 조합 한눈에 보기 — 역할별 기준 정리

역할고르는 기준피할 것
본문보통 굵기 고딕, 휴대폰에서 직접 확인가는 굵기, 장식이 많은 글꼴
제목본문 글꼴의 굵은 굵기 또는 제목용 글꼴 1종섹션마다 다른 글꼴
강조(가격·혜택)굵기·색·배경 박스로 구분강조만을 위한 글꼴 추가
포인트 문구손글씨·장식 글꼴, 짧은 문구에만긴 문장에 장식 글꼴
라이선스OFL·공공누리 제1유형 등 상업적 이용 허용 확인출처 불명 파일, 개인 사용 무료 글꼴

폰트 정하기 전 10초 체크리스트

  1. 01본문 글꼴을 휴대폰 화면에서 실제 크기로 확인했나요?
  2. 02한 페이지에 쓰는 글꼴이 두 종류 안쪽인가요?
  3. 03제목과 본문이 굵기·크기로 구분되나요?
  4. 04손글씨·장식 글꼴을 긴 문장에 쓰지 않았나요?
  5. 05상품 분위기와 글꼴 인상이 부딪히지 않나요?
  6. 06글꼴 파일을 제작사나 공식 배포처에서 받았나요?
  7. 07이용 조건에 상업적 이용이 허용돼 있나요?
  8. 08외주 결과물이라면 사용한 글꼴 목록과 라이선스를 받았나요?

상세페이지 폰트 기준 — 한 번 정해 두면 다음 상품부터 빨라집니다

상세페이지를 상품마다 새로 만들다 보면 글꼴과 말투가 조금씩 달라지기 쉽습니다. 셀러리는 상품명, 핵심 특징, 상품 URL, 사진을 넣으면 브랜드 분위기에 맞는 이미지와 레이아웃으로 상세페이지를 블록별로 구성하고, 에디터에서 수정한 뒤 내려받을 수 있습니다.

프로젝트에 말투와 금지 표현을 한 번 등록해 두면 상세페이지와 SNS 콘텐츠가 같은 기준으로 만들어집니다. 기준을 한 번 정해 두면 다음 상품부터는 확인만 하면 됩니다.

FAQ

상세페이지 본문에 명조체를 써도 되나요?

쓸 수 있지만 가는 굵기는 휴대폰 화면에서 획이 흐려 보이기 쉽습니다. 보통 이상의 굵기를 고르고 실제 화면에서 확인한 뒤 정하는 편이 안전합니다.

무료 폰트는 상세페이지에 그냥 써도 되나요?

무료라도 상업적 이용이 제한된 글꼴이 있습니다. OFL이나 공공누리 제1유형처럼 상업적 이용이 허용된 라이선스인지 이용 조건을 먼저 확인하세요.

한 페이지에 폰트는 몇 개까지 쓰는 게 좋나요?

두 종류 안쪽으로 제한하는 방식이 많이 쓰입니다. 같은 글꼴 안에서 굵기와 크기를 바꿔 위계를 만들면 통일감을 지키기 쉽습니다.

Features in this post