2010년에 만든 홈페이지를 지금까지 쓰고 있는 회사가 있었습니다. 소스를 열어보니 화면 전체가 테이블 태그로 짜여 있고, 글자 하나 옮기려면 표 구조 전체가 흔들렸습니다. 모바일에서는 아예 PC 화면이 그대로 축소돼서 나왔습니다. 오래된 사이트를 리뉴얼할 때 가장 큰 착각은 “디자인만 새로 입히면 된다”는 생각입니다. 실제로는 화면을 짜는 방식 자체가 바뀌어야 합니다.
테이블 태그 기반 사이트, 왜 지금 문제가 되는가
2010년대 초반까지는 표(<table>) 태그로 레이아웃을 짜는 방식이 흔했습니다. 당시에는 문제가 없었지만, 지금 기준으로는 다음과 같은 한계가 있습니다.
- 모바일 화면에 맞춰 레이아웃이 자동으로 재배치되지 않음(반응형 불가능)
- 구조와 디자인이 뒤섞여 있어 문구 하나 수정에도 레이아웃이 깨짐
- 검색엔진이 콘텐츠의 의미 구조(제목, 본문, 목록)를 파악하기 어려움
- 화면낭독기 등 보조 기술이 콘텐츠 순서를 정확히 인식하지 못함
- 코드량이 많아 로딩 속도가 느리고 유지보수 시 수정 범위를 예측하기 어려움
이런 사이트는 겉보기에는 “옛날 느낌”만 문제로 보이지만, 실제로는 검색 유입과 모바일 사용성에서 이미 손해를 보고 있는 경우가 많습니다.
리뉴얼 전 반드시 진단해야 할 3가지
| 진단 항목 | 확인 방법 | 발견되는 문제 |
|---|---|---|
| 레이아웃 구조 | 페이지 소스보기로 table 태그 중첩 정도 확인 | 표 태그 3중 이상 중첩된 구조 발견 |
| 모바일 대응 여부 | 휴대폰으로 접속해 화면 확대·이동 필요 여부 확인 | PC 화면이 그대로 축소되어 글자가 안 보임 |
| 콘텐츠·디자인 분리 여부 | 텍스트 하나만 수정 요청 시 소요 시간 확인 | 수정 하나에 레이아웃 전체 확인이 필요 |
진단 결과 이 세 가지가 모두 “문제 있음”으로 나온다면, 부분 수정보다 구조 전체를 새로 짜는 리뉴얼이 장기적으로 더 경제적입니다.
무엇이 바뀌는가: 구조와 표현의 분리
최신 웹표준 방식의 핵심은 콘텐츠 구조(의미)와 화면 표현(디자인)을 분리하는 것입니다.
- 제목은 제목 태그로, 목록은 목록 태그로, 표는 실제 표 데이터에만 사용
- 디자인(색상, 배치, 여백)은 별도 스타일 파일에서 관리
- 화면 크기에 따라 레이아웃이 자동으로 재배치되는 반응형 구조 적용
- 콘텐츠 순서가 검색엔진과 화면낭독기 모두에게 논리적으로 전달됨
이렇게 바뀌면 이후 문구나 이미지를 수정할 때 레이아웃이 깨지는 일이 크게 줄고, 페이지를 새로 추가할 때도 기존 구조를 재사용할 수 있어 유지보수 속도가 빨라집니다.
리뉴얼 방식 선택: 전면 재구축 vs 단계적 전환
규모와 예산에 따라 접근 방식을 다르게 선택할 수 있습니다.
| 방식 | 적합한 상황 | 주의점 |
|---|---|---|
| 전면 재구축 | 사이트 규모가 작거나, 콘텐츠도 함께 정리하려는 경우 | 콘텐츠 이전·정리에 시간이 소요됨 |
| 단계적 전환 | 페이지 수가 많고 운영을 중단할 수 없는 경우 | 신구 페이지가 공존하는 기간 URL 관리 필요 |
| 핵심 페이지 우선 전환 | 메인·주요 유입 페이지만 먼저 개선하려는 경우 | 나머지 페이지와의 디자인 일관성 검토 필요 |
페이지 수가 수백 개를 넘는 경우라면 전면 재구축보다 유입이 많은 페이지부터 단계적으로 전환하는 방식이 리스크를 줄입니다. 우선순위는 주차별 스코프 세분화 방식으로 나누면 관리가 쉬워집니다.
리뉴얼 시 검색 유입을 지키는 방법
리뉴얼 과정에서 가장 흔한 실수는 URL 구조를 통째로 바꿔버려 기존에 쌓인 검색 유입을 잃는 것입니다. 이를 방지하려면 아래를 반드시 지켜야 합니다.
- 기존 URL 목록 전체 백업 — 리뉴얼 전 모든 페이지 URL을 정리
- URL 변경이 불가피하면 리다이렉트 설정 — 옛 URL 접속 시 새 URL로 자동 연결
- 기존 페이지 제목·설명 태그 최대한 유지 또는 개선
- 리뉴얼 완료 후 검색엔진에 변경사항 재수집 요청
이 절차를 건너뛰면 리뉴얼 직후 몇 주간 검색 유입이 급격히 줄어드는 현상이 나타날 수 있습니다. 오픈 후 점검 항목은 크롤링 누락 방지 체크리스트를 함께 확인하세요.
콘텐츠 이전 시 놓치기 쉬운 것들
디자인과 구조만 바꾼다고 끝나는 것이 아닙니다. 콘텐츠 이전 과정에서 다음을 함께 점검하세요.
- 오래된 게시판 글의 첨부파일·이미지 링크가 새 구조에서도 정상 작동하는지
- 과거에 쌓인 게시글·상품 데이터의 인코딩(글자 깨짐) 문제 여부
- 연락처·주소 등 오래된 정보가 최신 상태로 갱신됐는지
- 기존에 있던 팝업·이벤트성 콘텐츠 중 계속 필요한 것과 삭제할 것을 구분
오래된 사이트는 콘텐츠 자체도 함께 오래된 경우가 많아, 리뉴얼을 계기로 불필요한 콘텐츠를 정리하는 작업을 병행하면 효과가 큽니다.
리뉴얼 후 다시 예전 방식으로 돌아가지 않으려면
리뉴얼을 마쳤어도 이후 운영 방식이 바뀌지 않으면 몇 년 뒤 같은 문제가 반복됩니다. 다음을 습관화하세요.
- 콘텐츠 등록은 관리자 화면(에디터)을 통해서만 진행하고, 소스코드를 직접 수정하지 않기
- 디자인 변경이 필요할 때는 개별 페이지가 아니라 공통 스타일에서 수정하기
- 정기적으로(연 1회 이상) 모바일 화면과 로딩 속도를 재점검하기
구조가 잘 짜여 있어도 운영 습관이 예전 방식으로 돌아가면 다시 유지보수가 어려운 사이트가 됩니다. 리뉴얼과 함께 비전문가도 쉽게 업데이트 가능한 CMS 세팅을 함께 검토하면 이런 문제를 예방할 수 있습니다. 진단이 필요하다면 무료 견적요청으로 현재 사이트 구조를 점검받아보세요.
자주 묻는 질문 (FAQ)
지금 사이트가 잘 보이는데도 리뉴얼이 꼭 필요한가요? +
PC에서 잘 보인다고 해서 문제가 없는 것은 아닙니다. 모바일 사용자 비중이 높은 요즘 환경에서는 반응형 대응 여부가 실제 이탈률과 검색 노출에 큰 영향을 줍니다. 페이지 소스에 표 태그 레이아웃이 많다면 조만간 문제가 드러날 가능성이 높습니다.
리뉴얼하면 기존에 쌓인 검색 유입이 사라지나요? +
URL 구조를 유지하거나 적절한 리다이렉트를 설정하면 유입을 대부분 유지할 수 있습니다. 다만 준비 없이 URL을 전부 바꾸면 일시적으로 유입이 크게 줄고 회복에 몇 주에서 몇 달이 걸릴 수 있습니다.
전체 페이지를 다 리뉴얼해야 하나요, 일부만 해도 되나요? +
유입이 많은 핵심 페이지부터 우선 진행하는 것도 충분히 유효한 전략입니다. 다만 신구 디자인이 오래 공존하면 브랜드 일관성이 떨어질 수 있으므로, 전환 완료 목표 기간을 정해두는 것이 좋습니다.
리뉴얼 기간은 보통 얼마나 걸리나요? +
페이지 수와 콘텐츠 이전 범위에 따라 다르지만, 중소 규모 사이트는 4~8주 정도가 일반적입니다. 콘텐츠 정리와 데이터 이전에 걸리는 시간이 전체 일정의 상당 부분을 차지하는 경우가 많습니다.
리뉴얼 후 다시 관리하기 어려운 구조가 되면 어떻게 하나요? +
리뉴얼 계약 시점에 "콘텐츠 등록·수정은 비전문가도 관리자 화면에서 가능해야 한다"는 요건을 명시하는 것이 좋습니다. 이 기준이 없으면 구조는 최신이지만 운영은 여전히 개발자에게 의존하는 결과가 될 수 있습니다.