Webflow
AI 사이트 생성, CMS, 호스팅, AEO를 묶어 브랜드 웹사이트를 운영하는 웹 제작 플랫폼
에디터 한마디
디자인 중심의 실무 사이트를 빠르게 배포하고 생산용 HTML/CSS/JS와 통합 호스팅·CMS가 필요한 팀이나 디자이너에게 적합합니다. Designer 학습에 시간을 투자할 의향이 있는 마케터·프리랜서에게 추천합니다.
장단점
좋은 점
- 무료 요금제로 webflow.io 도메인에 최대 3페이지를 시간 제한 없이 만들 수 있습니다.
- 비주얼 디자이너가 생성하는 코드(HTML/CSS/JS)가 깔끔하고 시맨틱해 페이지 로딩 속도와 SEO에 유리합니다.
- 호스팅(SSL 포함), CMS, 로컬라이제이션이 통합되어 별도 플러그인이나 운영 작업 없이 팀 단위 퍼블리싱이 가능합니다.
아쉬운 점
- 무료 3페이지를 초과하면 페이지 추가나 커스텀 도메인 사용을 위해 유료 호스팅 플랜이 필요합니다.
- 디자이너의 레이아웃, 클래스, 반응형 제어를 익히는 데 학습 곡선이 있어 완전 초보자에게는 어렵게 느껴질 수 있습니다.
- 플랫폼의 핵심 동작이나 심층 기능은 수정이 제한되어 플랫폼 자체를 변경할 수는 없습니다.
이렇게 써보세요
- 1 제품 랜딩 페이지 출시
가입 후 Designer를 열고 → Figma를 가져오거나 요소를 끌어 섹션을 구성하고 모바일 브레이크포인트와 인터랙션을 설정합니다 → 사이트 플랜 연결 후 Publish를 눌러 Webflow 호스팅으로 반응형 페이지를 배포합니다.
- 2 CMS 기반 블로그 만들기
프로젝트에서 게시물용 Collection(제목, 본문, 작성자, 이미지)을 모델링합니다 → 템플릿 페이지에 Collection 필드를 연결하고 비기술자용 Editor 권한을 설정합니다 → CMS에 글을 추가하고 Publish하면 라이브 블로그가 즉시 업데이트됩니다.
- 3 다국어 사이트 배포
프로젝트 설정에서 Localization을 활성화하고 로케일을 추가합니다 → 같은 코드베이스의 CMS에 번역 콘텐츠를 넣고 템플릿에 로컬라이즈된 필드를 매핑합니다 → Publish하면 SSL 포함 호스팅으로 여러 언어 버전을 제공합니다.
2개 더 보기
- 4 Figma 레이아웃을 실무 사이트로 다듬기
Figma to Webflow로 레이아웃을 가져온 뒤 → 스타일과 클래스, 반응형 규칙을 정리하고 플레이스홀더를 CMS 콘텐츠로 교체합니다 → Publish하면 Webflow가 생산용 HTML/CSS/JS를 자동으로 생성해 줍니다.
- 5 프리랜서 포트폴리오 신속 제작
webflow.io 도메인으로 무료 프로젝트를 시작하고 템플릿을 선택합니다 → 프로젝트와 사례 연구용 간단한 CMS를 추가하고 레이아웃을 반응형으로 조정합니다 → 준비되면 호스팅 플랜을 추가해 커스텀 도메인으로 Publish합니다.
주요 기능
- 비주얼 디자이너에 레이아웃을 배치 → 프로덕션용 HTML/CSS/JS 자동 생성
- CMS에 컬렉션 모델링 → 비개발자도 라이브 사이트 항목을 편집
- Publish 클릭 → SSL 포함한 글로벌 호스팅과 빠른 전송
- 프로젝트 내 로케일 설정 → 단일 코드베이스에서 지역화된 사이트 제공
- Figma to Webflow 가져오기 → Figma 레이아웃을 불러와 디자이너에서 다듬기
이런 상황에 추천
- 마케팅 매니저가 엔지니어 자원 없이 신제품 마이크로사이트를 런칭할 때
- 콘텐츠 에디터가 캠페인 전 라이브 사이트에서 블로그와 CMS 항목을 바로 업데이트할 때
- 프리랜스 디자이너가 Figma 랜딩을 가져와 같은 날 반응형 버전으로 배포할 때
시작하는 법
- 1 webflow.com에서 계정 생성 후 브라우저로 비주얼 디자이너를 엽니다
- 2 새 프로젝트 시작하거나 Figma to Webflow로 기존 레이아웃을 가져옵니다
- 3 섹션을 몇 개 추가하고 Publish를 눌러 webflow.io 도메인으로 배포합니다
소개
브라우저에서 요소를 끌어다 놓아 코드 한 줄 없이 반응형 사이트를 바로 배포할 수 있습니다. 디자이너와 마케터는 랜딩·블로그·포트폴리오·소규모 이커머스까지 만들고, 에디터는 CMS에서 직접 콘텐츠를 갱신합니다. 내장 호스팅·로컬라이제이션·보안과 Figma to Webflow·Webflow AI가 워크플로를 완성합니다.
비슷한 도구
FAQ
어떤 플랫폼에서 사용할 수 있나요?
Web에서 사용 가능합니다.
한국어를 지원하나요?
현재 한국어는 지원하지 않습니다.