김 컴퓨터

개발자를 위한 SEO: 검색엔진 최적화

SEO(Search Engine Optimization)는 구글이나 네이버 같은 검색엔진이 내 웹사이트를 잘 찾고, 상위권에 노출시켜주도록 코드를 최적화하는 작업입니다.

개발자에게 SEO란 "검색 로봇(Crawler)이 읽기 쉬운 코드를 작성하는 것"입니다.

1. 시맨틱 태그 (Semantic HTML) 준수

검색 로봇은 디자인을 보지 못하고, 오직 태그만 봅니다. 의미에 맞는 태그를 써야 로봇이 콘텐츠의 중요도를 파악합니다.

나쁜 예: 모든 요소를 <div>로 도배하기
좋은 예:
- 로고와 메뉴는 <header>, <nav>
- 주요 내용은 <main>, <article>
- 제목은 계층 구조에 맞게 <h1> → <h2> → <h3> 순서대로 사용

2. 메타 태그 (Meta Tags)와 오픈 그래프

HTML <head> 영역에 사이트의 신분증을 만들어주는 작업입니다.

<head>
    <meta name="description" content="파이썬과 AI를 다루는 개발자 블로그입니다.">

    <meta property="og:title" content="내 웹사이트 제목">
    <meta property="og:image" content="썸네일_이미지.jpg">
</head>

3. 웹 성능 (Performance)과 Core Web Vitals

구글은 "느린 사이트"를 싫어합니다. 로딩 속도는 랭킹의 중요한 요소입니다.

이미지 최적화: 너무 큰 이미지는 용량을 줄여서(webp 등) 사용합니다.
불필요한 JS 줄이기: 스크립트가 무거우면 화면이 늦게 뜹니다.

4. 로봇 제어 (Robots.txt & Sitemap)

robots.txt: 크롤러에게 "이 페이지는 가져가도 되고, 저 페이지(관리자 페이지 등)는 가져가면 안 돼"라고 규칙을 정해주는 파일입니다.
sitemap.xml: 우리 사이트의 지도입니다. 크롤러가 길을 잃지 않도록 모든 페이지 목록을 제공합니다.

요약: 개발자의 SEO 체크리스트

[ ] 의미에 맞는 HTML 태그를 사용했는가? (h1, nav, footer 등)
[ ] title과 meta description을 페이지마다 다르게 설정했는가?
[ ] 이미지에 alt(대체 텍스트) 속성을 빠짐없이 넣었는가?
[ ] 사이트 로딩 속도가 충분히 빠른가?