Elementor gegen Gutenberg

Veröffentlicht: 2022-10-18

Wer liebt nicht einen guten Kampf? Wir denken, dass wir für Sie eine ziemlich epische Website gefunden haben, wenn es um die Erstellung von Websites geht.

In dieser Ecke haben wir Elementor – den selbsternannten „König der WordPress-Seitenersteller“ (ihre Worte, nicht unsere). Und in der anderen Ecke ist Gutenberg, der neue Editor, der mit WordPress vorinstalliert ist.

Beide Builder haben ihre Stärken und Schwächen und es kann verwirrend sein, herauszufinden, welcher der richtige für Sie ist. Um zu verstehen, was jeder zu bieten hat, finden Sie hier einen detaillierten Vergleich von Elementor und Gutenberg:

Inhaltsverzeichnis

Was ist Elementor?

Elementor ist ein kostenloses und quelloffenes Drag-and-Drop- Seitenerstellungs -Plugin für WordPress. Es wurde mit der Idee entwickelt, die Webentwicklung für alle einfacher zu machen, unabhängig von ihrer Programmiererfahrung.

Es wurde von Yoni Luksenberg erstellt, der seit über 20 Jahren Websites entwickelt. Da er den Webdesign-Prozess als langsam und ineffizient empfand, wollte er etwas schaffen, das Menschen dabei hilft, schöne Websites zu erstellen, ohne Code schreiben zu müssen. Elementor wurde im Mai 2016 eingeführt und ist seitdem schnell gewachsen und hat sich zu einem der beliebtesten WordPress-Plugins der Geschichte entwickelt.

Mit Elementor können Sie jede Art von Website erstellen: Zielseiten, Online-Websites für Lebensläufe/Portfolios, Unternehmenswebsites und mehr – alles von Grund auf neu oder mit vorgefertigten Vorlagen. Sie können auch vorhandene Themen anpassen, um die gewünschten Ergebnisse zu erzielen – es gibt keine Einschränkungen.

Hauptmerkmale von Elementor

Im Folgenden sind die wichtigsten Funktionen dieses Seitenerstellers aufgeführt:

  • Drag-and-Drop-Editor
  • Über 100 Widgets
  • Theme-Builder
  • Globale Bearbeitung
  • Responsive Bearbeitung
  • Kann atemberaubende, verspielte Eingangs- und Ausgangsanimationseffekte erstellen
  • Hat über 90 Website-Kits
  • Kommt mit über 300 bereits erstellten Vorlagen
  • Sie können Ihrem Design benutzerdefinierte CSS-Codes hinzufügen
  • Es verfügt über WooCommerce-, Popup-, Formular- und Zielseitenersteller
  • Integriert sich in zahlreiche SEO-Plugins

Warum sollten Sie Elementor verwenden?

Einfach zu bedienen: Mit Elementor müssen Sie sich keine Programmierkenntnisse aneignen, um eine schöne Website zu erstellen. Der Editor ist Drag-and-Drop-basiert und ermöglicht es Ihnen, Seiten mithilfe von Widgets, die einfach per Drag-and-Drop an Ort und Stelle gezogen werden können, visuell zu gestalten.

Sie können auch einfach eine Vorlage auswählen – es gibt Hunderte von Vorlagen, die über das Plugin verfügbar sind – passen Sie sie an Ihre Bedürfnisse an und fahren Sie mit der Erstellung neuer Seiten oder Beiträge für Ihre Website fort!

Beeindruckende vorgefertigte Designs und Vorlagen: Elements wird mit vorgefertigten Designs und Vorlagen geliefert, die helfen, Zeit zu sparen. Diese Designs sind gut gestaltet und für Conversions optimiert, was bedeutet, dass sie auf Benutzeraktionen ausgelegt sind!

Es würde Stunden dauern, diese von Grund auf neu zu entwerfen. Wenn diese Funktion also nicht Grund genug ist, weiß ich nicht, was sonst jemanden vom Gegenteil überzeugen könnte!

Echtzeitvorschau: Elementor verfügt über eine Live-Vorschaufunktion, die es meinen Kunden ermöglicht, die vorgenommenen Änderungen zu sehen, sobald sie vorgenommen werden, anstatt zu warten, bis alles abgeschlossen ist, bevor sie alles auf einmal überprüfen (was uns beiden Zeit spart!). Wenn etwas nicht richtig aussieht, können wir auch zurückgehen, ohne wieder von vorne beginnen zu müssen

Was ist Gutenberg?

Gutenberg (alias „der neue Inhaltseditor in WordPress “) ist bereits Teil Ihres Lebens, wenn Sie dies lesen. Ob Sie es verwendet haben oder nicht, es ist bereits ein großer Teil von WordPress.

Der Block Page Builder ist der Standardeditor für alle WordPress-Sites und -Beiträge, die nach seiner Veröffentlichung im Jahr 2018 (WordPress 5.0) erstellt wurden.

Der Name „Gutenberg“ ist eine Anspielung auf Johannes Gutenberg, einen Wissenschaftler, der in den 1450er Jahren den Buchdruck mit beweglichen Lettern erfand und die Art und Weise, wie wir kommunizieren, veränderte.

Stellen Sie sich Gutenberg am besten als das Textverarbeitungsprogramm vor, das MS Word oder Google Docs entspricht, aber ausschließlich für WordPress-Sites entwickelt wurde und den alten klassischen Editor ersetzt, der seit 2005 verwendet wird.

Hauptmerkmale von Gutenberg

Nachfolgend sind die wichtigsten Funktionen dieses Blockeditors aufgeführt :

  • Verwendet Blöcke, um Inhalte und Seiten zu erstellen
  • Es ist keine Codierung erforderlich, um die Blöcke zu erstellen
  • Entwickelt mit moderner Technologie, um sicherzustellen, dass es schnell und zuverlässig ist
  • Unterstützt Galeriefotos
  • Verfügt über einen Bildeditor, mit dem Sie die Größe des Editors ändern, zoomen usw. können

Warum sollten Sie Gutenberg verwenden?

Warum sollten Sie Gutenberg verwenden? Nun, werfen wir einen Blick auf die Vorteile, die sich daraus ergeben.

  • Wiederverwendbare Blöcke erstellen: Der neue Blockeditor macht es einfach, wiederverwendbare Inhaltsblöcke zu erstellen, die Sie über mehrere Posts und Seiten hinweg verwenden können. Mit dieser Funktion sparen Sie Zeit und sorgen für einen einheitlichen Stil auf Ihrer Website. Call-to-Action-Boxen, Produkt-/Preistabellen, Bildergalerien usw. sind einige der Beispiele für wiederverwendbare Blöcke, die mit der Drag-and-Drop-Oberfläche von Gutenberg erstellt werden können.
  • Erweiterte Widgets und Bearbeitungswerkzeuge: Gutenberg enthält zahlreiche Widgets, die Sie in Spalten oder anderen Bereichen Ihres Designs platzieren können. Einige beinhalten Shortcode, Neueste Beiträge, Kategorien, Tag Cloud und Archive. Diese Widgets machen es für Nicht-Entwickler sehr einfach, zusätzliche Inhalte innerhalb des Seitenlayouts zu platzieren, ohne über technische Kenntnisse oder Programmierkenntnisse zu verfügen.
  • Integriert sich in alle Plugins und Themes von Drittanbietern: Da Gutenberg jetzt Teil des WordPress-Kerns ist, hindert nichts Dritte daran, Kompatibilität mit ihren Plugins und Themes hinzuzufügen.

Gutenberg vs. Elementor: Haben sie Gemeinsamkeiten?

Ja, die beiden Builder haben einige Gemeinsamkeiten. Hier sind die Top 3:

  • Individuelle Bearbeitung: Sowohl Elementor als auch Gutenburg ermöglichen es Ihnen, einzelne Blöcke zu bearbeiten (ob es sich um einen Absatz, ein Bild oder etwas anderes handelt). Diese Funktion ist von Bedeutung, da sie zeigt, dass sich beide Seitenersteller die Zeit und Mühe genommen haben, diesen Bedarf zu decken.
  • Benutzerdefinierte Layouts: Sie können sowohl mit Elementor als auch mit Gutenburg benutzerdefinierte Layouts erstellen. Mit anderen Worten, wenn Sie Ihren Text auf der linken Seite und ein Bild auf der rechten Seite haben möchten, können Sie dies ganz einfach erreichen!
  • Kompatibel mit Add-Ons von Drittanbietern: Wenn Sie die Funktionalität von Elementor oder Guttenberg erweitern möchten, sind viele kompatible Add-Ons online verfügbar. Wenn Sie beispielsweise nach einigen Anpassungsfunktionen in Ihren Formularen oder Galerien mit Gutenburg suchen, versuchen Sie es mit Advanced Forms. Wenn Sie mehr Kontrolle darüber haben möchten, wie Ihre Bilder mit Elementor aussehen, probieren Sie Image Intense aus.

Elementor vs. Gutenburg: Was sind die Unterschiede?

Elementor und Gutenburg sind zwei WordPress-Seitenersteller, die beide versprechen, das Erstellen von Websites für ihre Benutzer zu vereinfachen. Sie tun dies, indem sie blockbasierte Drag-and-Drop-Editoren bereitstellen, die das Entwerfen einer Website von Grund auf einfacher, schneller und intuitiver machen als die Verwendung der klassischen HTML-Bearbeitung.

Allerdings haben sowohl Elementor als auch Gutenburg ihre Unterschiede. Hier ist ein Vergleich dessen, was jeder zu bieten hat:

Kosten

Wenn die Kosten ein Faktor bei Ihrer Entscheidung sind, gewinnt Gutenberg diese Runde zweifellos. Elementor ist ein Premium-Plugin, das je nach gewähltem Plan 49 bis 999 US-Dollar pro Jahr kostet. Die kostenlose Version ist stark eingeschränkt und enthält nicht viele der Elemente, die Sie beim Erstellen Ihrer Websites verwenden möchten, z. B. Formularfelder, Galerien oder Flipboxen.

Gutenberg ist kostenlos mit WordPress 5.0 und höher. Wenn Sie eine ältere WordPress-Site haben und sich jetzt (oder in Zukunft) für ein Upgrade auf 5.0 entscheiden, wird Gutenberg ohne zusätzliche Kosten mitfahren.

Merkmale

Elementors Anspruch auf Berühmtheit waren schon immer seine erweiterten Funktionen. Damit können Sie mehr Dinge auf Ihrer Website tun als Gutenberg.

Beginnen wir mit dem visuellen Editor. Elementor ist viel einfacher zu bedienen und enthält eine Menge Vorlagen, Abschnitte und Widgets, die Sie nach Belieben anpassen können.

Wenn Sie eine E-Commerce-Seite benötigen, hat Elementor sie, während Gutenberg sie noch nicht einmal hat. Sie können auch detaillierte Spalten, Zeilen, Kopfzeilen, Fußzeilen und Seitenleisten innerhalb von Elementor erstellen.

Benutzerfreundlich

Gutenberg ist extrem einfach zu bedienen und die Benutzeroberfläche (UI) hat ein unkompliziertes Layout-Design.

Die Benutzeroberfläche bei der Verwendung von Elementor ist noch einfacher. Sie haben eine schöne Drag-and-Drop-Oberfläche erstellt, mit der Sie mit nur wenigen Mausklicks Seiten am Frontend Ihrer Website erstellen können.

Lernkurve

Wenn Sie Erfahrung mit Seitenerstellern haben, wird das Erlernen von Gutenberg einfach sein. Wenn Sie jedoch ein absoluter Neuling sind, müssen Sie sich möglicherweise einige Video-Tutorials ansehen, bevor Sie den Dreh raus haben.

Wenn Sie andererseits nichts über Seitenersteller und Websites im Allgemeinen wissen, dann ist Elementor genau das Richtige für Sie. Es enthält viele vorgefertigte Vorlagen, die Sie nach Herzenslust installieren und anpassen können.

Jeder Builder hat seine Lernkurve, aber sobald Sie gelernt haben, wie man sie benutzt, ist es nicht so schwer.

Leistung

Es besteht kein Zweifel, dass Elementor in Bezug auf Funktionen und Anpassungen einer der besten Seitenersteller ist. Bei all den Funktionen können Sie jedoch davon ausgehen, dass viel Code auf Ihre Website geladen wird. Daher kann sich dies auf die Gesamtleistung Ihrer Website auswirken.

Der Gutenberg-Seitenersteller ist Teil des WordPress-Kerns und wird daher im Vergleich zu Elementor, das viel Bloatware enthält, schnell geladen. Die Seitenladezeit spielt eine wichtige Rolle, wenn es um SEO-Performance und User Experience (UX) geht. Wenn Sie also nach blitzschneller Geschwindigkeit suchen und in Suchmaschinen einen höheren Rang einnehmen möchten, empfehlen wir Ihnen, den Gutenberg-Editor anstelle von Elementor zu verwenden.

Gutenberg-Seiten schneiden besser ab als Elementor, wenn sie mit Tools wie Google Page Speed ​​Insights oder GTMetrix getestet werden

Backend und Frontend

Wenn Sie neu in der Welt von WordPress sind, wissen Sie vielleicht nicht, dass es mehr als eine Möglichkeit gibt, den Inhalt einer WordPress-Website zu bearbeiten. Es gibt zwei Arten von Editoren: Backend- und Frontend- (oder Live-) Editoren. Die Art, die Sie verwenden, liegt bei Ihnen und hängt weitgehend von Ihren Vorlieben und Ihrem Komfort mit der Technologie ab.

Gutenberg ist ein Backend-Editor, d. h. wenn Sie ihn verwenden, arbeiten Sie direkt in derselben Umgebung, die Ihre Website-Leser sehen werden, sobald Ihr Beitrag oder Ihre Seite veröffentlicht wurde. Wenn Sie beispielsweise ein Element verschieben oder für einen Teil Ihres Textes eine andere Schriftgröße testen möchten, werden diese Änderungen erst nach Veröffentlichung der Seite für Sie sichtbar.

Auf der positiven Seite ist jedoch, wenn beim Bearbeiten eines Beitrags oder einer Seite in Gutenberg etwas schief geht (es passiert), ist es einfacher, dieses Problem zu beheben. Ja – Ihre gesamte Bearbeitungsarbeit wurde in einer vertrauten Umgebung durchgeführt, in der Sie sich leicht bewegen können.

Elementor ist sowohl ein Frontend- als auch ein Backend-Editor. Bei Verwendung des Seitenerstellers für einen Beitrag, eine Seite oder einen Entwurf. Dabei spielt es keine Rolle, ob Sie im Backend- oder im Frontend-Modus arbeiten. Sie können unabhängig vom verwendeten Modus alle Arten von Änderungen und Bearbeitungen vornehmen.

Theme-Kompatibilität

Es ist entscheidend, dass das von Ihnen gewählte Plugin mit Ihrem Thema kompatibel ist! Wenn dies nicht der Fall ist, können Sie es schließlich nicht verwenden.

Gutenberg ist ein Standard-WordPress-Editor und funktioniert mit jedem Thema. Da es jedoch Ihre Themeneinstellungen und -stile oder -farben nicht ändert, sehen die von Ihnen erstellten Inhalte möglicherweise nicht so fein abgestimmt aus, wie Sie es möchten. Wenn Sie also über die Einschränkungen von Gutenberg hinausgehen möchten, benötigen Sie ein Elementor-kompatibles Thema.

Elementor funktioniert perfekt mit allen WordPress-Themen, macht aber einen besseren Job, wenn es mit Premium-Themen verwendet wird, die speziell für Elementor entwickelt wurden. Wenn Sie eines dieser Themen auswählen (und es gibt viele davon), werden alle Standardeinstellungen synchronisiert, sodass es keine Konflikte zwischen ihnen und Ihren in Elementor erstellten Website-Elementen gibt.

Redaktionsfreiheit

Was ist mit der Bearbeitungsfreiheit? Es steht Ihnen frei, den Inhalt in Gutenberg zu ändern, aber das Seitenlayout ist tabu. Sie können die Fußzeile, Seitenleiste, Kopfzeile oder andere globale Elemente des Editors nicht bearbeiten. Elementor gibt Ihnen die vollständige Kontrolle über alle Elemente auf der Seite.

Elementor ist auch flexibler, wenn es darum geht, benutzerdefinierte Vorlagen basierend auf bestimmten Arten von Inhalten zu erstellen. Es bietet vordefinierte Vorlagen für Beiträge und Seiten, die beliebig angepasst werden können

Welche soll man wählen?

Sie haben sich entschieden, einen Blog zu starten. Sie haben Ihren Domainnamen reserviert, einen Hosting-Plan ausgewählt und können loslegen. Jetzt ist es an der Zeit, das Plugin auszuwählen, das Ihnen die kreativen Optionen bietet, die Sie benötigen, während die Dinge im Backend reibungslos laufen.

Wenn Sie nur nach einem Tool zum Erstellen einer einfachen Website suchen und nicht möchten, dass sie mit unnötigen Elementen aufgebläht (und damit langsam) wird, hat Guttenberg weniger überschüssigen Code als Elementor. Weniger Aufblähung bedeutet schnellere Ladegeschwindigkeiten, die höheren Suchmaschinenrankings entsprechen.

Die Aufrechterhaltung einer hohen Seitenladegeschwindigkeit ist für ein gutes Ranking in Suchmaschinen unerlässlich, ebenso wie die Verwendung eines ansprechenden Designs.

Was also, wenn Sie mehr als eine einfache Website wollen?

Wenn ja, ist Elementor wahrscheinlich die beste Wahl, da seine Benutzeroberfläche bei weitem einfacher und schneller ist, wenn es darum geht, kompliziertere Layouts wie Abschnitte und Spalten zu erstellen.

Und da wir alle wissen, wie wichtig SEO ist, müssen Sie eine schnell ladende Website entwerfen. Elementor kann auf Kosten eines weniger als perfekt optimierten Codes gehen (ein kleiner Preis für die Funktionalität). Es gibt jedoch Möglichkeiten, diesen aufgeblähten Code zu umgehen, z. B. die Verwendung von Plug-ins zum Entfernen von Aufblähungen wie Assets Cleanup, Perfmatters und so weiter.

Fazit

Sowohl Gutenberg als auch Elementor sind eine großartige Wahl für Anfänger, die nicht über viel technisches Wissen verfügen. Beide machen ihren Job gut, aber sie haben beide ihre Stärken und Schwächen. Jede eignet sich am besten für einen bestimmten Zweck.

Elementor ist am besten geeignet, wenn Sie Ihrer Website ein ausgefalleneres Erscheinungsbild verleihen möchten, mit zahlreichen vorgefertigten Vorlagen und Blöcken, aus denen Sie auswählen können. Es gibt Ihnen auch volle Bearbeitungsfunktionen für jede Seite.

Gutenberg hingegen macht es einfach, Schaltflächen, Tabellen, YouTube-Einbettungen und andere ähnliche Elemente hinzuzufügen. Es erstellt schnelle, aufblähungsfreie Seiten und ist ein Segen für Sie, wenn Sie mit Rändern und Auffüllen nicht vertraut sind.

Daher haben wir keinen klaren Gewinner. Der beste Seitenersteller für Sie hängt von Ihrem Budget, Ihren technischen Fähigkeiten und den Anforderungen an das Website-Design ab.

So fügen Sie eine Wunschliste in WooCommerce ohne Plugin hinzu