WordPress ist ein beliebtes Content-Management-System, das von Millionen von Menschen auf der ganzen Welt genutzt wird. Es ist eine großartige Plattform für die Erstellung professioneller Websites, und in diesem Blogbeitrag zeigen wir Ihnen, wie Sie dies in 6 einfachen Schritten tun können!
Eine professionelle Website mit WordPress zu erstellen ist einfach und jeder kann es tun! Befolge einfach die oben genannten Schritte und du wirst in kürzester Zeit eine gut aussehende, professionelle Website haben.
Wenn du diese Schritte befolgst, wirst du schnell und einfach eine professionelle Website mit WordPress erstellen können! Diese Anleitung erklärt Dir, wie Du eine Domain registrierst und ein Hosting auswählst. Eine Datenbank anlegst und WordPress installierst, ein Theme auswählst und das Layout anpasst, Seiten erstellst und Inhalte hinzufügst, Menüs anlegst und eine Hauptnavigation auswählst und benötigte Plugins installierst, um deine Website für Suchmaschinen zu optimieren, die die Sicherheit deiner Website zu erhöhen und Backups zu erstellen.
Registriere eine Domain und wähle ein Hosting aus
Der erste Schritt zur Erstellung einer professionellen Website mit WordPress besteht darin, einen Domainnamen zu registrieren und ein Hosting zu wählen. Ein Domainname ist die Adresse deiner Website (z.B. meinewebsite.de) und das Hosting ist der Ort, an dem deine Website im Internet steht.
Du kannst einen Domainnamen über einen Registrar wie IONOS oder Checkdomain registrieren oder direkt ein WordPress-Hosting inklusive Domain bei Anbietern wie IONOS oder HostPress buchen.
Was macht einen guten Domainnamen aus?
Der Domainname sollte leicht zu merken, kurz und einfach sein. Er sollte einen Bezug zu deinem Unternehmen oder dem Thema deiner Website haben und keine Ähnlichkeit mit anderen bekannten Marken oder Websites aufweisen.
Dein Hosting-Provider wird dir Anweisungen geben, wie du deinen Domainnamen mit deinem Hosting-Account verbinden kannst. Sobald deine Domain verbunden ist, kannst du mit dem nächsten Schritt fortfahren.
Was zeichnet ein gutes Hosting aus?
Ein gutes Hosting sollte dir ausreichend Performance, Speicherplatz und Bandbreite, einen sicheren Zugang, einen deutschsprachigen Kundensupport, eine Geld-zurück-Garantie und einfach zu bedienende Tools für die Erstellung deiner Website bieten.
Wichtig: Um eine Webseite rechtssicher zu hosten, solltest Du keinen Hoster außerhalb der EU verwenden!
Sobald du deinen Domainnamen registriert und das Hosting ausgewählt hast, kannst du zum nächsten Schritt übergehen!
Eine Datenbank erstellen und WordPress installieren
Jetzt, wo du einen Domainnamen registriert und ein Hosting gewählt hast, musst du eine Datenbank für WordPress erstellen. Eine Datenbank ist der Ort, an dem alle Daten deiner Website (z. B. Beiträge, Seiten, Bilder) gespeichert werden.
Die Erstellung einer Datenbank erfolgt normalerweise über phpMyAdmin, das in den meisten Webhosting-Kontrollpanels wie Plesk oder cPanel enthalten ist. Wenn du dir nicht sicher bist, wie das geht, frag einfach deinen Hosting-Anbieter um Hilfe.
Nachdem du die Datenbank erstellt hast, musst du WordPress installieren. Das kannst du über dein Hosting-Kontrollpanel oder mittels der Anleitung auf WordPress.org tun. Wenn du dir nicht sicher bist, wie du WordPress installieren sollst, kannst du deinen Hosting-Anbieter um Hilfe bitten.
Ein Theme auswählen und das Layout anpassen
Jetzt, wo WordPress installiert ist, ist es an der Zeit, ein Theme auszuwählen und das Layout deiner Website anzupassen. Ein Theme ist im Grunde eine Vorlage, die bestimmt, wie deine Website aussieht und funktioniert.
Es gibt Tausende von kostenlosen und kostenpflichtigen Themes für WordPress, so dass die Auswahl des richtigen Themes ein bisschen überwältigend sein kann. Wir haben eine Liste zusammengestellt, wo du hochwertige Themes finden kannst:
Wenn du ein Theme gefunden hast, das dir gefällt, kannst du es über dein WordPress-Dashboard installieren. Nachdem das Theme installiert ist, kannst du damit beginnen, das Aussehen deiner Website anzupassen.
Nimm dir etwas Zeit, um alle Funktionen und Optionen deines Themes zu erkunden. Viele Themes haben Einstellungen zum Ändern von Farben, Schriftarten, Layouts und mehr. Und wenn du noch mehr Kontrolle über das Aussehen deiner Website haben möchtest, kannst du einen WordPress-Entwickler beauftragen, dir bei der Anpassung deines Themes zu helfen.
Seiten erstellen und Inhalte hinzufügen
Jetzt, da das Layout deiner Website fertig ist, ist es an der Zeit, Inhalte hinzuzufügen! Du kannst Inhalte hinzufügen, indem du Beiträge und Seiten in deinem WordPress-Dashboard erstellst.
Ein Beitrag ist ein Inhalt, der in deinem Blog in umgekehrter chronologischer Reihenfolge angezeigt wird (vom neuesten zum ältesten). Eine Seite ist ein statischer Inhalt, der nicht im Blog-Bereich deiner Website angezeigt wird.
Einige Beispiele für Seiten sind: Über mich-Seite, Impressum, Datenschutz, Kontakt, Dienstleistungen, etc.
Um einen neuen Beitrag oder eine neue Seite zu erstellen, klicke einfach auf die Schaltfläche „Neu hinzufügen“ in deinem WordPress-Dashboard. Dann gibst du einen Titel ein und beginnst mit dem Schreiben deines Inhalts. Du kannst auch Bilder, Videos und andere Medien zu deinen Beiträgen und Seiten hinzufügen.
Wenn du mit dem Erstellen der Inhalte fertig bist, musst du sie veröffentlichen, damit sie auf deiner Website erscheinen!
Menüs anlegen und Hauptnavigation auswählen
Deine Website braucht ein Navigationsmenü, damit die Besucher/innen die gesuchten Inhalte leicht finden können. In WordPress kannst du Menüs im Bereich „Erscheinungsbild“ -> „Menüs“ in deinem Dashboard erstellen.
Beginne damit, ein neues Menü zu erstellen und füge die Seiten und Beiträge hinzu, die du aufnehmen möchtest. Du kannst auch Links zu anderen Websites, Kategorien, Tags usw. hinzufügen. Vergiss nicht, dein Menü zu speichern, sobald du alle Einträge hinzugefügt hast!
Dann musst du WordPress mitteilen, wo dein Menü auf deiner Website erscheinen soll. Die meisten Themes haben bestimmte Bereiche für Menüs, wie z. B. die Hauptnavigation, sowie Menüs im Kopf- oder Fußbereich.
Benötigte Plugins installieren
Je nach Art der Website, die du erstellst, musst du eventuell Plugins installieren, um zusätzliche Funktionen zu erhalten. Wenn du zum Beispiel einen Online-Shop einrichten willst, brauchst du ein eCommerce-Plugin wie WooCommerce. Oder wenn du ein Kontaktformular auf deiner Website einrichten willst, brauchst du ein Plugin wie Gravity Forms.
Es gibt Tausende von kostenlosen und kostenpflichtigen Plugins für WordPress, so dass die Auswahl der richtigen ein wenig überwältigend sein kann. Wir haben eine Liste zusammengestellt, in der du gute Plugins findest:
Du fragst Dich vielleicht, welche WordPress-Plugins man wirklich braucht. Das hängt natürlich davon ab, welche Funktionen Du auf Deiner Website einbinden willst. Es gibt ein paar wenige Must-have-WordPress-Plugins, die in keiner Installation fehlen sollten:
Ein SEO-Plugin, um deine Website für Suchmaschinen zu optimieren
Ein Sicherheits-Plugin, um deine Webseite abzusichern und ein Backup-Plugin, um deine Webseite zu sichern (kann auch vom Hoster angeboten werden, z.b. über Plesks WordPress Toolkit)
Dann gibt es natürlich noch, je nach Anwendungsfall und Funktionswunsch optionale Plugins.
Generell gilt jedoch: Je weniger Plugins, desto besser!
Wenn du die Plugins gefunden hast, die du brauchst, installiere und aktiviere sie über dein WordPress-Dashboard.
Zusammenfassung
Jetzt ist es an der Zeit, deine eigene professionelle Website mit WordPress zu erstellen! Wir hoffen, dass dieser Leitfaden hilfreich war. Wie du siehst, ist es nicht so schwierig eine professionelle Website mit WordPress zu erstellen.
Hast du Fragen dazu, wie du eine professionelle Website mit WordPress erstellst? Lass es uns in den Kommentaren unten wissen! Wir helfen dir immer gerne weiter.
Damit tritt es in direkte Konkurrenz zu den aktuellen Favoriten Kadence und Blocksy. Wir haben das Theme auf Herz und Nieren geprüft und unser Beispielprojekt (Skatedogz Skateboardschule) damit umgesetzt. Dieser Erfahrungsbericht enthüllt, ob es einen neuen Favoriten gibt oder ob du vielleicht besser bei Kadence oder Blocksy bleiben solltest.
Wie immer zeigt unser Mega-Tutorial das Theme bei der Umsetzung unseres Beispielprojekts. Viele Themes sehen oberflächlich schick aus, verursachen bei der täglichen Arbeit so viele Kopfschmerzen, dass die Suche nach dem nächsten Theme vor Vorne beginnt. Daher sind wir bei unseren Tests sehr kritisch. Nur so ist es möglich, Unzulänglichkeiten zu entdecken.
Die Möglichkeit eine komplette Demo-Webseite inklusive aller lizensierten Fotos und Illustrationen zu importieren und sofort damit online gehen zu können, ist wirklich einzigartig! In der Praxis ändert man natürlich einige Bilder und Texte, aber man braucht keine Angst mehr vor Abmahnungen wegen Platzhalter-Bildern zu haben! So schnell habe ich noch nie eine professionelle Webseite gebaut!
Die wichtigsten Features im Überblick
OceanWP liefert bereits in Free-Version viele interessante Features.
Stick Anything erlaubt das „Festkleben“ von Elementen im Viewport, etwa von Navigationselementen in der Sidebar.
Modal Window liefert Popup-Fenster mit beliebigen Inhalten, zum Beispiel für Formulare.
Post Slider präsentiert Beiträge als Slider.
Custom Sidebar erstellt beliebig viele Sidebars für eigene Widgets.
Product Share bietet Social Sharing-Buttons für Produktseiten.
Social Sharing bietet Social Sharing-Buttons für Beiträge.
Ocean Extra ist besonders interessant. Es beinhaltet viele, kleine, teils wichtige Einzelfeatures, wie Meta Boxes, Layout/Sidebar je nach Beitrag/Seite ändern, Abstände regulieren, Titel an-/abschalten, individuelle Titel, Untertitel, Styling des Titels, Bildergalerie, Demo-Installation u. v. m.
Außerdem spendiert OceanWP 15 kostenlose Demos in der Free-Version.
OceanWP ist zwar mit vielen Buildern kompatibel, der Favorit scheint jedoch Elementor zu sein. Elementor haben wir auch im Mega-Tutorial verwendet. Einige Erweiterungen sind nur mit Elementor kompatibel und nur für Elementor gibt es eine ganze Reihe Content-Module.
Portfolio: Eine Bildergalerie mit Beschreibungstext (eigener Contenttyp).
Woo Popup: Fenster mit Hinweis „In den Warenkorb gelegt – weiter shoppen?“
Sticky Header/Footer: Umfangreiches Modul zum Anpassen des Scrolleffektes des Headers.
Ocean Hooks: Inhalte an fast allen möglichen Stellen im Theme platzieren. Rollenbasiert und mit konditioneller Logik.
Side Panel: Extra Seitenbereich, der nur auf Klick öffnet.
Footer Callout: Call-to-Action für den Fußbereich der Seite.
Elementor Widgets: 43 Contentmodule exklusiv für Elementor.
Die Elementor-Widgets verdienen einen besonderen Hinweis. Die Anzahl und Qualität sind so hoch, dass eine Lizenzierung von Elementor Pro für viele Anwender nicht notwendig sein sollte. Für den Preis von OceanWP gibt es nicht nur das Theme selbst, sondern einen fast gleichwertigen Ersatz für Elementor Pro.
Besonders interessant für Liebhaber von großen Bilddatenbanken ist der Zugriff auf die Royalty-Free Bilder von Freepik und Flaticon. OceanWP integriert die Dienste direkt unter „Medien ⭢ Browse Ocean Images“.
Zuerst nach einem Bild suchen und mit einem Klick speichert OceanWP das gewählte Bild automatisch unter Medien. Komfortabler geht es kaum.
Freepik hat neben Millionen von Stockfotos auch Vektoren und Icon-Packs.
Flaticon gehört zu Freekpik.
Da ist für jeden Geschmack und Anwendungsfall etwas dabei.
Die Features der Premiumversion überzeugen. Vor allem die integrierte Bilderdatenbank dürfte vielen Nutzern gefallen. Dies ist im aktuellen Thememarkt (bisher) einzigartig.
Die Lizenzierung ging schnell: Installation des Themes geschieht direkt aus dem Markt. Premiumplugins müssen leider einzeln installiert werden. Das kostet gut und gerne eine Viertelstunde Zeit. Stattdessen wäre es gut, falls alle Plugins bereits im Hauptpaket enthalten wären und der Nutzer sie nur noch im Backend freischalten muss.
Nach der Installation findet sich im Backend das „Theme Panel“.
Darüber lassen sich Features an- und abschalten, zum Beispiel Customizer-Optionen, JS-Module, Gutenberg-Blöcke etc.
Um alle Features im Theme nutzbar zu machen, braucht es noch Elementor oder einen anderen Editor. Wir haben uns für Elementor entschieden, weil OceanWP-Premium ein großes Erweiterungspaket für diesen Builder bereitstellt.
Die Liste der OceanWP-Elementor-Module ist lang. Die Module sind als Alternative oder Ergänzung zu Elementor Pro gedacht. Im Video benutze ich viele dieser Contentmodule.
Insgesamt gab es keine großen Probleme bei der Umsetzung der Beispiel-Website. Es ging alles sehr flott und und einfach. Auch wenn vielleicht nicht ganz so flott und einfach, wie bei Kadence. Insgesamt gab es aber weniger „Problemchen“ bei OceanWP als bei Blocksy.
OceanWP bietet leider keinen Formulareditor. Das ist natürlich kein Problem, wenn du dir eine Formular-Plugin aus unserer Liste aussuchst. Kadence hat einen Formulareditor (und Builder) eingebaut, ist aber auch deutlich teurer.
Die Header- und Footer-Editoren im Customizer sind etwas weniger intuitiv, als bei anderen Themes. Die bieten in der Regel einen Spalteneditor, in dem sich Logo, Navigation, Suchicon etc. leicht anordnen lassen. OceanWP macht es etwas anders und versucht alles über Einstellungen zu regeln. Etwas ungewohnt, aber es gibt alle Features, die das Herz begehrt und wer etwas komplett Individuelles wünscht, kann einen Header/Footer einfach über das „Theme Panel ⭢ My Library“ erstellen und einbinden.
Von Vorteil ist die Möglichkeit Features an- und abschalten zu können.
Einfach ungenutzte Features deaktivieren und die Ladezeiten sollten so schneller werden. Nicht vergessen sicherzustellen, dass noch alles funktioniert.
Eine weitere Stärke von OceanWP sind die zahlreichen Starterpacks, die sich leicht installieren lassen. Bei über 200 davon findet sicher jeder was.
Es war mir tatsächlich nicht möglich, die Fontfarbe im Footer einzustellen, ohne eigenes CSS dafür anzulegen. Gleiches für die mittige Ausrichtung des Titels.
Insgesamt ging die Umsetzung der Beispiel-Website blitzschnell, wie du im Video sehen kannst.
Empfehlenswert ist der Businesstarif. Hauptsächlich wegen der Integration von Freepik und Flaticon.
Fazit: Demo-Seiten einfach online stellen!
Die drei großen Stärken von OceanWP sind der Zugriff auf die Bilddatenbanken, die Elementor-Module und die zahlreichen Website-Demos. Bei der täglichen Arbeit mit dem Theme gibt es nach kurzer Eingewöhnung keine Hürden. Der Preis ist sehr attraktiv. Die Business-Version ist sogar günstiger als das Abo bei Freepik selbst! Wer viele Bilder braucht, für den ist das alleine ein ausschlaggebendes Kaufargument. Das Theme mit seinen Premium-Features gibt es sozusagen kostenlos dazu.
Die Möglichkeit eine komplette Demo-Webseite inklusive aller lizensierten Fotos und Illustrationen zu importieren und sofort damit online gehen zu können, ist wirklich einzigartig! In der Praxis ändert man natürlich einige Bilder und Texte, aber man braucht keine Angst mehr vor Abmahnungen wegen Platzhalter-Bildern zu haben! So schnell habe ich noch nie eine professionelle Webseite gebaut!
Jedes Theme hat vor und Nachteile. Letztendlich kommt es wirklich darauf an, mit welchem Theme die Arbeit am schnellsten und komfortabelsten umgesetzt ist. Für mich ist das immer noch Kadence. Aber da bekomme ich keine Bilder dazu. Ich liebe kostenlose Bilder, also wird mir nichts anderes übrig bleiben, als Kadence UND OceanWP zu lizenzieren 🙂
Steigere sofort Deinen Erfolg mit den richtigen Keywords. Verbessere Deine Inhalte oder entdecke Produkte, an die du noch nicht gedacht hast.
seospark.io ist das umfangreiche Keyword Tool, welches Dir in wenigen Sekunden tausende von Keywords und Ideen aus 9 unterschiedlichen Netzwerken wie Google, Google Bilder, Amazon, eBay, YouTube, Pinterest, Instagram, News und Google Shopping liefert. So findest Du schnell und einfach hoch konvertierende Keywords mit geringem Wettbewerb.
Das Tool gibt die beliebtesten Keywords zurück, die ein gutes Suchvolumen auf sich vereinen inklusive Suchvolumen, Trend, CPC und Informationen über den Wettbewerb, tägliche Impressionen und die Schwierigkeit dafür zu ranken:
9 Long Tail Keyword Module
Ihre Website, Ihr Blog, Ihr Online-Geschäft dreht sich nicht um Sie, sondern um Ihre Besucher und letztlich um Ihre Kunden. Die Erstellung von Inhalten und die Gestaltung von Webseitenstrukturen ist mit den Long Tail Keywords aus seospark ganz einfach.
seospark kann 9 unterschiedliche Datenquellen zum Auffinden relevanter Keywords erschließen:
seospark ist als Long Tail Keyword Tool Deine zuverlässige Quelle für Long Tail Keywords, die für Deine Website und Deine Nische hyperrelevant sind. Es liefert eine umfangreiche Anzahl von Keywords, einschließlich Multi-Word Long Tail Nischen Keywords und potentiellem Suchvolumen, für die Verwendung in Deinen organischen und bezahlten Suchkampagnen.
Google Search Suggest
Der Klassiker! Du erhältst die relevantesten Vorschläge aus der Suggest-Funktion von Google zu deinem Keyword. Durch die Autocomplete-Funktion werden diese Keywords verhältnismäßig häufig gesucht! Selbstverständlich erhältst Du bei seospark zu jedem gefundenen Suchbegriff auch das jeweilige Suchvolumen, den Wettbewerb und den CPC aus den Google Ads, sowie einen Trendverlauf, um steigende Nachfrage und saisonale Schwankungen zu erkennen. Für Deine SEA Keyword Werbekampagnen kannst Du auch sehr viele irrelevante Keywords bereits vor Kampagnenstart identifizieren und diese als sogenannte negative Keywords in Google Ads ausschließen.
Du kannst somit in ein paar Sekunden hunderte Keywords deren exaktes Suchvolumen für Dein ausgewähltes Land herausfinden und somit die wichtigsten oder profitabelsten Keywords identifizieren. seospark hat dabei Zugriff auf das exakte Suchvolumen von über 1,4 Mrd. Keywords weltweit!
Bildersuche bei Google Images
Für viele Branchen kann die Bildersuche von Google ein sehr lohnenswerter Traffic-Kanal sein, insbesondere bei visuellen Produkten wie Mode, Postern oder Ähnlichem. Wenn Du also die richtigen Bilder für Deine Zielgruppe bereitstellst und diese zum ranken bringst, kannst Du zusätzliche Umsätze generieren! Mit dem Bildersuche-Modul in seospark findest Du heraus, nach welchen Bildern Deine Zielgruppe sucht. Damit kannst Du passende und hochwertige Bilder, Grafiken und Fotos produzieren und diese gezielt optimieren.
Produktsuche bei Amazon, Ebay, Google Shopping
Falls Du auf Amazon, Google Shopping oder Ebay aktiv bist, willst Du bestimmt wissen, für welche Produkte oder Produktvarianten sich Kunden bei Amazon interessieren. Das Produktsuche Modul von seospark hilft deinem E-Commerce Business die Produkte bei Amazon, Ebay und Co. zu verkaufen, welche wirklich von deiner Zielgruppe nachgefragt werden.
Erkenne Produkttrends oder Produktvarianten, welche von deinen Kunden gesucht werden. Durch unsere LIVE-Abfragen kannst du auch auf Trends und kurzfristige Nachfragen reagieren und bleibst immer auf dem neuesten Stand. Verwende das Produktsuche Modul von seospark und erhalte wertvolle Insights über das Suchverhalten Deiner Kunden.
Videosuche bei YouTube
Eine Produktion und Promotion eines YouTube Videos kann sehr aufwändig und teuer sein. Deshalb ist es wichtig, die Ressourcen Deines Kanals auf die richtigen Videothemen zu fokussieren. Verwende das YouTube Modul von seospark, um die Video-Themen herauszufinden, welche deine Zielgruppe interessieren und die bereits häufig bei YouTube gesucht werden. Anschließend kannst Du Deine Videos gezielt auf diese Suchanfragen ausrichten, optimieren oder neue Inhalte passend zur Nachfrage erstellen.
Instagram Hashtags und Pinterest Pins
Wie Du sicher weißt, sind die richtigen, die populärsten und passendsten Hashtags sind für das Targeting und die Steigerung der Reichweite Deiner Instagram-Posts enorm wichtig. Mit dem Instagram-Modul von seospark kannst du alle relevanten Hashtags für deinen nächsten Instapost herausfinden.
In seospark wird Dir zu den Ergebnissen natürlich auch der Media-Count angezeigt, damit Du sofort siehst, wie viele Posts bereits mit diesem Hashtag ausgezeichnet sind.
Live-Suchtrends via Google News
Durch echte LIVE-Abfragen in seospark ist es möglich die aktuellen Vorschläge aus der Google News Autocomplete anzuzeigen. Dadurch kannst Du in Echtzeit auf Veränderungen des Suchverhaltens reagieren und sofort aktuelle Themen und Trends entdecken, für die es sich lohnen könnte, Inhalte zu erstellen oder bereits vorhandene News zu optimieren.
Clusteranalyse in seospark
Du kannst ab sofort alle Keyword Ergebnisse aus dem Suggest Tool, egal in welcher Sprache, in sinnvolle Keyword Gruppen einsortieren lassen! Ein Keyword Cluster bezeichnet hierbei eine Gruppe von Keywords mit semantischem, also inhaltlichem Zusammenhang.
Das neue Keyword Clustering Tool in seospark kann Listen bis zu 1.000 Keywords in semantisch passende Untergruppen sortieren, selbstverständlich geschieht dies automatisch. Das ist nicht nur in der Keyword Recherche nützlich, sondern auch bei der Content Planung. So erhältst Du einen Überblick über die thematische Struktur deiner Websiteinhalte:
Hier muss ich aber sagen, dass es sich um eine Art Beta handelt, die Ergebnisse sind zum Teil nicht wirklich sinnvoll.
Keyword Metrics in seospark
Mit dem neuen Modul Keyword Metrics kannst Du jetzt schnell und einfach für beliebige Keywords Daten wie Suchvolumen, Trendverlauf, CPC, Wettbewerb, tägliche Impressionen und Schwierigkeit abrufen:
W-Fragen in seospark
Doch damit nicht genug, seospark ist mittlerweile mein Lieblings W-Fragen Tool geworden! Einfach ein Keyword eingeben und Fragepräfixe wie warum, wer, was, wie, wo, wieso und weshalb eingeben und schon generiert seospark eine Menge relevanter Fragen, die echte Nutzer bei Google gesucht haben:
Das W-Fragen-Modul ermöglicht es Dir in wenigen Sekunden mehrere Hundert bis Tausend Fragestellungen zu Deinem Thema zu finden, die auch so in Google gesucht werden!
Damit verstehst Du den Informationsbedarf und die Bedürfnisse Deiner Besucher und Kunden und kannst wertvolle und hilfreiche Inhalte schreiben, die Deine Zielgruppe wirklich erreichen.
Die Preise von seospark
seospark beginnt im kleinsten Account für einen Nutzer mit Suggest Keyword Tool + Wh Questions bei günstigen 15 EUR im Monat = 180 EUR im Jahr. Wer monatlich bucht, muss 19 EUR zahlen. Die Keyword Metrics (Suchvolumen etc.) kosten 10 EUR zusätzlich (inkl. 100.000 Abfragen im Monat), ebenso wie das neue Keyword Clustering (10 EUR für 50.000 Keywords im Monat).
Team-Accounts beginnen bei 39 EUR für 3 Nutzer bei jährlicher Zahlungsweise und 49 EUR für monatliche Zahlung. Ein maximal ausgestatteter Account mit 10 Nutzern und allen Modulen kostet 89 EUR im Monat bei jährlicher Zahlweise.
seospark sollte aus meiner Sicht in Deinen SEO-Tools nicht fehlen! Gib einfach hier das Keyword ein, für das Du recherchieren möchtest und drücke Enter. Finde jede Menge neuer Ideen. Schreibe großartigen Content. Nutze das Tool, um Inhalte zu verfassen, die Deine Zielgruppe wirklich interessieren. Finde die beliebtesten Keywords in Deiner Nische! Nahezu jede Sprache und jedes Land werden unterstützt! Exportiere die Keywords nach Excel, XML, CSV, JSON, SQL, uvm.
Wenn Du Dich überzeugt hast, buch‘ die Pro-Version – Aus meiner Sicht, machst Du damit alles Richtig!
Landingpages sind ein tolles Instrument, um wertvolle Leads oder neue Kunden zu gewinnen und eine hervorragende Ergänzung innerhalb Deiner Unternehmenshomepage. Ihr Erfolgsgeheimnis besteht darin, dass sie sich auf eine Dienstleistung beziehungsweise ein Produkt konzentrieren. Deshalb bietet sich für Deine Landingpage ein OnePager an, also eine kompakte Webseite, die im Grunde aus nur einer einzigen Seite besteht.
Mit einem geeigneten WordPress-Theme erstellst Du in kurzer Zeit verkaufsstarke OnePager. Hier präsentiere ich Dir die 5 besten WordPress Landingpage Themes und verrate Dir, was sie so besonders macht.
Dem Divi Theme wirst du in unseren Artikeln zu WordPress Themes häufig begegnen. Das liegt daran, dass dieses Theme extrem vielseitig ist. Ob Designer, Zahnarzt oder Autohändler, unter den mehr als 100 fertigen Webseiten-Layouts ist für Unternehmen aus beinahe jeder Branche etwas dabei. Auch für One Pager ist Divi sehr gut geeignet. Zum Beispiel kannst Du mit dem Theme auf einfache Art eine Single Page Navigation erstellen und Ankerlinks setzen. Wie Du dabei vorgehst, zeigt dir das Video oben.
Ein kleines, aber feines Highlight von Divi ist die Option, Split Tests durchzuführen. Das heißt, Du kannst ohne zusätzliche Software unterschiedliche Versionen deines OnePagers testen und herausfinden, welche bei Deiner Zielgruppe erfolgreicher ist.
Besondere Vorteile Sehr schnelles Theme Kompatibel mit Page Buildern und dem WordPress Block Editor Über 240 vorgefertigte Vorlagen können in Sekundenschnelle installiert werden Preis: Kostenlos / Pro ab 47 €/Jahr
Astra ist ein ziemlich populäres Multipurpose WordPress Theme, das es in einer kostenlosen und einer kostenpflichtigen Version gibt. Das Theme ist sehr schnell, was für Webseiten allgemein und für Landingpages im Speziellen immer wichtiger wird. Gleichzeitig hast Du viele Gestaltungsmöglichkeiten, vor allem mit der kostenpflichtigen Variante, die die Ladezeiten der Seite nicht verlangsamen.
Mit Astra kannst du eigene Kopf- und Fußzeilen entwerfen, alles auf der Seite anpassen und deine Website nach deinen Vorstellungen gestalten. In der kostenlosen Version des Themes ist bereits eine riesige Anzahl von Startvorlagen verfügbar, in der Premium-Version gibt es noch mehr. Darunter sind auch einige Onepager oder Vorlagen, die sich leicht in einen Onepager umwandeln lassen.
Besondere Vorteile
sehr schnelles Theme
Kompatibel mit Page Buildern und dem WordPress Block Editor
Über 240 vorgefertigte Vorlagen können in Sekundenschnelle installiert werden
Bei diesem Theme steckt der OnePager schon im Namen. One Page Pro ist ein WordPress-Theme speziell für „Einseiter“. Wie bei den anderen hier vorgestellten Themes handelt es sich allerdings um ein Multipurpose-Theme, also ein Theme, das du für verschiedene Zwecke einsetzen kannst. Willst Du in kurzer Zeit eine gut aussehende Landingpage erstellen, profitierst du von einer Reihe fertiger Layouts, die Du ganz oder in Teilen importieren und an deine Zwecke anpassen kannst. Außerdem stehen dir 19 verschiedene Header Styles und ein Drag-Drop Slider Creator zur Verfügung. One Page Pro ist responsiv, macht WordPress-Anfängern den Einstieg leicht und unterstützt WPML für Mehrsprachigkeit. Eine gute Wahl für Landingpages der verschiedensten Art, gerade dann, wenn es schnell gehen soll.
Generate Press legt den Schwerpunkt auf Einfachheit und Performance. Einfach und schnell ohne überflüssigen Schnickschnack heißt die Devise. Genau das richtige für OnePager und Landingpages. In der Site Library gibt es ein eigenes Design mit dem Namen „Landing“, das du als Ausgangspunkt nehmen kannst, oder Du fängst bei Null an. Für mehr Möglichkeiten beim Design lässt sich Generate Press problemlos mit Elementor oder Gutenberg kombinieren.
Generate Press gibt es zwar auch kostenlos. Um Zugriff auf die Site Library zu haben, musst Du dich allerdings für die kostenpflichtige Premium-Version entscheiden. Dazu raten wir Dir auch deshalb, weil Du bei der kostenlosen Version mit einem Copyright-Hinweis auf der Seite leben musst und das sieht nicht sehr professionell aus.
Besondere Vorteile
Sehr schnelles und stabiles WordPress Theme
Lässt sich gut mit verschiedenen Page Buildern kombinieren
Eigene Site Library in der Premium-Version
Preis: kostenlos oder 59 $/Jahr beziehungsweise einmalig 249 $ für Generate Press Premium
Das WordPress Theme Ultra stammt vom bekannten Themeanbieter Themify. Dass lässt erwarten, dass darin eine Menge Erfahrung mit den Erwartungen und Wünschen von WordPress-Nutzern steckt. Tatsächlich macht es dir Ultra leicht, in kurzer Zeit mit Drag and Drop eine ansehnliche Landingpage zu erstellen. Das Theme enthält 12 Bonus Builder Addons und über 60 fertige Layouts, die Du unkompliziert anpassen kannst. Wenn Du Ultra nicht nur für Landingpages, sondern auch für Mehrseiter verwenden willst, profitierst Du von Mega Menüs und Woo-Commerce-Unterstützung.
Das ist die Top 5 der empfehlenswerten WordPress Themes für Landingpages ????
Ich hoffe, Du hast ein Theme gefunden, aber vergiss nicht: Im Zweifel geht Probieren über Studieren!
Du bist nicht fündig geworden? Dann wirf einen Blick auf die Liste der besten WordPress Themes. Dort haben wir die besten WordPress Themes für jeden Anwendungsfall gesammelt und diesen Artikel aktualisieren wir ständig.
Hast Du deine Landingpage als One Pager mit WordPress erstellt? Dann schreibe uns gerne in den Kommentaren, mit welchem Theme Du gearbeitet hast, wie Deine Webseite lautet und ob Du zufrieden damit bist!
Tipps für erfolgreiche Landingpages
Du hast dein Theme gefunden? Dann beachte die folgenden Tipps als Starthilfe für eine erfolgreiche Landingpage:
Weniger ist mehr: Das zentrale Ziel von Landingpages ist immer, Besucher zu einer bestimmten Handlung zu bewegen. Verzichte deshalb auf alle überflüssigen Elemente, die ablenken könnten. Integriere die wichtigsten Informationen „above the fold“, also so weit oben, dass Besucher nicht scrollen müssen.
Wichtige Elemente von Landingpages: OnePager Landingpages sind unterschiedlich aufgebaut. Auf einige Elemente solltest Du aber nicht verzichten. Das sind ansprechende Grafiken, ein Logo, überzeugende Head- und Sublines und ein prägnanter Call to Action. Besser als Fließtext-Blöcke sind Aufzählungen – zum Beispiel von wichtigen Vorteilen eines Produkts. Wenn Du das erste Mal eine Landingpage erstellst, sieh Dir an, wie erfolgreiche Unternehmen in Deiner Branche dabei vorgehen.
Denke daran, Deine Seite zu optimieren: Mit einer guten SEO-Optimierung bringst du Mitglieder Deiner Zielgruppe auf Deine Landingpages.
Testen, testen, testen: Meistens ist es eine gute Idee, verschiedene Landingpages zu erstellen und zu testen, welche am besten funktioniert. Du wirst merken, schon verschiedene Überschriften haben einen großen Effekt.
Es gibt eine ganze Reihe von WordPress-Plugins, die dabei helfen können, eine Website zu monetarisieren. Insbesondere mit dem populären Amazon-Partnerprogramm ist es mit dem richtigen Plugin relativ einfach möglich, Affiliate-Links auf einer Website einzubinden und dadurch Einnahmen zu generieren.
Da Affiliate-Links helfen können, Umsatz mit einer Website zu generieren, natürlich abhängig vom jeweiligen Traffic, ist es wichtig, dass man ein zuverlässiges und vertrauenswürdiges Plugin wählt. Das bedeutet, dass ich ein Plugin gesucht habe, das die Links nicht manipuliert oder unerwartet die Arbeit einstellt und damit die Einnahmen gefährdet.
Während des Testens der verschiedenen Amazon-Affiliate-Link-Plugins für diesen Artikel wurde mir jedoch schnell klar, dass viele dieser Plugins nicht ausreichend unterstützt, weiterentwickelt oder aktualisiert werden, während andere nicht ausreichend verbreitet sind, um einen Eindruck davon zu bekommen, wie zuverlässig und vertrauenswürdig sie sind.
In Anbetracht dessen gibt es in diesem Artikel nur drei detailliert vorgestellte Plugins, die aber alle wirklich empfehlenswert sind und sich bewährt haben! Eines davon ist sogar kostenlos und die anderen beiden sind erschwingliche Plugins, die dabei helfen, eine WordPress-Website mit Amazon-Partnerlinks zu monetarisieren.
Lasst uns anfangen …
Über das Amazon-Partnerprogramm
Bevor wir zu den Plugins kommen, lohnt es sich, schnell zu erklären, was das Amazon-Partnerprogramm eigentlich ist und wie es helfen kann, eine Website zu monetarisieren.
Kurz gesagt: Nachdem man sich für das Amazon-Partnerprogramm angemeldet hat, kann man Empfehlungslinks zu jeder Seite bei Amazon erstellen und diese dann beispielsweise auf einer Website veröffentlichen. Natürlich kann man diese Affiliate-Links auch über Social-Media-Kanäle wie Twitter und Facebook verbreiten oder per E-Mail und Newsletter versenden. Wichtig dabei ist, dass die Empfehlungen im jeweiligen Kontext sinnvoll sind, denn diese sollen ja Besucher, die etwas kaufen wollen über einen Klick zum Amazon-Shop führen. Denn nur wenn ein Besucher, der auf einen derartigen Link geklickt hat, auch etwas kauft, erhält man eine kleine Provision, basierend auf dem, was er gekauft hat. Wie hoch diese Provision ist, hängt von der jeweiligen Produktkategorie ab. Hier gibt es eine Übersicht der aktuellen Werbekostenerstattungen.
Obwohl die prozentuale Vergütung im Vergleich zu anderen Affiliate-Programmen recht niedrig sind, gibt es eine Reihe von Vorteilen bei der Bewerbung von Produkten bei Amazon.
Erstens ist die Konversionsrate in der Regel sehr gut, denn die meisten Leute haben bereits ein Amazon-Konto und sind es gewohnt, dort einzukaufen.
Zweitens gibt es so viele unterschiedliche Produkte bei Amazon und auf dem Marketplace, dass man sicher etwas Relevantes und zum Inhalt der Seite Passendes findet, das man auf seiner Website bewerben kann.
Außerdem kann es passieren, dass Verbraucher mehrere Artikel auf einmal bei Amazon kaufen und sich dadurch die Empfehlungsprovisionen erhöhen.
Es ist wirklich einfach, Amazon-Affiliate-Links zu erstellen, beispielsweise über den PartnerNet Site Stripe, und anschließend in einem Beitrag zu veröffentlichen. Wie wir gleich sehen werden, gibt es allerdings einige Vorteile bei der Verwendung eines WordPress-Plugins …
Die besten Amazon-Affiliate-Link-WordPress-Plugins
Hier sind also die empfohlenen Amazon-Affiliate-Link-Management-Plugins für WordPress: Es gibt ein einfaches kostenloses Plugin, das alle wesentlichen Punkte abdeckt, sowie beeindruckende kostenpflichtige Plugins mit vielen weiteren nützlichen Funktionen und Features.
Das „Amazon Affiliate WordPress Plugin“, kurz AAWP ist aus meiner Sicht das vollständigste Plugin, denn es zielt darauf ab, sich um jegliche Aspekte der Monetarisierung einer WordPress-Website mit dem Amazon-Partnerprogramm zu kümmern. Obwohl es sich nicht um ein kostenloses Plugin handelt (AAWP gibt es ab 79 EUR), kann man sagen, dass AAWP so viele nützliche Funktionen hat, die diesen Preis mehr als rechtfertigen!
Das WordPress Plugin für Amazon Affiliates
Natürlich enthält AAWP die wirklich zeitsparenden Funktionen, die es auch im kostenlosen Amazon-Plugin gibt. So lassen sich alle Links zu Amazon automatisch mit der Referral-ID versehen und die Einnahmen internationaler Websites dank der Geotargeting-Funktion erhöhen. Bei der Geotargeting-Implemtierung von AAWP spielt es keine Rolle, aus welchem Land ein Besucher auf die Website zugreift. Wenn dieser auf einen Amazon-Link klickt, wird er zu seinem lokalen Amazon-Shop weitergeleitet, wie zum Beispiel Amazon.de, Amazon.com, Amazon.co.uk oder Amazon.in.
Aber damit nicht genug!
Dank des integrierten Produktvergleichstabellen-Generators können beispielsweise mehrere Artikel problemlos nebeneinander angezeigt und miteinander verglichen werden, was den Besuchern die Entscheidung erleichtert, welches Produkt sie kaufen sollen.
Um eine Tabelle zu erstellen, gibt man einfach die Produkt-ID oder ASIN-Nummer der Elemente ein, die angezeigt werden sollen, und das Plugin erledigt den Rest. Dank der Integration der wichtigsten Produktdetails wie Preis und Bewertung können Eure Besucher leicht erkennen, welcher Artikel für sie die beste Option ist, ohne die Website verlassen zu müssen und weitere Recherchen durchzuführen. Die angezeigten Preise lassen sich sogar aktualisieren. Die Daten werden dabei über die Amazon-Product-Advertising-API abgerufen und automatisch aktualisiert. Häufig benötigte Daten werden lokal zwischengespeichert und vermindern dadurch die notwendigen API-Abfragen. Alle generierten Elemente von AAWP sind dabei selbstverständlich responsiv, d. h. zur Darstellung auf Desktop-PCs sowie Tablets und Smartphones optimiert, und funktionieren sogar auf AMP-Websites!
Über die Textlink-Funktion werden Produktnamen einfach im Fließtext ausgegeben. Wer ein bestimmtes Amazon-Produkt in einem Beitrag oder auf einer Seite platzieren möchte, kann die Produktboxen dafür nutzen. Darin kannst du ein oder mehrere Produkte optisch ansprechend darstellen. Diese beinhalten u.a. Titel, Beschreibung, aktuelle Preisinformationen, Rabatte und einen Kaufen-Button.
Besonders praktisch ist die Integration sogenannter Bestseller über Listen. Damit kannst du deinen Besuchern ein richtig starkes Verkaufsargument liefern, indem du zu einer speziellen Produktgruppe (oder Suchbegriff) die meistverkauften Produkte auflistest. Darüber hinaus hast du die Möglichkeit, die Anzahl der Produkte selbst festzulegen: Top 3, Top 10 etc.
Wenn Du also zu bestimmten Themen oder Kategorien stets aktuelle Produkte anzeigen willst, ohne dich jede Woche um deine Affiliate-Links kümmern zu müssen, ist AAWP das perfekte Plugin für dich!
Zusätzlich kannst du deine Besucher auf die neuesten Produkte einer speziellen Produktgruppe aufmerksam machen. Analog zu den Bestseller-Listen hast du die Möglichkeit, die Anzahl der Produkte selbst festzulegen.
Das Plugin ist entwicklerfreundlich, technisch sehr flexibel und kann in Kombination mit jedem Theme verwendet werden. Dazu gibt es Tools zur Erstellung von auffälligen Produktpromotion-Boxen, ein integriertes Klick-Tracking für Einblicke in die Interaktion des Publikums mit den Affiliate-Links. Seit Version 3.14 unterstützt das Amazon WordPress-Plugins sogar die sogenannten Accelerated Mobile Pages (AMP). Dabei werden alle Darstellungsformen inklusive der Vergleichstabellen sauber und AMP-konform ausgegeben!
Ich nutze AAWP bereits seit längerem auf Herzelei.de, beispielsweise im Beitrag „Geschenkideen für Schwangere“ und bin sehr zufrieden mit Support, Qualität und Darstellung der integrierten Produkte.
Alternative: amazilon – Amazon-WordPress-Plugin für Affiliates
Das dritte Plugin, das ich hier vorstellen möchte, ist das amazilon-Plugin. Der Entwickler hinter dem Plugin ist selbst ein sehr erfolgreicher Amazon-Affiliate und hat dieses aus seinem eigenen Bedarf heraus entwickelt.
Dieser hatte die Chance, auf einem Berliner Event von Amazon den Wünschen von 50 ausgewählten Partnern zu lauschen, und er hat die Ergebnisse aus dem Workshop direkt in die Entwicklung des Amazon-WordPress-Plugins für Affiliates einfließen lassen. Das Ziel hinter amazilon ist (laut der Aussage des Erfinders), möglichst API-konform zu arbeiten, damit die Website nicht durch zu häufige Abfragen oder gar Verstöße gegen die Bedingungen des Partnerprogramms gesperrt wird.
Amazilon bietet ebenso wie AAWP sehr viele Möglichkeiten beim Einbinden und Verlinken von Amazon-Produkten auf der eigenen Website und kostet auch ab 39 EUR je Website. Besonders Nutzer ohne Programmierkenntnisse profitieren von der einfachen Bedienung des Plugins. Natürlich können neben diversen Buttons und Boxen auch Vergleichstabellen mit automatischer Preisaktualisierung angelegt werden. Diese sehen beispielsweise so aus:
Vergleichstabelle von amazilon mit automatischer Preisaktualisierung
Mit der integrierten Klick-Statistik werden alle ausgehenden Klicks zu Amazon getrackt. So findest du schnell heraus, welcher deiner Beiträge die meisten Klicks generiert. Es wird auch aufgezeichnet, welche der Vorlagen die meisten Klicks generiert. So erfährst du, welches Design bei dir am besten funktioniert und was dein erfolgreichster Artikel ist.
Das Amazilon-Plugin hat sogar einige besondere Features, die es sonst nirgendwo gibt. Hier die drei Highlights, die amazilon aus meiner Sicht einzigartig macht:
Beispielsweise schickt amazilon dir auf Wunsch eine E-Mail, wenn ein Produkt, das du eingebunden hast, nicht mehr auf Amazon verfügbar ist. Dieses kannst du dann gegen ein Verfügbares austauschen!
Besonders hilfreich aus meiner Sicht ist auch die Funktion, Produkte automatisch ersetzen zu können. So wird automatisch das definierte Fallback-Produkt angezeigt, sobald ein Produkt nicht mehr lieferbar ist!
Ein besonderes Highlight ist die Möglichkeit, die eigene Suche mit Produkten aus der Amazon API anzureichern. Wenn also jemand auf deiner Website beispielsweise nach einem Thema sucht, zu dem du keine Produkte oder Artikel in WordPress hast, dann erscheinen zumindest passende Produkte von Amazon. 😉
Finger weg von Amazons eigenem WordPress Plugin! Es hat es nie über die Entwicklungsphase hinaus geschafft und wurde bereits wieder eingestellt!
Vielleicht hast Du schon gesehen, dass es ein WordPress-Plugin von Amazon selbst gibt. Der „Amazon Associates Link Builder“ ist das offizielle und kostenlose WordPress-Plugin für Amazon-Partner. Mit dem Plugin lassen sich aus dem WordPress-Editor heraus Amazon-Produkte suchen und diese auf der Website verlinken. Man erhält über die API in Echtzeit Zugriff auf aktuelle Preise und die Verfügbarkeit der Produkte.
Das klingt alles wirklich sehr vielversprechend, denn laut Amazon lassen sich mit dem Plugin nicht nur Text- und Preislinks erstellen. Es stehen auch Vorlagen für unterschiedliche Arten von Produktboxen mit Bildern, Preisen und weiteren Produktinformationen zur Verfügung. Diese Vorlagen lassen sich bearbeiten oder man erstellt einfach eigene Vorlagen.
Aber dann schaut man sich einmal die letzten Bewertungen bei WordPress.org an:
Katastrophale Bewertungen im Plugin-Verzeichnis bei WordPress.org
Finger weg von Amazons eigenem WordPress Plugin! Es hat es nie über die Entwicklungsphase hinaus geschafft und wurde bereits wieder eingestellt!
Amazon Auto Links Plugin (kostenlos)
Das kostenlose Amazon Auto Links Plugin sorgt den Bewertungen zufolge zuverlässig dafür, dass alle Links auf einer Website automatisch in Affiliate-Links umgewandelt werden. Anstatt für jedes Produkt, das man empfehlen will, einen Affiliate-Link auf der Amazon-Website generieren zu müssen, gibt man einfach die Amazon-Partner-ID einmalig in das Plugin-Dashboard auf der Website ein, und diese ID wird dann in allen veröffentlichten Links zu Amazon angewendet.
Klingt fast zu schön, um wahr zu sein, oder?
Bei englischsprachigen Websites mit internationalem Traffic besonders wichtig ist die integrierte Funktion, mit der man die IDs für lokale Amazon-Associates-Programme hinterlegen kann, wie beispielsweise für die Partner-Programme in den USA, Brasilien, Kanada, China und in anderen Ländern. Das Plugin erkennt den Standort der Besucher (basierend auf deren IP-Adresse) und leitet diese dann an den jeweiligen Shop weiter, was die Chancen auf eine Konversion natürlich massiv erhöht.
Darüber hinaus hilft das Plugin auch dabei, geeignete Produkte zu finden, die man auf der Website einbinden könnte. Wenn man einen neuen Beitrag oder eine neue Seite in WordPress erstellt, kann man direkt über das Plugin das Amazon-Inventar durchsuchen und im WordPress-Editor auswählen, welche Links eingefügt werden sollen! Zu guter Letzt enthält das Amazon-Link-Plugin auch Vorlagen, die dabei helfen, die Darstellung der Affiliate-Links zu verbessern, was hoffentlich zu mehr Klicks und Verkäufen führt.
Wenn Du also nach einer kostenlosen Möglichkeit suchst, ist das Plugin Amazon Auto Links eine sehr gute Option!
Ein weiterer Grund, wieso ich zu AAWP rate, ist die Möglichkeit, Bestsellerlisten für einen bestimmten Produkttyp zu erstellen oder automatisch die neuesten Produkte einer bestimmten Produktgruppe aufzulisten. Damit sind die Produktempfehlungen stets aktuell und enthalten verfügbare Produkte, die gerne und häufig von Kunden bei Amazon gekauft werden, was die Chance auf einen Verkauf deutlich erhöht.
Wenn man gerade erst mit dem Affiliate-Marketing beginnt oder nicht besonders viele Besucher bekommt, ist die manuelle Erstellung und Integration der Links absolut in Ordnung. Man kann auch ein allgemeines Link-Management-Plugin wie Pretty Links verwenden. Sobald allerdings der Traffic zunimmt und die Website wächst, macht die Verwendung eines eigenen Amazon-PartnerNet-Plugins die Verwaltung und Erstellung geeigneter Verlinkungen einfacher und effizienter.
Welches Plugin verwendest Du, um Deine WordPress-Website mit dem Amazon-Partnerprogramm zu monetarisieren? Lass es mich in den Kommentaren unten wissen!
Der Gutenberg-Editor hatte Anfangs wenig Freunde und auch ich war zu Beginn alles andere als begeistert. Zu wenige Möglichkeiten, Blöcke und Erweiterungen haben zum Zeitpunkt der Veröffentlichung relativ triste Webseiten und Artikel produziert. Manche Blogger haben sogar das Ende von WordPress vorausgesagt.
Glücklichweise könnte dies nicht weiter von der Realität entfernt sein. Zugegeben, die Einführung des neuen WordPress-Inhaltseditors hätte besser laufen können. Aber spätestens jetzt ist klar, dass Gutenberg sich zu einem ausgezeichneten Werkzeug für die Gestaltung großartig aussehender WordPress-Websites entwickelt hat. Ich selbst setze Gutenberg bei allen neuen WordPress-Webseiten ein.
Einer der größten Vorteile ist die mittlerweile riesige Anzahl von Gutenberg-Plugins, die man zur Erweiterung einsetzen kann. Sogar ohne Programmiererfahrung kann man mit den richtigen Plugins nahezu jeden Aspekt einer Webseite so gestalten, wie man es möchte.
Allerdings habe ich in den Kommentaren zu meinen Artikeln Die besten WordPress Plugins und die besten WordPress Themes bereits festgestellt, dass die meisten WordPress-Nutzer diese Möglichkeiten von Gutenberg garnicht kennen.
Daher habe ich in diesem Artikel, die aus meiner Sicht besten Gutenberg-Plugins zusammen gestellt, mit denen das Erstellen einer Webseite sehr einfach und schnell von der Hand geht.
Kadence Blocks hat sich in unseren Tests als das beste Gutenberg-Plugin erwiesen, wenn man mit Gutenberg die Funktionen eines PageBuilders nachbilden möchte. Aktuell gibt es 23 Kadence-Blöcke für jeden erdenklichen Anwendungsfall, die sich komfortabel in Modulen aktivieren lassen:
Alle enthaltenen Blöcke von Kadence Blocks in der Übersicht
Das beste Feature ist dabei der Zeilen/Layout-Block, mit dem sich benutzerdefinierte Layouts mit bis zu 6 Spalten erstellen lassen. Dabei stehen jede Menge Layout- und Darstellungsoptionen zu Verfügung.
Kadence Blocks enthalten außerdem eine Designbibliothek mit vorgefertigen Inhalten zum Einfügen in die eigene Website. Sämtliche Inhalte sind selbstverständlich responsiv und passen sich der jeweiligen Bildschirmgröße an.
Das kostenlose Plugin Spectra (ehemals Ultimate Addons for Gutenberg) stammt von den Machern des großartigen Astra-Themes und funktioniert daher perfekt mit diesem. Spectra hat sich von einem einfachen Plugin, das ein paar Blöcke hinzugefügt hat, zu einem vollständigen Page Builder mit Blöcken, Vorlagen, Wireframes und vielem mehr entwickelt.
Für Power-User, die erweiterte Webdesign-Funktionen benötigen, gibt es jetzt Spectra Pro. Diese Premium-Version erweitert die Möglichkeiten des kostenlosen Plugins durch neue Blöcke wie den Instagram Feed Block, den Registration Block, den Login Block und den Loop Builder Block.
Ein weiteres tolles Feature von Spectra Pro ist die Dynamic Content Extension. Im Gegensatz zu typischen statischen Inhalten, die unverändert bleiben, wenn sie nicht manuell aktualisiert werden, ermöglicht Spectra Pro die dynamische Darstellung von Text und Bildern auf der gesamten Website mithilfe von Spectra-Blöcken und verleiht dem Webdesign mehr Flair und Vielseitigkeit.
Die Preise für Spectra Pro beginnen bei 49 US-Dollar pro Jahr mit dem „Spectra Pro Plan“, aber es sind auch andere Pakete wie das Essential Toolkit und das bald erscheinende Business Toolkit erhältlich.
Das Stackable Plugin bringt eine Reihe wirklich gut aussehender Blöcke mit und eignet sich daher besonders für Nutzer, die sich nicht selbst um das Aussehen ihrer Webseite kümmern wollen. Für alle enthaltenen Blöcke gibt es mehrere Layout- bzw. Designvarianten, die wirklich alle out of the box großartig aussehen.
Ein weiterer Vorteil von Stackable ist die intuitive Benutzeroberfläche, die großartige Konfigurationsmöglichkeiten bietet. Die integrierte Blockdesign-Bibliothek bringt 310 fertige Vorlagen mit, die sich perfekt für jeden Bereich einer Website eignen. Dabei kannst Du aus hellen, dunklen und anderen visuell dynamischen, voreingestellten Abschnittsdesigns frei wählen.
Wenn Du Deine Website ohne jegliche Programmierung erstellen willst, aber dennoch nicht auf komplexe Layouts verzichten willst, dann solltest Du Dir unbedingt Toolset als erstes Gutenberg-Plugin anschauen.
Mit den Blöcken von Toolset kannst Du einfach neue Funktionen hinzufügen, darunter benutzerdefinierte Posttypen, eine benutzerdefinierte Suche, Galerien, die Möglichkeit benutzerdefinierte Inhaltslisten anzuzeigen und vieles mehr. Alles in nur einem Plugin und das ganz ohne Programmierung.
Darüber hinaus kannst Du Toolset auch normale, statische Gutenberg-Blöcke dynamisch machen, so dass sie für jede Seite bzw. jeden Beitrag den richtigen Inhalt anzeigen. Auf einer Immobilienwebsite kannst Du beispielsweise eine Vorlage erstellen, um Häuser anzuzeigen und dieser mittels Toolset einen dynamischen Bildblock hinzufügen. Toolset bietet eine große Auswahl ansprechender Designs und sorgt dafür, dass Deine Seiten auf verschiedenen Bildschirmgrößen funktionieren.
Qubely hat keine nennenswerten Settings. Gerade einmal Api-Key-Felder für Goolge-Maps, ReCaptache und Mailchimp. Dafür trumpft es mit einer Vielzahl von Contentblöcken:
Das sind deutlich mehr als bei Kadence Blocks Pro. Auch wenn es mehr Blöcke gibt, so sollte die schiere Anzahl der Features nicht das ausschlaggebende Argument für Qubely sein. Im Vergleich lassen sich die Kadence Blocks etwas leichter bedienen. Das sieht man in unserem Test- und Tutorial-Video immer wieder, da es manchmal ein leichter Kampf war, etwas genau so aussehen zu lassen, wie bei den Kadence Blocks.
Qubely kostet 39 USD jährlich für eine Site, 59 USD jährlich für fünf Sites und 99 USD jährlich für beliebige Installationen.
6. Custom Blocks Constructor – Lazy Blocks
Lazy Blocks ist mein neues Lieblingspluging für die Arbeit mit Gutenberg. Damit erstellst Du ganz einfach benutzerdefinierte Blöcke visuell, fügst Steuerelemente per Drag & Drop zu deinen Blöcken hinzu und hinterlegst für deine Blöcke HTML- oder PHP-Code. Du kannst sowohl benutzerdefinierte Blöcke als auch benutzerdefinierte Metafelder für unterschiedliche Beitragstypen erstellen. Außerdem kannst du für jeden Beitragstyp Beitragsvorlagen mit vordefinierten Blöcken erstellen.
So einfach geht es, mit Lazy Blocks einen benutzerdefinierten Block im WordPress-Editor zu erstellen:
Benutzerdefinierten Block anlegen: Gib deinem benutzerdefinierten Block einen Namen, lege ein Icon, eine Kategorie, etc. fest.
Steuerelemente hinzufügen: Füge Kontrollfelder wie einfache Text- oder komplexe Bildauswahlen hinzu.
Ausgabecode schreiben: Gib den Code für deinen benutzerdefinierten Block mit HTML- und PHP-Unterstützung aus.
https://de.wordpress.org/plugins/lazy-blocks/
7. Kioken Blocks
Trotz der rasanten Verbreitung von Block-Sammlungs-Plugins im letzten Jahr, ist Kioken Blocks ein relativ unbekannter Newcomer, den du vielleicht verpasst hast. Kioken umfasst derzeit 17 Blöcke, die alle mit dem Schwerpunkt auf einem schickes Basisdesign erstellt wurden, das sich nahtlos in das Thema des Nutzers einfügt. Jeder Block kann mit weiteren Anpassungsmöglichkeiten komplett umgestaltet werden. Die Blöcke sind keine vorgefertigten Kopien anderer Kollektionen, sondern bieten ihre eigenen Stile und Funktionen.
Kioken Blocks will eine schnellere und einfachere Alternative zu komplexen Page Builder Plugins bieten: Es gibt Höhen und Tiefen bei der Arbeit mit Gutenberg und Kioken Blocks zielt darauf ab, diese ‚Tiefen‘ abzudecken.
Die Atomic Blocks sind eine Sammlung von Seitenbausteinen für den neuen Gutenberg-Editor. Das Erstellen von Seiten mit dem Blockeditor und Atomic Blocks gibt Dir wesentlich mehr Kontrolle über das Aussehen Deiner Seiten.
Die Installation des Atomic Block-Plugins fügt Deiner WordPress-Installation eine Sammlung schöner Seitenbausteine hinzu, mit denen Du schnell und einfach das Seitenlayout anpassen oder neue Elemente für die Steigerung des Engagements einbauen kannst. Atomic Blocks bieten dabei so gut wie alles was man für eine erfolgreiche Webeite braucht, von anpassbaren Schaltflächen bis hin zu wunderschön gestalteten Seitenabschnitten und ganzseitigen Layout-Designs über den Block Abschnitt & Layout.
Wenn Du sehen willst, wie man mit den Atomic Blocks arbeitet, schau Dir einfach das folgende Video an:
Zusätzlich zu den Inhalts-Blöcken, die bereits von Beginn an enthalten waren, gibt es mittlerweile einen brandneuen Sektions- und Layout-Block. Dieser Block wird mit einer Bibliothek von vorgefertigten Abschnitten und Layouts geliefert, damit Du mit dem neuen Block-Editor schnell und einfach eine schöne Website erstellen kannst.
Das Besondere an den Atomic Blocks ist die AMP-Unterstützung: Das Projekt Accelerated Mobile Pages (AMP) ist ein Veröffentlichungsformat, das von Google entwickelt wurde, um die Website-Performance für mobile Website-Nutzer zu verbessern. AMP-Seiten sind speziell für Nutzer aus der Google-Suche konzipiert, um Webseitenseiten schnell und ohne Verwendung von Fremddaten zu laden. Atomic Blocks hat als eines der wenigen Erweiterungen bereits eine Unterstützung für AMP in jeden Block eingebaut.
Wahrscheinlich weißt Du noch nicht, dass über eine EU-Richtlinie eine der Neuerungen, die zum 7. Juni 2021 über die EU-Urheberrechterichtlinie (DSM-RL) den Weg in das deutsche Urhebergesetz gefunden hat, die kommerzielle Nutzung deiner Inhalte erlaubt, solange Du dies nicht explizit technisch untersagst!
Natürlich sind deine Inhalte an Sich nach wie vor vom Urheberrecht geschützt, allerdings wurde der Umgang mit Text- und Data Mining neu geregelt. Bislang kannte das deutsche Urheberrecht nur Text- und Data Mining zu wissenschaftlichen Zwecken (geregelt in § 60d UrhG), doch der neue § 44b UrhG regelt nun zusätzlich auch das Text- und Data Mining zu sonstigen, d.h. auch kommerziellen Zwecken.
Die neue Richtlinie der EU sorgt dafür, dass das Text- und Data Mining in allen Mitgliedstaaten, sogar auf Basis unlizensierter Daten ermöglicht wird. Die klare Rechtsgrundlage für das kommerzielle Text- und Data Mining soll Erleichterungen für die Wirtschaft bringen und Innovationen anregen.
Dort ist zu lesen:
Text und Data Mining ist die automatisierte Analyse von einzelnen oder mehreren digitalen oder digitalisierten Werken, um daraus Informationen insbesondere über Muster, Trends und Korrelationen zu gewinnen.
Beachtenswert ist nun der Absatz 2, der es erlaubt, eine Kopie zu erstellen, zum Zwecke der Auswertung mittels Data Mining:
Zulässig sind Vervielfältigungen von rechtmäßig zugänglichen Werken für das Text und Data Mining. Die Vervielfältigungen sind zu löschen, wenn sie für das Text und Data Mining nicht mehr erforderlich sind.
Das umfasst nach meiner Auffassung nicht nur, dass die Texte auf deiner Webseite genutzt werden dürfen, um ein Sprachmodell bzw. eine Art künstlicher Intelligenz zu trainieren, sondern auch mittels KI die Texte auf deiner Webseite umgeschrieben und an anderer Stelle veröffentlich werden dürfen!
Noch ist das Ganze keine Rechtspraxis, bedarf also noch der Klärung und Anwendung, aber das neue Gesetz könnte aus meiner Sicht durchaus so ausgelegt werden, insbesondere da damit Innovation im Bereich KI in der EU gefördert werden soll. Ich bin aber kein Anwalt und auch kein Urheberrechtsexperte. Ich gebe hier die Rechtslage aus meiner Sicht nach bestem Wissen und Gewissen wieder.
Wenn du bislang nicht wusstest, dass moderne KI-Tools Texte automatisiert umschreiben können, solltest du dir mal diesen Artikel durchlesen: https://www.search-one.de/automatisierte-textgenerierung/. Die so maschinell generierten Texte unterliegen übrigens nicht dem Urheberrecht, da eine Maschine kein Urheber sein kann. Derartig umgeschriebene Texte sollten damit als gemeinfrei gelten.
Man ist dem jedoch nicht vollständig ausgeliefert, denn Absatz 3 regelt:
Nutzungen nach Absatz 2 Satz 1 sind nur zulässig, wenn der Rechtsinhaber sich diese nicht vorbehalten hat. Ein Nutzungsvorbehalt bei online zugänglichen Werken ist nur dann wirksam, wenn er in maschinenlesbarer Form erfolgt.
Das bedeutet konkret, dass Du mittels robots.txt Datei festlegen musst, dass Crawler NICHT auf deine Inhalte zugreifen dürfen. Dabei solltest Du jedoch beachten, dass Du nicht auch „gute“ Crawler wie Googlebot und Bingbot aussperrst.
In meinem Artikel bei SEARCH ONE habe ich eine Beispiel-robots.txt veröffentlich, die Du nutzen kannst, um alle Crawler außer Googlebot und Bingbot den Zugriff auf deine Inhalte verbieten kannst:
# Block everything for all Crawlers
User-agent: *
Disallow: /
# Allow everything for Googlebot
User-agent: Googlebot
Allow: /
# Allow everything for Bingbot
User-agent: Bingbot
Allow: /
Mit dieser robots.txt-Datei kannst du festlegen, welche Crawler auf welche Dateien auf deiner Website zugreifen können. Achtung: Die robots.txt-Datei muss dabei stets im Stammverzeichnis deiner Website liegen und exakt „robots.txt“ genannt werden.
Wenn Du eine Webseite erstellen willst, stellst Du Dir vielleicht die Frage, ob Du besser ein richtiges Webhosting mit einem CMS verwenden sollst oder einen der vielen Webseiten-Baukästen vielleicht der einfachere Weg zur eigenen Webseite ist. In diesem Beitrag beleuchten wir beide Wege und versuchen Dir bei der Auswahl der richtigen Grundlage für Deine Homepage zu helfen.
Das Erstellen einer Website ist einfach, wenn Sie über Grundkenntnisse in HTML (Hypertext Markup Language) und CSS (Cascading Style Sheets) verfügen. Außerdem sollten Sie mit PHP (PHP Hypertext Preprocessor), MySQL und JavaScript vertraut sein. Es gibt jedoch viele andere Möglichkeiten, eine Website zu erstellen, z. B. die Verwendung von WordPress, Joomla!, Drupal, Magento usw.
Website auf Basis eines CMS erstellen
Ein Content Management System (CMS) ist eine Softwareanwendung zum Erstellen und Pflegen von Webseiten. Als Einsteiger können Sie die Nutzung und Bedienung eines CMS leicht erlernen. Sie können Ihr Wissen auch erweitern, indem Sie mehr über HTML und Programmiersprachen lernen.
Egal ob WordPress, TYPO3, Joomla!, Drupal, Contao oder Neos, Content-Management-Systeme bieten Dir die Möglichkeit, auf einfache Weise eine Website zu erstellen. Sie können einfach ein vorhandenes Theme auswählen und ihre Inhalte dort einfügen. Mit einem CMS kann man ganz einfach auch neue Seiten, Bilder, Videos usw. hinzufügen. Ein intuitiver WYSIWYM-Editor ermöglicht es Benutzern, Inhalte ohne Programmierkenntnisse zu bearbeiten, während eine Rechtschreibprüfung hilft, Rechtschreibfehler zu vermeiden. Importoptionen ermöglichen Benutzern das Hinzufügen von Bildern, Videos und anderen Mediendateien zur Website. Suchfunktionen helfen Benutzern, bestimmte Informationen innerhalb der Site zu finden.
Kurz gesagt: Content-Management-Systeme (CMS) sind Softwareprogramme, mit denen Benutzer Webseiten einfach erstellen und bearbeiten können.
Sie können sie verwenden, um eine neue Website zu erstellen oder eine alte zu ändern. Sie können einer Seite auch Bilder, Videos, Links und andere Elemente hinzufügen. Es gibt viele verschiedene Arten von CMS. Einige sind kostenlos, während andere Geld kosten.
Erwartungen und Anforderungen an ein CMS
Bevor Sie sich für eines der vielen CMS entscheiden, ist es wichtig zu wissen, welche Art von Inhalten Sie anbieten möchten. Sie müssen darüber nachdenken, wer die Inhalte bereitstellt, wer Ihre Zielgruppe ist und welche Ressourcen für den Betrieb der Website verfügbar sind. Sie müssen auch wissen, wie viele Personen gleichzeitig am CMS arbeiten und welche Art von Workflows verwendet werden sollen.
Mit einem CMS können Sie Benutzern unterschiedliche Zugriffsebenen geben, je nachdem, was sie tun müssen. Zum Beispiel könnten Sie Ihrem Redakteur die volle Kontrolle über die Website geben, aber Ihrem Autor erlauben, nur den Text zu sehen, den er/sie schreiben muss.
Sie merken also: Bei der Auswahl eines CMS-Systems muss die Vielzahl an unterschiedlichen Funktionen berücksichtigt werden!
Dazu gehören verschiedene Funktionen wie Content Management, E-Commerce, Blogs, Foren, soziale Netzwerke usw. Jede Funktion erfordert spezifische Ressourcen. Nur ein direkter Vergleich ermöglicht eine fundierte Entscheidung.
Vergleichen Sie die vorgestellten Systeme anhand von Tabellen. Erfahren Sie, für welche Einsatzbereiche die einzelnen Systeme am besten geeignet sind und welche Ressourcen Sie für einen reibungslosen Betrieb bereitstellen müssen.
Auf einen Blick Die wichtigsten CMS im Vergleich
Jedes CMS hat seine Vor- und Nachteile. Wir sollten das Richtige nach unseren Bedürfnissen auswählen. Unser CMS-Vergleich zeigt, dass jedes CMS seine eigenen Vor- und Nachteile hat. Wir müssen diese Faktoren bei der Auswahl eines CMS berücksichtigen.
WordPress ist eine Blogging-Plattform, aber auch ein Content-Management-System (CMS). Es wird hauptsächlich von Bloggern verwendet. Ein System wie TYPO3 bietet bereits in der Grundinstallation einen umfangreichen Funktionsumfang. TYPO3 wird in der Blogosphäre selten verwendet. Benutzer können TYPO3 ganz einfach an ihre Bedürfnisse anpassen. Dazu gehört die Möglichkeit, einzelne Seiten oder Beiträge zu erstellen. Darüber hinaus stehen viele nützliche Erweiterungen zur Verfügung. Dazu gehören E-Commerce-Lösungen, Social-Media-Integration etc.
Wir haben die oben genannten Open-Source-Lösungen verglichen: WordPress ist die am einfachsten einzurichtende Lösung. TYPO3 ist außerdem sehr benutzerfreundlich. Joomla! ist anpassbarer als TYPO3. Drupal ist die erweiterbarste Plattform. Contao ist am wenigsten anpassbar. Neos ist am sichersten. Kirby CMS ist das einfachste, um Ihre eigene Website zu erstellen. Pico Bolt ist am anpassbarsten. Grave CMS ist das sicherste.
Sie können eine Website für Ihren geschäftlichen oder persönlichen Gebrauch erstellen. Dazu benötigen Sie keine technischen Kenntnisse. Mit einem Content-Management-System können Sie Ihre Website einfach verwalten.
Wie startet man mit einem CMS?
Sie sollten einen Webhoster verwenden, der per Knopfdruck das gewünschte Content Management System wie TYPO3 oder WordPress installiert. Das spart Zeit und Geld. Für die meisten CMS sind viele tolle Designvorlagen, so genannte Themes, oder auch Templates online verfügbar, die man schnell und effizient für seine eigene Website anpassen kann, ohne viel über Webdesign oder Programmierung wissen zu müssen.
Wer ein individuelles Design möchte, sollte auf jeden Fall über CSS- und HTML-Kenntnisse verfügen und sich auch mit bestimmten „Webdesign-Vorgaben“ vertraut machen. Bei TYPO3 beispielsweise ist dies z. B. ein Befehlssatz namens Typoscript. Für weitere Funktionen benötigen Sie fast immer eine Erweiterung oder ein Plugin. Wenn Sie keine Erweiterung finden, können Sie sie auch selbst schreiben. Mit Erweiterungen ist alles möglich, aber das Programmieren ist oft sehr zeitintensiv. Updates für Erweiterungen sind ebenfalls erforderlich. Außerdem werden nicht alle Erweiterungen weiterentwickelt. Dann kann es vorkommen, dass Ihre Erweiterung in der neusten Version des CMS nicht mehr funktioniert.
Sicherheitssysteme sind immer anfällig für Hackerangriffe. Es gibt jedoch Möglichkeiten, um sicherzustellen, dass Ihr System sicher ist. Sie müssen die Software regelmäßig aktualisieren, und Sie sollten die Sicherheitseinstellungen testen, bevor Sie sie verwenden. Schließlich müssen Sie sich über die Schwachstellen Ihres Systems informieren und dann Schritte unternehmen, um zu verhindern, dass Hacker diese Schwachstellen ausnutzen.
Bevor Sie mit der Arbeit an Ihrer neuen Website beginnen, stellen Sie sicher, dass Sie wissen, was Sie tun. Es gibt viele verschiedene Arten von CMS und jedes hat seine Vor- und Nachteile. Sie sollten mehrere dieser CMS ausprobieren, bevor Sie sich für eines entscheiden. Kostenlos ist toll! Aber jede Webseite kostet Geld. Die Hosting-Gebühren liegen bei mindestens 5 – 10 Euro pro Monat.
Der beste Homepage Baukasten
Ich habe unterschiedliche Website-Builder getestet, und hier sind meiner Meinung nach die besten. Jeder Website-Builder hat seine eigenen einzigartigen Stärken, aber sie sind alle großartige Tools.
Squarespace ist ein Online-Website-Builder, der viele großartige Funktionen bietet. Es hat die besten Blogging-, Podcasting-, Planungs- und Audioplayer-Funktionen. Es hat auch die beste Fotogalerie-Funktion.
Squarespace ist ein großartiger Website-Builder. Es ist einfach zu bedienen und bietet viele Funktionen. Kein anderer Website-Builder kann mit den sauberen, modernen Vorlagen von Squarespace mithalten.
Jimdo ist ein Webdesign-Tool, mit dem Sie ohne Programmierkenntnisse Ihre eigene Website erstellen können. Sie können aus verschiedenen Vorlagen und Themen wählen, Inhalte, Bilder, Videos und mehr hinzufügen. Sie können Ihre Website auch anpassen, indem Sie Ihr eigenes Logo hinzufügen und Farben und Schriftarten auswählen.
Wenn Sie Jimdo verwenden, können Sie eine unbegrenzte Anzahl von Seiten erstellen. Sie können auch das Design dieser Seiten bearbeiten. Es gibt jedoch einige Einschränkungen für diese Funktion. Beispielsweise können Sie das Layout des Seitenfußes nicht ändern.
Jimdo ist ein Website-Builder, der eine Vielzahl vorgefertigter Vorlagen anbietet. Diese Vorlagen werden mit einem Einführungsvideo und einer kurzen Tour geliefert. Die Basisversion ist völlig kostenlos, aber wenn Sie Ihren Domainnamen und andere Funktionen nutzen möchten, müssen Sie für einen Premium-Tarif bezahlen.
Viele Unternehmen und Selbständige nutzen gerne den 1und1 bzw. IONOS-Website-Baukasten. Der Baukasten namens MyWebsite bietet eine Vielzahl vorgefertigter Designs für alle Branchen. Fahrradgeschäfte, Schlosser und Lackierbetriebe finden hier direkt passende Vorlagen, die Ihr Unternehmen ansprechend darstellen. Mit nur wenigen Handgriffen können Sie einfach und intuitiv die passenden Informationen über Ihr eigenes Unternehmen zu den passenden Vorlagen hinzufügen.
Der Editor ist einfach zu bedienen. Sie können Elemente einfach per Drag & Drop auf die Seite ziehen. Sie können eine vordefinierte Struktur erstellen oder einfach frei platzieren. IONOS bietet vielfältige Funktionen, darunter die Einbindung von YouTube-Videos, Google Map, Facebook und Twitter. Ein Firmenkunde schätzt die gute deutschsprachige Betreuung. Ein einfacher Online-Visitenkartengenerator, der ein Kontaktformular und eine Wegbeschreibung mit Google Maps generiert.
1und1 bzw. IONOS bietet eine kostenlose Probezeit an. Das bedeutet, dass Kunden die Webhosting-Dienste testen können, ohne etwas bezahlen zu müssen. Kunden können auch eine Rückerstattung erhalten, wenn ihnen der Service nicht gefällt. Für Domains ist jedoch keine kostenlose Testversion verfügbar. Das Unternehmen bietet zwar eine Geld-zurück-Garantie an, dies gilt jedoch nur, wenn Sie einen Domainnamen bestellen.
Webflow ist vor allem für die Gestaltung von Websites bekannt. Im Editor ziehen Benutzer HTML-Elemente per Drag-and-Drop auf die Arbeitsfläche und passen sie über eine Seitenleiste auf der rechten Seite an. Wer sich mit HTML und Stylesheets auskennt, kann auch mit Webflow arbeiten. Das CMS bietet eine ähnliche Bandbreite wie das Gestaltungstool. Benutzer erstellen zunächst Inhaltstypen (Sammlungen) und fügen diesen dann Inhalte hinzu. Bevor das CMS richtig verwendet werden kann, ist eine längere Einarbeitungszeit erforderlich.
Webflow eignet sich zum Erstellen von Designs von Grund auf neu und richtet sich daher hauptsächlich an Profis. Dennoch stehen viele fertige Vorlagen zur Verfügung, die als Grundlage für eigene Gestaltungsarbeiten verwendet werden können. Die meisten dieser Vorlagen müssen gekauft werden. Die Registrierung für webflow ist zunächst kostenlos. Für mehr als zwei Seiten müssen Sie jedoch ein Abonnement bezahlen. Die Preisgestaltung ist relativ kompliziert. Webflow unterscheidet zwischen sogenannten „Site-Plänen“ und „Account-Plänen“, wobei ein oder mehrere Site-Pläne sowie ein Account-Plan benötigt werden, um alle Features nutzen zu können. Darüber hinaus fallen Einmalzahlungen für die Nutzung von Designvorlagen an.
Weebly ist ein benutzerfreundlicher Website-Builder, mit dem Benutzer professionell aussehende Websites ohne Programmierkenntnisse erstellen können. Es bietet Vorlagen, Drag & Drop-Funktionalität und viele nützliche Funktionen. Es stehen viele Funktionen zur Verfügung, einschließlich der Möglichkeit, das Design der Website anzupassen. Der Code-Editor ist langsam, funktioniert aber gut, wenn man sich daran gewöhnt hat. Weebly bietet auch E-Commerce-Funktionalität und Benutzerverwaltung.
Weebly bietet eine begrenzte Anzahl von Vorlagen an, die jedoch im Editor einfach angepasst werden können. Abhängig von Ihren geschäftlichen Anforderungen können Sie Weebly als einfachen Website-Builder verwenden oder eine aktualisierte Version erwerben. Sie können später jederzeit ein Upgrade durchführen, wenn Sie weitere Funktionen benötigen.
Wix
Wix ist ein großartiger Website-Builder, da Sie damit Ihr eigenes einzigartiges Design ohne Programmierkenntnisse erstellen können. Sie können aus Tausenden von Vorlagen wählen oder Ihr eigenes Design erstellen. Es gibt auch viele Videos und Tutorials, die Ihnen helfen, die Nutzung der Website zu erlernen. Der Nachteil ist, dass Sie eine Entscheidung darüber treffen müssen, welche Art von Design Sie möchten, bevor Sie mit dem Erstellen Ihrer Website beginnen.
Wix ist ein benutzerfreundlicher Website-Builder, mit dem Benutzer eine Website erstellen können, ohne sich um HTML-Code kümmern zu müssen. Sie können Elemente ziehen und ablegen, wo immer Sie wollen, aber Sie müssen darauf achten, dass Sie Ihr eigenes Design nicht durcheinander bringen.
CMS oder Baukasten?
Hier haben wir nochmal alle Vor- und Nachteile der Verwendung eines Website-Builders für Ihr Unternehmen zusammengefasst:
Homepage-Baukästen sind sehr einfach zu bedienen. Sie müssen nichts installieren oder bezahlen. Es gibt viele kostenlose Angebote. Einfach einzurichten. Keine Programmierkenntnisse erforderlich. Kostengünstig. Der Website-Builder enthält alles, was Sie zum Erstellen Ihrer Website benötigen. Sie erhalten kostenlosen Support, wenn Sie sie kontaktieren.
Automatische Updates sind für Kunden wichtig. Kunden erhalten Updates aus einer Hand. Für alle Dienstleistungen gibt es einen Ansprechpartner. Funktionen hängen von den Produkten ab. Die Homepage kann mit zusätzlichen Funktionen gestaltet werden.
Wer jedoch mit dem Ziel des Profits an eigene Projekte herangeht, kommt um eine professionelle Gestaltung zumindest auf Dauer nicht herum. Dafür gibt es im Internet viele Angebote und vor allem die Nutzung von CMS wie WordPress.
Homepage Baukästen haben einige Einschränkungen
Ein CMS, wie WordPress kann beispielsweise auch verwendet werden, um eine professionelle Website zu erstellen. Ein professionelles Unternehmen sollte ein professionelles Design verwenden. Eine Präsenz im Website-Builder kann jedoch Ihre Anforderungen für den Einstieg ins Internet erfüllen. Sie können sich auch dafür entscheiden, eine Website von Fachleuten erstellen zu lassen. Sowohl für Privatpersonen als auch für Selbstständige und Unternehmen, die Dienstleistungen oder Produkte anbieten möchten, können Sie beide Möglichkeiten nutzen.
Manche behaupten, das Hosting wäre einer der wichtigsten Faktoren für SEO. Früher gab es sogar spezielles SEO-Hosting, doch braucht wirklich jede Webseite eine eigene IP-Adresse und macht es überhaupt einen Unterschied für die Sichtbarkeit in den Suchmaschinen, wie und wo eine Webseite gehostet ist? Dieser Frage möchte ich im folgenden Artikel einmal auf den Grund gehen.
Fest steht:
Der Standort deiner Website (Host) kann einen großen Einfluss auf dein Ranking in den Suchmaschinen haben.
Willst Du beispielsweise in China gefunden werden, kommst Du um ein Hosting im Land der Mitte nicht herum. Wenn Deine Webseite in Deutschland ranken soll, ist es selbstverständlich empfehlenswert ein lokales Hosting in Deutschland zu verwenden.
Für größere Unternehmen, die ihre Dienste und Produkte weltweit anbieten, lohnt es sich zum Teil sogar für wichtige Märkte eine lokale Webseite im jeweiligen Land zu erstellen. Doch in Zeiten von CDN-Anbietern mit lokal gerouteten AnyCast-IP-Adressen, kann man problemlos mit einer zentralen Webseite Spitzenrankings in der ganzen Welt erreichen.
Wenn du sicherstellen willst, dass deine Website von so vielen Menschen wie möglich gesehen wird, ist es also durch wichtig, den richtigen Hoster und das richtige Hostingpaket zu wählen.
Doch was Du definitiv nicht brauchst, ist ein SEO-Hosting, das sicherstellt, dass jede Deiner Webseiten, die als privates Blognetzwerk benutzt werden, eine eigene IP-Adresse bekommen. Google braucht nicht die IP-Adresse, um festzustellen, dass mehrere Webseiten alle einem Betreiber gehören und dass diese als Linkgeber ohnehin keinerlei Vertrauen oder Relevanz mehr übertragen.
Bist Du also auf der Suche nach einem SEO-Hosting, um Deine eigenen Webseiten auf möglichst viele unterschiedliche IP-Adressen zu verteilen, solltest Du Deine SEO-Strategie besser nochmal überdenken.
Was jedoch wichtig in Sachen Hosting für ein gutes Ranking ist, sind die Stabilität, die Leistungsfähigkeit und die Anbindung einer Webseite!
Die Stabilität eine Webseite ist verständlicherweise ein wichtiges Rankingkriterium für Google und Co. Sollte eine Webseite also öfters mal nicht erreichbar sein, oder mit Fehlermeldungen um sich werfen, wird das Ranking dieser Seite kurzfristig verloren gehen, damit die Suchmaschine keine Nutzer auf eine defekte Webseite schickt und diese dann frustriert zur Suche zurück kehren.
Schauen wir uns als nächstes die Performance an:
Seit 2009 ermutigt Google Webmaster auf der ganzen Welt, die PageSpeed ihrer Websites zu berücksichtigen. Im Jahr 2010 wurde bekannt gegeben, dass PageSpeed künftig eines der rund 200 Ranking-Signale der Suche sein wird. Google kündigte an, dass in der zweiten Jahreshälfte 2020 im Rahmen des sogenannten „Page Experience“-Updates Signale für das Seitenerlebnis in den Suchergebnissen besonders berücksichtigt werden sollen.
Diese Signale bewerten, wie die Nutzerinnen und Nutzer die Interaktion auf einer Website empfinden, und sollen Google dabei helfen, sicherzustellen, dass die Nutzerinnen und Nutzer die nützlichsten Seiten in den Suchergebnissen finden und ein angenehmes Online-Erlebnis haben. Bei den neuen Core Web Vitals ist das Hosting jedoch bestensfalls ein Teil der Lösung, denn inbesondere bei der visuellen Stabilität, die im CLS-Wert gemessen wird, hat das Hosting keinerlei Einfluss.
Werfen wir daher einen Blick auf die Anbindung einer Webseite:
Greifen vielen Nutzer gleichzeitig auf eine Webseite zu, kann es passieren dass sich die Ladezeit für den Einzelnen massiv verschlechtert, wenn der Hoster keine ausreichende Anbindung besitzt. Aber auch das Peering zu bestimmten Anbietern kann zu schmal oder zu umständlich geroutet sein, so dass ein Teil deiner Besucher eine schlechte Nutzererfahrung beim Besuch deiner Seite empfinden.
Generell solltest Du daher darauf achten, dass dein Hoster mindestens mit 10 GBit an mehrere der wichtigsten Knotenpunkte des Internets angebunden ist, beispielsweise den DE-CIX und über private Peerings mit den Netzen von Google, Amazon sowie der Deutschen Telekom verfügt.
Insgesamt lässt sich festhalten, dass Hosting im SEO eine Frage der Hygiene, als ein echter Weg zur Spitze ist. Du merkst nichts, wenn alles in Ordnung ist, aber du hast ein Problem, wenn nicht alles in Ordnung ist!
Der Algorithmus einer Suchmaschine ist eine Reihe von Regeln, die eine Suchmaschine verwendet, um Listen als Antwort auf eine Suchanfrage zu erstellen und wird manchmal auch als die „secret sauce“ bezeichnet. Suchmaschinen schicken in regelmäßigen Abständen einen Crawler durch das Netz, um alle Webseiten und deren Inhalte zu indexieren.
Der erste Schritt besteht darin, herauszufinden, welche Seiten im Internet existieren. Da es kein zentrales Verzeichnis aller Webseiten gibt, muss jede Suchmaschine ständig nach neuen Seiten suchen und sie in die Liste der bekannten Seiten aufnehmen. Einige Seiten sind bekannt, weil die Suchmaschine sie schon einmal besucht hat. Andere Seiten werden entdeckt, wenn der Crawler einem Link von einer bekannten Seite zu einer neuen Seite folgt. Wieder andere Seiten werden entdeckt, wenn der Eigentümer einer Website eine Liste von Seiten (eine Sitemap) zum Crawlen einreicht. Diesen Vorgang bezeichnet man als Crawling.
Sobald eine Suchmaschine eine neue Seiten-URL entdeckt hat, wird die Seite besucht oder gecrawlt, um herauszufinden, was sich auf der Seite befindet. Moderne Suchmaschinen rendern die Seite sogar und analysieren anschließend sowohl den Text- und Nicht-Text-Inhalt als auch das gesamte visuelle Layout, um zu entscheiden, wo die Seite in den Suchergebnissen erscheinen kann. Je besser eine Suchmaschine eine Website verstehen kann, desto besser wird diese zu Begriffen zugeordnet, nach denen Menschen suchen.
Nachdem eine Seite entdeckt wurde, versucht die Suchmaschine zu verstehen, worum es auf der Seite geht. Dieser Vorgang wird als Indizierung bezeichnet. Moderne Suchmaschinen analysieren den Inhalt der Seite, katalogisieren die auf der Seite eingebetteten Bilder und Videodateien und versuchen auch sonst, die Seite zu verstehen. Diese Informationen werden im Suchmaschinen-Index gespeichert, einer riesigen Datenbank, die auf vielen Computern gespeichert ist.
Anschließend analysieren komplexe Programme die abgelegten Daten jeder Webseite, aber auch Daten von anderen Webseiten über jede Webseite, um jede Website einzeln zu bewerten und festzulegen, ob und wie hoch oder niedrig die Seiten der Website bei verschiedenen Suchanfragen erscheinen werden. Diese Algorithmen können sehr kompliziert sein. Google allein verwendet nach eigenen Angaben mehr als 200 verschiedene Variablen und die Suchmaschinen hüten ihre Algorithmen als Geschäftsgeheimnisse.
Wenn ein Nutzer eine Suchanfrage eingibt, versucht eine Suchmaschine, die relevanteste Antwort aus ihrem Index zu finden, wobei je nach Suchanfrage unterschiedlich viele Faktoren berücksichtigt werden. Die Suchmaschine versucht stets, die qualitativ hochwertigsten Antworten zu ermitteln und andere Faktoren zu berücksichtigen, die das beste Nutzererlebnis und die passendste Antwort bieten, indem Dinge wie der Standort des Nutzers, die Sprache und das Gerät (Desktop oder Telefon) berücksichtigt werden. So würde zum Beispiel die Suche nach „Fahrradwerkstätten“ einem Nutzer in München andere Ergebnisse liefern als einem Nutzer in Hamburg.
Übrigens: Die meisten Suchmaschinen, allen voran natürlich Google und bing akzeptieren keine Zahlungen, um Seiten höher zu platzieren! Die Platzierung jeder Seite erfolgt vollkommen automatisiert und programmatisch und kann nicht durch Menschen direkt beeinflusst werden.
In CSS gibt es diverse Möglichkeiten Farbwerte für Rahmen, die Schriftfarbe oder Hintergründe zu definieren. Diese stellen wir hier schrittweise vor:
RGB in Hexadezimalzahlen
In CSS 1 und 2 gibt es identische Möglichkeiten, bestimmten Eigenschaften Farbwerte zuzuweisen. Als häufigste Form findet man Farben als Hexadezimalwert deklariert. Um diese Notation zu verstehen, braucht es zunächst eine kurze Einführung in das Hexadezimalsystem:
Das hexadezimale Zahlensystem kennt 16 Zahlen je Stelle. Die ersten 10 sind unsere ganz normalen Zahlen aus dem Zehnersystem und danach geht es mit Buchstaben weiter. Diese reichen von 0 bis F also 0,1,2,3,4,5,6,7,8,9,A,B,C,D,E und F. Damit hat man pro Ziffer 16-Möglichkeiten. Kombiniert man zwei dieser Hexidezimalen-Zahlen zu einem Paar, kann man 16², also 256 Werte kodieren.
Hexadezimalwerte in CSS beginnen immer mit einer Raute #. Darauf folgen 3 Paare, bestehend aus je 2 hexadezimalen Zeichen. In der RGB-Notation von CSS stehen 3 dieser Pärchen für die Farbwerte in der Reihenfolge Rot-Grün-Blau, das erste also für den Rotanteil, das mittlere für den Grünanteil das letzte für den Blauanteil.
Wie der Name schon sagt, ist das hexadezimale System ein Zahlensystem, welches auf der 16 basiert. Zur Darstellung werden die arabischen Zahlen 0-9 und die lateinischen Buchstaben A-F benutzt. Die Zahlen haben ihre klassischen Werte, A-F ergänzen diese nach oben. So hat das A den Wert von 10 und das F den von 15, sie Zahlen dazwischen entsprechend. Es stehen also pro Zeichen 16 Werte (inklusive der 0) zur Verfügung. Es sind für jeden einzelnen Farbwert 2 Stellen vorhanden, der Sechzehnerübergang gestaltet sich wie beim normalen Dezimalsystem: Ist an einer Stelle das Maximum (hier F) erreicht, wird die Stelle vor der betrachteten um 1 erhöht. Wird zu 0F eins hinzugezählt, ergibt sich folglich der Wert 10, im hexadezimalen System 16. Das Maximum ist mit FF (also 255) erreicht, mit der 00 ergeben sich also 256 Werte pro Farbe, was insgesamt 2563 Farben ermöglicht.
Bei der Farbangabe als hexadezimaler Wert gilt: Je größer der Wert, desto heller wird die Farbe. Schwarz hat somit den Wert #000000, weiß #FFFFFF.
Kurzschreibweise
In CSS gibt es eine Möglichkeit die Schreibweise von hexadezimalen Werten zu verkürzen, was jedoch nicht für alle Werte möglich ist! Besteht ein Wert aus drei gleichen Zahlenpaaren, beispielsweise #CCBB00, so kann er zusammengefasst werden, in dem die Zahlen nur einfach notiert werden. In diesem Beispiel wäre dies #CB0.
Anwendungsbeispiel
a {
color: #FFFFFF;
background: #000;
}
Definition über rgb()
Wem diese hexadezimalen Werte zu kryptisch erscheinen, kann einen Umweg über die Funktion rgb() gehen. Bei dieser können die dezimalen Werte von 0 bis 255, durch ein Komma getrennt, angegeben werden. Die Reihenfolge ist identisch mit der der hexadezimalen Notierung und auch hier gilt: Je größer der Wert, desto heller die Farbe, 255 ist also das Maximum. Alternativ sind auch prozentuale Angaben möglich, was jedoch sehr ungebräuchlich ist.
Diese Methode ist jedoch nicht sehr weit verbreitet, da sie an sich nur unnötigen Speicher belegt.
Definition über Farbschlüsselwörter
Neben der Angabe von Farbwerten, gibt es noch eine Palette vordefinierter Farben.
Grundfarben (CSS 1 + 2)
Named
Numeric
Color name
Hex rgb
Decimal
black
#000000
0,0,0
silver
#C0C0C0
192,192,192
gray
#808080
128,128,128
white
#FFFFFF
255,255,255
maroon
#800000
128,0,0
red
#FF0000
255,0,0
purple
#800080
128,0,128
fuchsia
#FF00FF
255,0,255
green
#008000
0,128,0
lime
#00FF00
0,255,0
olive
#808000
128,128,0
yellow
#FFFF00
255,255,0
navy
#000080
0,0,128
blue
#0000FF
0,0,255
teal
#008080
0,128,128
aqua
#00FFFF
0,255,255
Als Anwendungsbeispiel:
a {
color: white;
background: black;
}
Farbschlüsselwörter ab CSS 3
In CSS 3 wird die Palette der vordefinierten Farben auf 140 erweitert. Diese können wie die alten Farbnamen verwendet werden. Alle modernen Browser unterstützen mittlerweile die folgenden Farbnamen:
Named
Numeric
Color name
Hex rgb
Decimal
aliceblue
#f0f8ff
240,248,255
antiquewhite
#faebd7
250,235,215
aqua
#00ffff
0,255,255
aquamarine
#7fffd4
127,255,212
azure
#f0ffff
240,255,255
beige
#f5f5dc
245,245,220
bisque
#ffe4c4
255,228,196
black
#000000
0,0,0
blanchedalmond
#ffebcd
255,235,205
blue
#0000ff
0,0,255
blueviolet
#8a2be2
138,43,226
brown
#a52a2a
165,42,42
burlywood
#deb887
222,184,135
cadetblue
#5f9ea0
95,158,160
chartreuse
#7fff00
127,255,0
chocolate
#d2691e
210,105,30
coral
#ff7f50
255,127,80
cornflowerblue
#6495ed
100,149,237
cornsilk
#fff8dc
255,248,220
crimson
#dc143c
220,20,60
cyan
#00ffff
0,255,255
darkblue
#00008b
0,0,139
darkcyan
#008b8b
0,139,139
darkgoldenrod
#b8860b
184,134,11
darkgray
#a9a9a9
169,169,169
darkgreen
#006400
0,100,0
darkgrey
#a9a9a9
169,169,169
darkkhaki
#bdb76b
189,183,107
darkmagenta
#8b008b
139,0,139
darkolivegreen
#556b2f
85,107,47
darkorange
#ff8c00
255,140,0
darkorchid
#9932cc
153,50,204
darkred
#8b0000
139,0,0
darksalmon
#e9967a
233,150,122
darkseagreen
#8fbc8f
143,188,143
darkslateblue
#483d8b
72,61,139
darkslategray
#2f4f4f
47,79,79
darkslategrey
#2f4f4f
47,79,79
darkturquoise
#00ced1
0,206,209
darkviolet
#9400d3
148,0,211
deeppink
#ff1493
255,20,147
deepskyblue
#00bfff
0,191,255
dimgray
#696969
105,105,105
dimgrey
#696969
105,105,105
dodgerblue
#1e90ff
30,144,255
firebrick
#b22222
178,34,34
floralwhite
#fffaf0
255,250,240
forestgreen
#228b22
34,139,34
fuchsia
#ff00ff
255,0,255
gainsboro
#dcdcdc
220,220,220
ghostwhite
#f8f8ff
248,248,255
gold
#ffd700
255,215,0
goldenrod
#daa520
218,165,32
gray
#808080
128,128,128
green
#008000
0,128,0
greenyellow
#adff2f
173,255,47
grey
#808080
128,128,128
honeydew
#f0fff0
240,255,240
hotpink
#ff69b4
255,105,180
indianred
#cd5c5c
205,92,92
indigo
#4b0082
75,0,130
ivory
#fffff0
255,255,240
khaki
#f0e68c
240,230,140
lavender
#e6e6fa
230,230,250
lavenderblush
#fff0f5
255,240,245
lawngreen
#7cfc00
124,252,0
lemonchiffon
#fffacd
255,250,205
lightblue
#add8e6
173,216,230
lightcoral
#f08080
240,128,128
lightcyan
#e0ffff
224,255,255
lightgoldenrodyellow
#fafad2
250,250,210
lightgray
#d3d3d3
211,211,211
lightgreen
#90ee90
144,238,144
lightgrey
#d3d3d3
211,211,211
lightpink
#ffb6c1
255,182,193
lightsalmon
#ffa07a
255,160,122
lightseagreen
#20b2aa
32,178,170
lightskyblue
#87cefa
135,206,250
lightslategray
#778899
119,136,153
lightslategrey
#778899
119,136,153
lightsteelblue
#b0c4de
176,196,222
lightyellow
#ffffe0
255,255,224
lime
#00ff00
0,255,0
limegreen
#32cd32
50,205,50
linen
#faf0e6
250,240,230
magenta
#ff00ff
255,0,255
maroon
#800000
128,0,0
mediumaquamarine
#66cdaa
102,205,170
mediumblue
#0000cd
0,0,205
mediumorchid
#ba55d3
186,85,211
mediumpurple
#9370db
147,112,219
mediumseagreen
#3cb371
60,179,113
mediumslateblue
#7b68ee
123,104,238
mediumspringgreen
#00fa9a
0,250,154
mediumturquoise
#48d1cc
72,209,204
mediumvioletred
#c71585
199,21,133
midnightblue
#191970
25,25,112
mintcream
#f5fffa
245,255,250
mistyrose
#ffe4e1
255,228,225
moccasin
#ffe4b5
255,228,181
navajowhite
#ffdead
255,222,173
navy
#000080
0,0,128
oldlace
#fdf5e6
253,245,230
olive
#808000
128,128,0
olivedrab
#6b8e23
107,142,35
orange
#ffa500
255,165,0
orangered
#ff4500
255,69,0
orchid
#da70d6
218,112,214
palegoldenrod
#eee8aa
238,232,170
palegreen
#98fb98
152,251,152
paleturquoise
#afeeee
175,238,238
palevioletred
#db7093
219,112,147
papayawhip
#ffefd5
255,239,213
peachpuff
#ffdab9
255,218,185
peru
#cd853f
205,133,63
pink
#ffc0cb
255,192,203
plum
#dda0dd
221,160,221
powderblue
#b0e0e6
176,224,230
purple
#800080
128,0,128
red
#ff0000
255,0,0
rosybrown
#bc8f8f
188,143,143
royalblue
#4169e1
65,105,225
saddlebrown
#8b4513
139,69,19
salmon
#fa8072
250,128,114
sandybrown
#f4a460
244,164,96
seagreen
#2e8b57
46,139,87
seashell
#fff5ee
255,245,238
sienna
#a0522d
160,82,45
silver
#c0c0c0
192,192,192
skyblue
#87ceeb
135,206,235
slateblue
#6a5acd
106,90,205
slategray
#708090
112,128,144
slategrey
#708090
112,128,144
snow
#fffafa
255,250,250
springgreen
#00ff7f
0,255,127
steelblue
#4682b4
70,130,180
tan
#d2b48c
210,180,140
teal
#008080
0,128,128
thistle
#d8bfd8
216,191,216
tomato
#ff6347
255,99,71
turquoise
#40e0d0
64,224,208
violet
#ee82ee
238,130,238
wheat
#f5deb3
245,222,179
white
#ffffff
255,255,255
whitesmoke
#f5f5f5
245,245,245
yellow
#ffff00
255,255,0
yellowgreen
#9acd32
154,205,50
Farben mit Alphakanal ab CSS 3
Da in CSS 3 auch eine Eigenschaft zur Deckkraft von Elementen existiert, wurde das RGB-Modell um einen Parameter, die Deckkraft, erweitert. So können 2 Eigenschaften in einer zusammengefasst werden.
a {
background: rgba(255, 0, 0, 0.5);
color:#33006655;
}
Des weiteren kommt in CSS 3 ein Format zur Verarbeitung von Daten im HSL-Format. Dies stellt eine Alternative zum RGB-System da und kann ebenfalls mit einem Parameter für den Alpha-Wert genutzt werden:
Wer die beliebtesten Formular-Plugins für WordPress miteinander vergleicht, stellt schnell fest: Alle kosten quasi das gleiche und haben fast identische Features. Rein von der Oberfläche oder der Featureliste scheint es unmöglich, sich für eines der Pakete zu entscheiden.
Jedes Formular-Plugin muss im Test ein mehrseitiges Formular für unsere Skatedogz-Website (die wir bereits bei den letzten Theme-Tests verwendet hatten) meistern. Ein einfaches Kontaktformular war uns dafür zu einfach, wir wollten auch komplexere Formularelemente wie Dateiuploads integrieren.
Das Testszenario: Die (fiktive) Skateschule wächst. Sie braucht ein Bewerbungsformular für neue Trainer. So sieht das Formular auf einer Seite aus:
Neben Kontaktinfos können Bewerber ihre Erfahrung in Jahren auf einem Slider einstellen, mehr als eine Website verlinken und Dateien (Videos, PDFs) von sich hochladen. Später werden die Felder auf drei Seiten aufgeteilt.
Daher haben wir das kostenlose und sehr verbreitete Contact Form 7 Plugin im unserem Test leider nicht berücksichtigen können, dieses bietet schlichtweg zu wenige Funktionen.
Das folgende Video demonstriert die Erstellung des Formulars für alle vier Plugins:
Der gesamte Erstellungsprozess geht selbstverständlich mittels Drag & Drop, d.h. man braucht nicht programmieren können, oder irgendwelche Shortcodes oder HTML-Code bearbeiten!
Es lohnt sich auf jeden Fall reinzuschauen, denn der Erfahrungsbericht offenbart nicht nur die Stärken, sondern auch viele Schwächen der einzelnen Plugins.
Die Installation verlief bei allen Plugins ohne Probleme. Nur bei Ninjaforms ist es notwendig zusätzliche Module, also Erweiterungen zu installieren, um zum Beispiel das Formular auf mehrere Seiten aufzuteilen oder mehrspaltige Formulare anlegen zu können.
Alle vier Formular-Plugins bieten bereits in der günstigen Basisversion die wichtigsten Felder; angefangen bei Text, Absatz, Checkboxen, Radio-Buttons, Dropdown-Felder, verborgene Felder, Felder für das Datum und die Uhrzeit und viele mehr.
Für normale Kontaktformulare ohne große Ansprüche sind alle Formular-Plugins wirklich ausreichend.
Außerdem bieten alle der getesteten Form-Builder die Möglichkeit abgeschickte Formulare weiterzuverarbeiten und Einreichungen an diverse Drittanbieter weiterzureichen. Hier ist es aber wichtig zu wissen, mit welchem Drittanbieter man arbeiten möchte, denn nicht jeder Anbieter ist in den Basisversion erhalten. Alle Plugins bieten außerdem einen Datei-Upload und können Formulare auch in der Basisversion schon auf mehrere Seiten aufteilen.
Alle getesteten Formular-Plugins beherrschen selbstverständlich auch bedingte Logiken, mit denen man Felder ein- und ausblenden kann, je nachdem, was der Nutzer davor ausgewählt hat.
Für sämtliche Formular-Plugins fallen jährliche Lizenzkosten an:Formidable Forms gibt es schon ab ca. 40 USD, Gravity Forms erst ab 59 USD, NinjaForms kostet 49 USD und WPForms liegt bei 40 USD. Wer sämtliche Features braucht, zahlt bei allen Anbietern rund 300 USD im Jahr.
Formidable bietet mehr wichtige Felder an als die Mitbewerber. Außerdem ist es sehr übersichtlich.
Felder lassen sich nach Belieben im Formularbereich verschieben und, wie auf dem Screenshot zu erkennen, nebeneinander in Spalten arrangieren.
Am einfachsten geht das mit dem Feld „Bereich“, das erlaubt, mehrere Felder in einer Box zu gruppieren. Die Mitbewerber können das nicht so einfach. Einmal in einem Bereich lassen sich die Felder per Auswahl unter „Set Row Layout“ anordnen.
Layouteinstellungen gibt es für jedes Feld. Diese können global eingestellt werden und lassen sich so an alle Anforderungen anpassen.
Besonders gut gefallen ein paar der Sonderfelder, die es bereits in der Basisversion gibt. Das „Repeater“-Feld erlaubt das Duplizieren von Formularfeldern für den Ausfüller. Im Video ist das für das Feld „Website/URL“ demonstriert. So kann ein Ausfüller zum Beispiel mehr als eine Website eintragen. Ein Slider ermöglicht die Angabe einer Zahl aus einem Bereich, zum Beispiel „Wie viel Jahre Erfahrung hast du?“.
Das Feld „Zusammenfassung“ bieten nur zwei der vier Kontrahenten. Dies lässt sich auf der letzten Seite einbinden. So kann der Ausfüller zum Schluss überprüfen, ob alle Felder richtig ausgefüllt sind.
Die ausgegrauten Drittanbieter stehen nur bei den teureren Lizenzen zur Verfügung.
Hat auch nicht jeder: Mit der Formularplanung lassen sich Formulareinreichungen öffnen, schließen und sogar planen und limitieren.
Gravity fällt vor allem durch seine „cleane“ Oberfläche auf.
Die Felder lassen sich in Spalten anordnen.
Leider hat Gravity kein Repeater-Feld. So ist es notwendig, mehrere Felder in das Formular einzufügen. Auch gibt es keinen Slider. Für einen Zahlenbereich muss ein normales Zahlenfeld herhalten. Über die Validierung gelingt es zwar auch den Bereich von 5-40 einzugrenzen, aber cool ist anders. Der Seitenumbruch funktionierte tadellos, aber ein gruppierendes Feld wie das Feld „Bereich“ bei Formidable gibt es nicht. Immerhin gibt es die Möglichkeit Sektionen anzulegen.
Bei Ninja Forms ist nicht ganz klar, ob man ein Ninja sein muss, um diese Software zu bedienen oder ob sie einem Ninjafähigkeiten verleihen möchte.
Sehr wichtig bei den Ninja Forms ist es, die zusätzlichen Module von der Herstellersite zu laden und zu installieren. Erst dann funktionieren mehrspaltige Layouts und Multiseitenformulare wie gewünscht.
Die Meldung oben links (1) ging nie weg. Es gab auch keinen „Schließen“-Button. Die Sektionsüberschriften (2) zeigt Ninja nur an, wenn das Feld aktiv ist. Dann fährt die rechte Spalte aus und offenbart den Text (3). Den Text im Layoutbereich zu haben, erscheint wohl nicht wichtig, wie der Folgescreenshot zeigt.
Die Übersichtlichkeit des Interfaces ist jedoch vorbildlich. Ebenso die Geschwindigkeit. Ein Klick auf einen Button und das Formularfeld erscheint sofort. Bei allen anderen Buildern dauert es 1-2 Sekunden. In der Basisversion bietet Ninja keinen Slider. Aber es gibt einen Repeater, den ich erst nach dem Videotest ans Laufen bekommen habe. Allerdings ist er nicht 100% einsatzfähig:
Unter (1) lässt sich die Überschrift einstellen, die dann auch unter (2) auf dem Button übernommen wird. Das Wort „ADD“ bleibt aber immer vorne auf dem Button stehen. Anpassen lässt sich das nicht.
Unser Favorit ist Ninja nicht. Ninja fühlt sich leicht und schnell an. Wer über die kleinen Mankos hinwegsehen kann und sich mit den Eigenheiten vertraut macht, der wird sicher auch mit Ninja glücklich. Die wichtigsten Funktionen werden abgedeckt und bestimmt lassen sich diese kleinen Fehlerchen auch über den Support korrigieren.
An WPForms habe ich selbst hohe Erwartungen gestellt, hatte dann aber vor allem bei der Gestaltung mit einigen Problemen zu kämpfen.
Auch wenn WPForms sehr aufgeräumt ist, stecken die Problemchen im Detail. Erstens fehlt es an vielen Feldtypen (im Vergleich zu des Testgegnern) und die Möglichkeit Formularfelder in ein Wunschlayout zu bringen, lässt im Vergleich zu Wünschen übrig. Mehr Infos im Video.
Fazit: Der Gewinner in unserem WordPress-Formular-Plugin Vergleich
Alle Formularplugins können einfache Kontaktformulare erstellen und dies auch schnell und ansehnlich. Bei unserem Test hat sich jedoch schnell gezeigt, wer die Nase vorn hat.
Die Installation bei NinjaForms war unnötig kompliziert. Es hat zwar keine besonderen Fähigkeiten, ist aber von den Vieren das schnellste Plugin.
Insgesamt stört uns daran allerdings, dass das Backend nicht so übersichtlich ist, wie das der anderen drei Plugins. Wen das nicht stört, für den ist NinjaForms ebenfalls eine gute Wahl.
WPForms bildet hier klar das Schlusslicht. Die Layoutmöglichkeiten sind vergleichsweise bescheiden. Auch gibt es keine weiteren Herausstellungsmerkmale oder besonderen Funktionen.
Das war für uns etwas überraschend, da WPForms eines der bekanntesten Formular Plugins ist, aber die anderen haben schlichtweg mehr zu bieten.
Am Ende haben im Grunde Kleinigkeiten, wie das hervorragende Repeater-Feld und die übersichtlichen Feldbereiche bei Formidable Forms über den Gesamtsieg im Vergleich der besten Formular-Plugins für WordPress entschieden.
Reguläre Ausdrücke sind eine fantastische Möglichkeit, nach Mustern im Text zu suchen. Sie können verwendet werden, um Text zu finden und zu ersetzen, Daten zu analysieren, Eingaben zu überprüfen, Suchen durchzuführen und vieles mehr! In dieser kurzen Einführung in Regular Expressions erfahren Sie, was Sie über die Verwendung dieser Ausdrücke wissen müssen:
Regex (eine Abkürzung für regular expression, auf deutsch Regulärer Ausdruck) sind eine Art Filterkriterium, mit deren Hilfe man Zeichenketten analysieren und manipulieren kann. Sie sind in einer Vielzahl von Programmiersprachen (sed, awk, Perl, PHP,…) und Programmen (Editor vi, HTML-Editoren, OpenOffice,..) verfügbar. Manchmal werden Sie auch Pattern (Muster) genannt.
Achtung: In der theoretischen Informatik hat der Begriff „Regulärer Ausdruck“ eine exakt definierte, sehr eingeschränkte Bedeutung. Ein regulärer Ausdruck aus der Informatik kann fast nix, eine Regex in Perl oder PHP kann viel mehr. Nicht verwechseln! Besonders nicht bei der Prüfung!
Manche Programmierer nennen RegEx auch scherzhaft „schreibgeschützten“ Code, denn reguläre Ausdrücke sind für andere (einschließlich des ursprünglichen Autors) nur sehr schwer oder fast gar nicht lesbar ist, nachdem diese einmal geschrieben wurden. Scherze wie diese rühren daher, dass reguläre Ausdrücke im Allgemeinen als überaus komplex und schwer verständlich wahrgenommen werden.
Was sind reguläre Ausdrücke und wie funktionieren sie?
Ein regulärer Ausdruck ist eine Folge von Buchstaben und Symbolen, die ein Suchmuster bilden. Man findet sie oft in Programmen, die Text bearbeiten oder suchen, um Zeichenfolgen oder Wörter zu finden. Reguläre Ausdrücke werden häufig in den Pattern-Matching-Systemen von Unix-ähnlichen Betriebssystemen sowie in vielen Programmiersprachen wie Python und C# verwendet.
Reguläre Ausdrücke sind im Grunde Abfolgen von Zeichen, die ein Suchmuster definieren. Sie können verwendet werden, um Text zu finden und zu ersetzen, Daten zu analysieren, Eingaben zu überprüfen, Suchen durchzuführen und vieles mehr!
Reguläre Ausdrücke können mit Mustern erstellt werden, die Metazeichen genannt werden. Metazeichen sind Symbole, die zur Definition des Suchmusters verwendet werden, aber für sich genommen keine wörtliche Bedeutung haben. Ein Sternchen (*) kann zum Beispiel für null oder mehr beliebige Zeichen stehen, wenn es in einem Muster für einen regulären Ausdruck verwendet wird.
Warum und wozu verwendet man RegEx?
Reguläre Ausdrücke werden für viele verschiedene Dinge verwendet. Sie können in Texteditoren verwendet werden, um Funktionen wie Suchen und Ersetzen oder Syntaxhervorhebung bereitzustellen. Reguläre Ausdrücke helfen Webentwicklern, Muster in URLs zu finden, damit sie wissen, ob ein Link auf eine bestehende Ressource auf dem Server verweist.
Programmierer/innen verwenden reguläre Ausdrücke oft, um Logdateien zu analysieren, die Daten über Fehler in ihren Anwendungen enthalten, ähnlich wie Antivirenprogramme nach Viren suchen, indem sie die Systemaktivitätsprotokolle untersuchen. Durch diese Art der Analyse können Programmierer/innen den Zeitpunkt und den Ort von Abstürzen innerhalb der Codebasis ihrer Software bestimmen, was es einfacher (und schneller) macht, Probleme zu beheben, die Nutzer/innen beim Ausführen ihrer Programme haben.
Hier ein paar einfache Beispiele:
Verschiedene Schreibweisen finden:
Spider[- ]?man
Dieser Ausdruck würde folgende Worte erkennen:
Spiderman
Spider man
Spider-man
Passwort prüfen:
^([A-Za-z0-9ÄÖÜäöüß]{6,250})$
Der Ausdruck erlaubt Passwörter mit sechs bis 250 Zeichen, welches Buchstaben aus dem Alphabet (in Groß und Kleinschreibung) sowie Umlaute (ebenfalls Groß und Klein) und „ß“ benutzt.
Anwendungsmöglichkeiten für reguläre Ausdrücke
Es gibt viele Anwendungsmöglichkeiten für reguläre Ausdrücke. Einige davon sind:
Suchen und Ersetzen von Text in Dateien;
Durchsuchen von Logdateien, um Fehler oder Ereignisse in der Datei zu finden;
Durchsuchen von großen Datenmengen, um bestimmte Dateien zu finden;
Validierung von Formularfeldern auf Websites (z. B. um sicherzustellen, dass sie nur Zahlen enthalten)
Extrahieren von Daten aus HTML-Seiten (oder anderen Arten von Markup), indem du Muster zwischen Tags findest.
Diese Art von Mustern ist sehr nützlich für die Überprüfung von Eingaben, da du vielleicht möchtest, dass alle Felder deines Formulars nur bestimmte Zeichen enthalten (z. B. Zahlen). Die zwei typische Anwendungen von Regexen sind das Suchen und das Ersetzen.
Um mit regulären Ausdrücken arbeiten zu können ist das Verständnis der Syntax die wichtigste Grundlage. Die wichtigsten Elemente der Syntax sind hier aufgelistet.
Reguläre Ausdrücke machen im Grunde zwei Dinge aus: Zum einen können durch bestimmte Zeichen Wiederholungen von Zeichen, Zeichenfolgen oder -klassen bestimmt werden, zum anderen können durch Zeichenklassen Ausdrücke verallgemeinert werden, so dass sie auf mehrere, verschiedene Zeichenfolgen zutreffen. Diese zwei Punkte sollen in diesem Artikel kurz beschrieben werden.
Beachte, dass die Syntax regulärer Ausdrücke sprachabhängig ist. Achte darauf, dass du die richtigen Regex-Muster für die Programmiersprache deiner Wahl verwendest, wenn du mit ihnen im Code arbeitest!
Suchen: Pattern Matching
Ich habe eine Variable mit viel Text, z.B. $text = "das kostet 7 Euro" und will rausfinden ob da ein Geldbetrag drin ist.
Die Schreibweise dafür in PHP würde wie folgt lauten:
if ( preg_match( ""/d+ Euro/"", $text ) ) {
echo ""ja, hier gibt es geld!"";
}
In Python:
import re
if re.search('d+ Euro', text):
print "ja, hier gibt es geld!"
Wie man sieht wird in beiden Sprachen der Pattern selbst gleich geschreiben : d+ Euro Nur das Drumherum ist anders. d steht für eine Ziffer (also 0 oder 1 oder 2 …. oder 9). Das Plus dahinter bedeutet: ein oder mehrmals. Der Rest des Patterns ist einfach wörtlich zu nehmen.
Auf Deutsch übersetzt bedeuten die beiden Programme also:
Gibt es in der Variablen $text irgendwo eine oder mehrere Ziffern, gefolgt von einem Leerzeichen, gefogt von dem Wort Euro? Falls ja, dann gib den Text aus „ja, hier gibt es geld!“.
Ein paar Beispiele für $text:
$text = "999 Euro sind viel Geld"; #das matcht
$text = "999euro sind gleich viel geld"; #das matcht aus zwei gründen nicht: Das Leerzeichen fehlt und kleines e
$text = "2,5 Euro"; #das matcht nicht, weil das Komma stört
$text = "2 Euro und 50 cent"; #das matcht, ignoriert aber die cent!
Dieses Beispiel könnte man jetzt weiter entwickeln: Kommazahlen auch erkennen, den Betrag in einer Variable speichern, u.s.w. Aber zuerst die andere Anwendungsart von Regexen:
Suchen und Ersetzen – substitution
Ich habe eine Varible mit viel Text, z.B: $text = "die coolste Entwicklung des Jahres ist das Metaversum. Ohne das Metaversum ist kein Firmenauftritt mehr vorstellbar. In der Zukunft wird auch in der Bildung immer mehr das Metaversum eingesetzt werden"
In diesem Text will ich nun eine Ersetzung vornehmen. Wieder zwei Schreibweisen dafür aus zwei Programmiersprachen.
Bei diesem einfachen Beispiel hätte man (in PHP) auch mit str_replace arbeiten können. Richtig cool wird die Sache erst, wenn man ein kompliziertes Pattern hat, das ersetzt wird.
Validierung von Formulareingaben
JavaScript hat keine eingebauten Funktionen, die zur Überprüfung von Benutzereingaben verwendet werden können, aber es ist durchaus möglich, eigene zu schreiben. Reguläre Ausdrücke sind eine großartige Möglichkeit, dies zu tun!
Hier ein Beispiel für ein Regex-Muster zur Überprüfung von E-Mail-Adressen in Python:
Dieser reguläre Ausdruck prüft, ob die eingegebene Zeichenkette zwei Teile Name und Domain, bestehend aus erlaubten Buchstaben und Zahlen enthält (keine Sonderzeichen, mit Ausnahme des Minuszeichens -, dem Unterstrich _ einem Punkt . oder dem Pluszeichen +), dazwischen das @-Zeichen steht und mit einem Punkt, gefolgt von der Domain-Erweiterung (TLD) endet. Wenn eine dieser Regeln nicht erfüllt ist, gibt die Regex falsch zurück.
/^[a-z]+$/i
Dieser reguläre Ausdruck prüft, ob die eingegebene Zeichenkette nur Buchstaben enthält und nicht leer ist (mindestens ein Zeichen enthält). Ist dies nicht der Fall oder enthält die Eingabe andere, nicht alphanumerische Zeichen, wird auch dieses Muster falsch zurückgegeben. Beachte, dass wir auch ein /i-Flag hinzugefügt haben, um die Groß- und Kleinschreibung zu ignorieren – so können wir mit der gleichen Regex auf Klein- und Großbuchstaben prüfen!
Mit Mustern wie diesen kannst du beispielsweise auch Benutzereingaben überprüfen, bevor du Aktionen wie das Versenden einer E-Mail durchführst.
Syntax: Texte, Zahlen, Klassen
Die einfachsten Pattern bestehen genau aus den Zeichen die gesucht werden. Wenn man ein A suchen will benutzt man den Pattern /A/. Wenn man eine 1 suchen will benutzt man den Pattern /1/.
Dann gibt es ein paar praktische Abkürzungen:
d eine Ziffer, also 1 oder 2 oder …. 9
Dkeine Ziffer, also jedes andere zeichen ausser 1 oder 2 oder …. 9
w Ein Wort-Zeichen, das sind kleine + grosse Buchstaben, Ziffern und der Unterstrich_
Wkein Wort-Zeichen
s Ein Leerzeichen oder Tabulator
Skein Leerzeichen oder Tabulator, also fast alle zeichen
Achtung: diese Abkürzungen matchen jeweils ein Zeichen. Wenn es mehrere sein sollen, kombiniert man diese:
/ddd/ sucht eine dreistellige Zahl irgendwo im String.
Wiederholungen: Quantoren
Mit den folgenden sog. Quantoren, gibt man an, wie oft sich ein bestimmter Ausdruck wiederholen darf. Sie werden hinter einen Ausdruck geschrieben und geben dann an, wie oft dieser vorkommen darf:
? : null- oder einmal , d.h. der Ausdruck ist optional
+ : mindestens einmal
* : beliebig oft (auch keinmal)
{n} : genau n-mal
{min,max} : mindestens min-mal und maximal max-mal
{min,} : mindestens min-mal
{,max} : maximal max-mal
Beispiel: x?html passt auf html und xhtml
Beispiele
Zeichen
Bedeutung
a?
a kommt kein- oder einmal vor.
a+
a kommt mindestens einmal vor.
a*
a kommt kein oder mehrmals vor.
a{3}
a kommt genau drei mal vor.
a{3,}
a kommt mindestens drei mal vor.
a{,5}
a kommt maximal fünf mal vor.
a{3,5}
a kommt mindestens drei, aber maximal fünf mal vor.
^a
Die Zeichenkette beginnt mit einem Text der auf a passt
ausdruck$
Die Zeichenkette endet mit einem Text der auf ausdruck passt
^ab$
Die Zeichenkette passt von Anfang bis Ende auf ab
Sollen mehrere verschiedene Zeichen angesprochen werden, muss um diese eine runde Klammer gesetzt werden: (ab)?würde folgendes bedeuten: ab kommt ein- oder keinmal vor.
Zeichenklassen
Zeichenklassen sind eine abkürzende Schreibweise für eine bestimmte Auswahl von Zeichen. Es stehen einige vordefinierte Zeichenklassen zur Auswahl. Diese sind oft abhängig von der Regex-Implementierung.
Zeichen
Bedeutung
.
Jegliches Zeichen (Ausnahme der Zeilenumbruch, siehe auch bei den Modifiern)
A-Z
ABCDEFGHIJKLMNOPQRSTVWXYZ
a-z
abcdefghijklmnopqrstvwxyz
0-9 oder d
0123456789
w
Wort = Mindestens ein Buchstabe, eine Ziffer oder Unterstrich (Abkürzung für [a-zA-Z0-9_]).
W
Kein Wort. Abkürzung für [^a-zA-Z0-9_]
d
Ziffer (Abkürzung für [0-9]).
D
keine Ziffer (Abkürzung für [^0-9]).
b
Wortgrenze (Position zwischen einem Wort und einem Leerzeichen).
B
keine Wortgrenze (Abkürzung für [^b]).
s
s.g. Whitespaces, also Leerzeichen, Zeilenumbrüche, Tabulatoren etc. (Abkürzung für [fnrtvu00A0u2028u2029])
S
kein Whitespace (Abkürzung für [^fnrtvu00A0u2028u2029]).
Dies ist nur eine kleine Auswahl der wichtigsten Zeichenklassen.
POSIX-Klassen
In vielen Implementierungen sind auch diese Zeichenklassen verfügbar.
Klasse
[:alpha:]
Buchstaben: [:lower:] und [:upper:]. Dies sind nicht nur lateinische Buchstaben.
Reguläre Ausdrücke sind eine fantastische Möglichkeit, nach Mustern im Text zu suchen. Sie können verwendet werden, um Text zu finden und zu ersetzen, Daten zu analysieren, Eingaben zu überprüfen, Suchen durchzuführen und vieles mehr! In diesem Artikel haben sie hoffentlich einen Eindruck davon bekommen, was man mit regulären Ausdrücken alles bewerkstelligen kann.
Wenn Sie alles wissen möchten oder einfach nur Fragen dazu haben, wie reguläre Ausdrücke bei Ihren speziellen Anforderungen funktionieren, sehen Sie sich unsere RegEx-Tutorials an, in denen wir auf verschiedene Anwendungsfälle der Syntax regulärer Ausdrücke näher eingehen. Wir bieten auch Tutorials speziell für Anfänger an. Wenn das alles neu für Sie ist, machen Sie sich keine Sorgen – es ist nicht so schwer, wie es auf den ersten Blick erscheinen mag!
Um es vorwegzunehmen: Du fühlst dich mit dem HTML/CSS-Framework Bootstrap pudelwohl, brauchst aber bei deinen Projekten auch die Unterstützung von WordPress + Plugins? Dann ist der Bootstrap 5 WordPress Page Builder livecanvas ein absolutes Muss.
livecanvas verspricht hohe Geschwindigkeit und daraus abgeleitet besseres SEO. Ob Letzteres tatsächlich erreicht wird, hängt natürlich von vielen weiteren Faktoren ab. Aber schnell ist er. Bisher ist uns kein schnellerer Builder zwischen Zeigefinger und Mausbutton gekommen. Allerdings erkauft man sich den Speed mit einer Menge Kompromisse an anderer Stelle. Dennoch ist livecanvas für Hartgesottene eine klare Empfehlung. Fangen wir aber mal von Vorne an.
Skatedogz-Projekt
Wie immer haben wir mit livecanvas unser Skatedogz-Projekt umgesetzt. Im Video gibt es ein vollständiges Tutorial zu livecanvas mit ein paar Tipps zur Entwicklung mit Bootstrap.
Hier ein kurzer Eindruck, wie die fertige Webseite der Skatedogz, die wir im Tutorial bauen, aussieht:
Breche aus dem Gefängnis herkömmlicher Pagebuilder aus
Laut Entwickler sind aktuelle Pagebuilder kacke! Sie fesseln ihre Kunden (Customer lock-in), haben oft schlechte Performance aufgrund von zu viel „Bloat“ und erlauben keine Flexibilität bei der Implementierung von HTML-/CSS-Lösungen.
Wer sich eine Weile mit dem Pagebuilder-Ökosystem beschäftigt, kann dies leicht bestätigen. Wie will livecanvas diese Probleme aus der Welt schaffen? Schließlich kann man konkurrierenden Pagebuildern ja keine grundsätzliche Böswilligkeit unterstellen. Die wollen schließlich auch nur, dass ihr Kunden gute Erfahrungen mit ihren Produkten machen. Das führt aber unweigerlich zu den o. g. Problemen. Bei livecanvas etwa nicht?
livecanvas-Innovationen
livecanvas trumpft mit einigen Innovationen auf, um diese Probleme aus dem Weg zu schaffen.
livecanvas erzeugt kein eigenes HTML oder CSS. Es hält sich strikt an die Vorgaben aus dem Bootstrap-Framework. Alle erzeugten Layouts lassen sich über einen Button als HTML abspeichern. Soweit in die neue HTML-Datei Bootstrap eingebunden wird, bleiben alle Layouts so, wie sie in livecanvas unter WordPress erstellt wurden. Angenommen es käme ein weiterer Pagebuilder auf den Markt, der auch alles nach Bootstrap-Vorgaben macht, dann wäre dieser zumindest theoretisch dazu in der Lage einfach livecanvas zu ersetzen. Bei Elementor und Divi wird das nie passieren.
Weiterhin erschließt der Einsatz von Bootstrap tausende Layouts, Elemente und Tutorials, die einfach so in livecanvas verwendet werden können.
livecanvas speichert dieses HTML in der Datenbank. Da es in der Regel keine Shortcodes enthält, wie das bei anderen Pagebuildern der Fall ist, muss WordPress nach einer Datenbankabfrage auch nichts mehr „transformieren“. Dadurch ist livecanvas sauschnell.
Der HTML-Code lässt sich nach allen Regeln der (Bootstrap-)Kunst anpassen, erweitern und am wichtigsten: verkleinern! (s. Video für diverse Beispiele).
Der Code-Editor ist ein Traum. Er läuft direkt im Browser. Es fühlt sich so an, als würde man lokale Dateien mit Visual Studio Code oder ähnlich bearbeiten. Alle Änderungen werden sofort (!) auf der Seite reflektiert als wäre ein Liveserver an.
livecanvas Überblick
Nach der Installation offenbart ein Blick in die Einstellungen, dass es im Prinzip keine gibt:
Okay, neben einem Einleitungsvideo auf Englisch gibt es wirklich nur ein Handvoll Features. Einfach nach Gebrauch an- und ausschalten.
Für unseren Test haben wir das empfohlene picostrap-Theme verwendet (vom gleichen Anbieter).
Ein Childtheme gibt es gleich dazu. So ist es dann auch möglich, Änderungen an den Dateien vorzunehmen, die durch Updates nicht einfach überschrieben werden.
Wem das nicht reicht, der kann auch eines der zahlreichen Bootstrap-Themes bei envato erwerben. Die meisten sind kompatibel mit livecanvas und wenn es dabei Probleme geben sollte, dann einfach den Support bemühen.
Ein ganz normaler Customizer, in dem sich viele übliche Einstellungen vornehmen lassen. Beispielsweise Fonts, Farben und weitere Optionen. Das Besondere hier ist aber, dass bei einem Klick auf „Veröffentlichen“ die Einstellungen nicht etwa in der Datenbank gespeichert werden.
Sie werden kompiliert und in den Dateien des Bundles abgespeichert. Gerade einmal 29kB ist die komprimierte Datei. CSS-Dateien anderer Pagebuilder sind nicht selten fünf- bis zehnmal größer.
Der livecanvas-Editor
Das Herz von livecanvas ist der Editor. Zuerst fällt auf, dass die Seite ganz normal angezeigt wird.
Es gibt lediglich eine unscheinbare Topleiste mit drei Buttons (1) und einen Button unten rechts (2), der eine neue Sektion erstellt.
Nach einem Klick auf „Add Section“ fügt der Editor eine neue Zeile ein und das Bearbeitungsmenü öffnet sich. Hier lassen sich Dutzende Vorlagen unter Readymades auswählen. Solange man auf ein neues klickt, wird dieses sofort angezeigt. Hier glänzt livecanvas nur so vor Speed. Das Laden geht wirklich unverzüglich. Schwer zu beschreiben. Man muss es einfach gesehen haben, zum Beispiel im Video.
Neben den Readymades gibt es aber auch einen Gridbuilder. Mit dem lassen sich die meisten Grids bauen, die Bootstrap so bietet.
Während die Maus über einen Element schwebt, zeigt livecanvas an den Kanten der Boxen Schaltflächen an, über die die Einstellungen der Elemente aufgerufen werden.
Über das Menü lassen sich Elemente verschieben, kopieren, einsetzen, duplizieren oder zum Beispiel neue Zeilen einfügen.
Es ist jedoch (aktuell) nicht möglich Elemente per Drag’n’drop zu verschieben. Ein Feature das fast alle anderen Pagebuilder bieten.
STRG+Z (oder CMD+Z) für „Rückgängig machen“ geht auch nicht. Aber es gibt zum Glück eine Historiefunktion, mit der man zu früheren Version zurückkehren kann. Nur eben nicht mit der Tastatur.
Ein Doppelklick auf diese Schaltflächen (1) öffnet übrigens die Optionen und eine Rechtsklick den Codeeditor (2), das wahre Schmuckstück von livecanvas. Hier wird der Code der Spalte angezeigt. Alle Änderungen im Codeeditor werden live auf der Seite widergespiegelt. Unter Global CSS (neben (2)) lässt sich auch gleich das globale CSS bearbeiten und live testen. Das macht richtig Spaß und ist im Prinzip das Hauptfeature von livecanvas. Es geht ja darum Bootstrap-Webdesignern die bestmögliche Experience zu liefern und das macht livecanvas wirklich gut.
Hat livecanvas auch Nachteile?
Was andere Builder in der Regel können, aber livecanvas nicht:
Drag’n’drop von Elemente geht nicht.
Es lassen sich keine Spalten oder Zeilen abändern. Wenn also eine Zeile drei Spalten hat und du daraus zwei machen möchtest, dann musst du das im HTML abändern.
Keine Unterstützung für dynamische Felder, Formulare und viele andere dynamische Funktionen.
Diverse andere Probleme, die ich im Video demonstriere.
Fazit: Der perfekte PageBuilder für Bootstrap-Entwickler
Nachdem ich in den letzten Monaten etliche WYSIWYG-Pagebuilder getestet hatte, war livecanvas zuerst wie ein großer Kulturschock, den ich erstmal verkraften musste. Meine Erfahrungen mit Bootstrap liegen schon viele Jahre zurück. Nach ein paar Stunden Dokumentation lesen und experimentieren, bin ich aber gleich wieder im Element gewesen.
Bei der Arbeit mit livecanvas zeigt sich schnell, was dieser Pagebuilder leistet und was nicht. Aus meiner Sicht gibt es noch viel Verbesserungspotenzial. Es stellt sich aber die Frage inwiefern liebgewonnene Features wie das Verschieben von Elementen, konditionelles Einbinden von Seiten, Dutzende von Blöcken usw., was es alles bei der Konkurrenz gibt, für dich tatsächlich entscheidend sind. Schließlich benutzt du Bootstrap und bist daher schon ein Badass 😉 Es gibt für Bootstrap im Prinzip auch alles, was es für WordPress gibt. Man muss nur kurz Google bemühen.
livecanvas ist ein geniales Tool für Bootstrap-Entwickler, die hier und da gerne WordPress mit einem Plugin verwenden wollen. Zum Beispiel für Formulare oder andere Interaktivelemente. Alle anderen sollten lieber auf einen herkömmlichen Builder setzen.
Kannst du dich noch an die drei Punkte aus dem livecanvas-Manifesto erinnern? Customer Lock-in, zu viel „Bloat“ und kaum Flexibilität bei der Implementierung von HTML-/CSS-Lösungen. Diese drei Probleme behebt livecanvas vollständig. Wenn das für dich wichtig ist, dann schlag zu und mach Gebrauch von der 30-Tage-Geldzurückgarantie.
Die meisten WordPress-Nutzer jubelten als RankMath Ende 2018 als kostenloses Ersatzplugin für Yoast und andere SEO-Plugins auf den Markt kam. Bietet selbst die Free-Version einen unglaublichen Funktionsumfang, der sogar den der konkurrierenden Bezahloptionen deutlich übertrifft. Das war eine echte Überraschung.
Seit November 2019 gibt es nun eine Pro-Version mit vielen interessanten Features. Dieser haben wir auf den Zahn gefühlt. Neben einem ausführlichen Tutorial und einer Erklärung der wichtigsten Features beantwortet unser ausführlicher Testbericht auch die Frage, für wen und ab wann sich die Pro-Version lohnt.
Unser Video-Tutorial demonstriert Installation und Einsatz bei Hey-Uni.de. Einem Hobby-Projekt, das wir im letzten Beitrag schon gehörig mit WP ROCKET beschleunigt haben. Jetzt geht es darum, herauszufinden, welche Best Practises sich mit RankMath Pro umsetzen lassen.
In unserem Video findest du einen kompletten Durchgang von der Installation, Konfiguration und eine Beleuchtung der meisten Features – Free und Pro (jedoch noch ohne Content AI):
Nach dem Kauf landet der Downloadlink in der Inbox. Über diesen lässt sich das WordPress-Plugin auf der Account-Seite als ZIP-Datei herunterladen.
Nach dem Download die ZIP-Datei einfach unter Plugins/Installieren/Plugin hochladen auswählen, installieren und direkt aktivieren.
Es empfiehlt sich direkt den Account zu verbinden, damit alle Features zur Verfügung stehen.
Username und Passwort steht in der E-Mail nach dem Kauf.
Einmal aktiviert, kann es losgehen mit dem Installations-Wizard. Es gibt Einiges zu einzurichten.
Selbstverständlich wählen wir „Advanced“, um alle Features konfigurieren zu können.
Da YOAST installiert ist, möchte RankMath mit der automatischen Migration beginnen. Alle Einstellungen von Yoast werden nach „Import starten“ übernommen.
Der Vorgang dauerte bei Hey-Uni ungefähr eine Minute. Danach wird das Yoast SEO Plugin deaktiviert.
Unter „Deine Seite“ lässt sich der Website-Typ einstellen. Ein Logo für Google. Das wird dann bei Suchen rund um die Website und/oder das Unternehmen bei Google angezeigt. Ein standardmäßiges Bild zum Teilen auf Social Media ist auch nützlich.
Eine der Stärken von RankMath Pro ist die Zusammenführung von Daten aus den unterschiedlichen Quellen, um so die Ranking-Performance besser analysieren zu können. Das bedeutet selbstverständlich auch, dass das Plugin Zugriff auf all diese Dienste benötigt.
In unserem Beispiel ist die Search Console verbunden. Das sollte fürs Erste reichen. Solltest du aber Google Analytics verwenden, dann richte es entsprechend ein. Unter Country unbedingt Deutschland einstellen, damit Google.de als Suchmaschine für Rankingabfragen verwendet wird.
Sitemaps sind streng genommen bei kleineren Sites nicht unbedingt notwendig. Schaden tun sie aber auch nicht. Die Standardvorgaben reichen für den Anfang.
Für News- und Video-Websites lassen sich separate Sitemaps anlegen.
Im Schritt „Optimierung“ lassen sich leere Tag- und Kategorieseiten auf NoIndex stellen (empfohlen). Externe Links grundsätzlich mit NoFollow zu versehen, bringt schlechtes Karma. Es schadet auch nicht den eigenen Rankings. Ob externe Links in einem neuen Fenster aufgehen sollen, hat eher Auswirkungen auf die Usability, ist aber ein beliebtes Feature.
Fertig. Ist die Installation von RankMath Pro jetzt abgeschlossen? Nicht ganz.
In der Rollenverwaltung (s. u.) lässt sich feingliedrig festlegen, wer welche Funktionen von RankMath verändern darf. Falls eine Seite nicht existiert, kann der 404 Monitor darüber benachrichtigen. Außerdem lassen sich solche Seiten dann umleiten.
Schema ist eines der herausragendenen Pro-Features bei RankMath. Die Typen für Beiträge und Seiten lassen sich vorab definieren. Das kann nützlich sein, sollte die Website vielleicht keine Publikation sein (z. B. ein Onlineshop oder Immobilienportal), dann macht es Sinn andere Schematypen zu verwenden. Natürlich lässt sich der Typ nachher noch individuell anpassen.
Features: RankMath Pro nach der Installation
Nach der Installation, für die man sich gerne 10 Minuten nehmen darf, geht es direkt ins Dashboard. Hier finden sich eine große Menge an Modulen (1), den Einrichtungsassistenten (2) und die Import & Export Funktionen (3). Der Rest der Funktionalität ist im Menü abrufbar.
Aktuell gibt es insgesamt 19 Module. Dabei braucht niemand wahrscheinlich alle Module gleichzeitig. Schauen wir uns dennoch mal die wichtigsten Module im Detail an.
Der 404 Monitor
Sobald ein Modul aktiviert ist, erstellt RankMath einen Link dazu im Menü.
Über einen Klick auf „Einstellungen“ geht es zum 404-Fehlerprotokoll.
Hier tauchen Anfragen auf, die ins Leere gelaufen sind. Sehr nützlich nicht nur für eine bessere Nutzerfreundlichkeit, sondern auch zum Beispiel um interne und externe Links zu finden, die nicht richtig gesetzt sind.
Ein Klick auf „Einstellungen“ liefert weitere Möglichkeiten. Die „Erweitert“-Option (1) protokolliert auch den Referrer, wichtig um herauszufinden, von welcher URL ein Klick kommt. Das „Protokolllimit“ begrenzt die Anzahl der Logs. Einhundert Zeilen in einem Protokoll (2) sollten reichen. Sollte es Pfade auf der Website geben, bei denen der 404-Fehler ausdrücklich gewünscht ist, so lassen die sich unter (3) ausschließen. Falls URLs Parameter angehangen sind, so können diese ignoriert werden.
Der Fehlaufruf ist direkt im Monitor sichtbar (1). Prompt nach der Aktivierung sind viele weitere 404s aufgetaucht. Es ist vielleicht interessant diese mal zu kategorisieren. (2) und (6) könnten falsche Links auf der eigenen Site sein. Das sollte klarer werden, sobald auch die Referrer-Infos bei zukünftigen Anfragen das erst Mal gespeichert werden. (3) bis (5) sind vermutlich Crawler oder Spamanfragen. (7) und (8) sehen aus wie typische Security-Attacken. Hier versuchen Hacker bekannte Schwachstellen zu ermitteln. Das passiert im Prinzip den ganzen lieben langen Tag lang. Also immer alles aktuell halten!
???? für den 404 Monitor. Sehr nützlich. Damit bleibt die Site immer clean. Die Erfahrung zeigt, dass sich im Laufe der Zeit so viele kleine Fehler eliminieren lassen. Am besten alle paar Wochen oder Monate mal hereinschauen und Fehler prüfen.
Wer braucht das? Jeder.
Support für Advanced Custom Fields
Sobald das bekannte Plugin Advanced Custom Fields installiert ist, weiß RankMath damit umzugehen. ACF wird von Sites eingesetzt, die viele zusätzlichen Feldoptionen benötigen. Ein Immobilienmakler möchte vielleicht in einer Sektion Immobilienobjekte veröffentlichen. Neben Titel und anderen Standardfeldern benötigt ein Eintrag auch Felder für Quadratmeter, Anzahl Zimmer, Miete etc.
Es ist lediglich notwendig den Support zu aktivieren. Es gibt keine Einstellungsmöglichkeiten. Sobald es aktiviert ist, kann RankMath die zusätzlichen Felder in die Contentanalyse und -Optimierung einbeziehen.
???? Mit ACF und theoretisch auch mit vergleichbaren Plugins müssen alle SEO-Plugins umgehen können.
Wer braucht das? Nur Sites, die angepasste Daten veröffentlichen, die über die Standardfelder nicht abgedeckt sind.
Support für das AMP-Plugin
Wer das AMP-Plugin benötigt, der braucht lediglich den Schalter hier umzulegen.
Danach werden alle für AMP notwendigen Funktionen bereitgestellt.
Sobald ein Beitrag bearbeitet wird, zeigt das AMP-Modul (1) an, ob das Markup gültig ist, bzw. welche Fehler es noch zu beheben gilt (2).
???? Wenn Speed auf der eigenen Site nicht gut realisierbar ist, vielleicht Aufgrund der Anforderung viele Widgets verwenden zu müssen, macht es eventuell Sinn die AMP-Version der Seite oder des Beitrags indizieren zu lassen.
Wer braucht das? Zuerst sollte es einen guten Grund geben überhaupt AMP einzusetzen. Dies macht nicht unbedingt für jede Site Sinn. Wer es nutzen möchte, hat aber immerhin ein komfortables Tool zur Analyse und Optimierung.
Analysen: Die Kernfunktion von RankMath Pro
Das Analysen-Modul stellt die Ranking und Trafficzahlen miteinander in Zusammenhang. Das macht es vermutlich für Viele zu dem wichtigsten Pro-Feature.
In den Einstellungen lassen sich alle Dienste verbinden. Das Projekt hey-uni.de benutzt lediglich die Search Console.
Das Analyse-Dashboard liefert einen guten Überblick über die aktuelle Performance und den Optimierungsstand. Da das Plugin frisch installiert ist, fängt die Arbeit jetzt erst an. Die meisten Seiten haben noch keine Bewertung und ob die Optimierung Früchte tragen, wird sich in Zukunft hier zeigen.
Besonders hilfreich ist dabei der Bereich „Top 5 Winning Posts“. Der lässt sich auch auf „Top 5 Losing Posts“ umstellen. So hat man einen guten Überblich darüber, welche Posts als nächstes zu optimieren sind.
Im Bereich „Site Analytics“ (1) gibt es einen Überblick über den SEO-Score aller Seiten und Beiträge. Der SEO-Score muss für jeden Beitrag eigens erarbeitet werden. Darin besteht die Haupttätigkeit der Onpage-Optimierung. Er besteht aus vielen kleinen Schritten. Jeder für sich genommen nicht sonderlich schwer. Aber es ist einiges an Arbeit.
RankMath hat im Blog eine detaillierte Anleitung dazu, die über 10.000 Wörter stark ist: Score 100/100 With Rank Math Post Tests. In diesem Beitrag können wir natürlich nur flüchtig über die einzelnen Schritte gehen. Hinterlasse auf jeden Fall einen Kommentar, wenn du dir dazu ein Tutorial wünschst. Wenn sich genügend melden, dann nehmen wir es mit auf die Liste.
Die SEO-Performance liefert nochmals den Überblick.
Hier sind alle Seiten und Beiträge aufgelistet.
Ein Überblick über alle Keywords gibt es auch.
Weiter unten können diese auch dem Rank Tracker hinzugefügt werden.
Dazu einfach auf das Plussymbol in der ersten Spalte klicken. Hier sieht man das aktuelle Ranking und die Geschichte der Rankings.
Im Rank Tracker erscheint das Keyword dann. Ich habe direkt noch ein paar weitere Keywords hinzugefügt (1). Für diese ermittelt RankMath ebenfalls die Rankings. Positionen tauchen nach kurzer Zeit auf. In der Pro-Version werden maximal 500 Keywords über alle Sites getrackt. Die Business-Lizenz für 199 USD jährlich erlaubt bis zu 10.000 Keywords.
Wichtiger Tipp: Damit RankMath ausschließlich Rankings aus einem Land ermittelt (also nur über Google.de), das Land in den Allgemeinen Einstellungen ⭢ Analysen ⭢ Country auswählen.
???? RankMath Pro bietet gerade in diesem Bereich Features, für die es sich lohnt, etwas zu zahlen. Zwar lässt sich diese Funktionalität auch mit anderen Tools nachbilden, aber nicht direkt in WordPress, bzw. nicht auf so eine übersichtliche und vollständige Art.
Wer braucht das? Jeder, der seine Ranking- und SEO-Performance stets im Blick haben möchte.
Forensupport
RankMath unterstützt bbPress (nur Pro) und BuddyPress bei WordPress-Installationen, die als Foren laufen. Es erstellt automatisch korrektes Q&A-Schema und kann deswegen schon interessant sein. Aktuell kein Thema für hey-uni.de.
Wer braucht das? Nur Forenbetreiber.
Bilder-SEO
Bilder wollen ordentlich ausgezeichnet werden. Das steigert die Chancen für ein gutes Ranking in der Bildersuche enorm. Die Einstellungsmöglichkeiten sind hier schon enorm. RankMath nimmt einem sehr viel Arbeit ab, wenn es um das Auszeichnen von Bildern geht.
Die Einstellungen lassen kaum Wünsche übrig. Nicht nur ALT-Attributen können Texte zugewiesen werden – auch den Titleln, Captions und Descriptions. Das passiert übrigens, ohne etwas am Text selbst zu ändern. Die Daten werden beim Rendern der Seite dynamisch in die DOM eingehangen. Der Google-Bot versteht das und der Originalinhalt bleibt unberührt.
Dabei können verschiedene Variablen zu einem String zusammengesetzt werden. Natürlich gilt es hier nicht zu übertreiben. Automation verlockt immer dazu die Grenzen des Machbaren auszuprobieren und die ALT-Attribute vollzuspammen. Zurückhaltung ist angesagt. Außerdem sollte in den ALT-Attributen (fast) nichts stehen, was nicht auch im Bild vorkommt.
???? Eine allumfassende Funktion zur Optimierung der Bilder. So wünscht man sich das.
Wer braucht das? Jeder, der Bilder verwendet und mit diesen noch ein Quäntchen mehr Rankings rauspressen möchte.
Sofortige Indexierung
Normalerweise nicht notwendig. Kommen doch alle Crawler früher oder später vorbei. Wer es aber eilig hat, kann seine URL an Bing schicken, um sie eventuell dort etwas schneller in den Index zu bekommen. Bringt das was? Versuche es einfach.
???? Ein kleines Gimmick. Aber schaden kann es auch nicht.
Wer braucht das? Jeder, der auf Bing steht.
Linkzähler
Das Linkzähler-Modul zählt ausgehende und eingehende Links in allen Beiträgen und Seiten.
Die drei Symbole im roten Kasten zeigen (von links nach rechts) interne Links auf eigene Unterseiten, ausgehende Links auf andere Domains und eingehende Links von der eigenen Website. Wichtige Inhalte sollten selbstverständlich mehr Links erhalten.
???? Nettes kleines Feature, das einem stets zeigt, auf welcher internen Linkbaustelle als Nächstes gearbeitet werden muss.
Wer braucht das? Sites, die an ihrem internen Linkprofil arbeiten wollen. Für externe Links ist immer noch ein anderes Tool notwendig.
Info: RankMath arbeitet anscheinend an einem Link-Builder-Modul, das einen stark erweiterten Funktionsumfang haben soll. Der Releasetermin ist noch nicht bekannt.
Lokaler SEO & Knowledge Graph
Restaurant, Frisör, Apotheke – solche Websites profitieren besonders und meistens ausschließlich von lokalem SEO. Das Modul bietet einen sehr großen Funktionsumfang. Wenn man eines über die Optimierung von lokalen Suchergebnissen sagen kann, dann dies: „Übertriebene Gründlichkeit führt zum Erfolg“. Je mehr Felder man bei Google ausfüllt, desto höher die Chance für eine gutes Listing.
In der Optionen lassen sich alle Daten eintragen, die das Unternehmen selbst widerspiegeln. Auf der Website selbst, können diese Unternehmensdaten dann mit dem Shortcode [rank_math_contact_info] eingefügt werden. Das hat den Vorteil, dass sich keine Tippfehler einschleichen. Ein weit verbreitetes Problem sind Tippfehler bei den Adressangaben, die Google Local durcheinanderbringen, wodurch die Rankings leiden können.
RankMath bietet einen Artikel mit allen Informationen, die zum korrekten Ausfüllen notwendig sind: Using Rank Math’s Local SEO Module. Es sind wirklich viele, aber es lohnt sich alles gründlich auszufüllen.
Ein besonderes Feature bei RankMath Pro ist die Unterstützung für multiple Standorte. Die Funktionalität wird freigeschaltet, nachdem „Organization“ unter „Person or Company“ angeklickt wird. Danach noch „Use Multiple Locations“ aktivieren und RankMath Pro fügt den neuen Menüpunkt „RM Locations“ ein.
Unter RM Locations können danach neue Standorte hinzugefügt werden, so erhält jeder Standort eine eigene Seite, die individuell gestaltbar ist. Eine weitere Einteilung nach Kategorien (2) ist möglich, sollte es sehr viele Standorte geben. Sogar Aldi, Lidl & Co könnten RankMath verwenden, um all ihre Filialen weltweit abzubilden.
???? Wow, dieses Modul hat es in sich. Es bildet alle notwendigen Features ab, die für eine mehr als ausreichende lokale Optimierung notwendig sind. Da bleiben keine Wünsche übrig.
Wer braucht das? Alle Sites, die für ein lokales Business stehen.
News-Sitemaps
News-Sitemaps machen Beiträge für den Google-Newsbot leichter zugänglich.
Dieses kleine Modul hilft dabei, die richtigen Kategorien für newsrelevante Inhalte auszuwählen.
???? Ein kleines, aber nützliches Feature, dass einer Site mit newsrelevanten Sites dabei hilft, ihre Beiträge schneller bei Google News zu platzieren.
Wer braucht das? Nur News-Websites.
Weiterleitungen
Viele Sites leiden unter Rankingverlusten, weil oft unabsichtlich nach einem Relaunch oder einfachen Änderungen an URLs Sichtbarkeit verloren geht. Das Modul Weiterleitungen (1) hilft dabei das zu vermeiden. Debug-Umleitungen (2) ist ein Tool für Entwickler, die so nachvollziehen können, was genau bei den Umleitungen passiert. Das Rückfallverhalten (3) bestimmt, was passiert, wenn eine umgeleitete URL nicht gefunden wird. Der Umleitungstyp (4) erlaubt auch die Wahl von anderen HTTP-Codes – 301 dürfte aber fast immer die richtige Wahl sein. Die automatische Postumleitung (5) ist äußerst praktisch, legt sie doch nach einer Änderung des Slugs (dem Pfadanteil eines Beitrags) automatisch einen Redirect an.
???? Das muss jedes SEO-Plugin können.
Wer braucht das? Jeder.
Schema
Das Thema Schema ist eines der beherrschenden SEO-Themen der letzten Jahre. Gepflegte Schemaeinträge können, am Haupt-Algorithmus vorbei, gute Rankings ergattern. Die Unterstützung von Schema-Daten in RankMath Pro ist phänomenal.
Die Optionen für Standardbeiträge finden sich im Menü unter RankMath ⭢ Titel & Meta.
In der Dropdown-Box lassen sich viele weitere Schemas auswählen.
(Screenshot: RankMath)
Das ist jedoch nur der Anfang. Die Schemaunterstützung zieht sich durch alle Bereiche und Beitragstypen in WordPress. Sollte eines fehlen, besteht kein Zweifel daran, dass RankMath es in Zukunft unterstützt.
Allen unterstützten Inhaltstypen können nach Belieben Schemas hinzugefügt werden bzw. lassen sich diese auch anpassen. Einfach auf das RankMath-Symbol klicken (1), dann auf Schema (2) gehen und den „Schema Generator“ aktivieren.
Vielleicht ist dieser Beitrag auch ein HowTo? Mit (+) Use einfach das HowTo-Schema hinzufügen.
Danach stehen zusätzlich Felder aus dem HowTo-Schema zur Verfügung. Zum Beispiel die notwendige Zeit bei der Umsetzung (1), ein Bild (2), etwaige Kosten (3) in einer Währung (4), benötigtes Material (5) usw.
Und schon können für diesen Beitrag zusätzliche Metainformationen hinterlegt werden, die eine Chance auf ein Ranking deutlich erhöhen können.
Außerdem können eigene Schemas angelegt werden, für die, die wissen, was sie tun.
???? Die Integration der Schema-Daten bei RankMath Pro geht noch deutlich tiefer. Sie lässt kaum Wünsche offen und bietet damit ein echtes Edge bei der Optimierung an.
Wer braucht das? Nur Leute, die es mit der Suchmaschinenoptimierung wirklich ernst meinen und schnell Resultate erzielen wollen.
Rollenverwaltung
In größeren Teams ist es notwendig die Rechte gewisser Gruppen einzuschränken.
???? Vielleicht bei jungen Sites noch nicht relevant. Wenn eine Site jedoch wächst und immer mehr Teammitglieder hinzukommen, dann wird diese Funktion immer wichtiger, vor allem um Unfälle zu vermeiden. (Jemand verstellt aus Versehen etwas und Rankings gehen dadurch verloren.)
Wer braucht das? Sites mit größeren Teams.
SEO-Analyse
Die RankMath SEO-Analyse ist crazy cool.
Nach dem Aktivieren präsentiert das Interface einen einfachen blauen Button. Ein Klick darauf startet eine umfassende SEO-Analyse, die als Grundlage der Optimierungsarbeiten verwendet werden kann.
Keine 30 Sekunden später erhält man einen hilfreichen SEO-Report, mit dem man direkt anfangen kann. Es heißt in der Suchmaschinenoptimierung ja immer: Behebe alle Fehler und Unzuläglichkeiten, denn man weiß nie, was dich vom Ranking eventuell zurückhält.
???? Die Ein-Button-Analyse ist superhilfreich, lassen sich so schnellstens offensichtlich Fehler und Schwachstellen aufdecken.
Wer braucht das? Jeder.
Sitemaps
Sitemaps sind ein Basisfeature.
In den Optionen lassen sich Bilder integrieren und für Bereiche Filterkriterien erstellen, die nicht in der Sitemap auftauchen sollen.
???? Auch wenn die Einbindung einer Sitemap sicher keine SEO-Wunder bewirkt, so ist es immer noch eine gute Best Practice.
Wer braucht das? Jeder.
Video-Sitemaps
Sites mit vielen Videos freuen sich über die Möglichkeit, diese per Sitemap anzubieten.
Das steigert die Chancen in einem Videosnippet in der Google-Videosuche angezeigt zu werden.
Wer braucht das? Nur Sites, die ihre Videos in die Suche bekommen wollen.
Google Web Stories
Web Stories sind Googles Antwort auf Instagram. Sie erfreuen sich einiger Beliebtheit und bietet eine Chance auf ein Ranking außerhalb des Standard-Algos. Wer das nutzen kann, der sollte dies auch tun.
???? Cool? Mal sehen, ob sich die Web Stories als festes Element etablieren. Google ist ja bekannt dafür, solche Experimente schnell abzuschießen, falls sie nicht funktionieren. Den Daumen hoch dafür, dass RankMath so schnell ein Feature zu Verfügung stellt.
Wer braucht das? Nur für Nutzer der Google Web Stories.
WooCommerce
Du betreibst einen Onlineshop mit WooCommerce? Dann gibt dir RankMath Pro hier auch Rückendeckung.
Beim Erstellen neuer Produkte und Kategorien klinkt sich RankMath Pro genauso ein, wie bei normalen Seiten und Beiträgen.
???? Die Integration ist durchgehend und vorbildlich. So lassen sich Onlineshops gründlich optimieren.
Wer braucht das? Onlineshops.
Update: Content AI von Rank Math
Gerade hat das Team von RankMath ein vollkommen neues Feature vorgestellt: Content AI:
Dabei handelt es sich quasi um eine Art Surfer SEO-Klon nur eben direkt im WordPress. Falls Du Surfer SEO nicht kennst, die Idee dahinter ist es, automatisiert die Suchergebnisseite von Google zu einem bestimmten Keyword abzurufen und die dort rankenden Seiten hinsichtlich bestimmter SEO-Signale zu untersuchen. Im Grunde sieht man damit, welche Keywords, die gut rankenden Seiten an welchen Stellen einsetzen und welche Begriffe diese in ihren Inhalten verwenden. Die Vorschläge sind dabei dynamisch und hängen vom eingestellten Fokus-Keywords und dem Zielland ab, das man in den Einstellungen konfigurieren kann:
Das Tool versucht tatsäch eine Art „intelligente Empfehlung“ zu geben, beispielsweise bei der optimalen Länge des Inhalts. Ich halte jedoch nichts davon, mich auf eine Pseudo-KI zu verlassen, die mir vorschreibt, wie viele Wörter ich schreiben soll, welche Überschriften ich verwenden, wie viele Links ich einfügen oder welche Medien ich einbetten sollen. Ebenso hilft Content AI dabei, herauszufinden, welche Phrasen oder Wörter man im Text, in Überschriften oder den SEO-Metadaten verwenden könnte.
Externe Links zu gut rankenden und damit vertrauenswürdigen Seiten, können ebenfalls einen Inhalt aufwerten. Mit den Linkvorschlägen der Content AI lassen sich schnell und einfach Zitate zu den eigenen Inhalten hinzufügen, um weiterführende Quellen für den Leser einzubinden und darüber die Sichtbarkeit in den Suchmaschinenergebnisseiten zu erhöhen. Darüber hinaus erhält man eine Liste von W-Fragen, vornehmlich aus den FAQPage-Snippets sowie PAA-Boxen (People-also-ask), die man dann im Textbeantworten, oder wiederum in strukturierter Form für ein eigenes FAQPage-Snippet einbauen kann.
Dies alles sollte man immer nur als Empfehlung, Vorschlag und Möglichkeiten verstehen und selbst prüfen, in wie weit dies für den Suchenden und das eigene Ziel sinnvoll ist!
Ich halte den Begriff „Content AI“ für vollkommen überzogen, aber heutzutage muss ja alles irgendwie nach künstlicher Intelligenz aussehen, dennoch ist das Feature aber eine sehr gute Möglichkeit, die Konkurrenz-Analyse quasi zu automatisieren und direkt im WordPress-Editor zu erledigen.
Fazit
RankMath ist ein wahrer Feature-Gigant. Wenn man Feature pro Dollar rechnet, dann ist das Plugin unglaublich preiswert.
Wer etwas Schlechtes über RankMath Pro sagen möchte, dann wahrscheinlich, dass die Einarbeitung aufgrund all dieser Optionen ziemlich aufwendig ist. Man kann aber unmöglich behaupten, dass RankMath Pro eine schlechte Investition wäre. Ganz im Gegenteil. Bei der Arbeit damit stellt sich schnell das Gefühl ein, das letzte SEO-Plugin gefunden zu haben, was man jemals braucht.
Die Dokumentation von RankMath ist ebenfalls vorbildlich, wenn auch nur auf Englisch. Es gibt umfangreiche Tutorials, die beim Optimieren helfen. Mehrere davon sind über 10.000 Wörter stark, mit klaren Anleitungen, wie die einzelnen Optionen am besten umzusetzen sind.
Eine Supportanfrage wurde übrigens auch schnell und akkurat beantwortet.
Für wen ist das Plugin?
Ganz ohne SEO-Kenntnisse könnte es zu schwer werden. Da ist viel Lernarbeit notwendig, denn man muss ja auch wissen, was all die unterschiedlichen Stellschrauben bewirken. In den Händen von Profis ist das Tool so etwas wie der Heilige Gral. Rund um RankMath lässt sich wahrscheinlich ein eigenes Agenturmodell aufbauen, denn „normale Kunden“ möchte man nicht mit RankMath alleine lassen.
Es gibt zwar einen „Easy Mode“, der es Anfängern ermöglicht, erstmal zu beginnen. Meine Erfahrung nach, ist es wahrscheinlich besser als nichts zu machen, allerdings werden dabei sicher Potenziale verschenkt.
Kurz gesagt: Wer Zeit hat, sich einzuarbeiten, der wird kaum ein besseres Tool finden.
Lohnt sich die Pro-Version?
Die Pro-Version lohnt sich natürlich nur, wenn es ein Modul gibt, das du unbedingt brauchst. Du sieht ja an den Screenshots, welche Module nur in der Pro-Version enthalten sind. Außerdem steht unter jeder Modulbeschreibung, für wen das jeweilige Modul gemacht ist. Es spricht auch nichts dagegen, erstmal mit der kostenlosen Free-Version zu beginnen und dann zu schauen, ob einem etwas fehlt. 59 USD jährlich für die Pro-Version ist bei dem Feature-Umfang schon fast geschenkt.
Was den Kauf von RankMath Pro aber besonders attraktiv macht: Es gibt kein Limit für eigene Sites! Du hast 50 verschiedene Domains? Dann brauchst du nur eine Lizenz und kannst das Plugin überall installieren. Genial!
Mit dem Erscheinen von Content AI, macht es die RankMath Pro Version aus unserer Sicht nur noch interessanter. Zwar kannst Du auch mit einem kostenlosen Account mit 5 Credits das Feature mal antesten, um es regelmäßig nutzen zu können, brauchst Du dann aber definitiv mindestestens den PRO-Plan mit 25 Credits pro Monat für die Content AI, oder sogar Business mit 200 Credits bzw. für größere Teams den Agency Plan mit 750 Credits.
Was das RankMath-Team da geschaffen hat, ist wirklich phänomenal.
Von uns gibt es eine absolute Kaufempfehlung und höchste Bewertungen!
