중고 산업장비 B2B 카탈로그 사이트 리뉴얼 사례

중고 산업장비를 매매하고 렌탈하고 정비까지 안내하는 사이트를 리뉴얼했습니다. 방문자가 결제까지 마치는 쇼핑몰이 아니라 매물을 확인한 뒤 전화나 문의로 이어지는 상담형 구조를 목표로 잡았습니다. 기존 사이트는 게시판형 홈페이지 솔루션 위에 매물을 게시글로 얹어 놓은 방식이라 관리와 검색 노출 모두 한계가 뚜렷했고, 제작 이후에도 매물 정보가 계속 바뀌고 문의가 쌓이는 것을 전제로 운영자가 직접 관리할 수 있는 화면까지 다시 설계했습니다.

호박지게차산업

경기도 오산에 위치한 중고지게차 전문 업체로, 두산·현대·클라크 등 다양한 브랜드의 톤수별 중고지게차 매매와 매입을 진행합니다. 단기·장기 렌탈 서비스와 정비·A/S까지 함께 제공해 지게차 운영을 한 곳에서 지원합니다.

사이트 바로가기

리뉴얼 전후 구조 비교

어떤 부분을 어떻게 바꿨는지 영역별로 정리하면 다음과 같습니다. 표에서 큰 방향을 확인한 뒤, 각 처리 내용은 이어지는 항목에서 자세히 다룹니다.

게시글로 관리하던 매물을 제품 카탈로그로

흩어진 스펙을 정해진 항목으로 정리

이전 사이트는 매물을 별도 카탈로그가 아니라 게시판 글로 등록하는 방식이었습니다. 톤수 분류는 게시판 카테고리 번호로 처리되어 있었고, 브랜드와 연식, 연료, 상태 같은 스펙은 정해진 항목이 아니라 게시글 본문이나 여분 필드 여기저기에 흩어져 있었습니다. 주소 형식도 게시판 글 번호를 그대로 쓰는 구조라 공유하거나 검색 결과에 노출되기에는 불리했습니다.

이번 작업에서는 매물을 제품코드와 브랜드, 톤수, 연료, 상태를 정해진 값으로 관리하는 데이터베이스 항목으로 옮겼습니다. 주소도 사람이 읽었을 때 어떤 매물인지 짐작할 수 있는 형태로 정리해, 게시글 하나하나를 따로 손보던 방식에서 벗어났습니다.

목록과 상세 페이지의 정보 위계

매물 목록은 톤수와 연료 방식, 브랜드처럼 현장에서 실제로 쓰는 기준으로 걸러볼 수 있게 짰습니다. 상세 페이지에서는 사진과 스펙, 판매 상태를 한 화면에서 확인하도록 배치를 정리했고, 정보량이 많은 항목일수록 위쪽에 두어 훑어보는 것만으로 핵심을 파악할 수 있게 했습니다.

관심 매물에서 매매 문의와 렌탈 문의로 이어지는 버튼은 상세 페이지 상단과 하단에 각각 배치했습니다. 스크롤을 많이 내린 방문자도 다시 위로 올라가지 않고 바로 문의로 넘어가도록 동선을 짧게 잡았습니다.

결제 화면 없이 상담으로 연결하는 방식

일반적인 쇼핑몰이라면 당연히 있어야 할 장바구니와 결제 화면은 이 사이트에 두지 않았습니다. 가격은 매물 특성상 조건에 따라 달라지기 때문에 화면에 공개하지 않고, 상담을 거쳐 안내하는 방식을 그대로 반영했습니다.

불필요한 쇼핑 화면을 걷어낸 자리에는 회사 소개와 렌탈, 정비 안내, 공지, 자주 묻는 질문을 한 사이트 안에서 이동할 수 있게 배치했습니다. 자주 묻는 질문은 클릭하면 펼쳐지는 형태로 구성해 페이지를 길게 늘어뜨리지 않고도 필요한 항목만 찾아볼 수 있게 했고, 이 구조는 모바일에서도 동일하게 동작합니다.

화면과 디자인 정리

PC와 모바일을 따로 관리하던 방식에서 하나로

기존에는 PC용 화면과 모바일용 화면이 서로 다른 폴더에 별도로 존재했습니다. 문구 하나를 바꾸려면 두 화면을 각각 손봐야 했고, 메뉴는 이미지 파일로 되어 있어 텍스트 검색이나 화면 확대가 되지 않는 구조였습니다.

지금은 하나의 화면 구조로 데스크톱과 모바일을 모두 대응하도록 바꿨습니다. 헤더와 푸터, 퀵메뉴 같은 공통 요소를 한 번만 수정하면 양쪽 화면에 그대로 반영되기 때문에, 콘텐츠를 두 번 관리해야 하는 부담이 사라졌습니다.

이미지 메뉴와 표 목록에서 카드형 화면으로

메뉴 제목이 이미지 파일로 되어 있다 보니 검색이나 확대가 되지 않았고, 목록 화면도 오래된 표 형태를 그대로 쓰고 있어 PC와 모바일 디자인이 서로 다르게 보였습니다.

디자이너가 만든 시안을 기준으로 카드형 매물 목록과 텍스트 기반 메뉴로 전면 교체했습니다. 헤더와 푸터, 카드, 버튼 같은 화면 요소를 같은 규칙으로 통일해 두어, 나중에 새 페이지를 추가하더라도 같은 부품을 가져다 쓰면 되도록 정리했습니다.

문의 접수와 관리자 운영

흩어져 있던 문의 창구 통합

렌탈 문의와 매입 견적, 공지, 일반 문의가 각각 다른 게시판으로 나뉘어 있어 방문자 입장에서는 어디에 남겨야 할지 헷갈리는 구조였습니다. 담당자 입장에서도 문의가 여러 게시판에 흩어져 있어 확인하는 데 손이 많이 갔습니다.

지금은 문의 창구를 하나의 폼으로 통합하고 매물 정보와 연계했습니다. 어떤 매물에 대한 문의인지 함께 넘어가기 때문에 담당자가 문의 목록만 봐도 어느 제품에 대한 연락인지 바로 파악할 수 있습니다. 접수 뒤 안내 화면과 개인정보 동의, 스팸성 문의를 걸러내는 처리까지 폼 하나에 담아 운영자가 별도 도구 없이 문의 관리를 마칠 수 있게 했습니다.

코드 없이 다루는 관리자 화면

이전에는 매물을 등록하는 감각이 게시글을 쓰는 것과 다르지 않았고, 데이터 구조가 명확하지 않아 매물을 옮기거나 분석하기가 까다로웠습니다. 매물 등록과 수정, 분류와 브랜드 관리, 문의 목록 확인, 사이트 환경설정을 관리자가 직접 다루는 화면으로 옮겼습니다. 매물을 등록할 때 채우는 항목은 아래처럼 정해 두어, 담당자가 값만 입력하면 매물 정보가 정리되도록 맞췄습니다.

• 연료 방식과 톤수, 판매 상태처럼 정해진 값 중에서 고르는 항목
• 브랜드와 기종, 연식처럼 매물마다 직접 입력하는 항목
• 대표 사진과 상세 이미지를 순서대로 올리는 이미지 관리

회사 소개나 오시는 길처럼 자주 바뀌지 않는 페이지도 문구를 코드에 박아 두지 않고 콘텐츠 데이터로 분리했습니다. 연락처와 담당자 정보도 여러 화면에 중복으로 적어 두던 방식에서 한 곳에서 관리하도록 바꿔, 한 번만 고치면 사이트 전체에 반영되는 구조로 정리했습니다.

검색 노출과 운영 안정성

페이지 역할을 살린 검색 설정

이전 사이트는 제목이 장식적인 문구로 채워져 있고 메타 요소가 페이지마다 들쭉날쭉해, 검색 결과에서 각 페이지가 무엇을 담고 있는지 드러나지 않았습니다. 매물이 게시글 주소로 노출되다 보니 검색 엔진이 제품으로 인식하기에도 맞지 않았습니다.

이번에는 매물 상세와 안내 페이지마다 제목과 설명을 따로 정리해, 검색 결과에서 각 페이지의 역할이 흐려지지 않도록 했습니다. 검색 엔진이 페이지 성격을 읽을 수 있게 구조화 데이터(JSON-LD)도 넣었는데, 가격을 공개하지 않는 상담형 카탈로그라는 점을 감안해 일반 쇼핑몰에서 쓰는 상품 가격 마크업은 억지로 넣지 않았습니다. 검색 도구에서 불필요한 오류가 뜨는 것을 막기 위한 판단입니다.

회사 소개와 렌탈 정비 안내, 매물 상세 페이지가 서로 다른 화면이면서도 하나의 흐름 안에서 읽히도록 제목 체계와 내부 링크를 맞췄습니다. 어느 페이지로 들어와도 매물 정보와 상담 절차로 자연스럽게 이어집니다.

운영 도구와 업로드 경로 정리

이전 사이트는 데이터베이스 관리 도구가 외부에서 접근할 수 있는 경로에 그대로 노출되어 있었고, 오래된 게시판 에디터를 쓰다 보니 업로드되는 파일 확장자도 느슨하게 관리되고 있었습니다. 설치 과정에서 남은 파일들이 정리되지 않은 채 서버에 남아 있기도 했습니다.

이번에 데이터베이스 관리 도구는 공개 웹에서 접근할 수 없도록 옮기고, 업로드 경로도 허용된 파일만 올라가도록 제한했습니다. 설치 과정에서 남은 파일들도 운영 서버에서 걷어냈습니다. 문자 인코딩이 페이지마다 다르게 섞여 있어 화면이 깨지던 문제도 하나로 통일해 정리했습니다.

공개 후에도 끊기지 않도록 한 처리

이메일 발송 템플릿을 하나로 통일하고, 동시 접속이 몰릴 때 발생하던 데이터베이스 처리 지연은 재시도 로직을 넣어 완화했습니다. 폴더 생성 과정에서 나오던 불필요한 경고 로그도 정리해 실제 오류와 구분되도록 했습니다. 사이트 구조와 데이터베이스 구성을 문서로 남겨 두어, 담당자가 바뀌더라도 인수인계가 끊기지 않도록 준비했습니다.