이메일 서명의 HTML은 최대 10,000자로 제한돼요. 이메일 서명을 내보낸 뒤 크기 제한을 넘으면 플러그인이 경고를 표시해요. 이를 피하려면 Emailify 플러그인의 Footer 탭에 있는 Signature 스타터 컴포넌트를 활용해 보세요.
안타깝게도 “HTML Email Signature” 내보내기에서는 반응형 모바일 재정의가 렌더링되지 않아요. 이메일 클라이언트가 CSS style 태그와 @media 쿼리를 모두 제거하기 때문이에요(그래서 코드 내보내기에도 포함되지 않아요). 따라서 처음 디자인할 때부터 데스크톱과 모바일 너비 모두에서 보기 좋도록 균형을 맞추는 것이 좋아요.
영상 튜토리얼: Figma에서 HTML 이메일 서명 디자인 및 내보내기
이 영상은 Emailify 플러그인을 사용해 Figma에서 바로 쓸 수 있는 반응형 HTML 이메일을 디자인하고 내보내는 방법을 안내해요.
Emailify에서 HTML 서명 내보내기
Emailify 플러그인에서 Export HTML 버튼을 클릭해 내보내기 패널을 열고, 드롭다운 목록에서 HTML Email Signature 옵션을 선택한 다음 Export to HTML Signature 버튼을 클릭해 Figma에서 선택한 이메일을 HTML로 내보내세요.
Emailify가 이메일 처리를 마치면 확인 메시지가 표시돼요. Download your .zip file 버튼을 클릭해 .zip 파일을 컴퓨터에 다운로드한 다음, .zip 압축을 풀면 내보낸 파일을 확인할 수 있어요.
HTML 이메일 서명을 클립보드에 복사
Emailify에서 HTML 이메일 서명을 내보내고 .zip 파일의 압축을 풀었다면, preview-and-install.html 파일을 Google Chrome 웹 브라우저에서 여세요(Safari 같은 다른 브라우저에서는 문제가 생길 수 있어요). 미리보기 페이지에서 Copy HTML Signature 버튼을 클릭하면 HTML 서명 내용이 클립보드에 자동으로 복사돼요.
일부 이메일 클라이언트에는 “원시” HTML 코드가 필요할 수 있어요. 이럴 때는 preview-and-install.html 파일에서 Copy HTML Signature (Raw Code) 버튼을 클릭해 원시 HTML을 클립보드에 복사하세요.
HTML을 클립보드에 복사했다면, 아래 안내(SignatureHound의 훌륭한 가이드에서 가져왔어요)에 따라 이메일 클라이언트에 서명을 설치하세요.
Mail 앱(iOS)에 HTML 이메일 서명 설치
- iOS 기기에서 Settings 앱을 열고 검색창에 Signature를 입력한 다음, Apps > Mail 아래의 Signature 설정을 여세요. Mail > Signature 경로로 직접 이동할 수도 있어요.
- 서명 편집기에 서명을 붙여 넣으세요. 이메일 계정이 여러 개라면 올바른 계정의 서명 필드인지 확인하세요. 먼저 기존 텍스트를 모두 지운 다음, 편집기를 길게 누르고 Paste를 탭하세요.
붙여 넣은 서명이 너무 크거나 서식이 깨져 보이면 iOS의 Undo를 한 번 실행해 Mail이 서식을 새로 고치게 하세요. 가장 쉬운 방법은 키보드의 Undo 화살표를 탭하는 거예요. 화살표가 보이지 않으면 Undo Change Attributes 메시지가 나타날 때까지 iPhone을 가볍게 흔든 다음 Undo를 탭하거나, 세 손가락으로 왼쪽으로 쓸어 실행을 취소할 수 있어요. 그러면 서명 서식이 자동으로 새로 고쳐져요.
- Settings를 닫고 Mail 앱을 연 다음, 새 이메일을 작성해 서명이 잘 작동하는지 확인하세요. 이메일 계정이 여러 개라면 Settings에서 서명을 붙여 넣은 계정과 같은 From 주소를 선택할 때 서명이 표시돼요.
Apple Mail을 다크 모드로 사용할 때, 서명에 레티나 이미지가 하나라도 쓰였다면 “Inbox” 패널에서 서명 뒤에 흰색 배경이 표시되는 특이한 동작이 있어요(시스템과 Mail 설정이 모두 다크 모드여도 마찬가지예요). 이미지를 2x 레티나가 아닌 원본 1x로 내보내고 크기를 줄이지 않으면 흰색 배경이 사라지지만, 대신 서명의 이미지가 흐릿해져요.