News

Nachdem Etch jetzt fast die stabile Version 1 erreicht hat und ich mich über die letzten Wochen mit dem Tool intensiv befasst habe, war es jetzt an der Zeit, es auch für den Aufbau dieser Webseite speziell für das Webdesign-Business zu verwenden.

Ich habe versucht, mich so weit wie möglich an den in WDD Live 99 von Kevin Geary beschriebenen Workflow anzupassen und so viele der in Etch integrierten Funktionen wie möglich zu nutzen. Für das Thema Responsiveness habe ich dedizieret (ausser im Header) auf Container-Queries anstelle von Media-Queries gesetzt.

Ich habe 19 Komponenten, 7 (Etch)-CPTs und 12 Schleifen erstellt.

Für eine CPT musste ich auf JetEngine CPT zurückgreifen, da ich ein Auswahl-Metafeld mit mehreren Optionen benötigte (in Etch noch nicht verfügbar).

Für ein CPT habe ich JetEngine-Repeater-Felder in Bricks verwendet, um Elemente auf den Einzelseitenvorlagen anzuzeigen. Da dies derzeit nicht unterstützt wird (nur ACF-Repeater-Felder), habe ich Einzelseiten erstellt und ein Seitenlink-Metafeld im CPT mit der URL dieser Seiten hinzugefügt (vorübergehende Umgehungslösung).

Die Erfahrungen in der Arbeit an der neuen Webseite hat mir bestätigt, dass der Arbeitsablauf in Etch genau so hocheffizient ist wie gedacht. Ich habe noch nie so schnell und sauber eine Webseite aufgebaut.

Etch – die neue einheitliche Entwicklungsumgebung für WordPress ist ab sofort und nur bis zu 01.09.2025 als LTD (Live Time Deal) erhältlich. Ab September wird dann auf ein jährliches Abo-Modell umgestellt. Jetzt ist also die Gelegenheit, sich eine LTD Version zu sichern.

Hier der Link zum Kauf: https://etchwp.com?aff=190b6a43 (Affiliate Link)

Hinweis: Die Entwicklung des Produkts ist aktuell noch im Gange, die stabile Version wird zum 01.09.25 erscheinen. Aber auch jetzt ist die Alpha-Version bereits sehr fortgeschritten und kann bereits mit Vorsicht für Webseiten eingesetzt werden.

Welche Vorteile bietet Etch?

Etch ist nicht ein weiterer Pagebuilder für WordPress sondern eine einheitliche Entwicklungsumgebung! Die Vorteile auf einen Blick:

• Etch schreibt automatisch alles, was Sie erstellen, als native Gutenberg-Blöcke im WordPress-Block-Editor und ermöglicht eine bidirektionale Synchronisierung, sodass Änderungen, die im Block-Editor vorgenommen werden, automatisch mit Etch synchronisiert werden. Dadurch werden Ihre Daten vollständig aus Etch befreit und Ihren Kunden wird eine native WordPress-Bearbeitungserfahrung geboten.
• Individuell anpassbare Oberfläche. Nahezu jedes Bedienfeld kann in einen anderen Ablagebereich verschoben werden. Die Seitenleisten unterstützen mehrere Bedienfelder und verschiedene Größen, und Ihre Layout-Einstellungen werden gespeichert, um maximale Konsistenz zu gewährleisten. In wenigen Sekunden erreichen Sie genau die Konfiguration, die Sie sich schon immer gewünscht haben!
• Endlich vollständiger Zugriff auf den HTML-Code! Sehen, anfassen und vollständig bearbeiten. Nichts ist tabu! Schreiben Sie ihn von Hand, kopieren Sie ihn aus einer beliebigen externen Quelle oder lassen Sie ihn mit Emmett wie von Zauberhand erscheinen. Sie möchten ihn nicht sehen? Dann blenden Sie ihn einfach aus. Sie haben die volle Kontrolle.
• Endlich – sauberer, semantischer Code! Keine unnötigen Wrapper, Attribute, automatisch generierten IDs oder automatisch generierten Klassen. Dies ist wahrscheinlich der sauberste und schlankste Code, den eine visuelle Entwicklungsumgebung derzeit liefern kann.
• Etch speichert das Element-Styling zusammen mit dem Element selbst und gibt nur das Styling für Elemente aus, die auf der Seite vorhanden sind. Dies ist die beste Methode, um das Styling auf einer Website zu organisieren und nur kritisches CSS auszugeben. Etch verwendet außerdem ein „selector-freies” Styling-System, das das Styling auch dann intakt hält, wenn Klassen umbenannt werden. Gleiches gilt auch für Javascript!
• Sobald Sie die Struktur erstellt haben, kann „Auto-BEM“ mit einem einzigen Klick automatisch BEM-Selektoren an jedes Element anhängen, um maximale Skalierbarkeit und Wartbarkeit Ihres Stylings sowie eine beispiellose Effizienz Ihres Workflows zu gewährleisten.
• Etch ist die einzige visuelle Entwicklungsumgebung, mit der Sie Klassen, Attribute und Attributwerte in einem einzigen Schritt hinzufügen können. Anschließend können Sie mit CSS auf Elementebene auswählen, auf welche Elemente Stile (einschließlich Attribute) angewendet werden sollen. Warten Sie, bis Sie sehen, wie unglaublich leistungsstark das ist.
• Stilelemente mit visuellen Stilvorgaben oder CSS … oder beides! Alle Änderungen, die Sie in den visuellen Eingabefeldern vornehmen, werden in bearbeitbares CSS geschrieben, und alles, was Sie in CSS schreiben, wird mit den Eingabefeldern synchronisiert. Sie müssen nie wieder raten, woher Ihre Stile stammen.
• Etch ist die einzige visuelle Entwicklungsumgebung, mit der Sie Klassen, Attribute und Attributwerte in einem einzigen Schritt hinzufügen können. Anschließend können Sie mit CSS auf Elementebene auswählen, auf welche Elemente Stile (einschließlich Attribute) angewendet werden sollen. Warten Sie, bis Sie sehen, wie unglaublich leistungsstark das ist.
• Erstellen Sie Komponenten mit einem einzigen Klick. Bearbeiten Sie Ihre Komponenten direkt auf der Arbeitsfläche (keine magischen Bereiche). Erstellen und ordnen Sie „Props“ in Sekundenschnelle zu. Erstellen Sie Varianten mit bedingter Logik. Komponenten werden als synchronisierte Muster gespeichert und ohne zusätzliche DOM-Elemente im Frontend gerendert. Einfach fantastisch.
• Verwenden Sie Bedingungselemente und Logikstrings, um die Darstellung beliebiger Elemente oder deren untergeordnete Elemente zu steuern oder Attributwerte und sogar Inline-Stile zu kontrollieren. Vollständige Unterstützung für zusammengesetzte Bedingungen, Bedingungen, Vergleiche, verschachtelte Bedingungen und mathematische Prüfungen in nahezu jeder Kombination.
• Schleifen für Beiträge, Taxonomien, Benutzer, rohe JSON-Daten und REST-API-Daten. Schleifen verschachteln. Schleifendaten aus einer Schleife in eine andere Schleife ziehen. Bedingte Logik in Schleifen verwenden. Schleifenkonfigurationen speichern. So sehen Schleifen in Ära 4 aus!
• Etch wurde für die Erstellung moderner, dynamischer Websites entwickelt. Ganz gleich, ob Sie Loops oder Templates verwenden, Sie können Daten dynamisch aus der WordPress-Datenbank, dem Block-Editor und benutzerdefinierten Feldern abrufen.

Letztes Jahr im September wurde von Kevin Geary ein neuer Pagebuilder angekündigt: Etch.

Ohne überhaupt eine Alpha-Version oder Mockups des Builder zu zeigen, wurden die ersten 1.500 Lizenzen innerhalb kürzester Zeit verkauft. Auch ich habe eine Partner-Lizenz erworben, einfach weil ich überzeugt war, dass hier was Großes am entsehen war. Auch hinsichtlich des Track-Records von Kevin (AutomaticCSS, Frames) war ich überzeugt, dass hier keine Vaporware entsteht – was übrigens viele dachten!

Jetzt, 9 Monate später ist die Version zwar immer noch Alpha und es fehlen noch essentielle Teile, aber dennoch kann man damit schon einfache Webseiten bauen. Ich habe daher meine private Seite ( https://peter-heck.de ) mit Etch neu gebaut.

Was ist aber so besonders an Etch:

In Etch hat man 100% Zugriff auf das komplette HTML, CSS und JS – man kann, ähnlich wie in Codepen arbeiten – aber auch mit Builder-typischen Inputs – ganz wie man möchte. Eingaben im Builder werden z.B. 1:1 in realtime in das CSS Fenster gespiegelt und umgekehrt. Komponenten sind einfach fantastisch gelöst und ermöglichen die Erstellung von Elementen mit zahlreichen Variationen (z.B. für Cards). Der erzeugte Code ist super clean!

Die professionelle Websiteentwicklung macht durch Etch einen Sprung in eine neue Ära!

Begleitend dazu erstelle ich in meinem Videokanal eine Reihe von Videos zu Etch ( https://www.youtube.com/watch?v=855JAnyAPC4&list=PL3o27eHV5YVgWstvswmwciVIhbB97Bfe0 ) und habe auch eine deutsche Facebookgruppe gegründet: https://www.facebook.com/groups/etchwpde

Vor Kurzem ist die jährliche Befragung von “The Admin Bar” herausgekommen. Zu einem Teilbereich des Ergebnisses möchte ich hier in dem Block meine Sicht zeigen:

Kosten der Webseite.

Dazu ein Statement von der Webseite:

Wenn ich jetzt davon ausgehe, dass die Teilnehmer meistens in B2B Bereich tätig sind, stelle ich mir die Frage, wie man eine Webseite, welche wirklich das Geschäft des Kunden voranbringt, für unter 5.000 Euro erstellen kann.

Um mich nicht falsch zu verstehen: Eine Website mit einigen Seiten kann man schon für unter 5.000 Euro erstellen, keine Frage. Allerdings steht diese dann erstmal alleine da und hat so keinen oder wenig Nutzen. Um wirklich Conversions zu erzeugen (sprich: Kunden nehmen die Leistung in Anspruch weil sie über die Homepage auf das Unternehmen aufmerksam geworden sind) ist aber weit mehr zu tun als nur die Homepage zu erstellen. Neben der technisch sauberen Erstellung ist das vor allem das richtige, kundenorientierte Design, ein vernünftiges Copywriting (die wenigsten Kunden sind in der Lage, suchmaschinenoptimierte Texte zu liefern) und vernünftiges SEO.

Um eine solche Website nur ansatzweise in die oberen Ränge bei Google & Co. zu bekommen, bedarf es wesentlich mehr Aufwand, der unter 5.000 Euro einfach nicht machbar ist!

Ich stelle da die Frage, ob eine Firma, die sich keine 5.000 Euro für eine Webseite leisten kann, wirklich eine braucht (um halt die Box “Ich habe eine Webseite” abzuhaken). Ggf. macht es gerade für kleine Firmen mehr Sinn, sich auf andere Medien wie Facebook, TikTok, Instagram etc. zu konzentrieren. Dann reicht ggf. wirklich eine 1-Page Webseite mit Links zu den sozialen Medien.

Wenn man sich die Datengrundlage anschaut und nur die deutschen Teilnehmer (31 – vielleicht nicht gerade repräsentativ) anschaut fällt auf, dass 20 davon in dem Bereich unter 5.000 Euro liegen! 9 liegen im Bereich 5.000 – 9.999 und nur 2 davon im Bereich 10.000 – 19.999 !

Stundensatz

Auch hier das Statement aus der Umfrage:

Dies korreliert teilweise mit dem vorherigen Punkt. Ein Stundensatz in diesem hochqualifizierten Bereich mit sehr komplexen Zusammenhängen darf nicht im Bereich 50 Euro liegen! Wir bewegen uns hier im B2B Bereich in einem hochdynamischen Umfeld, welches sehr viel Wissen, Erfahrung und ständiges Lernen erfordert. Da darf man seine Leistung nicht verscherbeln! Daher ist auch unser Stundensatz von aktuell 85 Euro marktgerecht und fair!

BTW – wenn man die Airtable Tabelle mal nach Deutschland filtert, dann liegt der durchschnittliche Stundensatz bei 125$!

Dieser neue Kurs lehnt sich an den Pagebuilding 101 Kurs von Kevin Geary an. Ich habe diesen Kurs aus drei Gründen neu aufgelegt:

1. Viele haben Schwierigkeiten, solchen komplexen Inhalten in einer anderen Sprache als der Muttersprache zu folgen, daher habe ich mich entschieden, den Kurs in Deutsch neu aufzulegen.

2. Die Welt dreht sich weiter und man kann ggf. auch bestimmte Inhalte variieren bzw. erweitern / kürzen.

3. Für mich selbst ist es auch eine Möglichkeit, gelernte Inhalte zu wiederholen und zu vertiefen.

Starten Sie jetzt mit dem neuen Kurs und lernen Sie, wie man Webdesign wie ein Profi erstellt. Nachdem Sie diesen Kurs absolviert haben, wissen Sie mehr als 90% der Webdesigner im Markt!

Link zum Kurs: https://www.youtube.com/watch?v=_v294EFmYF4…

Es gibt zahlreiche Arten seine Endgeräte abzusichern. Alle diese Lösungen, seien es Virenschutzprogramme, personal Firewalls oder ähnlich, haben den Nachteil, dass die immer nur auf dem jeweiligen Endgerät arbeiten und nur dieses schützen. Tablets, Smartphones und andere mobile Endgeräte sind zwar meist bereits durch den Hersteller einigermassen sicher, aber eben nicht komplett. Neben dem Thema Sicherheit kommen ist dann noch das Thema der Werbung anzusprechen. Um diese effizient zu blocken, bedarf es Werbeblockern, die auch auf allen Geräten laufen müsssen (sofern möglich). Wenn man dann noch zentrale Dienste wie Chatsysteme, Nextcloud oder andere sicher betreiben möchte, dann wird es komplex.

Eine hervorragende Lösung wurde während Corona von dem Sicherheitsingenieur Steven Foerster für seine Familie und Freunde entwickelt und ist als freie Software unter GitLab verfügbar.

Was macht jetzt diese Software?

Vereinfacht gesagt, steht irgendwo im Internet (entweder auf einem kleinen PC zuhause oder auf einem virtuellen Server in der Cloud), auf dem der Mistborn Softwarestack installiert ist. Dieser ist nach der Installation von aussen nur noch via Wireguard-VPN erreichbar. Auf ihm läuft eijne IP-Tables basierte Firewall und PiHole als zusätzliche Firewall. Weiterhin lassen sich auf diesem Gerät zahlreiche Dienste wie z.B. Nextcloud sicher betreiben. Auf den Endgeräten muss nur noch die Wireguard VPN Software installiert werden und diese verbindet sich mit dem Mistborn Server. Damit läuft dann alle Kommunikation ins Internet über diesen Server. Er dient somit als zentrale Schutzbarriere zum Internet – egal von welchem Gerät aus man arbeitet und egal, wo man sich mit diesem Gerät befindet.

Das Schaubild zeigt den Aufbau:

Ein Test via https://d3ward.github.io/toolz/adblock.html zeigt die Effizienz der Lösung hinsichtlich des Blockens von unerwünschter Werbung:

Haben Sie Interesse mehr dazu zu erfahren? Gerne beraten wir Sie und implementieren Mistborn für Sie!

Ich habe vor kurzem meinen Macbook Air verkauft. Der junge Käufer erzählte mir, er startet nach seiner IT-Ausbildung jetzt ein Geschäft im IT-Bereich und hat dazu auch eine Homepage, die er mit Strato Website Builder erstellt hat. Da er auch Dienste im Bereich Webdesign anbietet, habe ich ihm dazu geraten, erst einmal die Grundlagen hierzu zu lernen und sich den Pagebuilder 101 Kurs von Kevin Geary anzuschauen.

Es lies mir aber keine Ruhe und ich habe mir mal seine Homepage und eine vergleichbare aus dem IONOS Homepage Builder angeschaut. Was sich einem da auftut ist einfach grauenhaft! Bei Strato fast noch extremer als bei IONOS, aber beide sind ein Verbrechen am guten Webdesign!

Ich habe die Details in einem Video zusammengefasst – machen Sie sich selbst ein Bild davon!

Die Webseite des Kino- und Kulturverein Raunheim e.V. wurde von Elementor auf Bricks migriert.

Hierbei wurde konsequent Automatic-CSS und Frames eingesetzt. Dadurch ist sichergestellt, dass die damit erstellten Inhalte semantisch sauber, barrierefrei und optisch einheitlich dargestellt werden.

Weiterhin wurden die Inhalte in großen Teilen mittels Custom Post Types (CPT) bereitgestellt und somit die Vorteile des CMS – und ein solches ist WordPress eigentlich – voll ausgenutzt.

Als Beispiel dienst hier die Auflistung der Filme. Jeder Film existiert als Eintrag in einem CPT mit allen für den Film notwendigen Angaben. Auf der Webseite werden diese Filme dann mittels eines Loop-Containers aufgelistet. Die entsprechenden Genres für die Filme sind als Kategorien erstellt, somit kann danach einfach gefiltert werden. Aber auch die Liste der Vorstandsmitglieder oder der Kundenmeinungen sind als CPT erstellt.

Durch den Pagebuilder 101 Kurs von Kevin Geary bin ich auf die Nutzung von Pseudo Elementen gestoßen. Was man damit machen kann und warum diese so nützlich sind, zeigt mein neues Video – viel Spaß beim anschauen!

Wie in den vorherigen Posts bereits beschrieben, wechsele ich strategisch von Elementor zu Bricks. Damit einhergehend ändere ich auch die Herangehensweise für die Erstellung der Webseiten.
Ich möchte hier mal darstellen, wie es dazu gekommen ist und was sich im Detail ändert.
Nachdem ich mir Bricks angeschaut habe, kam ich sehr schnell auch mit dem CSS-Framework „Automatic CSS“ und dem Produkt „Frames“ aus dem gleichen Haus in Berührung. Um mich einzuarbeiten schaute ich mir zahlreiche Videos von Kevin Geary, dem Gründer von Automatic CSS, an und kam sehr schnell auf seinen Pagebuilder 101 Videokurs und auch auf die von ihm gegründete Community „Inner Circle“. Dadurch inspiriert war mir klar, dass ich den bisherigen Weg so nicht mehr weiterverfolgen kann.
Was wird sich also ändern, bzw. hat sich schon geändert:

1. Ich nutze künftig keine vordefinierten Templates mehr! Stattdessen werden neue Webseiten von Grund auf basierend auf Wireframes designed und anschließend via Frames und Automatic CSS gebaut. Dadurch wird sichergestellt, dass die Webseiten sowohl im Code semantisch einwandfrei sind als auch im Design konsistent. Weiterhin sind die damit erstellten Webseiten weitestgehend barrierefrei, da der Code z.B. auf die Bedürfnisse von Screenreadern optimiert ist.
   
2. Dadurch bedingt ändert sich auch das generelle Setup eines Projektes. Ein wesentlicher Aspekt ist das sogenannte „Discovery“ Gespräch. Dies ist essentiell um überhaupt zu verstehen, was die Ziele des Kunden sind, die er mit der Erstellung der Homepage erreichen möchte. Darauf abgestimmt wird dann das grundlegende Design der Homepage erstellt. Die darauffolgenden Phasen sind klar gegliedert und bauen systematisch aufeinander auf. So erfolgen das Design erst nachdem das grobe Gerüst anhand von Wireframes erstellt und abgenommen wurde. Das eigentliche Bauen der Homepage erfolgt wiederrum erst, nachdem das Design finalisiert wurde (z.B. Farben, Schriften etc.).
   
3. Die Inhalte selbst, sofern sie spezifische Bereiche wie Produkte/Services, Teammitglieder etc. betreffen, werden künftig ausschließlich via Content Post Types (CPT) dynamisch via Loops auf der Webseite dargestellt. Dies ermöglicht eine Pflege via Formular direkt durch den Kunden im backend, ohne dass er im Frontend editieren muss. Weiterhin skaliert diese Lösung besser und benötigt im Frontend keinerlei Designanpassungen.

Mittlerweile unterstützen die meisten Endgeräte die Umschaltung auf einen “Dark Mode”, also einen Modus, bei dem der Bildschirm auf ein dunkles Farbschema geschaltet wird.

Um den Wunsch der Webseitennutzer nach einer dunklen Darstellung zu entsprechen, besteht bei vielen Webseiten die Möglichkeit, diesen entweder manuell zu aktivieren oder, je nach Einstellung des Gerätes des Besuchers, diesen automatisch anzubieten.

Nach dem bereits in den vorherigen Posts angesprochenen Wechsel nach Bricks und Automatic CSS, steht mir jetzt eine einfache Möglichkeit zur Verfügung, bei der Nutzung von Automatic CSS diesen Modus sehr einfach zu aktivieren. Dazu muss dieser lediglich aktiviert und alternative Farbpaletten für den Dark Mode konfiguriert werden. Eine Sache von max. 5 Minuten! Dann noch einen Umschalter in den Header einbauen (nochmal 5 Minuten) und fertig ist das Ganze.

Ich habe dies jetzt für diese Homepage umgesetzt – testen Sie das doch einfach mal. Einfach oben im Header den Modus umschalten!

Wäre das auch was für Ihre Homepage? Dann sprechen Sie uns an!

Was zum Teufel ist “Snake Oil”? Schauen wir dazu auf die Begriffsdefinition in Wikipedia:

Schlangenöl (aus dem Englischen snake oil) ist die spöttische Bezeichnung für ein Produkt, das wenig oder keine echte Funktion hat, aber als Wundermittel zur Lösung vieler Probleme vermarktet wird.

Schaut man sich viele Ratgeber an, so greifen die meisten viel zu kurz. Es ist leider nicht mit der Installation eines Security-Plugins oder dem setzen einzelner Parameter getan. Auch Methoden wie z.B. das Login via Loging Atempt Limits abzusichern sind absolut nutzlos. Diese blockieren eine einzelne IP-Adresse, wenn sich diese zu oft falsch einloggt. Hacker greifen WordPress Systeme aber nicht mit einem System an, sondern mittels Botnetzen – da kommt jeder Login von einer anderen Adresse und dieser Mechanismus läuft ins Leere! Auch Security Plugins bieten keine echte Sicherheit. Diese können zwar bedingt helfen, indem Sie einfache Angriffe abwehren, aber sind allerhöchstens eine Ergänzung zu den wirklich wichtigen Maßnahmen. Echte WordPress Sicherheit baut auf zahlreiche einzelne Bausteinen auf!

In diesem Artikel möchte ich meine Strategie zum Thema Sicherheit in WordPress darstellen.

Am besten schaut man sich an, wie die meisten Einbrüche auf WordPress-Seiten vonstatten gehen – die häufigsten Gründe sind:

• Zu schwache Passwörter in Admin / User Accounts
• Veraltete WordPress-, Theme- oder Plugin-Versionen
• Von außen erreichbare WordPress Dateien
• SQL-Injektion (z.B. über Formulare)
• Brute-Force Attacken auf das WordPress Login
• Brute-Force Attacken auf die XMLRPC Schnittstelle

Gehen wir mal darauf ein, wie sich diese Probleme adressieren lassen, bzw. wie ich das handhabe.

1. Administrative Zugriffe und Passwörter / Brute-Force Attacken auf den Login-Bereich
   Der wichtigste Schutz überhaupt ist der des WordPress Login Bereiches! Generell vergebe ich keine Administrationsrechte an Kunden, es sei denn, es ist technisch nicht anders möglich. Jeder Adminzugang ist neben dem Zwang zu langen Passwörtern mindestens mit einer obligatorischen 2-Faktor Authentifizierung [1] abgesichert. Bei allen neuen Webseiten, bei denen keine Anmeldung normaler Besucher notwendig ist (z.B. bei Shop-Systemen oder Foren) setze ich das WebAuthn Plugin ein und konfiguriere dies so, dass eine Anmeldung ausschließlich mit einem Passkey [2] möglich ist. Weiterhin wird bei diesen Systemen die Login-URL auf einen anderen Pfad gesetzt. Letzteres erhöht die Sicherheit zwar nur marginal, ist aber ein valider Baustein zur Absicherung des Logins, auch wenn dies einen erfahrenen Hacker nicht wirklich abhält.
   Zusätzlich unterbinde ich das Scannen nach Benutzernamen innerhalb von Seiten und Beiträgen durch entsprechende .htaccess Direktiven.
   
2. Veraltete WordPress Komponenten
   Wichtig ist es, die WordPress-Komponenten (neben dem WordPress Kernsystem, vor allem die Plugins und Themes) aktuell zu halten. Dies geschieht bei mir zum einen über eine automatische Updatefunktion, die für alle Komponenten eingestellt ist, aber auch händisch, sollte dringender Updatebedarf bestehen. Letzteres kommt immer dann vor, wenn eine Sicherheitslücke bekannt wird, da möchte man nicht darauf warten, dass der automatische Update irgendwann einmal diesen durchführt. Die Benachrichtigung einer solchen kritischen Sicherheitslücke geschieht zum einen durch eine Alarmierung des eingesetzten Sicherheitsplugins Ninja Firewall, aber auch durch das Verfolgen einschlägiger Quellen im Internet. Die händische Installation erfolgt in einem solchen Fall zentral über die MainWP [3] Konsole.
   
3. Von außen erreichbare WordPress Dateien
   Wichtig ist es, spezielle Dateien und Verzeichnisse von einem Zugriff von außen zu schützen. Dazu werden diese in der .htaccess Datei [4] mittels spezieller Direktiven geschützt.
   
4. SQL- Injections
   Zur Vermeidung von SQL-Injections sollte in erster Line darauf geachtet werden, nur bekannte, solide und gut gewartete Plugins einzusetzen. Weitere Absicherung geschieht bei mir über spezielle Direktiven in der .htaccess Datei.
   
5. Abschaltung der XMLRPC Schnittstelle
   Die WordPress XMLRPC Schnittstelle ist ein bekanntes Einfallstor in WordPress. Die XML-RPC wurde entwickelt, um die Kommunikation zwischen verschiedenen Systemen zu standardisieren. Anwendungen außerhalb von WordPress, wie z.B. Blogging-Plattformen und Desktop-Clients, können so mit WordPress Daten austauschen. Mittlerweile wurde diese durch eine Rest-API ersetzt und wird daher bei mir komplett deaktiviert

Zusätzlich zu den erwähnten Absicherungen werden noch weitere Maßnahmen zur Absicherung getroffen, wie z.B. das Setzen von HTTP-Security Headern sowie spezielle Absicherungen innerhalb der .htaccess Datei.

Fazit: Einen 100% Schutz vor erfolgreichen Angriffen kann es nicht geben, man kann aber durch geeignete Maßnahmen viel dazu beitragen, es den Hackern nicht allzu leicht zu machen!

Wie bereits in dem Beitrag vom 29.02.2024 geschrieben, wechsele ich strategisch von Elementor zu Bricks. Nach der Migration der Seite https://trinksportgruppe.wine/ zu Bricks, startete ich vor einer Woche die Migration meiner eigenen Firmenwebseite von Elementor zu Bricks.

Ziel war es nicht, die Webseite 1:1 zu migrieren, sondern auch die Inhalte weitestgehend zu überarbeiten. Insgesamt bin ich mit dem Ergebnis sehr zufrieden und mich würde Ihre Meinung als Webseitenbesucher interessieren.

Schreiben Sie mir doch, wie Sie die neue Seite finden.

Vor etwas über 2 Jahren berichtete ich über den Umstieg von Nexustheme zu Elementor. Damals wurde der Support für Nexusthemes eingestellt und die bisher verwendeten Themes wurden auf Elementor umgestellt. Damit wurde ich praktisch zu dem Umstieg gezwungen, wobei zu sagen ist, dass mir dieser sehr leichtgefallen ist, da die Funktionen von Elementor damals sehr überzeugt haben.

Nach nunmehr über 2 Jahren habe ich nicht nur alle Kunden auf Elementor migriert, sondern auch neue Webseiten mit Elementor erstellt. Und ja, Elementor ist und bleibt ein hervorragender Pagebuilder und bestehende Seiten werden auch weiterhin unter Elementor betrieben.

Aber für alle neuen Webseiten werde ich strategisch zu Bricks wechseln. Was sind die Gründe dafür? Hier einige der wichtigsten:

1. Bricks unterstützt globale CSS Klassen! Damit definiere ich einmal, wie ein Inhaltselement aussehen soll und vererbe dies via CSS-Klasse an andere, gleichartige Elemente. Dies ist für mich das wichtigste Kriterium für den Wechsel gewesen. Unter Nutzung von Zusatzprodukten wie Automatic CSS und Frames wird dies noch auf einen höheren Level gehoben.
   
2. Der durch Bricks erzeugte Code ist wesentlich schlanker als der von Elementor! Dadurch verringern sich die Ladezeiten und dies ist wichtig für die SEO.
   
   
   _{Hier sieht man Anhand einer Überschrift den Code Output der beiden Builder}
   
   
3. Die Unterstützung dynamischer Inhalte ist besser gelöst als in Elementor! So kann man in Bricks innerhalb eines Textfeldes mehrere dynamische Felder kombinieren. Etwas, was Elementor nicht bietet und dazu führt, dass man sich etwas verbiegen muss, um die gewünschten Ergebnisse zu erzielen.
   
4. Viele Funktionen in Elementor sind nur als Experimental oder Beta Versionen verfügbar und man weiß nie, ob man diese produktiv einsetzen sollte oder nicht. Alles, was in Bricks enthalten ist, ist stable und produktiv einsetzbar.
   
5. Der Elementor-Editor nervt durch langsame Ladezeiten und verweigert auch ab und zu den Dienst komplett. Der Bricks Editor ist schnell und zuverlässig.
   
6. Bei fast jedem Elementor-Update zerschießt es das CSS und man muss dieses für jede Webseite neu generieren – etwas, was ziemlich viel Zeit in Anspruch nimmt.

Die wichtigsten Aspekte habe ich in dem folgenden Video mal zusammengefasst:

Lange Jahre haben wir unsere eigenen und die Webseiten unserer Kunden auf einem eigenen Rootserver gehostet. Nachdem aber die für die Pflege dieses Servers aufzuwendende Zeit immer größer wurde, entschlossen wir uns zu einem strategischen Wechsel zu einem Dienstleister für WordPress Hosting. Gestartet waren wir hier mit IONOS und das läuft bei kleineren Webseiten auch einigermaßen vernünftig, mit wenigen Downtimes und akzeptabler Geschwindigkeit.

Leider ist aber gerade das Thema Performance bei größeren Seiten ein Schwachpunkt bei IONOS, so dass wir in 2023 auf die Suche nach einem alternativen Hosting gingen. Leider gibt es da viele Meinungen zu verschiedenen Hostern auf dem Markt und die Suche nach “DEM” optimalen Hoster erwies sich als äusserst schwierig.

Letztendlich viel unsere Wahl auf die Firma Hostinger. Hier die Entscheidungskriterien:

Positiv:

• Hervorragende Performance durch den Einsatz von Litespeed Object Cache und optionalem CDN
• Extreme Variabilität bei der Parametrisierung der Webumgebung. So können z.b. PHP Module individuell an- bzw. abgeschaltet werden
• Sehr guter und zeitnaher Support via Chat
• Hervorragende Verfügbarkeit der Webseiten – bisher nach 3 Monaten keinerlei Ausfälle. Das sind wir von anderen Hostern wie IONOS, Bluehost, Strato etc. so nicht gewohnt.
• Große Einsparungen beim Abschluss eines Vertrages über mehrere Jahre

Negativ:

• Keine monatlichen Zahlungen, das Hosting muss für mindestens 1 Jahr im Voraus bezahlt werden
• Kein Ticketsystem. Der Support erfolgt ausschließlich per Chat, was bei komplexeren Themen, die ggf. längere Nachverfolgung benötigen, recht umständlich ist.

Zum Thema Ladezeiten, anbei mal ein Vergleich einer bei Bluehost gehosteten Seiten, die via Cloudflare augeliefert wird, zu einer bei Hostinger gehosteten Seite (ohne Nutzung des Hostinger CDN sowie mit CSS/JS-Optimierung via Litespeed Plugin) – die Steigerung der Geschwindigkeit ist mehr als deutlich. Hier spielen natürlich verschiedene Faktoren zusammen, aber in der Summe ist das Ergebnis sehr befriedigend.

Alles in allem können wir eine klare Empfehlung für das Hosting bei Hostinger aussprechen!

Gerade in der Phase der Erstellung einer Webseite kommt es vor, dass Kunden noch kleine Änderungen wünschen. Um das für den Kunden effizienter und besser steuerbar zu machen, arbeiten wir ab sofort mit Atarim. Dabei kann der Kunde direkt auf der Webseite Elemente mit Kommentare versehen, die dann als Task zur Umsetzung bei uns landen. In einem Kanban-Board werden diese priorisiert und abgearbeitet.

Für die Firma Webergarten in Oestrich-Winkel wurde die bisherige Seite für den Gartenbaubetrieb neu gestaltet und der Bereich für die Vermietung der Ferienwohnungen in eine eigene Seite ausgegliedert. Bei letzterer wurde uch ein Buchungssystem für die Ferienwohnungen integriert.

Zum Jahresende wurden gleich zwei neue Kundenwebseiten parallel erstellt und sind fristgerecht live gegangen:

EU-More: Für ein Projekt des European Copper Institute zur Beschleunigung des Austauschs ineffizienter Motoren in der Industrie wurde diese Webseite erstellt.

Lebenswerte: Für ein EMS-Fitnessstudio wurde eine Webseite erstellt.

Nachdem innerhalb der europäischen Datenschutzbehörden immer mehr Stimmen gegen die Verwendung von Google Analytics zur Verfolgung von Benutzerdaten laut werden (Stichwort: Verstoß gegen die DSGVO), habe ich mir mal Gedanken zu Alternativen gemacht und hierbei den Open-Source Dienst “Matomo” entdeckt. Das schöne an diesem Dienst ist, dass ich ihn vollkommen autark betreiben kann – keinerlei Daten fließen hier an die Datenkrake “Google”.

In einer frei konfigurierbaren Übersicht kann der Kunde die Metriken seiner Webseite beliebig einfügen und anordnen:

Klickt der Webseitenbetreiber jetzt auf einen Besucher, so öffnet sich eine Detailansicht eines Besuchers, inkl. der besuchten Seiten, der Herkunft (Land, direkter Zugriff / Zugriff über Suchmaschinen oder Verlinkungen) und der technischer Details zum verwendeten Endgerät, dem Betriebssystem und dem verwendeten Browser:

Mit diesem Dienst lassen sich ohne Bedenken hinsichtlich DSGVO (Benutzerdaten werden natürlich anonymisiert gespeichert) Auswertungen zum Besucherverhalten durchführen – ein großer Gewinn für den Kunden und der Datensicherheit in Europa!

Mit dem neuesten Elementor Release wurde endlich die Container-Unterstützung aus dem Alpha ind den Beta Status gehoben. Damit ist sie jetzt auch in Live-Projekten einsatzbar, da im Beta Bereich sichergestellt ist, dass Änderungen in der Entwicklung keine negativen Einflüsse mehr auf vorhandene Funktionen haben. Somit setzen wir diese Technik auch in künftigen Projekten ein.

Weiterhin ist der Loop-Builder als Beta hinzugekommen. Mit diesem sehr mächtigen Werkzeug lassen sich sehr flexibel Loops erzeugen. Auf unserer Homepage nutzen wir den für das Darstellen der Referenzen.

Mehr zum Release 3.8 hier in diese, Video:

Oftmals ist es hilfreich, den Kunden über die Homepage die Möglichkeit zu bieten, Termine für eine Beratung oder eine Leistung zu buchen.

Nach umfangreichen Tests verschiedener Produkte habe ich mich dafür entschieden, meinen Kunden bei Bedarf das Terminbuchungssystem “Amelia” anzubieten.

Amelia zeichnet sich durch einen sehr umfangreichen Funktionsumfang aus und integriert sich u.a. in bestehende Kalender (Outlook oder Google) sowie die gängigen Zahlungssysteme wie PayPal, Stripe oder Mollie. Es können Mitarbeiter angelegt und diesen Mitarbeitern Services zugeordnet werden. Für jeden Service kann individuell die Dauer, Rüstzeiten (Puffer vor/nach dem Termin), die Kosten und die Zahlweise festgelegt werden.
Einen Überblick über alle Funktionen finden sie hier: https://wpamelia.com/de/demos/#Features-list

Sollten Sie Interesse an einer kostenlosen Beratung zu dem Produkt haben, dann buchen Sie doch einfach einen kostenlosen Beratungstermin bei mir über die Homepage (Button: “Terminvereinbarung”) – natürlich “powered by Amelia” !

Für den KFZ-Sachverständigen Holger Pfenning wurde eine auf WordPress und Elementor basierende Homepage erstellt. Weiterhin wurde bei der Erstellung einer Google Unternehmensseite und dem Thema SEO unterstützt.

• WordPress / Elementor
• Realisierungszeit: 1 Woche

Wie es der Zufall so manchmal will, konnte ich in der neuen Heimat gleich zwei neue Kunden gewinnen:

Die Webseite für die Rheingauer Psychotherapie-Praxis Dipl.-Psych. Klaudia Jungnikl wurde auf Basis von WordPress und dem Elementor Framework benutzerfreundlich neu aufgebaut und mit kleineren Anpassungen versehen. Die neue technische Umsetzung ermöglicht es der Praxis , im Eigenzugang selbständig kleine Änderungen an der Webseite vorzunehmen

Angesprochen wurde ich vom Elternverein der Pfingstbachschule in Oestrich-Winkel, ob ich nicht die Betreuung der IT übernehmen könnte.

In diesem Zuge habe ich die Homepage neu aufgebaut und zur Verbesserung der Zusammenarbeit der Teammitglieder auf den Arbeitsplätze geteilten Onedrive-Ordnern und Gruppenkalendern eingerichtet. Beratung zum Thema Datenschutz wurde auch angefragt und wird natürlich auch noch stattfinden.

Nachdem Nexusthemes angekündigt hat, sich strategisch von dem selbstentwickelten Nexustheme Pagebuilder zu Gunsten des Elementor Pagebuilders zurückzuziehen und auch das Studio Hosting einzustellen, stehe ich jetzt vor der Aufgabe, alle Kunden-Websites entsprechend zu migrieren – hin zu einem neuen Hostingpartner und weg von dem Nexustheme Pagebuilder hin zu dem von Elementor.

Um dies strategisch vorzubereiten, habe ich erst einmal die eigene Homepage migriert – mit sehr gutem Erfolg. Der Elementor Pagebuilder ist weitaus flexibler als der von Nexusthemes und man findet im Netz zu praktisch jedem Problem eine Hilfestellung.

So bin ich jetzt gut gewappnet, um auch die Kundenwebsites entsprechend zu migrieren!

In der Zeit seit dem letzten Post war ich fleißig und habe gleich zwei neue Webauftritte erstellt.

Weighttuning

Der Ernährungsberater Martin Steiner beauftragte uns mit der Erstellung eines Webauftritts für seine neue Firma. Dank einer sehr guten Zusammenarbeit war die Seite innerhalb 3 Wochen fertiggestellt. Daneben wurde auch Unterstützung bei der Bekanntgabe in Google geleistet (Google My Business, Search Console, Analytics).

• WordPress
• Nexustheme basierendes Template
• Realisierungszeit: 3 Wochen 

Planwerk GmbH

Das Architektur- und Planungsbüro PlanWerk GmbH fragte an, ob ich deren in die Jahre gekommenen Internetauftritt neu gestaltet könnte. Mit Hilfe der Nexusthemes Templates und tatkräftiger Hilfe durch eine Mitarbeiterin von PlanWerk wurde in kürzester Zeit ein ansprechender Internetauftritt erstellt. Schauen Sie sich das Ergebnis unter https://pwerk.gmbh doch selbst mal an!

• WordPress
• Nexustheme basierendes Template
• Realisierungszeit: 3 Wochen (mit Pausen)

Hans Jürgen Fünfstück, seines Zeichens Immobilienmakler aus Langen, hostet schon seit Jahren seine Webseite bei uns. Bisher wurde ein speziell auf den Immobilienbereich zugeschnittenes WordPress Template verwendet. Dieses hat zwar den Vorteil, dass es auf die Bedürfnisse eines Immobilienmaklers zugeschnitten ist, brachte aber auch einige Nachteile mit sich: – Der Kunde muss alle Anpassungen komplett im WordPress Backend vornehmen – Die Webseite ist recht schmal gehalten und “verschenkt” auf größeren Schirmen recht viel Platz,Der Kunde hat sich jetzt für ein Nexustheme Template entschieden. Innerhalb kürzester Zeit wurde die Homepage neu gestaltet und auf das innovative Nexustheme Studio migriert.Die Ergebnisse kann man hier anschauen: https://hjf-immobilien.de/

Ab sofort können wir Ihnen als Microsoft Partner auch die Integration der cloudbasierten Microsoft 365 Geschäftslösungen anbieten. Werden Sie produktiver mit den Cloud-Diensten von Microsoft 365!

Die beste Voraussetzung für wirtschaftlichen Erfolg ist eine reibungslose Zusammenarbeit – innerhalb Ihres Unternehmens genauso wie mit Kunden und Partnern.

Wie wichtig es dabei ist, flexibel zu sein, wissen Sie selbst am besten. Mit Microsoft 365 von Microsoft sichern Sie sich diese Flexibilität und damit einen echten Wettbewerbsvorteil. Denn Sie können jederzeit auf Ihre Geschäftsdokumente zugreifen, und zwar ganz gleich, mit welchem Gerät Sie arbeiten und wo Sie sich gerade befinden: Im Zug oder Auto, im Home-Office oder Büro, beim Kunden oder Patienten vor Ort – Ihr mobiles Office mit allen wichtigen Daten und Unterlagen ist immer mit dabei.

Ohne große Investitionen hilft Ihnen Microsoft 365 im Abonnement, Ihre Arbeiten einfach und professionell zu erledigen. Immer mit der neuesten Microsoft-Office-Version. Darüber hinaus erhalten Sie ein professionelles E-Mail-System und Dokumentenmanagement sowie die Möglichkeit des Austauschs via Chat und Videokonferenzen. Alles aus einer Hand. Und die passende IT ist auch schon inklusive.

Wussten Sie schon, dass Microsoft 365 für Sie auch die Terminabstimmung übernimmt? Bookings* ist ein Website-basiertes System mit automatischen Bestätigungs- und Erinnerungsfunktionen, bei dem Ihre Kunden und Partner selbst Termine eintragen können.

Sie haben eine Frage oder interessieren sich für das Angebot? Lassen Sie uns gleich heute einen Termin vereinbaren – wir freuen uns auf Ihren Anruf.

Die etwas in die Jahre gekommene Firmenwebseite der Firma „Finanzkonzepte Imschweiler“ wurde mit Hilfe der bewährten Nexustheme Vorlagen neu erstellt. Die Realisation dauerte hierbei nur wenige Tage, Inhalte wurden weitestgehend von der alten Homepage übernommen und präsentieren sich jetzt im zeitgemäßen Design, mit neuen Fotos und natürlich auch für Mobilgeräte optimiert.

Nach Geschäftsübernahme des Optikers durch Jutta Jakobi musste auch der bisherige Internetauftritt neu gestaltet werden. Mit Hilfe der Nexusthemes Templates wurde in kürzester Zeit ein ansprechender Internetauftritt erstellt. Schauen Sie sich das Ergebnis unter https://optic-art-jakobi.de/ doch selbst mal an!

Für die Hypnoserpraxis Gosert in der Schweiz wurde ein Webauftritt basierend auf einem Nexustheme Template realisiert und auch der Facebookauftritt gestaltet.

Leider hat sich im Rahmen der Migration auf SSL-Verschlüsselung herausgestellt, dass das bisherige WordPress-Template für den Webauftritt des Weingeschäfts Hanglage nicht mit SSL funktioniert. Daher wurde die Gelegenheit genutzt, auf eines der bewährten Nexusthemes Templates umzustellen – das Ergebnis kann sich sehen lassen. Aber sehen Sie selbst.

Über unseren Kunden Heike Grothe (Fachkosmetik Heike Grothe) haben wir einen neuen Kunden vermittelt bekommen – Christine Hub, ihres Zeichens Reisevermittlerin in Mörschied.

Schnell wurde ein auf Nexusthemes basierendes passendes Template ausgewählt und mit der Intergration gestartet. In zwei je 6 Stunden dauernden Sitzungen wurde dann die Homepage interaktiv gestaltet und designed. Weiterhin wurden die Webauftritte in Google+ und Facebook erstellt.

Das Ergebnis kann sich sehen lassen: Eine moderne Homepage in responsive Design und eine sehr zufriedene Kundin

Als Mitglied des Kino- und Kulturvereins e.V. Raunheim bringt man sich natürlich auch gerne in die Vereinsarbeit ein. Die alte Homepage war doch schon etwas in die Jahre gekommen und nicht wirklich übersichtlich, so habe ich gleich Ja gesagt, als man mit der Bitte auf mich zukam, die Homepage zu überarbeiten.

Zusammen mit dem Vorstand wurde ein Template von Nexusthemes aus gesucht und für die Belange des Vereins angepasst. Inhalte wurden übernommen und die Seite am 13.12.2014 neu gelauncht.

Das mittlerweile etwas in die Jahre gekommene und nicht mehr zeitgemäße Design des Internetauftritts des Weingeschäfts „Hanglage“ wurde im Zuge der Migration von Typo3 nach WordPress komplett überarbeitet. Zum Einsatz kommt hier das Thema „White Rock“ sowie das Kalender Plugin „The Events Calendar PRO“.

Überzeugen Sie sich doch einmal von der Qualität dieses neuen Internetauftritts – hier finden Sie die Webseite