이메일에 HTML 인터랙티브
콘텐츠 링크로 첨부하기
AI로 인터랙티브한 차트, 계산기, 프레젠테이션 HTML을 만들었다.
이제 이걸 클라이언트에게 이메일로 보내려는데, 문제가 생긴다.
Gmail도 Outlook도 .html 첨부를 막거나, 받는 사람이 직접 열어야
하는 번거로움이 생긴다. 모바일에서는 아예 열리지 않는 경우도 흔하다.
정성껏 만든 결과물이 수신함에서 사장되는 상황 — 해결책은 간단하다.
HTML 파일이 아니라 렌더링된 URL을 보내면 된다.
필요한 것
- AI 도구 하나 (ChatGPT, Claude, Gemini, Cursor — 무엇이든)
- html.to — 계정 불필요, 무료, 영구 저장
html.to에 HTML을 올리면 즉시 공유 링크가 생성된다. 비밀번호 보호(AES-256-GCM), 영구 저장이 기본 제공된다.
단계별 방법
-
AI에게 HTML을 요청한다.
예시 프롬프트:분기별 매출 추이를 보여주는 인터랙티브 차트 HTML을 만들어줘. 외부 라이브러리 없이 순수 HTML/CSS/JS로. -
생성된 HTML 코드를 전체 복사한다.
Claude Artifacts라면 우측 상단 복사 버튼, ChatGPT라면 코드 블록의Copy code를 클릭한다. -
htmlto.puzl.co.kr에 접속한다.
회원가입 없이 바로 사용 가능하다. -
복사한 코드를 붙여넣거나 파일을 드래그한다.
텍스트 에어리어에 붙여넣거나,.html파일을 드롭 존으로 끌어오면 자동으로 로드된다. -
우측 미리보기에서 결과를 확인한다.
렌더링이 의도한 대로 나오는지 확인한다. 문제가 있다면 AI에게 수정을 요청하고 다시 붙여넣는다. -
(선택) 비밀번호를 설정한다.
사내 문서나 클라이언트 전용 자료라면Password필드에 비밀번호를 입력한다. AES-256-GCM으로 암호화되어 서버에도 원문이 저장되지 않는다. -
SHARE버튼을 누른다.
링크가 클립보드에 자동 복사된다. 형태:htmlto.puzl.co.kr/v/xxxxxxxx -
이메일 본문에 링크를 붙여넣는다.
파일 첨부 없이 링크만 보낸다. 받는 사람은 클릭 한 번으로 브라우저에서 완성된 화면을 본다.
Pro tips
- 외부 라이브러리 없이 만들어 달라고 요청하라. CDN 의존 HTML은 네트워크 환경에 따라 깨질 수 있다.
순수 HTML/CSS/JS만 사용조건을 프롬프트에 명시하면 안정적으로 렌더링된다. - 비밀번호는 이메일 본문이 아닌 별도 채널로 전달하라. 링크는 이메일로, 비밀번호는 문자나 Slack으로 따로 보내면 보안이 높아진다.
- 링크 앞에 맥락 한 줄을 붙여라. "아래 링크에서 인터랙티브 버전을 확인하실 수 있습니다:" 한 줄이 없으면 수신자가 링크를 그냥 지나치는 경우가 많다.
- 모바일에서 미리 확인하라. 공유 링크를 본인 휴대폰으로 먼저 열어 레이아웃이 모바일에서도 제대로 보이는지 체크한다. 문제가 있으면 AI에게
모바일 반응형으로 수정해줘를 요청한다. - 링크는 영구적이다. html.to 링크에 만료 기간이 없다. 이메일 수신자가 나중에 다시 열어도 동일한 화면이 보인다.
활용 시나리오
- 클라이언트에게 시안 공유. 기획자가 Claude로 랜딩 페이지 프로토타입을 만들고, html.to 링크로 클라이언트에게 이메일 발송. 클라이언트는 별도 앱 없이 브라우저에서 바로 확인하고 피드백을 준다.
- 팀 내 데이터 리포트 공유. ChatGPT로 분기 실적 인터랙티브 차트를 생성하고, 비밀번호를 걸어 링크를 사내 이메일로 전달. 외부에 노출될 걱정 없이 팀원만 열람 가능하다.
- 강사/교육자의 학습 자료 배포. Gemini로 퀴즈 또는 인터랙티브 학습 자료 HTML을 만들고, 링크를 수강생 이메일로 전송. 파일을 내려받거나 설치할 필요 없이 바로 학습 가능하다.
FAQ
Q. html.to 링크를 받은 사람도 회원가입이 필요한가요?
아니요. 링크를 받은 사람은 회원가입 없이 브라우저에서 바로 확인할 수 있습니다. html.to는 업로드할 때도, 볼 때도 계정이 필요 없습니다.
Q. 링크가 언제 만료되나요?
html.to는 영구 저장을 제공합니다. 별도의 만료 기간 없이 링크가 유지됩니다.
Q. 비밀번호를 걸면 링크가 달라지나요?
링크 주소 자체는 동일합니다. 다만 접속한 사람이 비밀번호를 입력해야 콘텐츠를 볼 수 있습니다. AES-256-GCM 암호화가 적용되어 서버에도 원문이 저장되지 않습니다.
지금 바로 링크 만들기 →