AI로 만든 HTML 포트폴리오
공유하는 법
취업 지원서에 깃허브 링크를 넣으면 열어보는 면접관이 몇이나 될까. 프리랜서가 클라이언트에게 작업물을 보여줄 때 "파일 첨부해드릴게요"라고 하면 대화가 멈춘다. 포트폴리오는 만드는 것만큼, 상대방이 즉시 볼 수 있게 전달하는 것이 중요하다. ChatGPT나 Claude로 HTML 포트폴리오를 만들었다면, 이제 링크 하나로 5초 안에 넘겨줄 수 있다.
필요한 것
- AI 도구 하나: ChatGPT, Claude, Gemini, Cursor — 어느 것이든 HTML을 생성할 수 있으면 된다.
- html.to: 계정 불필요. 생성된 HTML을 붙여넣으면 즉시 공유 링크가 나온다. 무료.
단계별 가이드
-
AI에게 포트폴리오 HTML을 요청한다.
프롬프트 예시:내 디자인 포트폴리오 HTML 페이지 만들어줘. 프로젝트 3개, 연락처 포함. 단일 파일로.Claude나 ChatGPT는 전체 HTML 파일을 코드 블록으로 출력한다. -
HTML 코드를 전체 복사한다.
코드 블록 우상단의 "복사" 버튼을 누르거나, 전체 선택 후Ctrl+C(macOS:Cmd+C).<!DOCTYPE html>부터</html>까지 빠짐없이 복사해야 한다. -
htmlto.puzl.co.kr에 접속한다.
브라우저 주소창에htmlto.puzl.co.kr을 입력하고 진입. 로그인 불필요. -
HTML을 붙여넣거나 파일을 드롭한다.
에디터 영역에Ctrl+V로 붙여넣거나,.html파일을 드래그 앤 드롭. 오른쪽 패널에 렌더링된 결과가 즉시 표시된다. 내용을 확인한다. -
(선택) 비밀번호를 설정한다.
특정 사람에게만 보여줄 작업물이라면, 공유 전 비밀번호를 입력한다. AES-256-GCM으로 암호화되며, 링크를 받은 사람도 비밀번호를 알아야 열 수 있다. -
SHARE버튼을 누른다.
짧은 공유 링크가 자동으로 클립보드에 복사된다. 별도 도메인, 서버, 저장소 설정 없음. -
링크를 전달한다.
이메일, 카카오톡, 링크드인, 이력서 PDF — 어디든 붙여넣으면 된다. 받는 사람은 클릭 한 번으로 브라우저에서 포트폴리오를 바로 확인한다.
전체 과정은 2분 이하. AI가 HTML을 만드는 시간이 더 오래 걸린다.
Pro tips
- AI 프롬프트에 "단일 HTML 파일"을 명시한다. 외부 CSS나 이미지 파일이 없는 단일 파일이어야 html.to에서 완전히 렌더링된다. 프롬프트 끝에
모든 스타일은 인라인 또는 <style> 태그 안에 포함을 추가하면 확실하다. - 링크를 이력서 PDF에 삽입한다. 이력서 작업물 항목에 html.to 링크를 하이퍼링크로 넣으면, 면접관이 PDF를 보다가 즉시 클릭해서 확인할 수 있다.
- 클라이언트에게 보낼 때는 비밀번호를 건다. 아직 계약 전인 작업물이라면 비밀번호 보호로 무단 배포를 막는다. 비밀번호는 별도 메시지로 전달한다.
- 링크가 영구 저장된다. html.to 링크는 만료 기한 없이 유지된다. 명함이나 소셜 프로필에 박아도 된다.
- 수정이 필요하면 AI에게 다시 요청하고 재업로드한다. AI에게
이전 HTML에서 색상만 바꿔줘라고 하면 수정본이 나온다. 같은 방식으로 재업로드하면 새 링크가 생긴다.
상황별 활용
-
취업 준비생 — 직무별 맞춤 포트폴리오:
지원 직무마다 AI에게 다른 포트폴리오를 생성하게 한다. 마케터 지원용, 기획자 지원용, 각각 별도 링크로 관리한다.
이력서에
포트폴리오: htmlto.puzl.co.kr/s/abc123형태로 기재. - 프리랜서 — 제안서 첨부 대신 링크: 클라이언트에게 프로젝트 제안서를 이메일로 보낼 때, PDF 첨부 대신 html.to 링크를 넣는다. 인터랙티브한 HTML 제안서가 정적 PDF보다 인상을 남긴다. 열람 여부는 링크 클릭으로 확인.
- 팀 내부 — 기획 시안 공유: 기획자가 AI로 만든 화면 시안이나 대시보드 목업을 개발팀에 전달할 때, 슬랙이나 노션에 링크만 공유하면 개발자가 브라우저에서 바로 확인한다. 파일 첨부, 드라이브 권한 설정 불필요.
자주 묻는 질문
Q. html.to에 올린 포트폴리오 링크는 영구적으로 유지되나요?
네. 삭제하지 않는 한 영구 저장됩니다. 생성된 링크를 이력서나 명함에 기재해도 됩니다.
Q. 포트폴리오를 특정 사람에게만 보여주고 싶으면 어떻게 하나요?
공유 전 비밀번호를 설정하면 됩니다. AES-256-GCM 암호화가 적용되며, 링크를 받은 사람도 비밀번호를 입력해야 내용을 볼 수 있습니다. html.to 서버에도 복호화된 내용이 저장되지 않습니다.
Q. 회원가입 없이도 사용할 수 있나요?
네. html.to는 계정 없이 즉시 사용 가능합니다. HTML을 붙여넣고 SHARE를 누르면 링크가 생성됩니다.
가입하면 업로드 이력 대시보드가 추가로 제공됩니다.