노션으로 기업 홈페이지 블로그 작성하기: 제하건축사사무소 제작 사례

제하건축은 부산·경남 지역에서 공장·사옥·주거 건축의 기획부터 준공까지 전 과정을 직접 수행하는 설계사무소입니다. 2015년 설립 이래 사업성 검토, 설계, 인허가, 시공 감리, 준공까지 하나의 팀이 끝까지 책임지는 방식으로 일해왔습니다.

홈페이지 의뢰를 받고 가장 오래 고민했던 부분은 디자인이 아니었어요. 훌륭한 포트폴리오를 '누가, 어떻게 블로그 콘텐츠 발행을 할 것인가'였습니다. 디자인과 개발은 제가 맡지만, 새 프로젝트가 완료될 때마다 올라가야 할 콘텐츠는 내부에서 지속적으로 관리해야 했거든요.

고객이 이미 쓰는 도구에 맞추기로 한 결정

프레이머에도 자체 콘텐츠 관리 화면이 있습니다. 다만 전체 화면이 영어로 구성되어 있어서, 디자인 도구에 익숙하지 않은 실무자가 매번 들어와 글을 쓰고 이미지를 올리기에는 허들이 낮지 않습니다. 필드 이름, 버튼, 옵션 설명까지 모두 영어라는 건 생각보다 큰 피로예요. 이게 첫 번째 고민이었습니다.

그래서 방향을 아예 바꿔 잡았습니다. "담당자분이 지금 어떤 도구를 가장 편하게 쓰고 계시지?"

답은 노션이었습니다. 회의록도, 업무 일정도, 고객 리스트도 모두 노션에서 관리되고 있었어요. 그럼 홈페이지 콘텐츠도 처음부터 노션을 원본으로 삼는 게 가장 자연스러운 선택이었습니다. 대안이 아니라, 처음부터 그게 가장 맞는 그릇이었던 거죠.

마침 프레이머가 외부 데이터 연동(API)을 공식으로 지원하고 있어서, 노션에 기록된 내용을 프레이머 쪽으로 자동으로 옮기는 흐름이 기술적으로 충분히 가능하다는 점도 확인했습니다. 그 순간 결정은 심플해졌어요. 프레이머의 영어 관리 화면을 어떻게든 익히게 할 이유 자체가 사라진 겁니다.

고객의 작업 환경을 바꾸는 게 아니라, 제가 만든 시스템을 고객의 환경 안에 끼워 넣는 방향이었어요.

프레이머는 그대로 두고, 노션을 원본으로 만든 방법

구조는 이렇게 잡았습니다.

노션에 프레이머의 프로젝트 데이터베이스와 동일한 구조로 데이터베이스를 하나 만들었습니다. 프로젝트명, 위치, 대표 이미지, 상세 이미지, 규모, 용도, 진행 상태, 본문까지 필드 구성을 그대로 맞췄어요. 그리고 노션의 내용을 프레이머 쪽으로 옮기는 동기화 스크립트를 따로 붙였습니다.

담당자 입장에선 처음 접하는 화면이 하나도 없습니다. 여전히 노션에서 평소처럼 프로젝트 정보를 기록하시고, 발행 상태만 체크하시면 끝이에요. 나머지는 스크립트가 알아서 돌아갑니다.

그 뒤로 카톡이 거의 멈췄어요. "이거 수정해주세요"가 아니라, "새 프로젝트 올렸으니 확인 부탁드려요"라는 공유가 오기 시작했습니다.

만약 그때 "프레이머 관리 화면 쓰시는 법 알려드릴게요"라고 했다면 이 구조는 시작도 못 했을 겁니다. 쓰던 걸 그대로 쓰게 한 게 핵심이었어요.

도구를 바꾸는 일은 생각보다 큰 비용입니다. 고객이 이미 손에 익힌 환경이 있다면, 그 위에 시스템을 얹는 쪽이 서로의 시간을 가장 크게 아끼는 길이었습니다.

검색 엔진과 AI 답변 엔진, 양쪽 모두를 위한 설계

2025년 이후로 홈페이지의 유입 경로는 두 갈래로 나뉩니다. 구글·네이버 같은 검색 엔진에서의 노출(SEO, 검색 엔진 최적화)과, 챗GPT·퍼플렉서티·구글 AI 개요처럼 질문에 직접 답하는 AI 답변 엔진에서의 노출(AEO, 답변 엔진 최적화)입니다. 제하건축처럼 지역·업종·공법이 명확한 사업자일수록 두 경로 모두에서 정확히 발견되는 게 실제 문의 전환에 중요합니다.

프레이머를 선택한 이유 중 하나가 여기에 있었습니다. 프레이머는 공식 문서를 통해 두 영역 모두를 기본기로 설계해두고 있거든요.

프레이머 공식 자료에 따르면, 제목과 설명 태그, 자동 이미지 최적화와 전 세계 배포망, 소셜 공유 미리보기(오픈 그래프), 사이트맵 자동 생성, 색인 제어, 의미 있는 URL 구조가 별도 설정 없이 제공됩니다. 여기에 더해 서버에서 페이지를 미리 그려 보내는 서버 사이드 렌더링을 기본 적용하고 있어, 첫 화면 로드 속도와 검색 봇의 콘텐츠 인식이 함께 좋아집니다. 자동 사이트맵과 검색 봇 제어 파일은 별도 플러그인 없이 생성되고, 구조화된 데이터(JSON-LD) 삽입과 대표 URL 지정도 지원합니다.

제하 홈페이지에는 이 기능들을 모두 활성화하고 실제 값을 채워 넣었습니다. 메인, 소개, 서비스, 진행 프로젝트, 문의 페이지 각각에 지역·업종·키워드가 반영된 고유 제목과 설명을 개별로 작성했고, 각 프로젝트 상세 페이지에는 위치와 용도 정보가 들어간 전용 제목을 붙였어요. 업로드한 프로젝트 사진은 프레이머가 차세대 이미지 포맷으로 자동 변환해 전 세계 배포망으로 송출합니다.

AEO 영역에서는 프레이머 공식 가이드를 보면 아래와 같이 가이드를 주고 있어요.

• 질문을 제목으로 두고, 바로 아래에 한두 문장으로 답을 적고, 그 아래에 스캔 가능한 섹션을 배치하는 구조 추천

• 페이지 하단의 자주 묻는 질문 섹션은 AI 답변 엔진이 개별 답변을 추출하는 진입점으로 작동하므로, 질문마다 인용 가능한 단위의 답을 두는 게 효과적

제하 홈페이지의 주요 페이지와 본 사례 페이지 모두 이 구조를 기준으로 작성했고, 회사 정보와 서비스 페이지에는 구조화된 데이터(JSON-LD)를 추가해 검색 엔진과 AI 답변 엔진이 업종·지역·연락처를 정확히 인식할 수 있도록 했습니다.

디자인과 콘텐츠 운영뿐 아니라 발견성 측면에서도, 고를 수 있는 기본값이 강한 도구로 시작하는 것이 장기적으로 건축주에게 이득이라는 판단이었습니다.

프로젝트 제작 사양

• 클라이언트: 제하건축사사무소 (2015년 설립, 부산·경남 기반 건축설계사무소)

• 사이트 주소: jeha-light.com

• 업종 및 콘텐츠 성격: 건축설계 포트폴리오 사이트 (공장·사옥·주거·상업 건축 프로젝트 공개)

• 주요 페이지 구성: 메인, 회사 소개, 서비스 안내, 진행 프로젝트(포트폴리오), 문의 페이지

• 제작 도구: 프레이머(웹사이트 디자인 및 배포)

• 콘텐츠 관리: 노션을 원본으로 사용. 담당자는 노션에서만 기록하고, 프레이머의 외부 데이터 연동 기능을 통해 홈페이지로 자동 반영

• 주요 기능: 프로젝트 상세 페이지 자동 생성, 프로젝트 이미지 갤러리, 카테고리별 프로젝트 정렬, 문의 폼, 잠재고객 문의시 담당자 메일로 자동발송

• 검색 엔진 최적화(SEO) 적용 사항: 페이지별 제목·설명, 소셜 공유 미리보기, 의미 있는 URL 구조, 자동 사이트맵 및 검색 봇 제어 파일, 색인 여부 제어, 이미지 자동 최적화 및 전 세계 배포망, 서버 사이드 렌더링, SSL 인증서 자동 적용

• 답변 엔진 최적화(AEO) 적용 사항: 질문-답변 구조의 페이지 레이아웃, 구조화된 데이터(JSON-LD), 자주 묻는 질문 섹션, 사이트 루트의 llms.txt 배치

• 운영 방식: 내부 담당자가 익숙한 노션 환경에서만 콘텐츠를 작성·발행 관리하고, 제작사가 동기화와 유지보수, 검색 최적화를 책임지는 구조

자주 묻는 질문

Q. 이 홈페이지는 어떤 도구로 만들어졌나요?

웹사이트 디자인과 배포는 프레이머로 진행했고, 콘텐츠는 노션을 원본으로 관리합니다. 두 도구는 프레이머의 외부 데이터 연동 기능을 통해 연결되어 있어서, 노션에서 작성한 내용이 홈페이지로 자동 반영됩니다.

Q. 고객이 직접 프로젝트를 올리고 수정할 수 있나요?

네, 내부 담당자가 직접 관리합니다. 다만 관리 화면을 새로 배워야 하는 방식이 아니라, 원래 쓰시던 노션에 글을 쓰고 발행 상태만 체크하는 방식이에요. 새 도구 학습 비용이 없기 때문에 실제로 꾸준히 운영이 이어지고 있습니다.

Q. 왜 프레이머 관리 화면을 쓰지 않고 노션으로 연결했나요?

프레이머 자체 관리 화면은 전체가 영어로 구성되어 있습니다. 디자인 도구에 익숙하지 않은 실무자에게는 진입 장벽이 있어요. 담당자분이 이미 노션을 업무 전반에 쓰고 계셨기 때문에, 새 환경을 익히게 하는 대신 익숙한 환경에 홈페이지 콘텐츠를 얹는 방식을 택했습니다.

Q. 프레이머로 만든 사이트는 검색 최적화(SEO)가 잘 되나요?

네, 프레이머는 별도 플러그인 없이도 검색 최적화를 기본 제공합니다. 사이트맵과 검색 봇 제어 파일을 자동 생성하고, 서버에서 페이지를 미리 렌더링해 보내기 때문에 첫 화면 속도와 검색 봇의 콘텐츠 인식이 함께 좋아집니다. 페이지별 제목·설명, 이미지 자동 최적화, 의미 있는 URL 구조도 기본으로 제공됩니다. 제하 홈페이지에도 이 기능을 전부 활성화하고 지역·업종 키워드에 맞춰 값을 채웠습니다.

Q. 챗GPT나 퍼플렉서티 같은 AI 답변 엔진에도 잘 노출되나요?

프레이머는 공식 가이드를 통해 답변 엔진 최적화(AEO)를 위한 페이지 구조를 권장하고 있고, 사이트 루트에 llms.txt 같은 AI 안내 파일을 배치할 수 있도록 공식 지원합니다. 제하 홈페이지에는 질문-답변 구조의 페이지 레이아웃, 구조화된 데이터(JSON-LD), 자주 묻는 질문 섹션, 그리고 llms.txt를 모두 적용했습니다. 그 결과 AI가 "부산 공장 건축 설계사무소"나 "경남 사옥 건축 파트너"를 찾는 질문을 받았을 때 제하건축을 정확한 맥락으로 인용할 수 있는 환경이 됩니다.

Q. 비슷한 방식을 다른 업종에도 적용할 수 있나요?

가능합니다. 노션을 이미 업무 도구로 쓰고 있는 조직이라면, 블로그·포트폴리오·채용 공고·공지사항 등 정기적으로 콘텐츠를 추가해야 하는 페이지는 동일한 구조로 붙일 수 있어요. 법무·의료·교육·건축처럼 실무자가 본업이 따로 있고 홈페이지 관리는 부가 업무인 업종에서 특히 효과가 좋습니다.

Q. 유지보수는 어떻게 이뤄지나요?

콘텐츠 추가·수정은 고객사가 노션에서 직접 처리하고, 디자인 변경·기능 개선·동기화 관리·검색 최적화 점검은 제작사가 담당합니다. 역할 분담이 명확하기 때문에 운영 단계에서 불필요한 커뮤니케이션이 거의 발생하지 않습니다.