Beaver Builder 대 Divi: 가장 완벽한 비교

게시 됨: 2021-11-23

WordPress 페이지 빌더를 찾고 있다면 시장 에서 가장 인기 있는 페이지 빌더 중 하나인 Beaver Builder와 Divi Builder에 대해 들어보았을 것입니다.

두 페이지 빌더 모두 초보자와 숙련된 전문가를 포함한 모든 사용자가 디자인에 액세스할 수 있도록 제작되었습니다.

그러나 Divi 또는 Beaver Builder 중 어느 것이 더 낫습니까? 결정을 돕기 위해 각 페이지 빌더를 자세히 살펴보고 시각적 편집기, 사용 편의성, 콘텐츠 모듈 및 미리 만들어진 템플릿과 같은 주요 기능에 대해 논의합니다.

이 게시물이 끝나면 Beaver Builder와 Divi를 완전히 비교 하여 WordPress 웹 사이트에 가장 적합한 페이지 빌더를 결정하게 됩니다.

시작하자!

내용물
  1. 개요: Beaver Builder 대 Divi
  2. 프론트엔드 인터페이스
  3. 사용 용이성: Divi Builder 대 Beaver Builder
  4. 콘텐츠 모듈
  5. 미리 만들어진 템플릿
  6. 비버 빌더 테마 대 Divi 테마
  7. 요구 사항
  8. 성능 테스트: Divi Builder 대 Beaver Builder
  9. SEO: Divi 대 비버 빌더
  10. WordPress Gutenberg Editor와의 호환성
  11. Divi 및 Beaver Builder로 구축된 웹사이트
  12. 비활성화: Beaver Builder 대 Divi Builder
  13. 문서 및 고객 지원
  14. 사용 가능한 설정
  15. 타사 애드온
  16. 모바일 응답성
  17. 테마 호환성
  18. 장점과 단점
  19. 어느 것을 선택해야 합니까?
  20. 가격: Divi 대 Beaver Builder
  21. Beaver Builder 대 Divi Builder에 대한 최종 생각
  22. Beaver Builder 대 Divi – FAQ

🛠️ 여기에서 WordPress 페이지 빌더의 전체 목록을 확인하십시오. ➡️


개요: Beaver Builder 대 Divi

Divi와 Beaver Builder는 모두 WordPress에서 엄청나게 인기 있는 페이지 빌더입니다.

둘 다 초보자가 첫 번째 사이트를 디자인할 수 있도록 세심하게 설계 및 엔지니어링되었으며, 동시에 고급 사용자가 제한 없이 원하는 것을 만들 수 있도록 모든 권한을 부여합니다.

디비 빌더란?

2013년에 출시된 Elegant Themes의 Divi Builder는 WordPress 웹사이트 디자인을 위한 많은 고유한 솔루션 을 제공하는 프리미엄 전용 페이지 빌더입니다.

디비 개요

Divi는 WordPress 커뮤니티에서 인기 있고 페이지 빌더와 함께 제공되는 테마로도 유명합니다.

우아한 테마의 Divi에 대한 평생 전략 가격은 WordPress 웹 사이트에서 하나의 테마와 페이지 빌더를 사용하려는 사용자에게 매우 매력적입니다.

무료 Divi 테스트 드라이브

Divi Visual Builder의 놀라운 기능을 살펴보세요

지금 시도

비버 빌더란 무엇입니까?

Beaver Builder는 사용자 정의 옵션이 많은 또 다른 신뢰할 수 있는 WordPress 페이지 빌더 이며 깨끗한 코드, 사용 용이성 및 개발자 친화성을 생성하는 것으로 알려져 있습니다.

Beaver Builder는 또한 다중 사이트를 지원하고 WooCommerce를 지원하며 SEO에 최적화되어 있습니다(스키마 마크업 및 코드 압축 지원).

비버 빌더 홈페이지

Divi와 달리 Beaver Builder는 프리미엄 모델을 사용하며 업그레이드 옵션이 있는 무료 플러그인을 제공합니다.

다음은 Beaver Builder에 대한 간단한 소개 동영상입니다.


프론트엔드 인터페이스

Divi와 Beaver Builder는 모두 시각적 프론트엔드 편집을 제공하지만 접근 방식이 다릅니다. Beaver Builder를 사용하면 사이드바 에서 대부분의 작업을 수행하는 반면 Divi에서는 부동 옵션 을 사용해야 합니다.

Beaver Builder 프론트엔드 인터페이스

Beaver Builder는 모든 콘텐츠 모듈 및 관련 설정이 사이드바에 표시되는 사이드바 형식을 사용합니다.

Beaver Builder 프론트엔드 인터페이스
비버 빌더 사이드바

사이드바를 화면의 왼쪽이나 오른쪽으로 이동하는 옵션도 있는데, 이는 고유한 기능이며 워크플로를 더 매끄럽게 만듭니다 .

이전에는 인라인 편집이 Divi에서만 지원되었지만 이제 Beaver Builder도 이를 지원하므로 모든 모듈에서 (MS Word 또는 Google 문서에서 하는 것처럼) 텍스트를 쉽게 편집할 수 있습니다.

또한 Beaver Builder에서는 콘텐츠 모듈을 드래그 앤 드롭하여 새 열이나 행을 만들 수 있지만 Divi에서는 수동으로 행을 만들어야 합니다.

전반적으로 Beaver Builder 편집기는 빠르며 편집기에서 레이아웃의 모든 측면에 스타일을 지정할 수 있습니다. Beaver Builder에 익숙해지는 데 시간이 걸리겠지만 일단 학습 곡선을 통과하면 일이 훨씬 쉬워질 것입니다.

Divi Builder 프론트엔드 인터페이스

Divi는 백엔드 편집을 지원하는 빌더이지만 페이지 빌더는 시각적 편집으로 유명하기 때문에 Divi Builder와 함께 간다면 놓칠 수 있는 부분이 아닙니다.

Divi 프론트엔드 인터페이스의 경우 사이드바가 없으며 모든 콘텐츠 및 설정 옵션이 사이트 미리보기의 오버레이에 팝업으로 표시됩니다.

따라서 Divi를 사용하면 사이트 미리보기를 전체 너비로 확인하려고 할 때마다 사이드바를 켜고 끌 필요가 없습니다.

Divi Builder 프론트엔드 인터페이스
Divi 비주얼 편집 모드의 팝업 옵션

새 콘텐츠 모듈을 추가하려면 행과 열을 가리키고 + 아이콘을 클릭한 다음 원하는 Divi 요소를 끌어다 놓기만 하면 됩니다.

🔔 참고:

강력한 시각적 편집과 함께 Divi는 Divi Wireframe View라는 동등하게 강력한 백엔드 편집 옵션도 제공합니다. 우리의 의견으로는 Divi Wireframe View가 현재 시장에서 사용 가능한 최고의 WordPress 백엔드 편집기입니다.

또한 확인하세요: Divi 대 Elementor


사용 용이성 : Divi Builder 대 Beaver Builder

페이지 빌더의 전체 개념이 사용 편의성을 중심으로 돌아가기 때문에 이 부분은 매우 중요합니다.

페이지 빌더는 사용자 가 코드를 작성하지 않고도 모든 기능을 갖춘 웹사이트를 구축할 수 있도록 특별히 제작되었습니다.

이 때문에 많은 개발자들은 이제 페이지 빌더를 선호합니다. 이러한 도구를 사용하면 기존 HTML/CSS 코딩에 비해 웹 사이트 구축 프로세스가 훨씬 빨라지기 때문입니다.

Beaver Builder 사용 용이성

플러그인을 설치하고 활성화하면 Beaver Builder는 필요한 모든 정보를 한 곳에서 제공하도록 설계된 특별한 온보딩 프로세스를 시작합니다.

편집을 시작하려면 모듈을 끌어다 놓은 다음 그에 따라 사용자 정의할 수 있습니다.

편집하는 동안 상단의 + 아이콘에서 모듈을 추가하고 페이지의 아무 곳에나 넣을 수 있습니다.

비버 모듈
Beaver Builder에서 모듈 추가

위에서 이미 언급했듯이 Beaver Builder는 다중 사이트 구성을 지원하므로 다중 사이트 설치를 관리하는 경우 하나의 네트워크 전체 제어판에서 변경 사항을 쉽게 처리할 수 있습니다.

전반적으로 Beaver Builder는 단순한 디자인과 모든 콘텐츠 모듈 및 설정의 효과적인 배치로 사용하기 쉽습니다 .

🔔 참고:

Beaver Builder에서 찾을 수 있는 한 가지 문제는 전체 너비 템플릿에 대한 전용 옵션이 없기 때문에 테마가 전체 너비 편집을 지원하지 않는 경우 100% 전체 너비를 디자인할 수 없다는 것입니다. 페이지.

Divi Builder 사용 편의성

Divi Builder를 시작하려면 아무 페이지나 게시물로 이동하여 Divi Builder 사용 옵션을 선택할 수 있습니다.

그런 다음 처음부터 빌드, 미리 빌드된 레이아웃 선택 또는 기존 페이지 복제의 세 가지 옵션이 제공됩니다.

Divi에 새 섹션 추가
Divi Builder에서 새 섹션 만들기

페이지에 새로운 Divi Builder 모듈을 추가하려면 먼저 섹션을 설정한 다음 행을 설정한 다음 모듈을 설정해야 합니다.

이것은 다소 어렵거나 혼란스럽게 들릴 수 있지만 일단 빌더의 느낌을 갖게 되면 편집하는 동안 전혀 문제가 없을 것입니다.

모듈 추가하기

위에서 볼 수 있듯이 세 가지 다른 + 아이콘이 있습니다. 파란색은 섹션, 녹색은 행, 검은색은 모듈입니다.

전반적으로 Divi Builder는 프론트엔드 비주얼 편집기와 와이어프레임(백엔드) 보기 간에 편안하게 앞뒤로 전환할 수 있으므로 특히 길고 복잡한 페이지에서 작업할 때 매우 직관적 이라는 것을 알게 될 것입니다.


콘텐츠 모듈

콘텐츠 모듈 또는 요소는 모든 일반적인 WordPress WYSIWYG 편집기에서 사용하는 빌딩 블록입니다.

페이지 빌더로 웹사이트 구축을 시작하기 전에 사용 가능한 모든 모듈을 살펴보고 어떤 것이 있는지 확인하는 것이 중요합니다.

페이지 빌더에 포함되지 않은 특정 항목이 필요한 경우 이를 해결하는 타사 애드온 또는 플러그인을 찾아야 합니다(이는 추가 번거로움을 의미함).

비버 빌더 모듈

Beaver Builder로 약 30개 이상의 모듈을 얻을 수 있으며, 이는 Divi의 40개 이상의 모듈에 비해 약간 적습니다. 그러나 이것이 Divi가 특히 더 낫다는 의미는 아닙니다.

비버 예제 모듈
비버 빌더 모듈

아코디언, 지도, 게시물, 제목, 버튼, CTA, 구분선, 이미지, HTML 코드, 갤러리 등과 같은 모든 기본 모듈이 Beaver Builder에 포함되어 있습니다.

즉, 특정 항목이 필요하고 기본 제공 Beaver Builder 모듈에서 찾을 수 없는 경우 항상 타사 추가 기능 을 찾을 수 있으며 대부분은 무료로 제공됩니다.

Divi Builder 콘텐츠 모듈

현재 Divi Builder에는 40개 이상의 모듈 이 포함되어 있으며 새로운 모듈이 정기적으로 출시됩니다.

웹 사이트의 Divi Builder 웹 사이트 요소 섹션
Divi 모듈

대부분의 기본 및 고급 모듈은 Divi Builder에서 다룹니다. 그러나 Divi는 표준 WordPress 위젯을 페이지에 추가하기 어렵게 만듭니다. 이는 Beaver Builder의 경우가 아닙니다.

마지막으로, Divi 모듈에는 고급 스타일을 더 쉽게 사용할 수 있도록 하는 CSS ID 및 클래스 전용 필드 도 있습니다.


미리 만들어진 템플릿

페이지 빌더의 가장 좋은 점 중 하나는 일반적으로 사전 제작된 템플릿이 엄청나게 많다는 것입니다. 이 템플릿을 사용하여 완전한 웹사이트를 거의 즉시 설정할 수 있습니다.

예, 언제든지 처음부터 페이지를 만들 수 있습니다. 하지만 템플릿은 그렇게 할 시간이나 이유가 없는 경우 매우 유용합니다.

비버 빌더 템플릿

Beaver Builder에는 완벽하게 반응하고 모든 테마에서 작동하는 전문적으로 디자인된 수십 개의 템플릿이 있습니다. Divi에 비해 많지는 않지만 빠르게 시작하기에 충분한 약 30개의 템플릿 을 얻을 수 있습니다.

최대 350개 이상의 페이지 템플릿 이 포함된 Beaver 파워 팩을 활용할 수도 있습니다.

비버 템플릿
비버 빌더 템플릿

Beaver Builder 템플릿은 랜딩 페이지와 콘텐츠 페이지 템플릿으로 나뉩니다.

연락처 페이지, 뉴스레터 가입, 페이지 정보, 비즈니스/기업 웹사이트 템플릿, 방문 페이지 등과 같은 모든 필수 페이지 유형 및 주제가 포함되어 있습니다.

Divi 빌더 레이아웃

Divi에는 사전 제작된 템플릿과 전체 웹사이트 팩의 방대한 라이브러리가 있습니다. 현재 880개 이상의 사전 제작된 디자인과 110개 이상의 전체 웹사이트 팩 중에서 선택할 수 있습니다. 가장 중요한 것은 이 모든 것이 세심하게 설계되었으며 숨이 멎을 정도로 아름답 습니다.

Divi 레이아웃 팩

모든 개별 웹 사이트 팩이 동일한 디자인 개념으로 구축되어 사용자에게 일관된 경험을 제공하므로 전체 웹 사이트 팩은 놀랍습니다. 미리 만들어진 웹사이트 팩을 사용하면 사이트의 모든 페이지가 정말 잘 어울립니다.

Divi 템플릿의 놀라운 점은 이러한 템플릿의 개별 요소(말 그대로 페이지에 표시되는 모든 것)를 독립적으로 저장하고 원할 때마다 재사용할 수 있다는 것입니다.

Divi 사전 제작 레이아웃

우아한 테마의 세계적인 디자인

레이아웃 보기

원하는 요소를 Divi 라이브러리에 저장하고 언제 어디서나 원하는 요소를 추가하기만 하면 됩니다. 즉, 추가 비용 없이 수천 개의 아름다운 디자인을 손쉽게 사용할 수 있습니다. 매우 편리하고 유용합니다!

따라서 템플릿의 수와 다양성이 중요하다면 Divi Builder를 사용해야 합니다!


비버 빌더 테마 대 Divi 테마

Divi가 처음에 독립형 테마로 출시된 후 Divi 페이지 빌더가 출시되었지만 Beaver Builder에는 이제 WordPress 테마도 있습니다.

Beaver Builder 테마는 페이지 빌더와 함께 작동하도록 설계되었으므로 테마에는 전체 너비 디자인을 만들기 위한 빈 캔버스 옵션이 포함됩니다.

Beaver Builder 테마에는 전용 제어판이 없으며 모든 것이 WordPress 사용자 지정 프로그램에 포함되어 있습니다. 테마는 테마 기반을 강력하게 유지하기 위해 CSS 기반의 부트스트랩 프레임워크에 구축됩니다.

모든 HTML5 마크업이 테마에 포함되어 SEO에 최적화 되어 있으므로 필요한 SEO 항목(예: 제목 태그 및 스키마 마크업)을 추가하기 위해 코드를 변경할 필요가 없습니다.

반면에 Divi 테마는 최소한의 Beaver Builder 프레임워크와 매우 다릅니다.

Divi는 모든 기능이 내장된 올인원 본격적인 테마입니다 . 그러나 최근 개발로 우아한 테마는 Divi 테마의 많은 기능을 Divi 빌더로 옮겼습니다.

Beaver Builder 대 Divi Builder를 테마 관점에서 볼 때 Divi 테마는 Beaver Builder 테마에 비해 많은 기능이 있습니다.

Divi 4.0에서는 테마를 완벽하게 제어 하고 머리글, 바닥글, 단일 게시물 템플릿, WooCommerce 레이아웃 등 모든 것을 편집 할 수 있는 Divi 테마 빌더를 활용할 수 있습니다 .

놀라운 Divi 테마 빌더에 대해 자세히 알아보려면 이 자세한 비디오를 확인하세요.


요구 사항

Divi와 Beaver 모두 호스팅 환경 구성이 이상적임을 보장하기 위한 특정 요구 사항이 있습니다. 이러한 웹 사이트 빌더는 원하는 경우 Divi가 자체 호스팅을 제공한다는 점을 제외하고는 거의 동일한 설정 이 필요합니다.

무엇이든 호스팅, PHP 버전, 메모리 제한 등을 포함하여 원활한 실행을 위한 안정적인 환경이 필요합니다.

디비

디비 요구 사항
Divi 시스템 요구 사항

Divi가 제대로 작동하려면 PHP 7.2 가 필요합니다. 또한 최상의 결과를 얻으려면 최신 버전의 WordPress 및 MySQL이 있어야 합니다.

또한 안정적인 호스팅이 필요합니다 . Divi는 웹사이트 빌더 기능을 자동으로 활성화하는 Divi Hosting을 제공하지만 다른 품질의 호스팅 제공업체를 선택할 수 있습니다.

또한, 이 웹사이트 빌더는 최소 128M의 메모리 제한 , 180의 최대 실행 시간 등과 같은 호스팅 환경 구성에 대한 권장 사항도 제공합니다.

Divi의 지원 센터에서 완전한 권장 사항을 얻을 수 있습니다.

비버 빌더

Divi와 마찬가지로 Beaver Builder의 최소 시스템 요구 사항에는 WordPress 4.6 이상 및 PHP 5.6.20이 포함 됩니다. 또한 안정적인 호스팅이 있는지 확인하십시오.

Beaver Builder는 자체 호스팅을 제공하지 않지만 GoDaddy 및 BlueHost와 같은 파트너 목록을 권장합니다. Beaver 웹사이트 빌더는 또한 최소 128개의 메모리 제한을 권장합니다.


성능 테스트: Divi Builder 대 Beaver Builder

Beaver Builder 대 Divi의 페이지 속도를 테스트하기 위해 세 가지 테스트를 실행 했습니다. 우리는 다양한 시나리오에서 이러한 페이지 빌더의 속도를 확인하고 싶었습니다.

따라서 이러한 성능 테스트의 데이터를 살펴보고 어느 것이 가장 빠른 페이지 빌더인지 알아봅시다!

테스트 #1(페이지 빌더가 있는 간단한 텍스트)

첫 번째 테스트에서는 동일한 페이지(단 하나의 텍스트 줄만 포함)와 동일한 테마(Twenty Twenty-One)로 두 개의 사이트를 설정했습니다.

다음은 첫 번째 테스트의 결과입니다.

Pingdom 결과

디비 빌더 비버 빌더
페이지 크기(kb) 411.9 54.1
로드 시간(밀리초) 666 362
요청 16 9

Google PageSpeed ​​Insights 점수

디비 빌더 비버 빌더
모바일 점수 87 100
첫 번째 콘텐츠가 포함된 페인트(FCP) 2.1초 1.3초
속도 지수 3.7초 2.4초
최대 함량 페인트(LCP) 2.1초 1.3초
인터랙티브 시간 3.7초 1.3초

Beaver Builder가 Divi보다 페이지 크기가 작고 로드 시간이 짧고 요청이 적은 것을 볼 수 있습니다. 가장 중요한 것은 Google PageSpeed ​​Insights 점수에서 완벽한 100 점을 받았고 FCP와 LCP를 줄였습니다.

테스트 #2(페이지 빌더 + 테마가 있는 간단한 텍스트)

두 번째 테스트 설정에서는 다음 구성을 사용했습니다.

  • 첫 번째 사이트: Divi 테마(Divi Builder 플러그인 내장)
  • 두 번째 사이트: Beaver Builder 테마 + Beaver Builder 플러그인

이 테스트는 사이트에 테마가 설치된 두 페이지 빌더의 성능을 확인하기 위한 것입니다.

이는 두 페이지 빌더 모두 자신의 테마에 가장 잘 맞는다고 광고하기 때문에 중요하므로 이 테스트는 이것이 성능에 영향을 미치는지 여부를 알아낼 것입니다.

Pingdom 결과

디비 빌더 비버 빌더
페이지 크기(kb) 411.9 54.1
로드 시간(밀리초) 681 380
요청 16 9

Google PageSpeed ​​Insights 점수

디비 빌더 비버 빌더
모바일 점수 81 100
첫 번째 콘텐츠가 포함된 페인트(FCP) 2.9초 1.2초
속도 지수 4.3초 2.3초
최대 함량 페인트(LCP) 3.3초 1.2초
인터랙티브 시간 3.6초 1.2초

이 테스트 후에 우리는 Beaver Builder가 여전히 Divi보다 빠르다는 것을 알 수 있습니다.

둘 다 Pingdom 결과는 각각의 테마에서도 거의 동일하지만 Divi 테마와 빌더가 있는 첫 번째 사이트는 PageSpeed ​​Insights 점수에서 87점에서 81점으로, FCP는 2.1점에서 더 높은 점수를 받았습니다. 2.9초로.

이제 실제 페이지를 사용하여 성능 데이터를 얻은 세 번째이자 마지막 테스트를 살펴보겠습니다.

테스트 #3(페이지 빌더 + 테마가 있는 콘텐츠 페이지)

이 설정에서는 페이지에 일부 콘텐츠를 추가했습니다. 다음은 두 사이트 페이지에서 사용한 정확한 콘텐츠 요소입니다.

  • 텍스트
  • 단추
  • 아코디언
  • 이미지(이미지 크기 64KB, JPG 형식)
  • 문의 양식
Divi를 사용하여 만든 간단한 웹 사이트

이 테스트를 위해 당사에서 만든 Divi Builder 설정이 포함된 첫 번째 사이트입니다.

Beaver Builder를 사용하여 만든 간단한 웹 사이트

이 테스트를 위해 우리가 만든 Beaver Builder 설정이 있는 두 번째 사이트.

Pingdom 결과

디비 빌더 비버 빌더
페이지 크기 542.2 272.3
로드 시간 699 529
요청 20 19

Google PageSpeed ​​Insights 점수

디비 빌더 비버 빌더
모바일 점수 76 96
첫 번째 콘텐츠가 포함된 페인트(FCP) 2.6초 1.8초
속도 지수 5.9초 2.3초
최대 함량 페인트(LCP) 3.6초 2.6초
인터랙티브 시간 4.5초 1.8초

이 테스트에서 Beaver Builder는 다시 Divi보다 훨씬 더 나은 성능을 보였습니다. Beaver Builder의 사이트는 놀라운 PageSpeed ​​Insights 점수가 96 점(Divi의 76 점에 불과함)과 Divi보다 50% 적은 페이지 크기 를 가지고 있습니다.

전반적으로 Beaver Builder가 더 작은 페이지 크기, 더 적은 요청, 더 나은 PageSpeed ​​Insights 점수로 Divi보다 일관되게 더 나은 성능을 발휘 하고 있음을 알 수 있습니다.

따라서 우아한 테마는 Divi를 빠르게 만들기 위해 노력하고 있는 것처럼 보이지만 속도와 성능 면에서 Beaver Builder와 경쟁하려면 여전히 많은 작업이 필요합니다.


SEO: Divi 대 비버 빌더

Beaver Builder와 Divi는 모두 100% 모바일 반응형이며 Yoast 또는 RankMath와 같은 타사 플러그인과 통합할 준비가 되어 있기 때문에 SEO 친화적인 웹사이트 빌더입니다.

비버 빌더

Beaver Builder 플러그인은 코드가 깔끔하고 중복성을 피하기 때문에 최고의 SEO 표준을 갖춘 정말 좋은 Divi 대안입니다. 예를 들어, 이 웹 사이트 빌더는 코드 압축 및 스키마 마크업을 잘 활용하여 페이지를 쉽게 검색할 수 있도록 합니다.

Beaver의 페이지 속도 성능도 빠르며 원하는 경우 최적화된 CSS를 통해 속도를 더욱 높일 수 있습니다. 이상적으로는 Beaver SEO를 최대한 활용하려면 타사 플러그인 을 다운로드해야 합니다.

디비

Divi SEO 설정
Divi SEO 설정

Divi가 단축 코드를 기반으로 한다는 것은 알려진 사실이며(분명히 이것은 코드를 Beaver만큼 깔끔하지 않게 만듭니다) 일부 전문가들은 단축 코드 기반 구조가 Divi 웹사이트의 속도를 늦춘다고 생각합니다.

우리 모두 알고 있듯이 사이트 속도는 SEO에 중요 하지만 그것이 전부는 아닙니다 .

따라서 짧은 코드 기반 구조에도 불구하고 Divi는 여전히 훌륭한 SEO를 지원할 수 있습니다. 예를 들어 메타 설명, 메타 키워드 및 표준 URL을 활성화할 수 있습니다.

타사 플러그인을 다운로드하여 이 웹사이트 빌더의 SEO 기능을 확장할 수도 있습니다. Divi는 RankMath를 권장하지만 원하는 SEO 플러그인을 사용할 수 있습니다.

마지막으로, SEO는 주로 콘텐츠에 따라 달라집니다. 더 나은 콘텐츠는 Divi와 Beaver Builder 모두에서 기대할 수 있는 더 나은 SEO 결과를 제공합니다.


WordPress Gutenberg Editor와의 호환성

WordPress 기본 편집기라고도 하는 Gutenberg는 제한된 방식으로 Beaver 및 Divi와 호환됩니다. 기본적으로 WordPress 5.0이 있으면 Gutenberg 또는 웹사이트 빌더의 편집기 중에서 선택할 수 있습니다.

비버 빌더

비버 구텐베르크 설정
비버 빌더와 구텐베르크

WordPress용 Beaver Builder를 사용하면 선택한 페이지, 게시물 또는 블록에서 "...로 변환" 기능을 통해 Gutenberg Editor와 Beaver 간에 콘텐츠를 변환할 수 있습니다.

그러나 일부 데이터가 손실될 수 있으므로 두 번 이상 앞뒤로 전환하지 않도록 경고합니다.

디비

Gutenberg의 Divi 레이아웃 블록
구텐베르크 블록 중 Divi

원하는 경우 Divi를 사용하면 Gutenberg로 쉽게 편집할 수도 있습니다.

Gutenberg로 편집하려면 페이지 작성을 시작할 때 "기본 편집기 사용"을 클릭하기만 하면 됩니다. 저것과 같이 쉬운.

또한 Divi 레이아웃 블록을 사용하여 Gutenberg 내에서 Divi 레이아웃을 혼합 및 일치시킬 수 있으므로 두 편집기의 장점을 모두 누릴 수 있습니다.


Divi 및 Beaver Builder로 구축된 웹사이트

Divi Builder와 Beaver Builder는 모두 아름답고 기능적인 사이트를 만듭니다. 그들이 무엇을 할 수 있는지에 대한 감각을 제공하기 위해 다음은 Divi 및 Beaver로 구축된 웹사이트의 몇 가지 훌륭한 예입니다.

디비

예 #1

순종 건설 웹 사이트

Thoroughbred Construction의 이 예는 간단하면서도 매력적입니다. 뛰어난 색 구성표와 단추를 잘 사용하는 이 웹 페이지는 최고의 사용자 경험을 제공합니다.

예 #2

노매드 캐피털리스트 웹사이트

이 멋진 사이트 Nomad Capitalist에는 전폭 비디오와 이미지가 있으며 아이콘, 글꼴, 상자 및 색상과 같은 요소를 잘 활용하여 세련된 모양을 완성합니다.

예 #3

마음의 평화 치과 스튜디오 웹 사이트

Peace of Mind Dental Studio는 세련된 디자인과 아름다운 드롭다운 탐색을 통해 원하는 것을 쉽게 찾을 수 있습니다. 외관은 깨끗하지만 정보와 리소스로 가득 차 있습니다.

비버 빌더

예 #1

디지덴 웹사이트

DigiDen은 글꼴, 시각 자료 및 버튼을 많이 사용하여 매력적인 레이아웃을 제공합니다. 또한 페이지를 아래로 스크롤할 때 사진 격자를 훌륭하게 사용합니다.

예 #2

컬럼비아 인더스트리 웹사이트

Columbia Industry의 사이트는 효과적인 이미지의 적절한 균형을 유지합니다. 전체 너비 이미지와 그리드 버튼을 사용하면 탐색이 쉽고 아름답습니다.

예 #3

스토리 개더링 홈페이지

Story Gatherings에는 절대적으로 멋진 전체 페이지 비디오 영웅이 있지만 전체 너비 섹션에서 정보를 잘 구성합니다. 작업을 보여주는 놀라운 버튼, 영상 및 애니메이션이 있습니다.


비활성화: Beaver Builder 대 Divi Builder

마음이 바뀌거나 새로운 솔루션을 찾은 경우 플러그인을 비활성화하면 콘텐츠가 어떻게 되는지 알고 싶을 수 있습니다.

Beaver Builder와 Divi는 여기에 몇 가지 유사점과 차이점이 있습니다 .

Beaver Builder를 비활성화하면 모든 디자인이 손실되지만 콘텐츠는 계속 사용할 수 있습니다. 표시되는 동안 페이지에 표시되는 모양이 마음에 들지 않을 수 있습니다.

Divi 플러그인을 비활성화하면 콘텐츠가 일반 단어 대신 단축 코드로 렌더링됩니다.

그러나 두 빌더가 콘텐츠와 디자인을 비활성화 전 상태로 되돌리려면 한 번의 활성화 클릭이 필요합니다.

🔔 참고:

위에서 언급했듯이 Divi를 사용하는 경우 플러그인을 다시 활성화하여 항상 이 단축 코드 엉망을 콘텐츠로 다시 변환할 수 있으므로 반드시 잃어버리지는 않습니다. 그러나 웹 사이트 빌더를 변경하는 경우 콘텐츠를 수동으로 전송해야 할 수도 있습니다.


문서 및 고객 지원

고객 지원과 관련하여 Beaver Builder 또는 Divi는 잘못될 수 없습니다.

두 웹 사이트 빌더 모두 기술 및 비기술적 문제에 대한 중요한 문서 , 도움말 센터 및 고객 지원을 보유하고 있습니다.

비버 빌더

비버 지원 페이지
Beaver Builder 지원 페이지

Beaver는 G2에서 별 4.5/5개를 받으며 고객의 높은 평가를 받았습니다. 단계별 가이드와 드릴다운 주제가 있는 지식 기반을 모두 제공합니다. 이 지식 기반은 당신의 삶을 더 쉽게 만들어 줄 수 있는 매우 철저합니다.

말할 것도 없이 Beaver에는 기술적인 문제에 대한 티켓을 제출할 수 있는 지원 시스템도 있습니다.

G2에 대한 비버 리뷰

디비

우아한 테마 문서 페이지
Divi 문서 페이지

Divi에는 일반적인 문제에 대한 방법 기사 및 비디오를 제공하는 강력한 문서 섹션이 있습니다.

이 기사는 따라하기 쉽기 때문에 필요한 정보를 얻을 수 있습니다. Divi의 지원 센터는 특정 질문이나 문제에 대한 답변은 물론 새 릴리스에 대한 업데이트도 제공합니다.

마지막으로 24시간 연중무휴 채팅 지원 시스템 에서 Divi에 연락하여 질문에 대한 답변을 얻을 수 있습니다.

보너스로 거대한 Divi 커뮤니티가 있으므로 대부분의 Divi 관련 질문에 대한 빠른 Google 검색으로 답변을 빠르게 찾을 수 있습니다.


사용 가능한 설정

Divi 대 Beaver Builder의 사용 가능한 설정을 자세히 살펴보겠습니다.

기본적으로 Divi는 작업할 수 있는 보다 강력한 설정 패널을 제공합니다.

그러나 모든 종소리와 휘파람이 필요하지 않은 경우 Beaver Builder에는 시작하는 데 필요한 기본 설정이 있습니다.

비버 빌더

Beaver Builder 모듈 설정
비버 설정

Beaver Builder 설정을 통해 모듈 켜기/끄기, 게시물 유형 및 아이콘을 비롯한 가장 중요한 컨트롤에 액세스할 수 있습니다.

WordPress 댓글을 비활성화하고 사용자 액세스 권한을 설정하여 제어를 관리할 수도 있습니다.

디비

Divi 일반 설정
Divi 설정/옵션

대조적으로, Divi의 사용 가능한 설정은 광범위한 선택을 제공합니다.

여기에서 일반 설정에서 사이트의 로고, 탐색 모음, 색상 팔레트 및 소셜 아이콘을 설정할 수 있습니다.

또한 댓글, 광고 및 SEO 옵션과 같은 보다 구체적인 사항을 제어할 수 있습니다.

여기에서 가장 흥미로운 설정 중 일부는 Divi 사진 갤러리 를 활성화하는 기능(놀라운 작은 기능임)과 게시물의 첫 번째 이미지에서 미리보기 이미지를 자동 생성하는 기능을 포함합니다.

이러한 추가 기능은 일반 설정을 넘어 사이트 비주얼을 향상시키는 데 도움이 될 수 있습니다.


타사 애드온

Divi와 Beaver Builder 중에서 결정할 때 최고의 타사 애드온을 허용하는 것이 무엇인지 확인할 수 있습니다.

운 좋게도 두 도구 모두 흥미로운 타사 빌더에 대한 액세스를 제공합니다.

비버 빌더

파워팩 웹사이트

Beaver Builders는 70개 이상의 모듈과 350개 이상의 행 및 페이지 템플릿 이 포함된 PowerPack을 제공합니다. 여기에는 전문적이고 모바일에 최적화된 디자인과 목차, 소셜 공유, 슬라이딩 메뉴와 같은 유용한 모듈이 포함됩니다.

Ultimate Addons와 같은 다른 개발자의 타사 플러그인을 사용하거나 WordPress에서 호환되는 플러그인을 다운로드할 수도 있습니다(대부분!).

디비

Divi 확장 페이지

Divi에는 자체 Bloom 및 Monarch 외에도 우수한 애드온 플러그인이 있습니다.

50개 이상의 새로운 구성 가능한 옵션을 제공하는 Divi Booster 및 Divi Switch와 같은 좋아하는 타사 애드온도 추천합니다.

다른 필수 Divi 애드온에는 이벤트 캘린더, 블로그 추가 기능, 회전 목마 등과 같은 플러그인이 포함됩니다. 선택의 폭이 넓습니다!

또한 확인하십시오: Beaver Builder 대 Elementor


모바일 응답성

반응성과 관련하여 Divi와 Beaver는 모두 뛰어난 모바일 웹 디자인을 위한 도구를 제공하는 모바일 우선 빌더입니다. 모바일 설정을 사용자 정의할 수 있으므로 콘텐츠가 올바르게 렌더링되도록 디자인을 쉽게 조정할 수 있습니다.

비버 빌더

비버 모바일 설정
Beaver Builder 응답성 설정

시작하려면 Beaver 테마가 최상의 결과를 제공합니다. 그러나 모바일 친화적인 테마를 선택하고 일부 설정을 조정하여 멋지게 만들 수 있습니다.

반응형 편집 모드에서 데스크톱, 태블릿, 모바일 간에 서로 다른 설정을 지정할 수 있습니다.

사용자 정의가 더 필요한 경우에 대비하여 Beaver Themer 도구를 사용하여 페이지에 반응형 레이아웃을 구축할 수도 있습니다.

디비

Divi는 또한 데스크톱, 태블릿 및 모바일용 보기 및 설정이 포함된 반응형 편집 형식을 자랑합니다.

모든 것이 모바일에서 잘 렌더링되도록 사용자 정의된 설정을 쉽게 만들 수 있습니다. 모바일용 Divi 기능을 향상 시키기 위한 툴킷인 Divi Responsive Helper를 사용할 수도 있습니다. 이를 통해 모바일 웹 디자인 프로세스도 간소화할 수 있습니다.

Divi 반응형 도우미

테마 호환성

Beaver Builder와 Divi Builder의 테마 호환성 차이점을 검토해 보겠습니다.

모든 페이지 빌더와 마찬가지로 테마 선택이 중요 합니다. 일부는 다른 것보다 더 호환되기 때문입니다.

즉, WordPress Beaver Builder 및 Divi 모두에 호환되는 테마에 대한 옵션이 많이 있으며 기본적으로 모든 테마를 사용자 정의하여 멋지게 보이게 할 수 있습니다.

비버 빌더

비버 반응 설정

Beaver의 자체 테마 외에도 수십 가지 호환되는 테마 중에서 선택할 수 있습니다.

Beaver Builder는 Page Builder Framework, GeneratePress, Astra 및 Genesis Framework를 포함하여 몇 가지 최고의 호환 테마를 권장합니다.

물론 Beaver Builder 테마를 사용하여 원하는 WordPress 테마를 변형할 수도 있습니다!

디비

Divi 하위 테마 페이지
Divi 차일드 테마

Divi의 자체 테마는 항상 가장 호환되지만 옵션이 있습니다.

Divi의 한 가지 장점은 제공하는 수많은 레이아웃 팩입니다. Molti, Avanti, Phoenix, Josefin 등과 같은 최고의 테마를 포함하는 거대한 테마 시장에서 선택할 수도 있습니다.

타사 테마와 관련하여 Divi는 WordPress 테마에서 문제 없이 작동해야 합니다.


장점과 단점

비버 빌더

장점

  • 간단하고 사용자 친화적
  • 무료 버전 사용 가능
  • 코드를 정리하고 단축 코드 문제 없음
  • 라이브 미리보기로 JavaScript 코드 편집
  • 작업 속도가 매우 빠름
  • 대행사를 위한 화이트 라벨링 옵션
  • 다중 사이트 기능

단점

  • 고가 — 특히 Beaver Builder 테마를 선택하는 경우
  • 제한된 사전 제작 템플릿

디비 빌더

장점

  • 매우 강력한 Divi 비주얼 빌더
  • 백엔드 보기 및 와이어프레임 옵션
  • 평생 계획으로 돈을 위해 큰 가치
  • 전문적으로 설계된 사전 구축 레이아웃의 거대한 라이브러리
  • Bloom 및 Monarch와 함께 번들 제공
  • 분할 테스트 및 리드 생성 도구와 같은 다양한 내장 마케팅 기능

단점

  • 단축 코드 기반 접근 방식이므로 깨끗한 코드가 없습니다(그러나 페이지 빌더를 변경할 계획이 없는 경우에는 괜찮음).
  • 더 많은 서버 리소스가 필요하고 때때로 약간 느릴 수 있습니다.
  • 사용 가능한 무료 옵션 없음(대신 데모 버전을 사용해 볼 수 있음)

어느 것을 선택해야 합니까?

Beaver 또는 Divi와 함께 잘못 갈 수 없습니다. 둘 다 귀하의 웹사이트에 완벽할 수 있는 훌륭한 도구 입니다.

Divi와 Beaver Builder 중에서 선택하는 데 도움이 되도록 몇 가지 지침이 있습니다.

다음과 같은 경우 Beaver를 사용해야 합니다.

큰 학습 곡선이 필요하지 않은 사용하기 쉬운 편집기를 원합니다. 단축 코드 문제 없이 뛰어난 사이트 성능과 깔끔한 ​​코드를 원합니다. 약정을 하기 전에 무료 버전을 사용해보고 싶습니다.

다음과 같은 경우 Divi를 사용해야 합니다.

수백 개의 미리 만들어진 템플릿과 방대한 테마 및 플러그인 시장에 액세스하기를 원합니다. 사이트를 고도로 맞춤화할 수 있는 옵션이 필요합니다. 연간 구독 대신 평생 구매에 대한 장기 투자를 원합니다.


가격: Divi 대 Beaver Builder

가격 책정과 관련하여 Beaver Builder와 Divi에는 모두 무제한 웹 사이트가 포함되어 있습니다. 즉, 페이지 빌더를 사용할 수 있는 사이트 수에는 제한이 없습니다.

비버 빌더 가격

비버 가격 페이지
  • 제한된 모듈로 영원히 무료 플랜
  • 무제한 사이트 라이선스가 포함된 99달러의 표준 요금제
  • $199의 Pro 플랜과 Standard의 모든 것, Beaver Builder 테마 및 다중 사이트 기능
  • Pro 플랜과 화이트 라벨링 옵션의 모든 것이 포함된 399달러의 에이전시 플랜

Divi 빌더 가격

Divi 가격 페이지
  • 모든 우아한 테마 제품(Divi, Extra, Bloom 및 Monarch)에 대한 액세스, 수백 개의 웹사이트 팩, 프리미엄 지원 및 무제한 웹사이트 사용을 포함하는 연간 $89의 연간 액세스 플랜.
  • $249의 일회성 결제로 평생 액세스할 수 있으며 이후에는 반복되는 연간 요금이 없습니다.

Divi와 비교할 때 Beaver Builder는 비용이 많이 듭니다. 특히 Beaver Builder 대 Divi 시작 계획을 보면 더욱 그렇습니다. Beaver Builder 테마를 얻으려면 더 많은 비용을 지출해야 하지만 Divi Builder는 연간 및 평생 계획 모두에서 Divi 테마와 함께 제공됩니다.

따라서 결정하기 전에 두 페이지 빌더의 데모를 모두 시도하고 필요에 가장 적합한 페이지 빌더를 얻을 수 있습니다.

또한 두 페이지 빌더 모두에 대해 30일 동안 묻지 않는 환불 정책 이 있으므로 위험 부담이 전혀 없습니다. 마음에 들지 않으면 전액 환불을 요청할 수 있습니다.


Beaver Builder 대 Divi Builder에 대한 최종 생각

Divi와 Beaver Builder를 비교할 때 둘 다 블로거, 소규모 사업자, SEO, 숙련된 개발자 및 코딩 없이 웹사이트를 구축하려는 모든 사람에게 적합합니다.

Divi는 초보자를 위한 훌륭한 Beaver Builder 대안이며 전체 웹사이트 디자인 프로세스를 간소화하는 수백 개의 미리 만들어진 템플릿을 제공합니다.

프리랜서이거나 웹 디자인 에이전시를 운영하는 경우 Divi는 Elegant Themes 평생 요금제를 사용하여 반복적으로 비용을 지불할 필요가 없고 웹 사이트의 수에 제한 없이 제품을 사용할 수 있으므로 좋은 투자가 될 것입니다. .

Beaver Builder는 모든 기본 기능과 필요한 사용자 정의 옵션을 갖춘 또 다른 강력한 WordPress 페이지 빌더입니다. 라이트 버전은 프리미엄 버전으로 업그레이드하기 전에 사용해 보는 것도 좋습니다.

두 제품 모두 훌륭하고 어느 하나를 잘못 사용하기가 정말 어렵습니다. 따라서 여기에서 개인 취향에 더 많은 영향을 미칩니다.

위의 비교 분석이 WordPress 웹 사이트의 요구 사항을 더 잘 충족하는 빌더를 더 잘 이해하는 데 도움이 되기를 바랍니다.

Beaver Builder 대 Divi – FAQ

Beaver와 Divi 중 하나를 선택하면 질문이 생기는 것이 정상입니다. 다음은 가장 자주 발생하는 몇 가지 FAQ입니다.


🎨 궁극의 Divi 리뷰는 여기에서 확인하세요 ➡️


🔔 다음 사항 도 확인하세요:

  • 디비 대 엘리멘터
  • 비주얼 작곡가 대 디비
  • 디비 대 아바다
  • 디비 대 Wix
  • 디비 대 테마파이
  • Divi 대 Thrive Architect
  • 디비 대 제네시스
  • 산소 대 비버 빌더
  • 비버 빌더 대 Elementor