학습 내용
온라인에서 글꼴을 사용할 때의 기회와 한계, 브랜드에 맞는 이메일을 보내는 방법에 대해 알아보세요.
사용자 정의 글꼴을 사용하는 방법을 알아보세요.
글꼴 작동 방식
글꼴은 텍스트를 표현하는 것으로 인쇄물이나 온라인 매체에서 사용할 수 있습니다. Arial이나 Times New Roman과 같은 일반적인 글꼴에 익숙하시겠지만, 브랜드를 표현하고 소통하는 데 사용할 수 있는 글꼴은 수천 가지가 넘습니다.
웹사이트나 이메일과 같은 온라인 미디어의 경우 글꼴 옵션은 거의 무한합니다. 그러나 모든 디바이스가 동일한 글꼴에 액세스할 수 있는 것은 아니기 때문에 다른 사람과 창작물을 공유할 때 완전히 동일하게 보이지 않을 수 있습니다.
디바이스가 글꼴에 액세스하여 사용할 수 있는 방법에는 시스템 글꼴 (사용 중인 디바이스에 저장된 글꼴)과 웹 글꼴 (외부 서버에서 로드된 글꼴)의 두 가지가 있습니다.
시스템 글꼴 정보시스템 글꼴 정보
컴퓨터와 휴대폰에는 다양한 글꼴이 사전 로드되어 있습니다. 일반적으로 설치되는 글꼴이 몇 가지 있지만(예를 들어 대부분의 디바이스에는 조지아 및 버다나 글꼴이 기본으로 제공됨), 디바이스마다 기본적으로 포함되는 글꼴이 크게 다를 수 있습니다. 대부분의 디바이스에서 사용되는 글꼴을 "웹 안전" 글꼴이라고 합니다.
웹 글꼴 정보웹 글꼴 정보
웹 안전 글꼴과 달리 웹 글꼴은 사용자가 보고 있는 콘텐츠와 동시에 외부 서버에서 로드됩니다. 사용자 정의 글꼴은 일반적으로 웹 글꼴입니다. 웹 글꼴을 사용하는 경우 특정 디바이스에서 웹 글꼴을 로드할 수 없는 경우를 대비하여 웹 안전 대체 글꼴도 설정할 수 있습니다.
대체 글꼴 정보대체 글꼴 정보
웹페이지나 이메일 등 온라인에서 콘텐츠를 볼 때, 그 이면에는 장치에 표시할 글꼴을 알려주는 CSS(온라인 콘텐츠 스타일 지정에 사용되는 코드)가 있습니다. 디바이스에서 글꼴에 액세스할 수 없는 경우 CSS에서 '대체 글꼴'(웹사이트 또는 이메일 메시지를 만든 사람이 선호하는 글꼴을 사용할 수 없는 경우에 사용할 수 있도록 선택한 글꼴 또는 글꼴)을 확인합니다. 대체 글꼴은 대부분의 디바이스에서 사용할 수 있는 웹 안전 글꼴이어야 하며, 사용자 지정/웹 글꼴을 지원하지 않는 디바이스에서 메시지를 볼 때 메시지가 표시되는 방식을 더 잘 제어할 수 있습니다.
사용 가능한 대체 글꼴이 없거나 사용 중인 디바이스에서 대체 글꼴을 지원하지 않는 경우 디바이스에서는 Arial 또는 Times New Roman과 같은 기본 글꼴을 사용합니다. 기본 글꼴은 디바이스와 앱에 따라 매우 다양합니다.
이메일에서 글꼴이 작동하는 방식이메일에서 글꼴이 작동하는 방식
일부 이메일 클라이언트는 웹 글꼴을 지원하지만 그렇지 않은 클라이언트도 있습니다. 웹 글꼴을 지원하지 않는 받은 편지함이나 기기에서 이메일을 열면 기본 글꼴이 대신 사용됩니다. 대체 글꼴을 설정하여 백업으로 사용할 시스템 글꼴을 제어할 수 있습니다.
누군가 웹 글꼴을 지원하는 기기에서 이메일을 열면 이메일의 CSS에 제공된 URL에서 글꼴이 로드됩니다. 디바이스에서 글꼴에 액세스할 수 있으면 해당 글꼴이 표시되고, 그렇지 않으면 대체 글꼴로 이동합니다.
다음 이메일 클라이언트는 웹(사용자 지정) 글꼴을 지원합니다:
- Apple 메일
- iOS Mail(iOS의 기본 이메일 브라우저)
- 구글 안드로이드(구글 및 어도비 글꼴에서 사용하는
@import메서드를 지원하지 않는 안드로이드 2.3 제외) - 삼성 메일(Android 8.0)
- Mac용 Outlook
가장 큰 이메일 클라이언트 중 하나인 Gmail은 일반적으로 웹 글꼴을 지원하지 않는다는 점에 유의하세요. 하지만 한 가지 예외가 있습니다: Gmail은 Roboto를 지원합니다.
이메일 최적화이메일 최적화
이메일이 여러 기기에서 일관성 있게 보이도록 하는 가장 좋은 방법은 웹 안전 글꼴을 사용하는 것입니다. 클라비요의 기본 글꼴은 일반적으로 웹에서 안전합니다. 클라비요에서 제공하는 글꼴을 찾아보세요:
- 콘텐츠 > 이미지 & 브랜드 > 브랜드 자산
- 이메일의 스타일 탭
- 텍스트가 포함된 이메일 블록의 스타일 섹션
- 가입 양식 편집기의 스타일 탭
클라비요에서 제공하는 글꼴 중 세 가지 글꼴은 일부 디바이스에서 지원되지 않습니다: 세기 고딕, 타호마, 애플 블랙입니다. 이러한 글꼴은 iOS 장치(예: iPhone)에 사전 설치되어 있지 않으므로 이러한 글꼴을 사용하는 경우 iOS 장치에서 볼 때 받은 편지함의 기본 글꼴로 표시될 수 있습니다.
사용자 정의 글꼴 사용 팁
사용자 지정 글꼴을 사용하는 것을 선호하는 경우 아래 팁을 사용하여 창의력을 발휘하여 모든 기기에서 이메일이 잘 보이도록 디자인하세요.
대체 글꼴 사용
사용자 정의 글꼴과 최대한 일치하는 웹 안전 대체 글꼴을 선택합니다. 사용자 지정 글꼴을 구성할 때 클라비요의 기본 글꼴에서 대체 글꼴을 선택할 수 있습니다.
이미지에 텍스트 사용
전체 이미지 이메일은 전달력을 떨어뜨릴 수 있지만, 이미지 속 텍 스트와 텍스트 블록 속 텍스트를 전략적으로 조합하여 브랜드에 맞는 이메일을 만들 수 있습니다. 제목과 클릭 유도 문안(CTA)에 사용할 사용자 지정 브랜드 글꼴을 선택하고, 본문 텍스트에 사용할 웹 안전 글꼴과 페어링하세요.
선택한 텍스트에 브랜드 글꼴이 포함된 이미지를 사용하고 이메일에 이미지를 추가할 때 대체 텍스트를 추가해야 합니다. 그런 다음 이메일의 나머지 텍스트에 웹 안전 글꼴을 적용합니다. 그 결과 사이트와 일치하는 브랜드 이메일이 생성되며 구독자의 받은 편지함에서도 액세스할 수 있습니다.
철저한 테스트
어떤 방법을 선택하든, 특히 새로운 디자인을 사용할 때는 이메일을 철저히 테스트하세요. 여러 장치에서 자신에게 이메일을 보내 각 장치에 표시되는 방식이 만족스러운지 확인하세요. 리트머스나 이메일 온 애시드와 같은 이메일 테스트 프로그램을 사용하여 더 다양한 기기를 사용하여 테스트할 수도 있습니다.
추가 리소스