웹사이트에 블로그를 추가하는 방법: 선택지, SEO, 설정

웹사이트에 블로그를 추가하려면, 먼저 글을 어떻게 쓸지 정하세요. 프로젝트의 Markdown 파일로 쓸지(본인이나 개발자가 글을 쓰는 경우), 비개발자가 쓸 관리자 에디터가 있는 데이터베이스로 쓸지, 아니면 완전한 편집 도구를 원하면 CMS를 쓸지 고르세요. 그다음 메인 도메인의 /blog에 목록 페이지, 글마다 하나의 페이지, RSS 피드를 만듭니다. 검색엔진을 위해서는 각 글이 고유한 제목, 설명, 공유 이미지를 가진 실제 HTML로 제공되고 사이트맵에 포함되어야 합니다. AI 앱 빌더로 이 중 어떤 방식이든 프롬프트 하나로 만들 수 있습니다. 어떤 방식을 고를지는 대부분 누가 글을 쓸지에 따라 달라집니다.

글을 쓰는 방식 고르기

이 결정이 가장 중요합니다. 기술적인 선택은 여기서 따라옵니다.

판단 기준: 일반 텍스트 파일에 글을 쓰는 것이 편하다면 Markdown이 가장 간단하고 빠르게 제공됩니다. “커밋”이나 “재배포”라는 말 때문에 본인이나 팀이 글쓰기를 망설이게 된다면, 에디터 방식을 고르세요.

하위 폴더 또는 서브도메인

• 하위 폴더(example.com/blog): 사이트 하나, 디자인 하나, 분석 도구 하나로 관리하고, 순위를 올리고 싶은 페이지와 같은 도메인에 글이 놓입니다. 대부분의 비즈니스에 가장 단순한 방식입니다.
• 서브도메인(blog.example.com): 블로그가 메인 사이트 아래에서 제공할 수 없는 다른 플랫폼에서 운영될 때 필요합니다.

제품 사이트 안에 블로그를 직접 넣을 계획이라면 하위 폴더를 사용하세요.

블로그에 필요한 것

• 글 목록 페이지: 제목, 날짜, 짧은 요약, 페이지네이션 포함.
• 글 페이지: 읽기 편한 너비(한 줄에 대략 60~80자), 명확한 제목 계층, 좋은 이미지 처리.
• 깔끔한 URL: /blog?id=17이 아니라 /blog/how-to-choose-a-caterer처럼.
• 글마다 제목과 메타 설명, 그리고 공유된 링크에 제대로 된 미리보기가 뜨도록 Open Graph 태그.
• 모든 글의 사이트맵 항목, 그리고 독자와 뉴스레터 도구를 위한 RSS 피드.
• 작성자와 날짜, 수정했을 때는 “수정일”.
• 글이 충분히 쌓이면 카테고리나 태그.
• 미완성 글이 공개되지 않도록 초안 기능.

SEO: 글을 실제 페이지로 만들기

최근 도구로 만든 많은 사이트는 단일 페이지 앱입니다. 브라우저가 자바스크립트를 내려받아 페이지를 그리는 방식이죠. 앱에는 괜찮지만, 블로그는 검색과 링크 미리보기에 의존합니다. 브라우저에서만 그려진 페이지는 일부 크롤러와 소셜 미리보기가 읽기 어렵습니다. 블로그라면 글을 미리 렌더링(사이트 빌드 시 HTML로 생성)하거나 서버 렌더링하도록 요청하세요. 그래야 모든 글 URL이 본문, 제목, 설명을 즉시 담은 상태로 응답합니다.

제목, 사이트맵, 구조화 데이터를 더 자세히 알고 싶다면 AI로 만든 웹사이트의 SEO 가이드를 참고하세요.

프롬프트 예시

Markdown 블로그:

/blog에 블로그를 추가해 주세요. 각 글은 content/blog 폴더의 Markdown 파일이며, 파일 상단에 제목, 설명, 날짜, 선택 사항인 커버 이미지를 둡니다. 목록 페이지(최신순, 페이지당 10개)와 /blog/[slug] 경로의 글 페이지를 만들고, 모든 블로그 페이지를 정적 HTML로 미리 렌더링해서 각 글이 고유한 제목, 메타 설명, Open Graph 태그를 갖게 해 주세요. 글을 sitemap.xml에 추가하고 /blog/rss.xml에서 RSS 피드를 생성해 주세요.

에디터가 있는 블로그:

글을 데이터베이스에 저장하는 블로그를 추가해 주세요. 필드는 제목, 슬러그, 요약, 본문(Markdown), 커버 이미지, 상태(초안 또는 게시), 게시일입니다. 비밀번호로 보호되는 관리자 영역에서 글을 만들고, 수정하고, 미리보기하고, 게시할 수 있게 해 주세요. 커버와 본문 이미지는 업로드할 수 있어야 합니다. /blog에는 게시된 글만 보여 주고, 각 글 페이지는 고유한 제목과 메타 설명을 가진 상태로 서버에서 렌더링해 주세요.

다듬기:

블로그 글 레이아웃을 개선해 주세요. 읽기 편한 너비, 더 넓은 줄 간격, 스타일이 적용된 제목, 코드 블록, 인용문, 반응형 이미지, 글 하단의 “이전 글 / 다음 글” 링크를 넣어 주세요. 사이트의 기존 색상과 글꼴은 그대로 유지해 주세요.

단계별 진행

1. 누가 쓸지 정하기. Markdown, 데이터베이스 + 에디터, CMS 중에서 고르세요.
2. URL 구조 정하기. /blog와 /blog/post-slug.
3. 목록 페이지와 글 페이지 만들기. 위의 레이아웃 기본 사항을 적용하세요.
4. 글마다 메타데이터 넣기. 제목, 설명, 공유 이미지, 날짜.
5. 크롤링 가능하게 만들기. 글을 미리 렌더링하거나 서버에서 렌더링하고, 글 페이지의 소스 보기로 확인하세요. 본문 텍스트가 거기 있어야 합니다.
6. 사이트맵과 RSS 피드 추가.
7. 이미지 처리. 압축하고, 크기를 지정하고, 대체 텍스트(alt)를 넣으세요. 에디터를 쓴다면 업로드 파일은 파일 스토리지에 저장하세요(파일 업로드 추가 방법 참고).
8. 출시 전에 글 두세 개 쓰기. 블로그가 비어 보이지 않도록 하세요.
9. 게시한 뒤 Google Search Console에 사이트맵 제출.

자주 하는 실수

• 아무도 쓰지 않을 설정을 고르는 경우. 팀원이 파일을 건드리지 않을 팀이라면 Markdown 블로그는 비어 있게 됩니다.
• 브라우저에서만 렌더링되는 글. 공유하면 미리보기가 비어 보이고, 검색엔진이 볼 수 있는 내용도 줄어듭니다.
• 모든 글에 같은 제목과 설명. 글마다 고유해야 합니다.
• 게시 후 슬러그 변경. 링크가 깨집니다. 꼭 바꿔야 한다면 리디렉션을 추가하세요.
• 압축되지 않은 큰 이미지. 모든 글을 느리게 만듭니다.
• 초안 기능 없음. 작성 중인 글이 실수로 공개됩니다.
• 고객의 질문이 아니라 나 자신에 대해 쓰는 경우. 유용한 답변이 방문을 부르고, 공지만으로는 방문이 거의 늘지 않습니다.

체크리스트

• 글 쓰는 방식이 실제로 글을 쓸 사람에 맞음
• 블로그가 메인 도메인의 /blog에 있음
• 글마다 깔끔하고 안정적인 URL
• 글마다 고유한 제목, 설명, 공유 이미지
• 글 HTML에 전체 본문이 포함됨(소스 보기로 확인)
• 사이트맵과 RSS 피드에 게시된 모든 글 포함
• 초안은 비공개로 유지
• 이미지는 압축되고 대체 텍스트 포함
• 출시 전에 글 몇 개 작성

Mythex에서 블로그 추가하기

Mythex에서는 채팅으로 두 가지 블로그 중 어느 쪽이든 추가할 수 있습니다. 에디터 기반 블로그라면 글은 프로젝트의 데이터베이스에, 이미지는 파일 스토리지에 저장되며, 앱에 필요할 때 Mythex가 이를 활성화합니다. Mythex 문서에 따르면 새 앱의 기본값은 종종 Vite 단일 페이지 앱이라서 서버 렌더링이나 정적 HTML보다 SEO가 약합니다. 그러니 블로그라면 글 페이지를 미리 렌더링하거나 정적으로 만들어 달라고 요청하거나 Next.js 설정을 요청하세요. 자세한 내용은 게시된 앱의 SEO를 참고하고, 변경 후에는 다시 게시하세요.

처음부터 시작하신다면 AI로 웹사이트 만들기와 소규모 비즈니스 웹사이트 만들기를 참고하세요.

자주 묻는 질문