Website-Screenshot

Jede Webseite genau so aufnehmen, wie ein echter Browser sie rendert – ganze Seite, jede Bildschirmgröße, PNG/JPG/WebP/SVG

100 % kostenlos. Dieses Tool braucht unseren Server für die Arbeit. Was du sendest, wird dort verarbeitet und danach verworfen – nie gespeichert.

language

In einem echten Chromium-Browser geladen, daher führt die Seite eigenes JavaScript, Media Queries und Webfonts aus. Seiten hinter einem Login zeigen die abgemeldete Ansicht.

of captures left today.

Jump to the next useful tool without leaving your flow.

See more

Über dieses Tool

Mach aus jeder Live-Webseite ein Bild. Die Aufnahme läuft in einem echten headless-Chromium-Browser auf unserem Server, das Ergebnis entspricht dem, was Besuchende wirklich sehen: Die Seite führt ihr eigenes JavaScript aus, eigene Media Queries entscheiden das Layout, Webfonts laden und tauschen ein, bevor der Auslöser fällt, und Flexbox, Grid, Verläufe und CSS-Effekte werden genau so gemalt wie im Browser. Wähle eine Bildschirmgröße vom Handy bis Desktop HD, erfasse den sichtbaren Bereich oder die ganze scrollende Seite, entferne Cookie-Banner und Werbung und lade PNG, JPG, WebP oder SVG herunter. Um eigenes Markup statt einer Live-Seite zu rendern, nutze HTML zu Bild.

Ablauf

Prüfe eine Seite, bevor du sie veröffentlichst

  1. 1Die Seite auslesenZieh Überschriften, Links, Bilder und Metadaten.Öffnen
  2. 2Meta-Tags prüfenTitel und Beschreibung so, wie Suchmaschinen sie lesen.Öffnen
  3. 3Die Share-Karte vorschauenSieh, wie sie in Social Media aussieht.Öffnen
  4. 4Screenshot machenSpeichere eine Aufnahme der fertigen Seite für dein Archiv.Du bist hier

So verwendest du dieses Tool

  1. Adresse einfügenGib eine öffentliche http://- oder https://-Seite ein. Der Browser kommt als anonyme Erstbesucherin bzw. Erstbesucher, du bekommst also die Seite, die eine neue Leserin oder ein neuer Leser sieht.
  2. Bildschirmgröße und Optionen wählenWähle einen Viewport von Mobile 390px bis Desktop HD 1920px – die Seite legt sich in dieser Breite. Schalte „Ganze Seite“ ein, um zuerst nach unten zu scrollen, Retina 2x für doppelte Dichte, und blockiere Werbung oder Overlay-Popups für einen sauberen Rahmen.
  3. Das Bild herunterladenAufnehmen, dann als PNG für den schärfsten Text speichern, JPG oder WebP für eine kleinere Datei, oder SVG, wenn ein Workflow eines braucht. Kopieren legt den Screenshot direkt in deine Zwischenablage.

Warum es nutzen

  • Eine echte Browser-Engine, kein HTML-Parser – du bekommst, was Besuchende sehen, inklusive Webfonts und CSS Grid.
  • Full-Page-Aufnahme scrollt die Seite zuerst, sodass lazy-loaded Bilder wirklich da sind statt leerer Platzhalter.
  • Echte Viewport-Größen lösen die responsive Breakpoints der Seite aus – eine Mobile-Aufnahme ist das Mobile-Layout, kein geschrumpftes Desktop.
  • Entfernen von Werbung, Trackern und Cookie-Bannern für einen sauberen Rahmen ohne Nachbearbeitung.
  • Retina-2x-Ausgabe für Folien, Doku und Druck, wo ein 1x-Screenshot weich wirkt.
  • HTML und CSS einfügen, um ein E-Mail-Template, eine Rechnung oder Social Card ohne Deployment zu prüfen.

Häufige Anwendungen

  • Eine Open-Graph- oder Social-Preview-Card mit 1200 x 630 von einer Seite oder aus eigenem HTML machen.
  • Einen Beleg, eine Buchungsbestätigung oder AGB-Seite genau so archivieren, wie sie an dem Tag aussah.
  • Dieselbe Seite bei Handy-, Tablet- und Desktop-Breite für ein Responsive-Review aufnehmen.
  • Ein HTML-E-Mail-Template als Bild rendern, damit ein Kunde es abnehmen kann.
  • Echte Produkt-Screenshots in Doku, Decks und App-Store-Listings setzen.
  • Beleg für einen Bug-Report oder ein Design-QA-Ticket, ohne Popups.

Tipps für bessere Ergebnisse

  • Ganze Seite plus Retina 2x bei einem langen Artikel erzeugt ein sehr großes Bild – schalte Retina aus, wenn du keine Druckdichte brauchst.
  • Sieht eine Seite halb geladen aus, nimm sie erneut auf: langsame Seiten sind nach dem ersten Versuch oft schon im Cache fertig.
  • Nutze das Social-Card-Preset, wenn du einen exakten 1200-x-630-Rahmen willst statt hinterher zuzuschneiden.
  • PNG hält Text knackig; JPG und WebP sind bei fotolastigen Seiten deutlich kleiner.
  • Im Modus „Code einfügen“ kannst du <html> und <body> weglassen – ein nacktes Fragment wird für dich gewrappt.
  • Overlay-Popups entfernen schaltet auch das Scrollen frei, was Full-Page-Aufnahmen bei offenem Modal rettet.

Fehler, die du vermeiden solltest

  • Einen Screenshot einer Seite erwarten, die Login braucht – der Browser kommt abgemeldet, genau wie eine Erstbesucherin oder ein Erstbesucher.
  • Annehmen, SVG-Ausgabe sei ein Vektor der Seite. Gerenderte Pixel lassen sich nicht in Formen zurückverwandeln; das SVG trägt das Bild in sich, damit es in SVG-only-Workflows skaliert.
  • Eine Seite hinter Paywall oder Bot-Schutz aufnehmen und den Challenge-Screen als Bug lesen.
  • Sich auf relative Pfade wie <img src="logo.png"> in eingefügtem HTML verlassen – es gibt keine Basis-URL, nutze eine volle https://-Adresse oder eine Data-URI.
  • Werbeblocker für eine Seite einschalten, deren Layout von diesen Slots abhängt, und sich wundern, warum die Abstände anders sind.

Häufig gestellte Fragen

Füge die Adresse ein, lass „Ganze Seite“ an und nimm auf. Der Browser scrollt zuerst nach unten, damit lazy-loaded Bilder und Animationen da sind, und macht dann ein durchgehendes Bild der ganzen scrollenden Seite statt nur des sichtbaren Bereichs.

Ja. Wechsle zu „Code einfügen“ und schreibe dein Markup, CSS in der zweiten Box – es wird als Style-Tag injiziert. Du kannst auch eine .html-Datei hochladen. Beides wird vom selben Browser wie eine Live-URL gerendert, das Ergebnis entspricht einer deployed Seite.

Er wird von headless Chromium in der Viewport-Größe gerendert, die du wählst, die Seite führt eigenes JavaScript aus, wendet eigene Media Queries an und lädt eigene Webfonts. Wir warten, bis Fonts fertig geladen sind – der übliche Grund für Screenshots in der falschen Schriftart.

PNG für verlustfrei, schärfsten Text; JPG und WebP für deutlich kleinere Dateien bei fotolastigen Seiten; und SVG, das das aufgenommene Bild in einem SVG-Wrapper einbettet für Tools, die nur SVG akzeptieren. PNG ist der beste Default für alles mit Text.

Ja. „Mobile 390 x 844“ setzt einen echten 390px-Viewport, die Seite liefert ihr Mobile-Layout über eigene CSS-Breakpoints. Das ist etwas anderes als ein geschrumpfter Desktop-Screenshot, der alles nur kleiner macht.

Schalte „Overlay-Popups entfernen“ ein. Es entfernt Consent-Leisten, Newsletter-Modals und große Sticky-Panels nach dem Laden und schaltet das Scrollen frei, damit Full-Page weiter funktioniert. Normale Navigationsleisten bleiben.

Jede Aufnahme startet einen echten Browser auf unserem Server, das ist deutlich schwerer als ein Tool in deinem eigenen Tab, daher gibt es ein kleines Tageskontingent pro Besucherin bzw. Besucher. Die Seite zeigt, wie viele du noch hast, und eine fehlgeschlagene Aufnahme zählt nicht.

Nein. Der Browser kommt als anonyme Erstbesucherin bzw. Erstbesucher ohne Cookies oder Session, alles hinter Login zeigt die abgemeldete Seite. Für private Seiten nutze den Modus „Code einfügen“ mit dem HTML, das du schon hast, oder das browserbasierte Screenshot-Studio.

Related guides