템플릿을 겉모습으로 선택하지 마세요: 에이전시를 위한 콘텐츠 우선 워크플로우

요약

대부분의 에이전시는 클라이언트 사이트가 멈추면 템플릿을 탓합니다. 실제 병목 현상은 누군가 테마를 선택하기 전에 일어나는 인테이크(intake)와 콘텐츠 매핑입니다. 이 워크스루는 9개의 제품 라인과 3가지 구매자 유형을 가진 산업용 공급업체라는 전형적인 클라이언트 프로젝트를 반복 가능한 템플릿 워크플로우로 안내합니다. 클라이언트 발견(discovery)을 페이지별 청사진으로 전환하고, 히어로 섹션의 겉모습보다 콘텐츠 부하량을 기준으로 테마를 선택하며, 다음 클라이언트를 더 빠르게 만드는 재사용 라이브러리를 구축하는 방법을 배우게 됩니다. 그 대가는 수정 작업 감소, '템플릿이 이걸 할 수 있나요?'라는 질문 감소, 그리고 모든 계정에 확장되는 전달 프로세스입니다.

대부분의 템플릿 조언은 순서를 잘못 잡습니다. 스크린샷에서 시작해 색상 팔레트로 끝납니다. 한 명 이상의 클라이언트를 위해 웹사이트를 만든다면, 그 순서 때문에 모든 제작이 일회성처럼 느껴집니다. 템플릿은 시작점이 아닙니다. 클라이언트의 콘텐츠가 시작점입니다. 이건 말장난이 아닙니다. 테마가 무엇을 담아야 하는지 알기 전에 테마를 고르면, 카피를 레이아웃에 억지로 끼워 맞추고, '블록 하나만 더' 요청하고, 결코 회수하지 못할 시간을 청구하게 됩니다.

이것이 바로 그 문제를 해결하는 워크플로우입니다. 9개 제품 라인과 3가지 구매자 유형을 가진 지역 산업용 공급업체와의 프로젝트를 브리프부터 런칭까지 따라가 보세요. 이 단계는 이후 모든 클라이언트에게 적용됩니다.

질문에서 시작하세요, 템플릿 쇼핑몰이 아니라

클라이언트는 깔끔한 브리프를 보냅니다: “우리는 현대적인 웹사이트가 필요합니다. 깔끔한 디자인. 우리보다 더 커 보이고 싶습니다.” 그 브리프는 수백 개의 템플릿에 맞을 수 있습니다. 어떤 템플릿이 현실과 맞닥뜨려도 살아남을지에 대해서는 아무것도 알려주지 않습니다.

템플릿이 무엇을 담고 있는지 알기 전에 템플릿을 보지 마세요. 클라이언트와 앉아서 형용사가 아니라 페이지 목록을 만들어내는 질문을 하세요:

• 현재 사이트에 어떤 페이지가 있나요?
• 1년 후에는 어떤 페이지가 있어야 하나요?
• 매달 업데이트되는 페이지는 무엇인가요? 어떤 페이지는 오래되어도 되나요?
• 사이트에서 가장 복잡한 것은 무엇인가요—사양서, 예약 양식, 비디오 월?
• 고객 다음으로 중요한 잠재 고객은 누구인가요?

답변은 모든 것을 바꿉니다. 산업용 공급업체는 제품 카탈로그가 한 페이지가 아니라 9개의 카테고리 페이지이며, 각각 상세 제품 페이지, PDF 데이터 시트, 규정 준수 로고, 견적 요청 양식이 있다고 말합니다. 엔지니어, 구매 관리자, 유통업자라는 세 가지 구매자 유형은 서로 다른 페이지에 방문하여 서로 다른 증거를 원합니다.

이제 '깔끔한 디자인'은 의미가 없습니다. 템플릿은 제품 데이터 테이블, PDF 링크 목록, 양식을 담을 수 있어야 합니다. 그것이 바로 체크리스트입니다.

많은 팀이 클라이언트가 이미 '자신이 원하는 것을 말했다'며 이 단계를 건너뜁니다. 그렇지 않습니다. 그들은 사업체 이름과 낙관론만 말했을 뿐입니다. 페이지 목록을 만드세요. 현재 프로세스가 템플릿 검색으로 시작한다면, 이 한 가지 변화만으로 가장 많은 시간을 절약할 수 있습니다.

템플릿 찾기 전에 콘텐츠 감사

클라이언트가 '경쟁사 사이트처럼 만들어 주세요'라고 말합니다. 경쟁사 사이트를 열면 거대한 히어로 슬라이더가 보입니다. 거기서 시작하지 마세요.

클라이언트와 함께 기존 사이트를 여세요. 테마를 찾기 전에 페이지별 콘텐츠 부하를 매핑하세요. 각 페이지에 대해 콘텐츠 유형을 세어 보세요: 긴 단락, 표, 이미지 갤러리, 양식, 동영상, 다운로드 파일, 팀 소개, 추천사, 삽입된 지도. 어떤 페이지가 상시 페이지이고 어떤 페이지가 캠페인 페이지인지 기록하세요. 페이지를 비즈니스 목표에 따라 순위를 매기세요. 이는 있으면 좋은 것이 아니라 모든 템플릿에 적용할 필터입니다.

실용적인 단계: 간단한 스프레드시트를 만드세요. 열은 페이지 이름이고, 행은 콘텐츠 유형입니다. 페이지에 필요하면 체크하세요.

공급업체의 감사 결과 확실한 요구사항이 드러납니다: 모든 제품 페이지에는 큰 사양 테이블과 고정 '견적 요청' 버튼이 있는 2열 레이아웃이 필요합니다. 홈페이지에는 세 가지 시장 부문을 위한 섹션이 필요합니다. 리소스 페이지에는 PDF를 위한 반복 가능한 카드 그리드가 필요합니다.

보통 검토하던 템플릿 중 이런 것을 처리할 수 있는 것이 있나요? 아직 모릅니다. 그게 핵심입니다.

업종별 템플릿은 이 과정을 단축할 수 있습니다. 산업 분야용으로 제작된 템플릿은 처음부터 제품 카탈로그와 사양 섹션을 포함하는 경우가 많습니다. 그러면 해당 블록을 수동으로 만들 필요가 없습니다. 하지만 업종 라벨은 약속이 아닙니다. '제조업' 테마에는 필요 없는 블로그 섹션이 포함되어 있고 필요한 유통업체 찾기 지도가 없을 수도 있습니다. 템플릿을 카테고리 이름이 아니라 감사 결과로 판단하세요.

이것이 느린 부분처럼 들린다면, 그렇지 않습니다. 이 사전 매핑이 '템플릿이 안 맞는다'는 악순환을 끝냅니다. 그 악순환이 마진을 잡아먹는 이유를 더 자세히 알고 싶다면 템플릿 워크플로우가 느리게 느껴지는 이유와 해결 방법을 읽어 보세요.

홈페이지보다 제품 페이지를 먼저 보세요

여기 함정이 있습니다: 템플릿 데모는 풀스크린 비디오가 있는 멋진 홈페이지를 보여줍니다. 클라이언트에게 보여주면 승인합니다. 그런데 8행 사양 표가 있는 제품 상세 페이지를 만들려고 하면 레이아웃이 무너집니다.

템플릿을 홈페이지로 평가하지 마세요. 가장 지루한 페이지로 평가하세요.

데모의 내부 페이지를 여세요. 제품 페이지에 사양 표가 있나요? 긴 데이터 테이블이 줄바꿈되나요, 스크롤되나요? 고정 콜투액션이 있나요? 질문이 10개인 FAQ 페이지를 로드하면 어떻게 되나요? 블로그 목록이 20개가 아니라 4개일 때 의도적으로 보이나요? 이러한 테스트를 통과하는 템플릿이 구매할 가치가 있습니다.

클릭을 시작하기 전에 비교가 도움이 됩니다:

클라이언트가 말하는 것	템플릿이 담아야 하는 것
'현대적인 느낌이 필요해요'	타이포그래피와 충돌하지 않는 전체 너비의 이미지 중심 섹션
'제품 페이지가 중요해요'	사양 표, PDF 링크, 관련 제품을 포함한 반복 가능한 제품 레이아웃
'구매하기 쉽게 해주세요'	구매 의도가 높은 모든 페이지에 보이는 견적 또는 예약 양식
'사이트가 우리와 함께 성장해야 해요'	재구축 없이 재정렬할 수 있는 모듈형 섹션
'PDF가 많아요'	중단 없이 확장되는 카드 그리드 또는 문서 목록

이 표를 필터로 사용하세요. 템플릿이 한 행이라도 통과하지 못하면 버리세요. 모든 행을 통과하면 홈페이지는 거의 중요하지 않습니다—적응할 수 있으니까요.

나중에 문제가 생기는 것들을 확인하세요

반응형, SEO 친화성, 로딩 속도, 사용자 정의 옵션, 사용자 경험. 이러한 기능은 사이트가 런칭 후에도 살아있게 만드는 요소이며 스크린샷에서는 보이지 않습니다.

실제 휴대폰에서 데모를 열어 보세요. 사양 표가 가로 스크롤 함정이 되나요? 고정 견적 버튼이 여전히 접근 가능한가요, 아니면 푸터를 가리나요? 테마 데모에서 페이지 속도를 테스트하세요. 무거운 애니메이션과 대형 비디오로 가득 찬 템플릿은 벽돌처럼 로드됩니다.

구매 전에 SEO 기본 사항을 확인하세요: 깔끔한 페이지 제목, 메타 설명, 의미론적 제목 계층, 이미지 대체 텍스트 필드, 제품 또는 지역 업체를 위한 스키마 지원. 많은 팀이 이를 너무 늦게 알게 됩니다. 순위를 떨어뜨리는 SEO 신화는 결과를 약속하기 전에 확인하라는 좋은 알림입니다.

사용자 정의 옵션도 중요합니다. 고정된 섹션에 갇히는 테마는 페이지 빌더가 몇 분이면 할 일을 개발자를 고용해서 해야 할 수도 있습니다. 섹션을 재정렬하고, 새 콘텐츠 블록을 추가하고, 전역 글꼴과 색상을 한 곳에서 변경할 수 있는 템플릿을 찾으세요. 더 모듈화되어 있을수록 모든 클라이언트 사이트를 맞춤 제작된 느낌으로 만들기 쉽습니다.

클라이언트가 잘못된 템플릿에 빠졌을 때 대처법

세 가지 옵션을 보냅니다. 클라이언트는 당신이 숏리스트에 넣지 않은 것—거대한 벽돌 격자(masonry grid)가 있는 포트폴리오 테마—으로 답합니다. 템플릿에 제품 사양 표가 없어서 콘텐츠 감사를 통과하지 못합니다. 항복하고 싶은 충동을 참으세요.

클라이언트에게 논쟁이 아니라 콘텐츠 감사 결과를 보여주세요. 템플릿의 데모 제품 페이지를 여세요. 제품 페이지가 없다면 그 격차를 언급하세요. '이 테마에는 사양 표 레이아웃이 없어서 처음부터 만들어야 합니다. 그러면 템플릿의 속도 이점이 사라집니다.' 아니라고 말할 수 있는 구체적인 근거를 주세요.

그런 다음 숏리스트로 다시 안내하세요. 검증된 옵션 중에서 선택하게 하세요. 그래도 고집하면, 그 이탈을 맞춤 제작 항목으로 범위를 잡으세요. 이는 수동적으로 공격적인 것이 아니라 정직한 것입니다. 클라이언트는 예쁜 템플릿과 추가 일정을 가질 수 있습니다. 비용만 알면 됩니다.

원칙: 시각적 매력은 실제하지만 그것은 하나의 기능일 뿐입니다. 모든 템플릿 선택을 감사 결과와 연결하여 사이트의 핵심 기능을 보호하세요.

첫 번째 빌드는 디자인 패스가 아니라 콘텐츠 드롭입니다

템플릿을 선택했습니다. 클라이언트는 디자인을 기대합니다. 데모를 즉시 다시 스타일링하고 싶은 유혹을 참으세요.

첫 번째 빌드는 콘텐츠 드롭입니다. 모든 샘플 요소를 클라이언트의 실제 콘텐츠로 교체하세요—내비게이션 라벨, 실제 제목, 실제 제품 이름, 이미지가 있다면 이미지, 이메일 주소. 템플릿의 기본 글꼴과 색상은 그대로 두세요. 그런 다음 무엇이 깨지는지 살펴보세요.

공급업체 사이트에서 '서비스' 내비게이션 라벨이 '제품 및 사양'이 되는데, 메뉴 공간에 비해 세 단어가 깁니다. 홈페이지 히어로 헤드라인 '제조업의 파트너'는 세 줄로 줄바꿈되어 버튼을 접힌 부분 아래로 밀어냅니다. 실제 데이터가 있는 제품 표는 열을 넘칩니다. 이것이 귀중한 정보입니다. 어떤 섹션을 사용자 정의해야 하는지 정확히 알려줍니다.

먼저 색상을 변경하면 모든 레이아웃 문제를 템플릿 탓으로 돌리고 더 악화시킬 것입니다. 콘텐츠 드롭을 먼저 하세요. 프로젝트 중에 실행할 가장 저렴한 진단입니다.

사용자 정의를 할 때는 우선순위 패스를 실행하세요: 실제 데이터로 인해 깨지는 레이아웃은 지금 수정하고, 외관상 선호도는 클라이언트 승인 라운드를 위해 기록해 두세요. 이렇게 하면 오후 내내 로고 간격을 조정하다가 견적 양식이 작동하지 않는다는 사실을 발견하는 전형적인 실패를 방지할 수 있습니다.

실제 콘텐츠가 아닌 것은 모두 제거하세요

템플릿에는 필러가 포함되어 있습니다. '위젯 선택 방법'에 관한 블로그 게시물, 스톡 사진이 있는 팀 소개 5개, 추천사 슬라이더, 이벤트 캘린더, 가격 표. 클라이언트가 해당 섹션에 실제 콘텐츠가 없다면 그 섹션을 제거하세요.

비어 있거나 거의 비어 있는 섹션은 사이트를 미완성처럼 보이게 합니다. 추천사 두 개가 있는 슬라이더는 깨진 것처럼 보이고, 사진 한 장이 있는 팀 그리드는 초라해 보입니다. 공급업체 클라이언트는 사진 촬영이 끝난 두 개의 제품 카테고리가 있고 나머지는 없습니다. 플레이스홀더 갤러리를 만들지 마세요. 사진이 없는 카테고리를 위해 갤러리를 제거하거나 잘 디자인된 문서 목록으로 교체하세요.

같은 규칙이 페이지 유형에도 적용됩니다. 템플릿에 블로그가 포함되어 있는데 클라이언트가 글을 쓰지 않는다면 내비게이션에서 블로그를 삭제하고 뉴스 페이지를 유지할지 결정하세요. 콘텐츠 감사에 매핑되는 페이지만 유지하세요. 사용하지 않는 페이지는 유지 관리 부담이며 런칭 후 사용자 정의의 블랙홀입니다.

절충: 맞춤 제작은 상상할 수 있는 모든 페이지를 포함할 수 있습니다. 템플릿은 그럴 수 없습니다. 그래서 콘텐츠 감사가 먼저입니다. 모든 데모 섹션이 그대로 있을 때 가장 멋져 보이는 템플릿이 아니라 클라이언트가 필요로 하는 대부분을 갖춘 템플릿을 원합니다.

런칭 키트로 두 번째 클라이언트를 더 빠르게 진행하세요

첫 번째 진행은 의도적으로 느립니다. 워크플로우를 구축하는 단계입니다. 두 번째 클라이언트는 같은 템플릿을 재사용했기 때문이 아니라 이제 프로세스를 소유했기 때문에 더 빨라야 합니다.

첫 프로젝트 후 런칭 키트를 만드세요. 최소한 다음을 포함합니다:

• 1부의 발견 질문 목록.
• 클라이언트당 하나의 탭이 있는 콘텐츠 감사 스프레드시트.
• 일반적인 업종별 페이지 유형 체크리스트.
• 한 페이지짜리 사용자 정의 플레이북: 콘텐츠 드롭, 레이아웃 수정, 그다음 스타일링 순서.
• 업종별 '템플릿 숏리스트'—이미 검증한 두세 개의 테마.

다음 클라이언트가 들어옵니다. 키트를 열고, 공급업체의 제품 라인을 삭제하고, 가격 목록 페이지를 추가하고, 같은 감사를 실행합니다. 프로세스를 다시 발견하는 것이 아니라 실행하는 것입니다.

이것이 에이전시가 모든 웹사이트를 빈 페이지처럼 취급하지 않게 되는 방법입니다. 팀이 같은 실수를 반복한다면, 나쁜 습관을 제도화하기 전에 템플릿을 망치는 사용자 정의 실수를 확인하세요.

템플릿이 문제가 아닐 때를 아세요

한 단계 더 있습니다: 수정 단계입니다. 클라이언트가 더 큰 글꼴, 캐러셀, 추가 랜딩 페이지, '로고가 펄스하도록 만들 수 있나요?'라고 요청합니다. 자연스러운 반응은 템플릿을 탓하는 것입니다. 하지만 항상 그런 것은 아닙니다.

대부분의 수정 요구는 템플릿의 한계가 아니라 공유된 청사진이 없기 때문입니다. 클라이언트가 자신의 콘텐츠가 페이지에 어떻게 매핑되는지 볼 수 없다면, 페이지의 목적이 명시된 적이 없기 때문에 계속해서 레이아웃 변경을 요청할 것입니다. 모호한 요청을 받으면 감사에서 페이지의 목적으로 돌아가세요. '이 페이지는 견적 요청을 받도록 설계되었습니다. 펄스 로고는 그 목표를 진전시키지 못합니다. 대신 고정 견적 버튼을 넣죠.'

이것이 정직한 절충입니다. 맞춤 제작은 거의 무한한 유연성을 제공하지만 그 유연성에는 비용이 따릅니다: 런칭 후의 모든 변경이 변경 명령(change order)이 되고, 사이트는 비즈니스 목표에서 벗어날 수 있습니다. 잘 선택된 모듈형 섹션이 있는 템플릿은 콘텐츠 감사에 맞춰 선택했다면 새 블록을 더 빠르고 저렴하게 흡수할 수 있습니다. '템플릿이 이걸 할 수 없다'와 '이건 이 페이지에 어울리지 않는다'의 차이를 아세요.

결론

템플릿을 겉모습이 아닌 콘텐츠 우선으로 선택하세요. 인테이크 질문을 실행하세요. 콘텐츠 유형을 매핑하세요. 내부 페이지를 감사하세요. 디자인 패스 전에 콘텐츠 드롭을 하세요. 실제가 아닌 것을 제거하세요. 배운 것을 다음 클라이언트를 위해 저장하세요.

공급업체 사이트가 런칭됩니다. 3개월 후, HVAC 계약자가 찾아옵니다. 같은 프로세스, 새 스프레드시트 탭, 더 빠른 실행. 템플릿은 반복할 수 있는 시작점이 되고, 클라이언트는 실제 콘텐츠를 견딜 수 있는 사이트를 얻습니다.

질문에서 시작하세요. 템플릿은 그 뒤를 따를 것입니다.