더 나은 웹 코드 작성

여기에 아이러니 한 것이 있습니다. 많은 웹 디자이너는 웹 빌더와 함께 제공되는 단순성을 좋아합니다. 그러나 흥미롭게도 기본 코드를 자동화하여 웹 디자이너와 개발자의 역할을 없애기 위해 대량의 웹 빌더가 만들어졌습니다.

재밌어요?

그러나 다시 한 번 반대되는 웹 빌더가 있습니다. 디자이너와 개발자의 역할을 줄이는 대신 이러한 팀에 최적화 된 도구가 제공됩니다. 그들의 주요 목표는 고급 도구를 사용하여 설계 기관을 용이하게하는 것입니다.

어떻게 묻는거야?

음, 웹 플로우 유명한 예 중 하나입니다. 전체 웹 디자인 환경에서의 역할은 곧 살펴볼 것입니다. 이 Webflow 검토에서는 알아야 할 모든 중요한 기능, 해당 약점 및 디자인을위한 플랫폼 활용 비용에 대해 설명합니다.

그러나 먼저 Webflow 란 정확히 무엇입니까?

웹 흐름 검토 : 개요

아마 지금까지 알았 듯이 Webflow는 일반적인 웹 빌더가 아닙니다.

2013 년에 시작된이 도구는 전문적인 코드없는 디자인 도구와 강력한 시각적 CMS 및 표준 빌더의 사용자 친 화성을 결합한 웹 디자인 솔루션으로 자체 판매됩니다. 따라서 웹 구축 솔루션과의 융합으로 생각하십시오. 윅스 그리고 같은 CMS 엔진 워드 프레스.

웹 플로우

그러나 실수하지 마십시오. Webflow는 좋아하는 것과 경쟁하지 않습니다 윅스 위 블리. 다양한 사용자 인구 통계를 대상으로하는 다양한 기능을 제공합니다.

전체적으로 가장 흥미로운 것은 전체 코딩에 대한 Webflow의 현명한 접근입니다. 유연성을 높이기 위해 코드 편집을 지원하는 코드가없는 플랫폼입니다.

혼란 스러운가? 예, 알아요 그래서 웹 사이트 디자인부터 컨텐츠 관리 시스템에 이르기까지 웹 플로우가 제공하는 모든 것을 예의 바르게 평가하는 데 시간이 걸렸습니다.

자세한 내용은 다음과 같습니다.

웹 흐름 검토 : 기능

웹사이트 디자인

Webflow는 의심 할 여지가없는 몇 가지 사항입니다. 그러나 코드가없는 웹 디자인 도구는 항상 여기에서 주요한 제안이었습니다.

시작하기 전에 Adobe Photoshop의 편집 창과 혼동하면 이해할 수 있습니다. 이 두 사람은 멀리서 보면 쌍둥이 형제처럼 보일 수 있지만 가까이 다가 가면 상당히 달라집니다. 좀 더 구체적으로 말하면 Webflow는 주로 CSS와 HTML에서 작동하는 자동화 엔진이라는 것을 알 수 있습니다.

웹 플로우 디자이너

그것에, 당신은 편안하게 사이트 요소를 소개하고 코드를 사용하지 않고 그에 따라 이동할 수 있습니다. 프로그래밍 비트는 Webflow의 기본 프레임 워크에 의해 처리되며, 디자인 프로세스를 진행할 때 사이트 코드를 체계적으로 생성하고 편집합니다.

다른 코드가없는 웹 디자이너를 사용해 본 경우 프로그래밍 비트를 제거하면 유연성이 제한된다는 것을 알고 있습니다. 흥미롭게도 Webflow의 디자인 툴은이 추세를 따르지 않습니다. 그래서 저는 솔직히 말해서 그것이 시장에서 가장 진보 된 다목적 웹 사이트 제작자 중 하나라는 것을 인정할 것입니다.

이제 맞서자 웹 사이트 관리 도구와 관련하여 고급과 단순성은 불과 얼음으로 알려진 두 가지입니다.

사실 Webflow는 가장 간단한 빌더 중 하나가 아닙니다. 인터페이스는 매우 강력하지만 복잡해 보이므로 로프를 배우려면 약간의 노력이 필요할 수 있습니다.

우선 Webflow는 완전히 코드가없는 디자인 프로세스의 환상을 만들지 않습니다. 따라서 캔버스에 바로 들어가서 도형을 그리기 시작할 것으로 기대하지 마십시오. 이러한 접근 방식은 사용자 지정 기능을 실질적으로 제한합니다.

결과적으로,이 시스템은 웹 사이트를 구축 할 때 코딩의 일부 측면을 영리하게 포함합니다. 예를 들어 정사각형 중간 페이지를 소개하려는 경우 새로운 <DIV> 고정 된 위치와 함께 왼쪽 하단 및 오른쪽 상단 점을 XNUMX으로 편집합니다.

이것은 무엇을 의미할까요?

프로그래밍 지식 없이도 Webflow를 활용할 수는 있지만 HTML 및 CSS 속성을 기본적으로 이해하여 그 강력한 기능을 포괄적으로 활용할 수 있습니다.

그러나 다른 방법을 선호하는 경우 '코드를 쓰지 않습니다” 등록 할 때 선택하십시오. 그 후 시스템은 자동화 기능을 확장하여 많은 부분의 설계를 처리합니다.

즉, 완전히 빈 캔버스로 시작할 수 있습니다. 기본에서 모든 것을 사용자 정의하기 때문에 내가 선호하는 접근 방식입니다.

그래도 한마디. CSS 및 HTML에 익숙한 디자이너에게는이 옵션을 그대로 두십시오. 그렇지 않으면 프로세스가 섞이거나 어딘가에 갇힐 위험이 있습니다.

초보자를 코딩하는 가장 좋은 방법은 Webflow의 사전 디자인 된 템플릿을 이용하는 것입니다. 이 시스템은 200 개가 넘는 매력적인 템플릿을 제공하며 그 중 30 개는 완전 무료입니다. 반면에, 유료는 24 달러에서 79 달러 사이입니다.

다양한 테마를 철저히 분석 한 후 다양한 구조와 기능으로 인해 테마가 눈에 띄게 다르다는 것을 알았습니다. 그런 다음 후속 편집 프로세스를 통해 요소의 배경, 색상, 레이어, 불투명도, 회전, 효과, 위치, 크기 등을 변경할 수 있습니다.

호스팅

이것은 말할 것도없이 진행됩니다. 오늘날 많은 웹 빌더와 마찬가지로이 웹 플로우는 디자인 패키지와 함께 사이트 호스팅과 사용자 정의 도메인을 제공합니다.

웹 플로우 호스팅

그러나 여기에서 일반적인 공유 계획 방식을 기대하지 마십시오. 대신 Webflow는 "무한히 확장 가능한 서버 집합"이라고 설명하는 범위 내에서 사내 사이트를 유지하기로 선택합니다.

이것은 무엇을 수반합니까?

Webflow는 전 세계 100 개 이상의 데이터 센터를 소유하고 제어합니다. CDN과 결합하여 아마존 CloudFront를 ...을 더한 빠르게- 그 결과 모든 유형의 웹 사이트를 호스팅하기위한 하나의 견고한 시스템이 탄생했습니다.

Webflow는 모든 트래픽 크기를 처리 할뿐만 아니라 밀리 초 단위의 페이지 로딩 시간과 99.99 % 웹 사이트 가동 시간으로 최적의 성능을 보장합니다. AWS 기반 프레임 워크는 엔터프라이즈 사이트에서 비교적 큰 트래픽로드를 지원하기위한 견고한 기반을 제공하는 데 특히 중요합니다.

또한 웹 보안이 필수적이므로 Webflow의 호스팅 인프라는 HTTP / 2를 준수하며 사용자는 사이트에 대한 관련 SSL 인증서를받습니다.

콘텐츠 관리 시스템

콘텐츠가 시각적 디자인과 만나는 곳입니다. Webflow의 CMS를 사용하면 사이트의 컨텐츠를 입력하고 관리 할 수 ​​있습니다. 즉, 작성중인 정확한 페이지에서 텍스트 또는 미디어를 추가하고 편집 할 수 있습니다.

또한 복잡한 구조의 광범위한 웹 프로젝트를 관리하는 경우 특히 사용자 정의 가능한 필드가있는 컨텐츠 유형, 팀 구성원, 프로젝트 등 컨텐츠 측면의 수동 조정을 지원하는 시스템의 기능에 감사합니다.

글쎄,이 모든 것이 촉진됩니다 CMS 컬렉션 기본 편집기 창에서 바로 액세스 할 수있는 기능. 새 모음을 생성하자마자 컨텐츠 유형을지나 필드를 정의하고 항목을 소개 할 수 있습니다. 이후에는 별도의 웹 페이지 또는 사용자가 만든 페이지에 통합 된 목록으로 채택됩니다.

웹 플로우 CMS

혼란 스러운가? 좋아,이 예를 고려해보십시오. 조직의 인력을 표시하는 페이지를 설정하고 소셜 팀, 설명, 이름, 사진 및 직원 이름과 같은 항목이 포함 된 "팀 구성원"모음을 소개 할 수 있습니다.

이제 기본적으로 CMS 백엔드를 다룹니다. 그러나, 당신은 무엇을 알고 있습니까? 그게 다가 아닙니다. Webflow는 Webflow Editor를 통해 WordPress에 돈을 잘 버는 것입니다. 여기에서 미리 선택된 유형에 따라 새 컨텐츠로 게시 된 페이지를 구성 할 수 있습니다.

간단히 말해 추가 플러그인을 설치하지 않고도 포트폴리오, 기사 및 블로그 게시물과 같은 동적 컨텐츠를 지원하는 포괄적 인 웹 사이트를 얻을 수 있습니다.

Collaboration

인정해. 대규모 웹 디자인 프로젝트는 흥미 롭습니다. 그러나 특히 관련 당사자를 모두 합리화하지 않으면 더욱 번거로울 수 있습니다.

Webflow는 이와 같이 생각한 것으로 보이며 여러 팀 구성원이있는 웹 디자인 에이전시의 협업을 촉진하기 위해 노력하고 있습니다. 또한 클라이언트, 타사 디자이너, 계약자 등과 같은 다른 당사자를 초대 할 수도 있습니다. 역할 및 사용자 기능은 설정 한 해당 권한에 따라 다릅니다.

웹 플로우 협업

예를 들어 클라이언트를 다루는 경우 엄청나게 제한된 사용 권한으로 프로젝트를 실시간으로 검토하도록 초대 할 수 있습니다.

즉, 모든 사이트 조정이 보드 전체에 실시간으로 반영됩니다. 이를 통해 협업 팀 구성원은 이미 처리 된 작업을 반복하지 않아도됩니다.

전체 기능

  • XML 사이트 맵
  • SEO 메타 제목, 설명
  • 이미지 대체 태그
  • 지원 센터
  • 커뮤니티 포럼
  • 우선 지원
  • 이메일 지원
  • 맞춤 도메인 이름
  • 준비 사이트
  • 즉각적인 업데이트
  • 맞춤 URL 리디렉션
  • 연중 무휴 웹 사이트 모니터링
  • 빠른 로딩 시간
  • Google 도메인 구매
  • 지피에 통합
  • MailChimp 통합
  • Google 웹 로그 분석 통합
  • SEO 최적화
  • 화이트 라벨 양식
  • CMS 화이트 라벨링
  • 사이트 비밀번호 보호
  • 프로젝트 조직
  • 웹 사이트 백업
  • 사용자 정의 오류 페이지
  • 맞춤 파비콘
  • 직접 고객 결제
  • SNS 구성 요소
  • 서식있는 텍스트
  • 라이트 박스
  • 배경 비디오
  • HTML 임베드 코드
  • 드롭 다운 메뉴
  • 구글지도
  • 슬라이더와 회전 목마
  • 탭 탐색
  • 사용자 정의 가능한 웹 양식
  • 웹 사이트 편집기
  • 양식 제출 검토
  • 그래프 내용 열기
  • SEO 태그 템플릿
  • Zapier를 통한 CMS 가져 오기
  • RSS 피드
  • CMS API
  • 3D 애니메이션
  • CSS 스타일링 속성
  • 웹 사이트 템플릿
  • 최적화 된 이미지
  • 웹 폰트 패밀리
  • 글로벌 색상 견본
  • CSS3 플렉시블 박스
  • 커스텀 코드 추가
  • 내보낼 수있는 코드
  • CSS 필터

웹 흐름 검토 : 가격

Webflow의 가격 구조는 일부 사용자에게는 복잡해 보이지만 다른 사용자는 포괄적 인 접근 방식을 높이 평가합니다.

함께 제공되는 복잡한 비교 프로세스로 인해 단일 플랫폼에서 수많은 패키지를 싫어하는 유형이라면 Webflow의 가격 계획이 다소 번거로울 수 있습니다. 그러나 다른 사용자 수준에 맞는 여러 가지 가격 옵션을 선호하는 경우 여기에서 상품이 구성된 방식을 좋아하게됩니다.

이제 Webflow는 프리랜서, 솔로 디자이너 및 디자인 팀의 세 가지 유형의 사용자를 지원하려고합니다. 각 카테고리에는 다양한 기능을 갖춘 자체 패키지 세트가 있습니다.

웹 플로우 패키지

각 계획에 대한 간단한 설명은 다음과 같습니다.

프리랜서의 경우 :

무료 스테이징 완전 무료.

  • 한 달에 10 개의 양식 제출
  • CMS 항목 50 개
  • 500 월간 방문수
  • 정적 페이지 2 개
  • 무료 webflow.io 하위 도메인

기본 호스팅 매월 청구되는 월 $ 15 또는 매년 청구되는 월 $ 12.

  • 한 달에 500 개의 양식 제출
  • 25,000 월간 방문수
  • 정적 페이지 100 개
  • CDN
  • 무료 SSL 옵션
  • 도메인 생성

CMS 호스팅 매월 청구되는 월 $ 20 또는 매년 청구되는 월 $ 16.

  • 콘텐츠 편집자 3 명
  • CMS API 액세스
  • 2,000 개의 CMS 항목 사용 가능
  • 한 달에 1,000 개의 양식 제출
  • 100,000 월간 방문수
  • 정적 페이지 100 개
  • CDN
  • 무료 SSL 옵션
  • 도메인 생성

비즈니스 호스팅 매월 청구되는 월 $ 45 또는 매년 청구되는 월 $ 36.

  • 콘텐츠 편집자 10 명
  • CMS API 액세스
  • 10,000 개의 CMS 항목 사용 가능
  • 무제한 양식 제출
  • 1,000,000 월간 방문수
  • 정적 페이지 100 개
  • CDN
  • 무료 SSL 옵션
  • 도메인 생성

프리랜서를위한 Webflow

디자이너의 경우 :

기동기- 비어 있는.

  • 무료 준비
  • 고객 청구
  • 최대 2 개의 동시 프로젝트
  • 무료 사이트 구축

라이트 매월 청구되는 월 $ 24 또는 매년 청구되는 월 $ 16.

  • 코드 내보내기
  • 강화 된 스테이징
  • 고객 청구
  • 최대 10 개의 동시 프로젝트

찬성- 매월 청구되는 월 $ 42 또는 매년 청구되는 월 $ 35.

  • 사이트 비밀번호 보호
  • 화이트 라벨링
  • 프로젝트 소유권 이전
  • 코드 내보내기
  • 강화 된 스테이징
  • 고객 청구
  • 무제한 동시 프로젝트

디자이너를위한 웹 플로우

크리에이티브 팀

팀- 매월 청구되는 월 $ 42 또는 매년 청구되는 월 $ 35.

  • 팀 대시 보드
  • 사이트 비밀번호 보호
  • 화이트 라벨링
  • 코드 내보내기
  • 강화 된 스테이징
  • 고객 청구
  • 무제한 동시 프로젝트

큰 팀 맞춤 견적.

  • 대량 팀원 가격
  • 팀 대시 보드
  • 사이트 비밀번호 보호
  • 화이트 라벨링
  • 코드 내보내기
  • 강화 된 스테이징
  • 고객 청구
  • 무제한 동시 프로젝트

팀을위한 웹 플로우

누가 Webflow 사용을 고려해야합니까?

고려 된 모든 것, 우리는 박수를 보냅니다 웹 플로우 제공을 위해 :

  • 보안 준수를위한 무료 SSL 인증서.
  • 페이지 로딩 시간 단축을위한 무료 통합 컨텐츠 전송 네트워크.
  • 다음과 같은 효과적인 시스템과 협력하여 고급 글로벌 웹 사이트 호스팅 아마존 CloudFront를 빠르게- 빠른 페이지 로딩 속도.
  • 동적 컨텐츠 작성을위한 다목적 통합 CMS.
  • 다양한 웹 사이트 요소를 테스트하고 검토하기위한 준비 환경.
  • 고급 사이트 관리와 전체 애니메이션 및 스타일 제어를 위해 최적화 된 CSS 및 JS 관리자.
  • 빈 캔버스 또는 사전 디자인 된 템플릿으로 시작하는 유연한 웹 구축 프로세스.
  • 사이트를 구축 할 때 실시간으로 내보낼 수있는 코드를 생성하는 모바일 친화적 인 웹 디자인 도구입니다.

그 외에도, 내가 겪었던 단점은 다음과 같습니다.

  • 전자 상거래 사이트 지원을위한 제한된 기능
  • 프로그래머에게 큰 호응을주는 디자인 프로세스
  • 제한된 수의 웹 사이트 템플릿
  • 초보자를위한 가파른 학습 곡선

이제 모든 것을 하나로 묶어 봅시다. Webflow는 다양한 기능과 제어 기능을 원하는 개발자, 디자이너 및 대행사를 위해 개발 된 고급 웹 빌딩 시스템이라는 데 동의합니다.

당신의 생각은 무엇입니까?

보그 단 란 세아

Bogdan은 Inspired Mag의 창립 멤버로서이 기간 동안 거의 6 년의 경험을 축적했습니다. 여가 시간에는 클래식 음악을 공부하고 시각 예술을 탐구하는 것을 좋아합니다. 그는 또한 수정 프로그램에 상당히 집착하고 있습니다. 그는 이미 5를 소유하고 있습니다.