마지막 업데이트 날짜: 2025년 10월 10일
명시된 경우를 제외하고 다음 구독 중 어느 것에서나 사용할 수 있습니다.
마케팅 이메일 초안을 작성할 때 데스크톱 또는 모바일 이메일 클라이언트에서 특정 섹션을 숨길 수 있습니다. 또한 열 구성과 전체 레이아웃을 변경하여 소형 기기에서 이메일을 읽는 수신자의 환경을 개선할 수 있습니다.
다양한 디바이스에 맞게 이메일을 맞춤 설정하면 참여도를 높이고 이메일의 전반적인 사용자 경험을 향상시킬 수 있습니다.
제한 사항 및 고려 사항 이해하기
- 데스크톱과 모바일에서 별도의 모듈과 스타일을 설정하는 것은 드래그 앤 드롭 편집기에서만 가능합니다. 디자인 관리자 템플릿을 사용하여 만든 이메일의 경우 개발자가 수동으로 모든 장치 사용자 지정을 추가해야 합니다.
- 다음 이메일 클라이언트는 모바일에 최적화된 이메일을 지원하지 않습니다: Android용 Yahoo! Mail, Android용 AOL Mail, Gmail IMAP 및 일부 버전의 삼성 메일. 이러한 클라이언트에서는 숨겨진 모듈이 표시되며 모바일 전용 구성은 무시됩니다.
- 글꼴 크기 또는 패딩과 같은 모듈 설정은 모바일과 데스크톱에서 다른 값으로 설정할 수 없습니다. 이러한 설정에 다른 값을 사용하려면 동일한 콘텐츠로 모바일 전용 모듈과 데스크톱 전용 모듈을 별도로 만드는 것이 좋습니다.
데스크톱 또는 모바일에서 모듈 및 섹션 숨기기
데스크톱 또는 모바일 수신자에게 표시할 모듈 또는 섹션을 사용자 지정합니다:
- HubSpot 계정에서 마케팅 > 이메일로 이동합니다.
- 작성된 이메일의 이름을 클릭하거나 이메일 작성을 클릭합니다.
- 이메일 편집기 상단의 데스크톱 아이콘 또는모바일 아이콘을 클릭하여 각 장치 유형에 대한 설정을 구성합니다.
- 모듈 또는 섹션 위로 마우스를 가져가 숨기기 아이콘을 클릭하여 편집 중인 이메일 버전에서 해당 모듈을 숨깁니다.
- 편집 중인 버전에 대해 숨겨진 모듈을 모두 표시하려면 편집기 상단의 표시 옵션 드롭다운 메뉴를 클릭한 다음 숨김 표시 켜짐을 토글합니다.
- 해당 버전의 이메일에 대해 숨겨진 모듈을 다시 표시로 전환하려면 숨겨진 아이콘이 있는 곳에 있는 보기 아이콘을 클릭합니다.
모바일 장치에서 모듈 스태킹 사용자 지정
모바일 장치에서 볼 때 섹션의 모듈이 쌓이는 방식을 사용자 지정할 수 있습니다.
- HubSpot 계정에서 마케팅 > 이메일로 이동합니다.
- 작성된 이메일의 이름을 클릭하거나 이메일 작성을 클릭합니다.
- 이메일 편집기에서 섹션을 클릭합니다.
- 왼쪽 사이드바 편집기에서 스택 섹션의 옵션을 선택합니다:
- 동일한 열 유지: 이메일이 모바일에서도 데스크톱과 동일한 수의 열을 표시합니다.
- 오른쪽 위에 왼쪽: 섹션의 왼쪽에 있는 모듈이 모바일에서 먼저 표시됩니다.
- 왼쪽 위에 오른쪽: 섹션의 오른쪽에 있는 모듈이 모바일에서 먼저 표시됩니다.
데스크톱 또는 모바일에서 스타일 사용자 지정
단일 섹션 또는 전체 마케팅 이메일에 대해 데스크톱 및 모바일 스타일을 별도로 구성할 수 있습니다.
- HubSpot 계정에서 마케팅 > 이메일로 이동합니다.
- 초안 이메일의 이름을 클릭하거나 이메일 생성을 클릭합니다.
- 이메일 편집기에서 섹션을 클릭하여 해당 스타일을 편집하거나 왼쪽의 템플릿 디자인 아이콘을 클릭하여 전체 이메일의 스타일을 편집합니다.
- 왼쪽 사이드바 편집기에서 섹션 옆의 모든 디바이스 스위치를 끄면 데스크톱과 모바일에 대한 별도의 설정을 볼 수 있습니다.
- 데스크톱 및 모바일용스타일 설정을 편집합니다.
이메일의 표시 여부 및 레이아웃 설정 편집을 마치면 이메일이 여러 이메일 클라이언트에서 어떻게 표시되는지 미리 볼 수 있습니다.
모바일 장치에 맞게 이메일 최적화하기
모바일 장치에서 마케팅 이메일의 모양을 개선하려면 다음 모범 사례를 따르는 것이 좋습니다:
- 반응형이메일 템플릿 사용: 반응형 콘텐츠는 보는 화면에 맞게 조정됩니다. HubSpot의 드래그 앤 드롭 템플릿은 기본적으로 반응형이지만, 코딩된 템플릿을 만드는 개발자는 반응형 이메일 템플릿 마크업을 사용해야 합니다.
- 이미지 파일 크기 줄이기: 이미지 파일이 작을수록 이메일 크기가 작아지고 로드 시간이 빨라집니다. HubSpot은 설정된 너비로 이미지 크기를 자동으로 조정하여 파일 크기를 줄이지만, FastStone 사진 리사이저와 같은 서비스를 사용할 수도 있습니다.
- 읽기 쉬운 링크 및 버튼 만들기: 모든 텍스트 링크와 버튼은 너비와 높이가 57픽셀 이상이어야 합니다.
- 이메일 미리보기 텍스트 테스트: 마케팅 이메일의 시작 부분에 배치된 이미지의 대체 텍스트를 이메일의 미리보기 텍스트로 가져올 수 있습니다. 이미지의 대체 텍스트를 제거하면 이 문제가 해결됩니다. 테스트 이메일을 전송하여 미리보기 텍스트가 예상대로 표시되는지 확인하는 것이 좋습니다.
- 자바스크립트 및 iframe 요소 피하기: 임베드된 자바스크립트 및 iframe 요소는 대부분의 이메일 클라이언트에서 렌더링되지 않습니다. 코딩된 템플릿에는 이러한 요소를 추가하지 않는 것이 좋습니다.
- 이메일 크기를 줄여 잘리지 않도록 하기: 102KB가 넘는 이메일은 Gmail에서 '전체 메시지 링크 보기' 뒤에 콘텐츠를 숨길 수 있습니다. 이메일 크기를 계산하고 줄이는 방법에 대해 자세히 알아보세요.
