건축 & 리모델링

SER & BAT

두 고객층, 하나의 사이트: 개인 고객과 공공 임대주택 기관은 같은 페이지를 읽지 않습니다.

연도
2026
제작 기간
3주
기술 스택
Next.js · React · Tailwind · Vercel
  • 디자인
  • 개발
  • 로컬 SEO
  • B2B·B2C 카피라이팅
https://www.seretbat.fr/
SER & BAT 웹사이트 메인 페이지 — 건축 & 리모델링, Kayzen Web 제작
설립 연도
2008
개 동선, 두 가지 설득 논리
2
Lighthouse SEO
100/100
출발점

해결해야 했던 과제.

배경

SER & BAT는 2008년부터 리옹에서 실내 리모델링을 해 왔습니다. 석고보드 시공, 도장, 욕실, 주방. QUALIBAT(프랑스 건설 품질 인증) 인증을 받았으며, ICF Habitat, SACVL 같은 공공·기관 임대사업자의 공사도 맡습니다.

제약

두 고객층은 공통점이 전혀 없습니다. 개인 고객은 시공 사례와 공사 기간을 보고 싶어 합니다. 임대사업자는 인증, 기관 레퍼런스, 계약을 끝까지 수행할 역량을 원합니다. 한쪽에만 말하는 사이트는 다른 쪽을 잃습니다.

해법

두 동선으로 확실하게 안내하는 홈, 그리고 서로 다른 두 가지 설득 논리. 개인 고객 쪽은 갤러리와 견적. 기업 고객 쪽은 QUALIBAT 인증, 이름을 밝힌 레퍼런스, 시공 역량. 필요한 증거가 서로 다릅니다.

주장이 아닌 측정

납품 시점에 측정한 점수.

운영 중인 사이트의 Lighthouse 점수입니다. 있는 그대로 공개합니다. 낮은 점수가 있으면 그 원인과 개선 계획을 아래에 적어 두었으며, 감추지 않습니다.

PageSpeed
89
성능: 100점 만점에 89점
92
접근성: 100점 만점에 92점
100
권장사항: 100점 만점에 100점
100
검색엔진 최적화: 100점 만점에 100점
디자인 & 아트 디렉션

모든 선택에는 이유가 있습니다.

  1. 명시된 두 개의 동선

    첫 화면부터 개인인지 기업인지 분명히 고르게 합니다. 방문자의 유형을 추측하는 것은 도박입니다. 직접 물으면 클릭 한 번이면 되고, 엉뚱한 메시지를 피할 수 있습니다.

  2. 디자인 요소가 된 인증

    QUALIBAT는 페이지 하단의 로고가 아니라, 인증이 무엇을 보증하는지 설명하는 블록입니다. 임대사업자는 이것을 읽을 줄 알고, 개인 고객은 읽는 법을 배웁니다.

  3. 이름을 밝힌 기관 레퍼런스

    ICF Habitat와 SACVL을 명시합니다. 건설 B2B 시장에서 이름을 밝힌 레퍼런스 하나는 일반적인 주장 열 개의 가치가 있습니다.

프로젝트 색상 팔레트

  • 인스티튜셔널 블루

    #1F4C73

    아이덴티티, 기업 동선

  • 테라코타

    #B95F33

    행동 유도, 개인 동선

  • 라이트 그레이

    #F3F5F7

    배경

  • 잉크

    #1D2126

    텍스트

타이포그래피 체계

제목용 서체

Outfit 700

본문용 서체

Inter 400

타이포그래피 체계는 그대로 두고 두 가지 강조색으로 동선을 구분합니다. 방문자는 생각하지 않아도 자신이 어디에 있는지 압니다.

엔지니어링

보이지 않는 곳의 기술.

  • Next.js
  • React
  • Tailwind
  • Vercel
  1. 두 개의 문의 퍼널

    개인용 양식은 공간과 면적을, 기업용 양식은 계약 유형과 물량을 묻습니다. 하나의 양식이었다면 양쪽 모두에 맞지 않았을 것입니다.

검색엔진 최적화

사이트가 검색되는 방식.

  1. B2C와 B2B 검색어 분리

    한쪽은 “리옹 아파트 리모델링”, “리옹 7구 석고보드 시공”, 다른 쪽은 “리옹 사회주택 임대사업자 리모델링 업체”, “론(Rhône) QUALIBAT 석고 미장”.

  2. 업력 표시

    “2008년부터”를 제목과 마크업에 넣었습니다. 설립 3년 차 업체가 흔한 시장에서 업력은 사람들이 명시적으로 찾는 견실함의 신호입니다.

사이트 구조

납품한 결과물.

  • 홈 — 동선 안내
  • 개인 고객 — 시공 사례와 견적
  • 기업 고객 — 인증과 레퍼런스
  • 시공 항목
  • 2008년부터 이어 온 회사
  • 문의
방법론

프로젝트 진행 과정.

  1. 고객 세분화

    두 고객층, 두 가지 증거 묶음.

  2. 디자인

    첫 화면 안내, 색으로 구분한 동선.

  3. 개발

    각자에게 맞춘 두 개의 문의 퍼널.

  4. SEO

    B2C·B2B 검색어, 업력과 인증 마크업.

질문

자주 받는 질문.

클릭 한 번의 비용으로 트래픽의 50%에게 엉뚱한 설득 논리를 보여 주는 일을 막습니다. 기준이 정반대인 두 부류를 설득해야 하는 사이트에서 이는 아주 좋은 거래입니다.

같은 수준의 기준을, 귀하의 사이트에도.

현재 사이트 무료 진단, 24시간 이내 견적, 그리고 방금 읽으신 것과 같은 서면 분석을 제공합니다. 3회 무이자 분할 결제가 가능하며, 이용 가능한 지역 지원금은 계약 전에 확인합니다.

공유