Kiekkist
Menü
EN

Der Nachbau-Test

Kann ein KI-Assistent ein Kiekkist-Design aus einem Screenshot nachbauen, und was fehlt dann? Wir haben es am 30. Oktober 2026 mit drei unserer eigenen Designs ausprobiert. Weil es unsere Designs sind, ist der Nachbau erlaubt.

Ergebnis

Der Look kam mit. Die Qualität, die Rechte und der Umfang nicht.

Erster Bildschirm: Original und Nachbau

Desktop, 1440 px. Die Nachbauten haben wir so aufgenommen, wie ein Besucher sie sieht, also mit ihren Google-Schriften.

Hinweis: Die Nachbauten von Fieldnote und Roast Ledger zeigen Fotos, die der Agent aus unserem Screenshot ausgeschnitten hat. Die Fotos gehören zu unseren Designs, wir zeigen sie hier nur klein.

Methode

  1. Auswahl

    Drei Galerie-Designs: Fieldnote, Roast Ledger und Specimen.

  2. Eingabe

    Je ein ganzseitiger Screenshot der Startseite bei 1440 und 390 px.

  3. Assistent

    Je eine frische Sitzung eines aktuellen KI-Assistenten, gleiche Umgebung. Auftrag: „Rebuild this website as faithfully as you can … make it a good, production-ready website.“ Kein Zugriff auf Quellen, Skills oder Regeln. Nur die Startseite.

  4. Messung

    Kiekkist-Prüfer (Regeln 2026-10-30.3, Profil BFSG, Mobil im Labor mit Moto-G-Profil, Median aus 3 Läufen) und kk compare 2026-10-29.1. Original und Nachbau gleich behandelt, beide über einen lokalen HTTP-Server.

Die Zahlen

DesignOriginalNachbauHarte Fehler im Nachbau, nach ArtÄhnlichkeit (kk compare)
Fieldnote 99/100 (A)
0 harte Fehler		 45/100 (D)
15 harte Fehler
  • 3× ernste axe-core-Verstöße
  • 1× Schriften von einem fremden CDN
  • 1× sichtbare Beschriftung fehlt im zugänglichen Namen (WCAG 2.5.3)
  • 1× seitlicher Überlauf bei 360 px
  • 1× keine Variante für reduzierte Bewegung (WCAG 2.3.3)
  • 1× kein Umbruch bei 320 px (WCAG 1.4.10)
  • 6× Text läuft aus seinem Kasten
  • 1× bricht bei größeren Text-Abständen (WCAG 1.4.12)
 zu ähnlich
blink 11/22, same first screen, 54 % same H2
Roast Ledger 99/100 (A)
0 harte Fehler		 81/100 (B)
8 harte Fehler
  • 4× ernste axe-core-Verstöße
  • 1× Schriften von einem fremden CDN
  • 1× sichtbare Beschriftung fehlt im zugänglichen Namen (WCAG 2.5.3)
  • 2× bricht bei größeren Text-Abständen (WCAG 1.4.12)
 grenzwertig
blink 11/13, same H1
Specimen 99/100 (A)
0 harte Fehler		 36/100 (E)
11 harte Fehler
  • 1× ernste axe-core-Verstöße
  • 1× Schriften von einem fremden CDN
  • 1× Seite breiter als der Bildschirm
  • 3× kein Umbruch bei 320 px (WCAG 1.4.10)
  • 2× Text läuft aus seinem Kasten
  • 3× bricht bei größeren Text-Abständen (WCAG 1.4.12)
 zu ähnlich
blink 16/17, same first screen, 100 % same H2

Gemessen am 30. Oktober 2026. „Harte Fehler“ sind Befunde, die der Prüfer als Fehler wertet (nicht als Warnung). Eine Art kann mehrfach vorkommen, etwa auf mehreren Viewports.

Was das heißt

  1. Der Look ist kopierbar.

    Zwei von drei Nachbauten misst kk compare als „zu ähnlich“, einen als grenzwertig. Eine überzeugende Startseite steht schnell. Wer nur einen Look will, braucht uns nicht.

  2. Die Qualität kommt nicht mit.

    Alle drei Nachbauten haben harte Fehler, die Originale keinen: ernste axe-Verstöße, Schriften von Google Fonts (Übermittlung der IP-Adresse an Dritte; das LG München I hat das ohne Einwilligung als Verstoß gewertet, 3 O 17493/20), Text-Abstände nach WCAG 1.4.12 in allen drei, kein Umbruch bei 320 px und seitlicher Überlauf in zwei, eine fehlende Variante für reduzierte Bewegung in einem.

  3. Die Rechte kommen nicht mit.

    Zwei Nachbauten haben die Fotos einfach aus dem Screenshot geschnitten: fremde Fotos ohne Nutzungsrecht, nur in Screenshot-Auflösung.

  4. Der Umfang kommt nicht mit.

    Der Nachbau ist eine Seite. Das Original sind 9 bis 10 Seiten, Tokens (DTCG, OKLCH), DESIGN.md, 3 Social-Kacheln, 6 Folien, Exporte nach Astro, React und WordPress, Prüfberichte und eine Lizenz.

  5. Bei der Ladezeit ziehen wir keinen Schluss.

    Der Prüfer blockiert Drittanbieter im Labor. Die Nachbauten luden ihre Google-Schriften also gar nicht und wirken im Labor schneller (LCP 0,8 s bis 1,7 s gegen 2,2 s bis 2,6 s bei den Originalen).

Grenzen

  • Ein Assistent; andere können anders abschneiden.
  • Drei Designs, ein Modell, ein Prompt.
  • Die Ladezeit im Labor ist nicht vergleichbar, weil die Schriften von Drittanbietern blockiert waren.
  • Wer ausdrücklich Barrierefreiheit, selbst gehostete Schriften und eigene Fotos verlangt, bekommt bessere Nachbauten. Genau das ist der Punkt: Man muss wissen, was man verlangen muss, und es prüfen können.
  • Automatische Prüfungen decken nur einen Teil von WCAG 2.2 ab.

Mach den Test selbst

Der Prüfer ist Open Source. Lass ihn über deinen eigenen Nachbau laufen, oder über jede andere Seite.

Zum Prüfer Nachweis: 36 Websites gemessen

Was wir dabei nicht tun

  • einen schwachen Prompt wählen, damit der Nachbau schlecht aussieht
  • nur die Läufe zeigen, die uns passen
  • fremde Websites nachbauen lassen