블로그 SEO 개선 작업

블로그 작업이 마무리 단계에 접어들면서, 이제 본격적으로 검색 엔진 노출에 집중해야 할 때가 왔습니다. 아무리 좋은 콘텐츠를 만들어도 사람들이 찾을 수 없다면 의미가 없으니까요!

이 작업이 끝나면 재밌는 포스트를 작성하면서 틈틈히 코드 개선에 신경써야 할 것 같습니다. 솔직히 지금 마음이 상당히 불편한데, 일부러 불편한 코드들을 한 달 가까이 방치중입니다.

저는 매번 쓸데없이 완성하기 직전에 코드가 마음에 안 들면 당장 그것부터 치우려는 버릇이 있는데, 이번 기회에 한번 고쳐보려고 블로그가 마무리되기 전까지는 최대한 참아왔습니다.

다음은 이번 블로그에 개선된 내용입니다.

SEO 최적화 시스템: 검색엔진 최적화를 위한 포괄적인 SEO 기능 구현
- robots.txt 동적 제공 (/robots.txt 경로로 접근 가능)
- sitemap.xml 자동 생성 (모든 발행된 게시글과 주요 페이지 포함)
- 메타 태그 최적화: Open Graph, Twitter Card, Canonical URL 지원
- 이미지 SEO: 모든 썸네일 이미지에 의미있는 alt 태그 적용
SEO 모듈: SEO 관련 기능을 전담하는 새로운 모듈 추가
- SeoModule: SEO 기능들을 모듈화하여 관리
- SitemapController: sitemap.xml과 robots.txt 동적 제공
- PostsSharedService.getPublishedPosts(): 발행된 게시글 조회 메서드
뷰 헬퍼 함수: SEO를 위한 새로운 헬퍼 함수 추가
- originalUrlHelper: 현재 페이지의 완전한 URL 생성 (프로토콜 포함)
- 프로토콜, 호스트 자동 감지로 개발/프로덕션 환경 호환

메타 태그 시스템: 레이아웃 템플릿에 포괄적인 메타 태그 추가
- Canonical URL: 중복 콘텐츠 방지
- Open Graph: Facebook, 카카오톡 등 소셜 미디어 링크 미리보기 최적화
- Twitter Card: Twitter 링크 공유 최적화 (동적 카드 타입 지원)
이미지 컴포넌트: 모든 이미지에 alt 태그 적용
- 게시글 썸네일: "게시글 제목 - 썸네일" 형식
- 시리즈 썸네일: "시리즈명 시리즈 - 썸네일" 형식
- 접근성 향상 및 검색엔진 최적화
동적 메타데이터: 페이지별 맞춤형 메타데이터 지원
- 게시글 페이지: 제목, 요약, 썸네일 이미지 자동 설정
- 시리즈 페이지: 시리즈명, 설명, 썸네일 자동 설정
- Twitter Card 타입 동적 선택 (summary/summary_large_image)

📑 다른 변경사항