RSS
전체 글

웹사이트를 공개하기 전 확인해야 할 기본 체크리스트

웹사이트는 화면만 완성되었다고 끝나지 않습니다. 검색엔진, 소셜 미리보기, 보안 헤더, 모바일 브라우저 색상, robots, sitemap 같은 메타 계층이 함께 준비되어야 안정적으로 공개할 수 있습니다.

왜 웹 기본기가 중요한가

앱스토어에 앱을 올릴 때 이름, 설명, 스크린샷, 권한, 개인정보 처리방침을 챙기듯 웹에도 비슷한 준비가 필요합니다.

웹 기본기가 부족하면 다음 문제가 생길 수 있습니다.

  • 검색에 잘 노출되지 않는다.
  • 카카오톡이나 슬랙에 링크를 붙였을 때 미리보기가 이상하다.
  • 브라우저 탭 아이콘이 비어 있다.
  • 보안 정책이 약해 스크립트 삽입 위험이 커진다.
  • 검색엔진이 사이트 구조를 이해하지 못한다.

필수 체크리스트

1. 타이틀과 메타 설명

각 페이지의 title과 description은 검색 결과와 공유 미리보기에 영향을 줍니다. 모든 페이지가 같은 제목을 쓰지 않도록 주의해야 합니다.

2. OG 이미지와 소셜 미리보기

Open Graph 태그를 설정하면 링크 공유 시 제목, 설명, 이미지가 카드 형태로 표시됩니다. 서비스의 첫인상을 좌우하므로 반드시 확인해야 합니다.

3. 파비콘과 앱 아이콘

브라우저 탭, 북마크, 모바일 홈 화면에서 보이는 아이콘입니다. 작지만 브랜드 신뢰감에 영향을 줍니다.

4. sitemap과 robots

sitemap은 검색엔진에 사이트 구조를 알려주고, robots는 크롤링 정책을 안내합니다. 공개 페이지와 비공개 페이지를 구분하는 데 중요합니다.

5. 구조화 데이터

JSON-LD 같은 구조화 데이터는 검색엔진과 AI가 사이트 성격을 이해하는 데 도움을 줍니다.

6. 보안 헤더

CSP, X-Content-Type-Options, Referrer-Policy, Permissions-Policy 같은 헤더는 기본 보안 수준을 높입니다. 특히 CSP는 외부 스크립트와 iframe 허용 범위를 명확히 제한합니다.

7. 모바일과 다크모드

theme-color, viewport, 터치 영역, 모바일 레이아웃을 확인해야 합니다. 데스크톱에서는 괜찮아도 모바일에서 깨지는 경우가 많습니다.

공개 전 검증 방법

  • 실제 도메인에서 접속해보기
  • 카카오톡/슬랙/디스코드에 링크 붙여보기
  • Google Search Console 등록
  • Lighthouse 또는 PageSpeed Insights 점검
  • curl로 보안 헤더 확인
  • 모바일 실제 기기에서 확인

듀오랩스가 보는 관점

웹사이트 품질은 디자인뿐 아니라 보이지 않는 메타 계층에서 완성됩니다. 작은 회사 사이트일수록 기본기를 잘 챙기는 것만으로도 신뢰도가 크게 올라갑니다.