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

웹사이트는 화면만 완성되었다고 끝나지 않습니다. 검색엔진, 소셜 미리보기, 보안 헤더, 모바일 브라우저 색상, 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로 보안 헤더 확인

모바일 실제 기기에서 확인

듀오랩스가 보는 관점

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