실행계획
영상에서 뽑은 프롬프트 세 줄과, 언제 쓰고 언제 쓰지 말지의 기준입니다.
근거는 정리.html과 같습니다.
기존에 하던 요청을 바꿀 필요는 없습니다. 끝에 한 줄을 붙이는 것이 전부입니다.
HTML 그리드로 펼쳐 줘. 나란히 비교할 수 있게.
원 글의 예시 프롬프트를 그대로 옮기면:
온보딩 화면 여섯 가지 다른 접근을 만들어 줘. 레이아웃, 톤, 밀도를 다르게 해서 한 HTML 파일에 그리드로 펼쳐 줘.
값 조정 가능한 슬라이더 넣어 줘. 마음에 드는 값은 복사 버튼으로.
슬라이더를 아무리 움직여도 실제 코드는 안 바뀝니다. HTML 파일은 실험대일 뿐입니다. 값을 정했으면 복사 버튼 → Claude에게 붙여넣기까지 해야 진짜 코드가 고쳐집니다. 그래서 프롬프트에 "복사 버튼으로"를 꼭 넣습니다. [02:50]
이거 학습하려고 하는데, 다이어그램이랑 주석 달린 코드, 주의할 점을 한 HTML로 정리해 줘.
영상 전체의 한 줄이 여기 있습니다 — "읽지 말고, 만들면서 배우세요." [06:10]
같은 코드 리뷰를 마크다운으로 받으면 1,140 토큰, HTML로 받으면 5,480 토큰이었다는 측정이 있습니다. [05:05]
HTML은 태그가 붙고 스타일이 들어가고, 슬라이더를 넣으면 그걸 움직이는 코드까지 들어갑니다. 눈에 보이는 게 늘어난 만큼 글자도 늘어납니다.
※ 이 숫자는 제3자 한 명의 개인 측정이고 원문을 검증하지 못했습니다. 부록 B 참고. 다만 "HTML이 훨씬 길어진다"는 방향 자체는 확실합니다.
| HTML로 받는다 | 마크다운으로 받는다 |
|---|---|
| 시각화할 것 색·도표로 한눈에 봐야 하는 것 |
글로 정리할 것 읽고 넘길 것 |
| 학습 문서 | 체크리스트 |
| 여러 안을 비교할 때 | 내가 다시 고칠 문서 |
"이 문서를 내가 다시 고칠 건가?"
고칠 문서라면 마크다운입니다. HTML은 태그가 섞여 있어 사람이 손보기 번거롭고, 결국 고칠 때마다 AI에게 통째로 다시 시키게 됩니다. 그러면 토큰 5배가 고칠 때마다 반복됩니다.
한 번 만들고 계속 들여다볼 문서라면 만들 때 다섯 배를 내고 끝입니다. 학습 문서가 HTML에 맞는 진짜 이유가 이것입니다 — 시각화라서가 아니라 다시 안 고치기 때문입니다.
※ 영상과 원 글 어디에도 없는 정리자의 판단입니다.
영상은 다섯 가지 중 셋만 다뤘습니다. 원 글에서 확인한 나머지 둘입니다. 프롬프트는 원문 예시를 옮긴 것입니다.
이 PR을 리뷰하게 HTML로 만들어 줘. 실제 diff를 렌더링하고, 여백에 주석을 달아서. 흐름도랑 모듈 구조도도 같이.
각 티켓을 Now / Next / Later / Cut 칸으로 끌어다 옮길 수 있는 카드로 만들어 줘.
이 유튜브 정리 폴더의 문서를 .md에서 .html로 바꾼 것이 정확히 이 영상의 활용법 3번입니다. 다시 고칠 문서가 아니라 계속 들여다볼 학습 문서이기 때문입니다.
다만 최상위 README.md는 마크다운으로 남겨 두었습니다. 영상을 추가할 때마다 목록을 손으로 고치는 문서라서입니다. 위의 "다시 고칠 건가?" 기준을 그대로 적용한 결과입니다.