Éclair 1.8: 12 Art Directions für eine Website wie keine andere
Von Thierry Gustin
Veröffentlicht am
6 Min. Lesezeit
Inhalt
- Was ändert sich mit Éclair 1.8?
- Was ist eine Art Direction?
- Wie wählst du deine Art Direction und passt sie an?
- Wie entwirft die KI deine Art Direction?
- Was ist der Design-Score?
- Bleibt deine Website schnell und lesbar?
- Wie aktualisierst du auf Éclair 1.8?
- Und wie geht es weiter?
- Häufige Fragen zu Éclair 1.8
Éclair 1.8 ist seit dem 1. November 2026 verfügbar. Bisher änderte ein Theme die Farben; eine Art Direction verändert die ganze Bildwelt deiner Website. Du wählst eine von 12, passt sie an oder lässt die KI deine eigene entwerfen. Und ein neuer Design-Score hilft dir, deine Seiten aufgeräumt zu halten.
Was ändert sich mit Éclair 1.8?
| Neuheit | Was sie dir bringt |
|---|---|
| 12 Art Directions | Eine ganze Bildwelt: Farbpalette, Titelschrift, Banner, Vorteile und Symbole |
| Richtung anpassen | 5 Farben, 18 Titelschriften, Schreibweise, Ecken, Abstände, Karten und Banner |
| Meine Richtung mit KI entwerfen | Drei wirklich unterschiedliche Richtungen aus deinem Geschäft, für etwa 0,03 $ |
| Design-Score | Ein dritter Score im Editor, neben SEO und GEO |
| Unter der Haube | Garantierte Kontraste, Schrift von deiner Website, Archiv von 479 KB, 550 Prüfungen |
Was ist eine Art Direction?
Ein Theme ändert die Farben; eine Art Direction verändert die ganze Bildwelt: Farbpalette, Titelschrift, Größe der Überschriften, Ecken, Abstände, Aufbau des Banners, Layout der Vorteile, Farbbänder und Symbole. Jede geht von einer konkreten Idee aus, nicht von einem Adjektiv:
| Richtung | Bildwelt | Titelschrift |
|---|---|---|
| Nocturne | Die Stadt bei Nacht: tiefes Blau, bernsteinfarbenes Licht | Big Shoulders Display, in Großbuchstaben |
| Galerie | Weiße Wände, schwarze Werkschilder, ein Signalrot | Familjen Grotesk |
| Ton | Die Keramikwerkstatt: Sand, Terrakotta, weiche Formen | Young Serif |
| Botanik | Herbarium und Gewächshaus: tiefes Grün, salbeifarbenes Papier | DM Serif Display |
| Plakat | Das Schweizer Plakat: Schwarz auf gebrochenem Weiß, leuchtendes Orange | Archivo Black, in Großbuchstaben |
| Riviera | Am Meer: Marineblau, blasser Himmel, Koralle | Gloock |
| Kanzlei | Das Briefpapier: marineblaue Tinte, Bordeaux, feine Linien | Libre Caslon Display |
| Neon | Der Kreativbildschirm bei Nacht: fast Schwarz, Limettengrün | Unbounded |
| Sanftheit | Die Praxis: Puderrosa, Pflaume, viel Luft | Cormorant Garamond |
| Baustelle | Beton, Sicherheitsgelb, schmale Beschilderung | Barlow Condensed, in Großbuchstaben |
| Pausenhof | Der Schulhof: Himmelblau, Tomatenrot, runde Buchstaben | Fredoka |
| Presse | Die Morgenzeitung: Zeitungspapier, Titelseitenrot | Newsreader |
Wie wählst du deine Art Direction und passt sie an?
- Wähle unter Einstellungen › Design die Option Art Direction statt Klassisches Theme.
- Klicke auf eine der 12 Karten und sieh dir die Live-Vorschau an: deine echte Website, am Desktop oder auf dem Smartphone.
- Öffne Richtung anpassen, um sie zu personalisieren, und speichere dann: Vorher wird nichts veröffentlicht.
Unter „Richtung anpassen“ stellst du alles ein, frei kombinierbar:
- 5 Farben: Hintergrund, Bänder und Karten, Text, Sekundärtext, Akzent der Buttons und Links.
- Schriftart für Überschriften: 18 Schriften, ausgewählt wegen ihres Charakters, oder eine Systemschrift. Der Fließtext bleibt in einer Systemschrift, ohne Download.
- Schreibweise, Größe der Überschriften, Ecken (eckig, abgerundet, rund) und Abstände (kompakt, normal, luftig).
- Karten mit feiner Linie, als Farbfläche oder mit Schlagschatten, und Startbanner nebeneinander, als Plakat, randloses Vollbild, Editorial oder zentriert.
- Vorteile als Karten, Zeilen oder Spalten, Abschnitte einfarbig oder in Farbbändern und Symbole, gezeichnet statt als Emojis.
Zum klassischen Theme kehrst du zurück, wann du willst: Seine Einstellungen warten unverändert auf dich.
Wie entwirft die KI deine Art Direction?
Wenn der KI-Assistent aktiviert ist, erscheint unter den Karten Meine Richtung mit KI entwerfen. Beschreibe in ein oder zwei Sätzen dein Geschäft, deine Zielgruppe und die gewünschte Stimmung, zum Beispiel „Bio-Bäckerei im Viertel in Freiburg, Familien als Kundschaft, warm, aber modern“, und klicke dann auf 3 Richtungen vorschlagen.
Die KI liest auch die Beschreibung deiner Website und dein Redaktionsprofil. Sie geht von der konkreten Welt deines Geschäfts aus (Orte, Materialien, Gegenstände, Licht), gibt jedem Vorschlag eine präzise Referenz und schlägt drei wirklich unterschiedliche Richtungen vor, fernab der Standardwahl deiner Branche und der Marotten von KI-generiertem Design. Diese Methode ist angepasst nach Impeccable von Paul Bakaus.
Die drei Vorschläge erscheinen vor den Karten, mit ✦ markiert: Du probierst sie in der Vorschau aus, passt sie an und speicherst den, der dir gefällt. Die KI wählt nur aus den Einstellungen von Éclair und schreibt nie CSS: Jeder Vorschlag wird geprüft, und seine Kontraste werden korrigiert. Die geschätzten Kosten liegen bei etwa 0,03 $ für die drei Vorschläge mit Claude Sonnet 5.5 und werden vom Budget des Assistenten abgezogen.
Was ist der Design-Score?
Im Editor zeigt der Tab Analyse jetzt einen dritten Ring, Design, neben SEO und GEO. Er prüft, ob deine Seite optisch überzeugt:
- Zwischenüberschriften mit klarer Hierarchie, kurz und ohne dekoratives Emoji;
- ein Banner mit kurzem Titel und einem Aktionsbutton;
- maßvolle Handlungsaufforderungen, höchstens drei Buttons;
- ein Block „Vorteile“ mit 3 bis 6 beschriebenen Elementen;
- ein Text ohne Sätze in Großbuchstaben, ohne hohle Superlative, ohne wiederholte Passagen und ohne Block von mehr als 350 Wörtern am Stück.
Der Wert am Tab Analyse ist der Durchschnitt der drei Ringe: Eine gute Seite wird gefunden, zitiert und gern gelesen.
Bleibt deine Website schnell und lesbar?
Ja, und das ist durch die Bauweise garantiert:
- Garantierte WCAG-Kontraste: Ganz gleich, welche Farben du oder die KI wählen, Éclair passt den Text auf 7:1 zum Hintergrund an und Sekundärtext, Links und Buttons auf 4,5:1. Geprüft an 20.000 zufällig gezogenen Paletten.
- Kein Drittanbieter: Die Titelschrift (12 bis 27 KB) lädt dein Server nur einmal herunter, danach liefert deine Website sie selbst aus und lädt sie vorab. Deine Besucher kontaktieren weder Google Fonts noch sonst jemanden.
- Immer 100/100: Lighthouse vergibt 100 in allen vier Kategorien, auch mit den Richtungen Nocturne, Riviera, Presse und Plakat.
- Nichts geht kaputt: Das HTML ändert sich nicht, also auch nicht SEO, strukturierte Daten und Barrierefreiheit. Die 6 klassischen Themes bleiben bis aufs Byte identisch.
Wie aktualisierst du auf Éclair 1.8?
Das Verfahren bleibt gleich und rührt deine Inhalte nicht an:
- Klicke unter Sicherheit › Backup auf Backup herunterladen.
- Lösche per FTP die Ordner
app/undassets/und lade dann die der neuen Version zusammen mitindex.phpund.htaccesshoch. - Lass
data/(Inhalte, Einstellungen, Konten, eigenes CSS) undmedia/(Bilder) unverändert. - Klicke in der Verwaltung auf Einstellungen › Erweitert › Cache leeren.
Nur ein Punkt ist zu prüfen: Éclair 1.8 braucht die PHP-Erweiterung zlib, die fast überall standardmäßig vorhanden ist. Und wenn dein Hoster ausgehende Verbindungen blockiert, kann die Schrift einer Art Direction nicht heruntergeladen werden: Éclair weist dich darauf hin und nutzt eine Ersatzschrift aus derselben Familie. Der Leitfaden Aktualisieren, sichern, umziehen erklärt jeden Schritt, und das Archiv von 479 KB wartet auf der Seite Herunterladen.
Und wie geht es weiter?
Wie bei den vorherigen Versionen bestimmen deine Rückmeldungen den weiteren Weg. Eine Idee, ein Fehler, eine Frage? Schreib mir über die Kontaktseite oder eröffne ein Ticket auf GitHub.
Häufige Fragen zu Éclair 1.8
Machen die Art Directions meine Website langsamer?
Nein. Nur die Regeln, die deine Richtung braucht, werden in die Seite eingefügt, und die Titelschrift wird von deiner Website ausgeliefert und vorab geladen. Lighthouse bleibt in allen vier Kategorien bei 100.
Verschwindet mein aktuelles Theme?
Nein. Die 6 klassischen Themes sind weiterhin da, bis aufs Byte identisch. Du wechselst zwischen einer Art Direction und dem klassischen Theme, wann du willst, und beide behalten ihre Einstellungen.
Brauche ich den KI-Assistenten für die Art Directions?
Nein. Die 12 Richtungen und „Richtung anpassen“ funktionieren ohne KI. Nur „Meine Richtung mit KI entwerfen“ braucht den Assistenten, mit deinem Claude- oder ChatGPT-Schlüssel.
Verbinden sich meine Besucher mit Google Fonts?
Nein. Dein Server lädt die Schrift einmal von Fontsource herunter (SIL Open Font License) und liefert sie dann selbst aus: keine Anfrage an einen Drittanbieter.
Kann ich direkt von 1.6 auf 1.8 aktualisieren?
Ja: Das Verfahren ist bei jeder Version gleich, und 1.8 enthält die Neuheiten der vorherigen Versionen. Mach vorher einfach ein Backup.
Leitfaden zu Themes und Art Directions lesen
Auch lesenswert
Éclair 1.7: der visuelle Modus und von KI erstellte Seiten
Éclair 1.7 bringt den visuellen Modus, um deine Seite so zu bearbeiten, wie sie aussieht, und lässt die KI ganze Seiten erstellen. Neuheiten, Kosten, Update.
Éclair 1.5: Themes, schlanker Shop und MCP-Connector
Éclair 1.5 bringt 6 Themes mit Live-Vorschau, einen schlanken Shop mit Stripe-Bezahlung und einen MCP-Connector für Claude und ChatGPT. Neuheiten und Update.
Von WordPress zu Éclair migrieren: die Methode Schritt für Schritt
Von WordPress zu Éclair migrieren, ohne dein Ranking zu verlieren: URL-Inventar, Seiten neu anlegen, 301-Weiterleitungen und Umstellung, Schritt für Schritt.