Notion으로 코딩 없이 쉽게 웹사이트 만들기

회사 웹사이트, 팀 블로그, 개인 이력서와 포트폴리오를 모두 Notion 사이트에서 만들 수 있어요. 복잡하고 느린 웹 개발 작업은 생략하고 노코드로 웹사이트를 만들어 보세요.

소요 시간: 6분
페이지 게시 - 메인 스크린샷
Notion을 활용해 회사 공개 홈페이지를 구축할 수 있는 여러 방법 중 하나입니다.
가이드
  • 게시하는 방법
  • 웹사이트를 확장할 수 있도록 바로 사용 가능한 템플릿과 영감을 주는 아이디어
  • 템플릿
  • 시각적 요소를 활용해 Notion 페이지에 생생함을 더하세요.
  • 공개 페이지에서 사용할 수 있는 다양한 옵션

회사 웹사이트에 페이지를 추가하는 작업은 디자이너, 엔지니어 그리고 바쁜 일정 사이에서 균형을 맞춰야 하는 지루한 프로세스일 가능성이 높습니다. 정말 간단한 페이지들도 여러 팀을 거쳐 만들어야 하는 일이니까요.

하지만 Notion에서는 클릭 한 번이면 웹으로 페이지를 게시할 수 있습니다. 아래에서 방법을 알아보세요.

  • 개발자 없이도 아름다운 페이지를 구축해 보세요. 수십 개의 임베드와 제목, 열과 같은 도구를 사용할 수 있어 복잡한 콘텐츠 관리 시스템을 구축할 때 종종 필요한 개발자 리소스가 전혀 없이도 시각적으로 풍부한 웹사이트를 만들 수 있습니다.

  • 직접 페이지를 게시하세요. 웹사이트를 구축 또는 확장하기 위해 디자이너, 엔지니어와 씨름할 필요가 없습니다. 어떤 Notion 페이지도 공개 페이지로 쉽고 빠르게 만들 수 있으며 링크를 공유해 페이지를 선보이거나 심지어는 검색 엔진에서 검색되게 만들 수도 있습니다.

게시하는 방법

Notion을 활용하면 몇 번의 클릭만으로 웹사이트를 만들 수 있습니다. 원하는 페이지에서 공유를 클릭하고 게시 탭으로 가서 웹에 게시를 클릭하기만 하면 됩니다. 이 경우, 링크만 있다면 누구나 페이지를 볼 수 있습니다. 또한 페이지를 편집하면 실시간으로 편집한 내용이 반영되어 방문자들에게는 편집된 버전이 표시됩니다. 정말 간편하죠!

웹사이트를 확장할 수 있도록 바로 사용 가능한 템플릿과 영감을 주는 아이디어

아무것도 없이 처음부터 만들고 싶지 않은 사용자분들이 빠르게 페이지를 완성할 수 있도록 출발점으로 사용 가능한 템플릿을 공유합니다. 또한 아이디어를 얻으실 수 있도록 Notion을 활용해 웹사이트를 구축한 회사들의 예시도 공유합니다.

템플릿

채용 보드: 채용 관련 상황은 항상 유동적입니다. 그렇기 때문에 채용이 끝난 직무를 빼고, 새로운 채용 공고를 올리고, 회사 사명을 다시 작성하는 등의 업데이트 사항을 빠르게 반영할 수 있는 채용 보드는 매우 유용합니다. 보는 사람의 시선을 사로잡고 유용한 정보를 담은 채용 보드는 어떤 환경의 회사인지 보여주는 창문의 역할을 합니다.

채용 보드 템플릿을 복사해서 워크스페이스에서 사용해 보세요.

도움말 센터: 고객 서비스 관련 이메일이 쌓이는 것을 줄여줍니다. 여태 받았던 고객 지원 관련 이메일을 살펴보고 가장 많은 질문을 받았던 사항에 대한 답변을 포함한 콘텐츠를 작성해 게시하세요. 고객들이 더 쉽게 찾고 있던 답변을 확인할 수 있습니다.

Notion에서는 이러한 콘텐츠를 하위 페이지에 쉽게 정리하고 필요에 따라 편집할 수 있습니다.

필요할 때 언제나 사용할 수 있는 도움말 센터 템플릿입니다.

블로그 게시물: 커뮤니티를 구축하고 딱딱한 CMS(콘텐츠 관리 시스템)에 의존할 필요 없이 역동적인 콘텐츠를 만들어 보세요. Notion에서 블로그 게시물을 작성하고 깔끔하고 가독성이 좋은 게시물을 만들어 다른 사람들에게 공개할 수 있습니다. 목차, 오디오 파일, 이미지, 동영상과 같은 요소들을 페이지에 바로 임베드할 수 있어 독자들의 집중력이 높아집니다.

블로그 포스트 템플릿으로 당신의 이야기를 들려주세요.

로드맵: 기존 고객뿐만 아니라 잠재 고객과도 공유할 수 있는 제품 로드맵을 활용해 보세요. 로드맵을 게시하면 고객은 어떠한 기능을 지닌 제품을 만나게 될지 파악할 수 있습니다. 심지어는 공개 편집 기능을 켜면 고객이 원하는 기능을 제출하는 것도 가능합니다.

로드맵 템플릿을 복사해 워크스페이스에서 사용해 보세요.

시각적 요소를 활용해 Notion 페이지에 생생함을 더하세요.

페이지에서 /를 입력하면 페이지에 포함할 수 있는 요소의 전체 메뉴가 나타납니다. 해당 요소를 사용하려면 /이미지/typeform과 같이 /를 입력하고 사용하고 싶은 요소의 이름을 입력하세요.

  1. 제목과 줄 바꿈: H1(제목 1), H2(제목 2), H3(제목 3)을 활용해 콘텐츠를 빠르게 파악하고 원하는 내용을 쉽게 찾을 수 있도록 만들어 보세요. 텍스트가 너무 긴 경우에는 대시 기호(—)를 연속적으로 세 개를 입력해 줄 바꿈으로 텍스트를 나눠보세요.

  2. : 한쪽에는 이미지를, 다른 쪽에는 텍스트를 배치해 신문과 같은 느낌이 나는 레이아웃을 활용해 보세요 ⋮⋮ 아이콘으로 드래그 & 드롭하면 Notion 페이지에서 원하는 곳에 페이지, 텍스트, 이미지를 배치할 수 있습니다. 열을 생성하고 싶으면 기존 콘텐츠를 왼쪽이나 오른쪽으로 드래그 & 드롭하세요. 파란 수직선이 나타나 원하는 위치를 찾는데 도움을 줍니다.

  3. 목차: 목차는 사이트에서 독자들이 원하는 섹션으로 바로 넘어갈 수 있게 만들어 줍니다. /목차를 입력하면 섹션을 나누는 제목을 활용한 목차를 생성할 수 있습니다.

  4. 이미지/동영상/오디오: 멀티미디어를 경험할 수 있는 환경을 만들어 보세요. YouTube 동영상을 임베드하거나, 팟캐스트 파일을 업로드하거나, 이미지를 Notion 페이지로 바로 드래그 & 드롭할 수 있습니다. 이미지나 동영상의 측면에 생기는 바를 이용하면 크기도 조정할 수 있습니다.

  5. Typeform 임베드: Typeform을 Notion 페이지에 삽입하면 피드백을 수집하거나 연락처 포털을 만들 수 있습니다.

  6. 콜아웃과 인용: 특정한 섹션이나 문장을 돋보이게 만드는 콜아웃이나 인용을 활용해 보세요. 다른 유명 블로그에서도 흔히 사용하는 기능입니다.

  7. 토글 리스트: 자주 묻는 질문(FAQ)과 같은 콘텐츠의 경우 토글 리스트를 활용해 웹사이트 방문자에게 가장 관련성이 높은 정보만 표시되게 만들면 방문자는 편하게 필요한 내용을 찾을 수 있습니다. 가장 핵심이 되는 정보를 토글의 미리보기에 두고 나머지 내용은 안에다 중첩시켜 두세요.

  8. : 디자인을 원하는 대로 바꾸거나 텍스트 색이나 배경색을 다르게 해서 콘텐츠를 강조해 보세요. 원하는 텍스트를 강조 표시하고 •••을 클릭한 후 을 선택해 원하는 텍스트 색이나 배경색을 선택하세요.

공개 페이지에서 사용할 수 있는 다양한 옵션

검색 엔진 인덱싱 — 트래픽을 늘리고 페이지가 Google과 다른 검색 엔진에서 보일 수 있도록 합니다.

링크 만료 — 사이트를 정해진 기간 동안만 공유하고 싶다면 링크 만료 옵션을 사용하세요. 클라이언트에게 맞춤 포트폴리오를 공유하거나 외부 파트너에게 민감한 문서를 공유할 때 유용합니다.

커스텀 비주얼 — '사이트 사용자 지정' 메뉴에서 사이트의 외관을 변경할 수 있습니다. 링크 미리보기를 사용자 지정하고, 제목을 바꾸고, 라이트/다크 테마를 선택할 수도 있답니다.

Google Analytics와 통합 — '사이트 사용자 지정' 메뉴에서 Google Analytics와 통합하면 사이트의 성과를 쉽고 빠르게 파악할 수 있습니다.

템플릿 복제 허용 — 정말 멋진 랜딩 페이지 템플릿을 제작했는데 다른 회사들도 이 템플릿 포맷을 유용하게 쓸 수 있을 것 같다는 생각이 든다면, 제작한 페이지를 템플릿으로 복제할 수 있게 만들어 주세요. 템플릿을 복제한 사용자는 해당 템플릿을 자신의 Notion 워크스페이스에 저장할 수 있습니다. 이 옵션은 '사이트 사용자 지정' 메뉴의 헤더 옵션에 있습니다.

페이지를 템플릿으로 공유하고 싶으신가요?

혼자서 콘텐츠를 게시할 수 있으니 Notion에서 다양한 페이지를 만들고 소소한 변경 사항을 반영하는 건 정말 쉽게 하실 수 있을 겁니다.

아름다운 웹 페이지를 구축하는 데 도움이 되는 템플릿

이 가이드 공유하기

템플릿으로 시작하기

템플릿 갤러리에서 10,000개가 넘는 템플릿을 둘러보세요.


설명되지 않은 부분이 있나요?