[AI 활용] 세무사 홈페이지 제작-1
세무사 지인을 위한 개업 선물
소상공인, 자영업자, 초기 스타트업을 대상으로 한 달에 한 개 정도 무료로 워드프레스 홈페이지를 제작해 드리고 있습니다. 도움이 필요한 분은 편히 연락주세요.
자세한 내용은 이곳에서 확인해 주세요.
https://bit.ly/roy-homepage-inquiry
AI를 다양하게 활용하고 있다. 회사에서 기획하거나 MVP를 만들어 검증할 때 뿐 아니라, 과거에 하고 싶었지만 러닝커브로 인해 시간이 걸리던 일을 다시 시도하는 등에 활용 중이다. 이번엔 그 사례 중, AI의 도움을 받아 세무사 홈페이지 제작에 활용한 사례를 작성했다.
Pretendard를 기본 폰트로하고, PC의 인터랙션과 모바일 반응형도 모두 구현했다. (세무사 프로필 사진은 아직 촬영 전이라, 영상 찍을 때만 잠깐 노출시켰다.)
만들어진 사이트는 이곳에서 확인할 수 있다:
사용한 서비스
AI
1. Gemini 2.5 Pro
페이지 기획을 구체화하고 정리하는 데 활용했다. 당시 GPT-4.1, 4.5, o3 등도 사용해봤지만, 작문과 문제 정의 측면에서는 Gemini가 더 만족스러웠다.
2. Claude Opus 4
HTML과 CSS 코드를 제작할 때 주로 활용했다. 전체 구성을 먼저 설계한 뒤, 시연 가능한 프로토타입을 빠르게 구현하는 데 큰 도움이 되었다.
3. Perplexity Pro
리서치 용도로 활용했다. 다른 AI의 웹 검색 기능보다 속도가 빠르고, 검색 결과를 정리하는 사용자 경험도 뛰어났다.
홈페이지 제작
1. 워드프레스
2. 구글 서치 콘솔, 네이버 서치 어드바이저
3. GA4
4. 네이버 광고시스템 > 키워드 분석
호스팅
1. 닷홈
워드프레스를 무료로 체험하기 위해 먼저 사용했다. 워드프레스를 직접 만져본 결과 허브스팟 CMS보다 훨씬 난이도가 낮아 자신감을 얻었다. 기본적인 세팅 방법과 워드프레스 오픈소스의 특징을 익히는 데 적합했다.
2. 카페24
최종적으로 선택한 플랫폼이다. 워드프레스 세팅과 호스팅, 도메인 연결까지 한 번에 해결할 수 있어 편리했다.
제작 과정
실제 작업에는 하루 평균 2시간 30분 정도, 총 10일이 소요되었다. 처음 6일은 워드프레스 기본 기능을 익히는 데 시간을 많이 썼다. 하지만 CSS를 조작하고 Block에 Class를 설정하는 방법을 터득한 순간부터 작업 속도가 크게 빨라졌다. 이제는 비슷한 수준의 홈페이지라면 2일이면 제작할 수 있을 것 같다.
1. 홈페이지 기획 (w/ Gemini 2.5 Pro)
2. 닷홈에서 워드프레스 설치 및 기본 체험
3. 카페24에서 워드프레스 세팅 및 결제
4. 디자인 수정 (w/ Claude Opus 4)
5. 플러그인 설치 (도입문의 폼, SEO 등)
6. 제작 완료 및 검증
7. 도메인 구매 및 연결
8. 네이버/구글 서치 콘솔 등록 및 GA4 삽입
8. 사이트 인계
홈페이지 기획
페이지 기획 자료 초안 ⓒ작가편집홈페이지 기획은 제품 기획만큼 익숙하진 않았지만, 1년간 마케팅 플랫폼을 운영하며 옆에서 콘텐츠 기획자들의 작업을 지켜본 경험이 도움이 되었다. 다만, 콘텐츠의 맥락이나 브랜드 톤앤매너는 아직 다듬지 못했다. 요청자가 이 정도 퀄리티까지 원하지 않은 것도 있어서 우선 형태를 갖추는 것에 집중했다.
주안점
무엇보다 중요한 것은 지인(세무사)과의 인터뷰였다. 어떤 서비스와 강점을 드러내야 하는지 이야기를 나누며 홈페이지의 구조를 잡는데 참고했다. 후에 세무회계사가 법인으로 전환하고, 조금 더 관리하는 콘텐츠가 많아지면 그때 홈페이지의 사이트맵을 세분화하면 될 것 같고, 현재는 단일 페이지로도 충분하다고 판단했다.
가장 중요한 건 아래 정도로 포인트를 뒀다.
1. 고객이 이곳에서 제공받을 수 있는 서비스가 무엇인가?
2. 고객이 이들에게 어떻게 연락하면 되는가?
레퍼런스 등 사례나 상담문의 기록을 추가하면 더 좋을 것 같은데, 제작할 때 활용할 수 있는 정보가 부족한 상황이어서 추후 작업으로 미뤘다.
디자인
나는 화려하고 이쁜 디자인을 잘하는 편이 아니다. 그냥 레이아웃을 깔끔하게 정리할 줄 알 뿐. 그래서 오히려 문서를 깔끔하게 정리하는 데 자신있다. 그래서 이번 홈페이지 디자인 역시 과도하게 꾸미기보다는, 내 취향에 맞춰 카드 형태의 단정한 레이아웃으로 정리하기로 했다. 이 과정에서 Claude의 도움을 많이 받았다.
구체적으로는 프롬프트를 설계한 뒤, 앞서 작성한 기획서를 첨부해 프로토타입을 만들어달라고 요청했다. 그러자 Claude가 HTML과 CSS를 기반으로 기본적인 인터랙션까지 포함된 프로토타입을 생성해주었다. (사용한 프롬프트와 생성된 프로토타입은 이 문서에서 확인할 수 있다.)
시안 확정
피그마 시안 ⓒ작가편집컨셉 기획서와 프로토타입을 참고해 피그마 시안을 완성한 뒤, 지인과 간단히 리뷰 시간을 가졌다. 지인은 전반적인 분위기에 만족했지만, 개인적으로는 아쉬운 부분이 많았다.
현재 시안은 [히어로 섹션 → 세무사 소개 → 서비스 소개 → 콘텐츠 → FAQ → 지도 → 도입문의 → 푸터] 순서로 구성되어 있다. 하지만 세무사 소개는 별도 페이지로 분리해도 무방하고, 메인 페이지 하단에는 차라리 철학이나 메시지를 담아 브랜드 맥락을 강화하는 편이 더 효과적이라고 생각했다.
그럼에도 불구하고, 결국 클라이언트(지인)에게 컨펌을 받은 시안이기에 이를 기반으로 워드프레스 개발을 진행하기로 했다.
※ 워드프레스 개발 과정과 그 안에서의 시행착오는 2편에서 다룬다.
ⓒ 2025. 327roy All rights reserved.
