AI로 홈페이지를 만들 때 디자인이 템플릿처럼 보이는 지점은 레이아웃이 아니라 색·글꼴·사진·문구입니다. 화면을 몇 번이나 새로 생성해도 이 네 가지가 처음 상태로 남아 있으면 어디서 본 화면처럼 읽힙니다. 반대로 배치를 그대로 두고 색 두 개와 첫 화면 사진 한 장만 바꿔도 분위기는 먼저 달라집니다.
핵심 요약
- 템플릿 느낌은 기본 사진·기본 색·기본 글꼴·기본 문구 네 곳에서 거의 다 생깁니다.
- 손대는 순서는 색 → 글꼴 → 사진 → 문구이고, 섹션을 다시 만드는 일은 마지막입니다.
- 본문 글자와 배경의 밝기 차이는 4.5:1 이상, 버튼처럼 글자가 아닌 요소는 3:1 이상이 기준입니다(W3C WCAG 2.2).
- 첫 화면에서 가장 큰 사진은 2.5초 안에 보이는 것이 기준입니다(구글 web.dev).
AI 홈페이지 디자인이 템플릿처럼 보이는 지점 5곳
화면을 만들어 놓고 「뭔가 남의 집 같다」고 느끼는 지점은 거의 정해져 있습니다. 아래 다섯 곳만 열어 보면 원인이 나옵니다.
- 첫 화면 사진 — 업종 기본 사진이 그대로 남아 있는 경우입니다. 같은 업종이면 다른 곳에도 비슷한 사진이 걸려 있습니다.
- 주 색 — 처음 들어 있는 파란 계열이 그대로입니다. 간판이나 명함과 색이 다르면 그 순간 다른 회사 화면이 됩니다.
- 글꼴 — 제목과 본문이 같은 기본 글꼴 하나로 되어 있습니다. 제목이 본문보다 크기만 큰 상태입니다.
- 섹션 제목 문구 — 「우리의 서비스」 「함께하는 사람들」 처럼 어느 업종에 넣어도 말이 되는 문장입니다.
- 카드 묶음 — 아이콘 세 개가 한 줄로 놓인 기본 구성이 손대지 않은 채 남아 있습니다.
지시문 한 줄로 전문가가 만든 디자인이 나온다는 말을 자주 보게 됩니다. 직접 해보시면 화면 자체는 멀쩡한데 위의 다섯 곳이 기본값으로 남아 있는 것부터 눈에 들어옵니다. 마치 분양 아파트 모델하우스에 들어 있던 가구를 그대로 두고 사는 것과 같습니다. 집은 내 집인데 사진을 찍으면 모델하우스로 보입니다.
레이아웃을 새로 만드는 쪽과 색·사진만 바꾸는 쪽, 어느 쪽이 덜 템플릿처럼 보일까요?
질문부터가 모순이 있는 질문입니다. 화면을 처음 본 사람은 섹션이 몇 개였는지, 카드가 2열이었는지 3열이었는지 기억하지 못합니다. 먼저 들어오는 것은 색과 사진, 그리고 제목 글자 모양입니다. 그래서 배치를 통째로 다시 만들어도 기본 사진이 남아 있으면 템플릿 느낌은 그대로 남고, 배치를 한 번도 손대지 않고 색 두 개와 첫 화면 사진만 바꾸면 다른 곳처럼 보입니다.
“템플릿처럼 보이는 것은 배치가 같아서가 아니라, 처음 들어 있던 사진과 문구가 남아 있어서입니다.”
순서를 거꾸로 잡으면 시간이 많이 듭니다. 섹션 재생성은 한 번에 화면 전체가 바뀌니 다시 확인할 곳이 늘어나고, 색·글꼴·사진은 값을 고르는 일이라 되돌리기도 쉽습니다. 목적이 「우리 가게로 보이게」라면 값부터 바꾸는 쪽이 빠릅니다.
바꿀 수 있는 부분과 막히는 부분
AI가 만든 화면에서 하는 일은 성격이 두 가지로 나뉩니다. 값을 고르는 일과, 구조를 다시 만드는 일입니다. 아래 표에서 위 네 줄은 값이고 마지막 줄만 구조입니다.
| 항목 | 손대는 방법 | 숫자 기준 |
|---|---|---|
| 색 | 값 직접 입력 | 주 색 1개 + 보조 1개, 본문 대비 4.5:1 이상 |
| 글꼴 | 목록에서 선택 | 제목·본문 2종까지 |
| 사진 | 칸마다 교체 | 한 벌 14칸(첫 화면 3·중간 2·카드 5·목록 3) |
| 문구 | 직접 입력 | 첫 화면 문장 1줄 + 버튼 1개 |
| 섹션 구조 | 섹션 단위 재생성 | 1섹션씩, 되돌릴 지점 1곳 저장 |
확인 기준 : 2026년 10월
사진 14칸은 저희가 업종 템플릿 한 벌을 만들 때 실제로 나눠 두는 칸 수입니다. 이 숫자가 중요한 이유는 하나입니다. 색과 글꼴은 한 번 바꾸면 전체에 적용되는데, 사진은 칸이 열네 개여서 한두 칸이 꼭 기본 상태로 남습니다. 템플릿 느낌이 끝까지 안 빠지는 글의 원인이 대개 여기에 있습니다.
색·글꼴·사진 중 먼저 손댈 순서
세 가지를 동시에 바꾸면 무엇 때문에 좋아졌는지 알 수 없습니다. 한 번에 하나씩, 아래 순서대로 하시면 됩니다.
| 순서 | 할 일 | 숫자 기준 |
|---|---|---|
| 1 | 간판·명함에 있는 색을 그대로 적기 | 색 2개, 글자 대비 4.5:1 · 버튼 대비 3:1 |
| 2 | 제목용·본문용 글꼴 각각 하나 고르기 | 2종, 큰 제목은 18pt(약 24px) 이상 |
| 3 | 첫 화면 사진 한 장부터 교체 | 1장 먼저 → 나머지 13칸 |
| 4 | 첫 화면 문장과 버튼 글자 바꾸기 | 문장 1줄, 버튼 1개 |
| 5 | 필요한 섹션만 다시 만들기 | 1섹션씩 |
확인 기준 : 2026년 10월
대비 숫자는 취향이 아니라 공개된 기준입니다. W3C의 접근성 지침(WCAG 2.2)은 본문 글자와 배경의 밝기 차이를 4.5:1 이상으로, 18pt(약 24px) 이상이거나 14pt 굵은 글자는 3:1 이상으로 정해 두고 있습니다. 버튼이나 입력칸 테두리처럼 글자가 아닌 요소도 3:1 이상입니다. 색을 고를 때 이 세 숫자만 확인하면 「예쁜데 안 읽히는 화면」은 나오지 않습니다.
원하는 화면을 얻으려면 지시문에 무엇을 적어야 하나요?
지시문에는 분위기를 적는 것보다 값을 적는 것이 효과가 큽니다. 「깔끔하게」 「고급스럽게」는 받는 쪽에서 해석할 여지가 너무 넓습니다. 아래 다섯 개를 적으면 한 번에 가까운 결과가 나옵니다.
- 업종과 하는 일을 한 줄로 — 「주택 수리, 출장 견적」처럼 명사로 적습니다.
- 색은 말이 아니라 값으로 — 간판 색을 색상 코드로 적거나 사진을 올려 색을 집어 줍니다.
- 글꼴은 두 가지 성격으로 — 제목은 굵고 각진 쪽, 본문은 읽기 편한 쪽 정도로 범위를 좁힙니다.
- 첫 화면에 들어갈 사진 장면 — 「작업 중인 손」 「가게 안 창가」처럼 장면으로 적습니다.
- 찾아온 사람이 눌러야 하는 버튼 하나 — 전화, 문의, 예약 중 하나만 정합니다.
버튼을 하나로 줄이라는 말이 아깝게 느껴질 수 있습니다. 그런데 버튼이 네 개인 첫 화면과 하나인 첫 화면 중에 전화가 더 오는 쪽은 하나인 쪽입니다. 고를 것이 많으면 사람은 고르지 않고 나갑니다.
섹션을 다시 만들 때와 요소만 고칠 때는 어떻게 다른가요?
요소만 고치는 일은 바꾼 자리만 바뀌고, 섹션을 다시 만드는 일은 그 섹션이 통째로 새로 나옵니다. 문구 한 줄이나 사진 한 장이 마음에 안 들 때 섹션을 다시 만들면, 손봐 둔 다른 부분까지 함께 바뀌어 처음 상태로 되돌아가기 쉽습니다.
그래서 기준을 이렇게 잡으시면 됩니다. 글·사진·색·버튼 글자처럼 「안에 들어 있는 것」이 문제면 요소만 고칩니다. 블록 순서가 뒤집혀 있거나 꼭 필요한 칸이 아예 없을 때만 섹션을 다시 만듭니다. 다시 만들기 전에 지금 화면을 저장해 두면 되돌릴 지점이 생깁니다.
첫 화면은 5초 안에 무엇이 보여야 하나요?
무엇을 하는 곳인지, 어디에 있는지, 다음에 누를 버튼 하나입니다. 이 세 가지가 스크롤하지 않은 상태에서 보이면 첫 화면은 제 역할을 한 것입니다. 디자인이 특별한지는 그다음 문제입니다.
여기서 사진 용량을 함께 보셔야 합니다. 구글이 공개한 web.dev 기준으로 화면에서 가장 큰 요소가 그려지는 시간은 2.5초 이내가 좋은 상태이고, 방문의 75%를 기준으로 재며 휴대전화와 데스크톱을 따로 봅니다. 첫 화면 사진이 무거우면 색을 아무리 잘 맞춰도 사람이 보기 전에 떠납니다. 사진을 교체할 때 가로 폭을 화면에 맞게 줄여서 올리는 것만으로 대부분 해결됩니다.
1단계부터 5단계까지, 공개 전에 할 일
- 1단계 — 간판·명함·차량 스티커에서 색 두 개를 뽑아 적습니다.
- 2단계 — 제목용과 본문용 글꼴을 하나씩 정하고 더 늘리지 않습니다.
- 3단계 — 첫 화면 사진을 실제 사진으로 바꾸고, 남은 칸을 전부 열어 기본 사진이 남았는지 확인합니다.
- 4단계 — 첫 화면 문장을 업종과 지역이 들어간 한 줄로 바꾸고 버튼을 하나로 줄입니다.
- 5단계 — 휴대전화에서 열어 글자가 잘리는지, 버튼이 손가락으로 눌리는지 봅니다.
다섯 단계를 끝내면 같은 템플릿으로 시작한 화면이라도 서로 다른 곳처럼 보입니다. 바꾼 것은 구조가 아니라 값입니다.
아이비전트에서는 어디까지 값으로 바뀌나요?
저희 빌더는 업종 템플릿 한 벌을 만들 때 사진 칸을 열네 개로 나눠 둡니다(첫 화면 3·중간 2·카드 5·목록 3). 그리고 운영하면서 정해 둔 규칙이 하나 있습니다. 첫 화면 사진은 다른 고객 화면에 이미 쓰인 것을 다시 쓰지 않습니다. 첫 화면이 겹치는 순간 두 사이트가 한 템플릿으로 보이기 때문입니다. 색과 글꼴은 값으로 바꾸고, 섹션은 필요한 곳만 다시 만들 수 있습니다.
14일 무료체험 기간 안에 색·글꼴·사진을 직접 바꿔 보고 화면이 우리 것처럼 보이는지 확인해 보시면 됩니다. 공개할 때 쓸 내 도메인 연결은 월 3,300원부터입니다.
정리 — 색 두 개와 첫 화면 사진 한 장부터 적어 보면 됩니다
템플릿처럼 보이는 지점은 레이아웃이 아니라 기본값이 남아 있는 자리입니다. 색, 글꼴, 사진, 문구를 순서대로 바꾸고 섹션 재생성은 꼭 필요한 곳에만 쓰시면 됩니다. 어떤 디자인이 더 좋은지를 먼저 묻기보다, 찾아온 사람에게 무엇을 보여줄지 목적을 먼저 정하고 비교해서 고르시면 됩니다.
확인 기준 : 2026년 10월
