Zum Inhalt wechseln
Dr. Web Logo seit 1997.
  • Beste Agenturen
  • Magazin
  • Beste Agenturen
  • Magazin
Dr. Web Logo seit 1997.
  • Kontakt
  • Anmeldung
  • Newsletter
  • Beste Agenturen
  • Magazin
Menü
  • Beste Agenturen
  • Magazin
Suche
Agenturpartner werden →

Dr. Web » Tools » Praktisch: Ganzseitige Screenshots deiner Website mit Firefox, Chrome & Safari

Praktisch: Ganzseitige Screenshots deiner Website mit Firefox, Chrome & Safari

Artikel weiterempfehlen

  • Aktualisiert am 31. Januar 2022
  • Jetzt kommentieren
  • Markus Seyfferth von Markus Seyfferth
Lesedauer: 3 Minuten

Inhaltsverzeichnis

Total easy: Screenshots mit Firefox

Firefox macht es meines Erachtens mit Abstand am einfachsten, solch einen ganzseitigen Screenshot zu erstellen. Der Vorgang ist überaus benutzerfreundlich, und du brauchst keine Extensions, um ganz bequem die Website abzufotografieren:

1. Hierzu benutzt Du den Tastatur Shortcut Strg + ⇧ + S (in Windows) bzw. ⌘ + ⇧ + S (iMac) du auf die drei Pünktchen in der URL-Leiste und gehst auf “Take a Screenshot”:

ganzseitigen screenshot erstellen in Praktisch: Ganzseitige Screenshots deiner Website mit Firefox, Chrome & Safari

2. Im nächsten Schritt kannst du dann wahlweise die einzelnen Elemente einer Seite virtuell ablichten lassen, indem du mit dem Mauszeiger drüber fährst und den jeweiligen Bereich anklickst.

In diesem Fall willst du aber die ganze Seite abfotografieren, und hierfür gehst du dann auf “Save full page” und lichtest so die Seite ab.

ganzseitigen screenshot erstellen in firefox schritt 2 Praktisch: Ganzseitige Screenshots deiner Website mit Firefox, Chrome & Safari

3. Im allerletzten Schritt tut sich dann ein Fenster auf, in dem du eigentlich nur noch den blauen “Download” Knopf betätigst. Die Datei wird dann im Regelfall in den Downloads-Ordner verfrachtet und dort abgespeichert. Es sei denn, du hast einen anderen Standard-Ordner definiert.

ganzseitigen screenshot erstellen in firefox schritt 3 Praktisch: Ganzseitige Screenshots deiner Website mit Firefox, Chrome & Safari

Und das war es auch schon. Operation gelungen, Patient lebt. Nun schauen wir uns als nächstes den Vorgang in Chrome an.

Weniger easy: Screenshots mit Chrome

In Chrome geht das Ganze leider nicht ganz so einfach wie in Firefox. Für Entwickler wird das sicher kein Problem sein, da diese sich meist schon mit Chromes DevTools auskennen. Für nicht ganz so versierte Nutzer hingegen ist es wohl eher etwas unzugänglich, und man muss sich erst an den Vorgang gewöhnen. Und der geht so:

1. Du rufst das DevTools Menü in Windows per STRG + SHIFT + I auf, (im Mac per CMD + ALT + I). Es erscheint folgende Übersicht:

ganzseitigen screenshot erstellen in chrome schritt 1 Praktisch: Ganzseitige Screenshots deiner Website mit Firefox, Chrome & Safari

2. In einem zweiten Schritt gibst d nun in Windows STRG + Shift + P ein, was ein Eingabefeld aufruft, das so aussieht:

ganzseitigen screenshot erstellen in chrome schritt 2 Praktisch: Ganzseitige Screenshots deiner Website mit Firefox, Chrome & Safari

3. Zu guter Letzt schreibst du nun das Wort “Screenshot” in das Eingabefeld, wodurch einige Optionen angezeigt werden. Was du brauchst, ist “Capture full-size screenshot”.

ganzseitigen screenshot erstellen in chrome schritt 3 Praktisch: Ganzseitige Screenshots deiner Website mit Firefox, Chrome & Safari

Das klickst du nun also an, und nach wenigen Sekunden wird ein Abbild der gesamten Website in den Downloads-Ordner heruntergeladen. Fertig. Wenn dir das zu kompliziert ist, gibt es für dich die Screenshot-Funktionalität auch als Chrome Extension.

Der Vollständigkeit halber werfe ich noch einen Blick auf den Safari-Browser.

Auch ganz okay: Screenshots mit Safari

Im Safari kannst du ebenso einen Screenshot über den “Web Inspector” tätigen, welchen du per CMD + ALT + I im Mac aufrufst. Hier braucht es nur noch einen weiteren Mausklick auf “Capture Screenshot”, und im Nu liegt die Datei im Downloads-Ordner. Wenn du solche Entwickler-Werkzeuge nicht magst, kannst du auch eine Extension à la Awesome Screenshot verwenden.

ganzseitigen screenshot erstellen in safari schritt 1 Praktisch: Ganzseitige Screenshots deiner Website mit Firefox, Chrome & Safari

Was sind deine Lieblings-Extensions oder Tricks, um solche Screenshots zu erstellen? Schreib es doch unten in die Kommentare! Die besten Tipps nehmen wir dann in den Artikel auf.

Frohes Fotografieren!

Markus Seyfferth

Markus Seyfferth

ist seit 2019 Geschäftsführer & WordPress-Entwickler bei Dr. Web. Zuvor war er sechs Jahre lang Vorstand des Smashing Magazine, im Rahmen dessen er u.a. das Online-Marketing, die Betreuung der Werbekunden sowie diverse Online-Projekte geleitet hat.

Lust auf mehr?

  • Markus Seyfferth Markus Seyfferth
  • 23. September 2022
Oh Schreck, die Daten sind weg

Tenorshare 4DDiG: So stellen Sie ihre verlorenen Daten wieder her

In diesem Artikel werden wir sehen, wie man ein sehr häufiges Problem löst: den plötzlichen Verlust wichtiger Daten.
  • Tools
  • Markus Seyfferth Markus Seyfferth
  • 6. September 2022

Digitale Signatur: Verträge unterzeichnen, ganz ohne Papierkram

Formulare, Verträge, NDAs, Erklärungen, Registrierungen — all diese Dokumente erfordern Unterschriften. In der globalen Wirtschaft ist aber die räumliche Nähe, die früher ganz selbstverständlich das Umfeld einer Unterzeichnung war, meist nicht herzustellen. So schafft die digitale Signatur Abhilfe.

  • Tools
  • Jörg Mrusek Jörg Mrusek
  • 21. April 2022
Online-Sicherheit & Privatsphäre (Sponsored Post)

Surfshark One: So schützt du dich vor Viren, Schadsoftware, Datenlecks und Hacker-Angriffen

Anzeige Surfshark führt mit „Surfshark One“ ein neues Rundum-Sicherheits-Angebot zum Thema Online-Sicherheit ein. Zeit sich das genauer anzusehen:
  • IT Sicherheit, Tools, VPN
  • Markus Seyfferth Markus Seyfferth
  • 25. März 2022
Eine eierlegende Wollmilchsau?

SEO Tools im Test: Das kann die OSG Performance Suite

Jedes SEO-Tool hat seine Berechtigung, Stärken und Schwächen. Manche Tools decken nur einen kleinen Bereich ab, andere verfolgen den All-in-One-Anspruch. Die OSG Performance Suite ist sehr umfangreich, wie unser Test ergab. Doch schau selbst:
  • SEO, Tools
  • Jörg Mrusek Jörg Mrusek
  • 26. November 2021

BeTheme – 1 Theme, 1000e Möglichkeiten

Das BeTheme gehört mit über 240.000 Kunden zu einem der beliebten Bezahl-Themes. Vor allem die über 650 fertigen Vorlagen machen das Theme universell und für viele verschiedene Branchen einsetzbar.
  • Tools, Webdesign
  • Markus Seyfferth Markus Seyfferth
  • 20. November 2021

Online-Konfiguratoren: Türen nach dem Baukastenprinzip kaufen

Wer es bislang geschafft hat, ganz auf Online-Shopping zu verzichten ist sicherlich in der Minderheit. Dinge bequem vom heimischen Sessel aus zu bestellen ist heutzutage gang und gäbe.
  • Tools

Schreibe einen Kommentar Antworten abbrechen

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

Dr. Web Logo weiss.
Fachmagazin für Online-Marketing. Seit 1997. Wissen, Software, Dienstleister: Wir bringen die Digitalisierung Ihres Unternehmens praxisnah voran. ✅

Agentur nach Schwerpunkt finden

  • Als Agentur eintragen
  • Beste Agenturen finden
  • Die besten Digitalagenturen
  • Die besten SEO Agenturen
  • Die besten Webdesign Agenturen
  • Die besten Werbeagenturen
  • WordPress Agentur finden
  • Als Agentur eintragen
  • Beste Agenturen finden
  • Die besten Digitalagenturen
  • Die besten SEO Agenturen
  • Die besten Webdesign Agenturen
  • Die besten Werbeagenturen
  • WordPress Agentur finden

Für Unternehmer: Finden Sie Ihre Agentur in…

  • Aachen
  • Augsburg
  • Basel
  • Bamberg
  • Bayreuth
  • Bergisch-Gladbach
  • Berlin
  • Bern
  • Bielefeld
  • Bochum
  • Bonn
  • Bremen
  • Chemnitz
  • Darmstadt
  • Dortmund
  • Dresden
  • Duisburg
  • Düsseldorf
  • Essen
  • Esslingen
  • Flensburg
  • Frankfurt
  • Freiburg
  • Gelsenkirchen
  • Gießen
  • Goslar
  • Hamburg
  • Hamm
  • Hannover
  • Heidelberg
  • Ingolstadt
  • Innsbruck
  • Karlsruhe
  • Kassel
  • Köln
  • Leipzig
  • Leverkusen
  • Ludwigsburg
  • Mainz
  • Mannheim
  • München
  • Münster
  • Nürnberg
  • Offenburg
  • Oldenburg
  • Osnabrück
  • Passau
  • Pforzheim
  • Potsdam
  • Regensburg
  • Reutlingen
  • Rosenheim
  • Rostock
  • Salzburg
  • Starnberg
  • Stuttgart
  • Tübingen
  • Wien
  • Wiesbaden
  • Wuppertal
  • Würzburg
  • Zürich
  • Aachen
  • Augsburg
  • Basel
  • Bamberg
  • Bayreuth
  • Bergisch-Gladbach
  • Berlin
  • Bern
  • Bielefeld
  • Bochum
  • Bonn
  • Bremen
  • Chemnitz
  • Darmstadt
  • Dortmund
  • Dresden
  • Duisburg
  • Düsseldorf
  • Essen
  • Esslingen
  • Flensburg
  • Frankfurt
  • Freiburg
  • Gelsenkirchen
  • Gießen
  • Goslar
  • Hamburg
  • Hamm
  • Hannover
  • Heidelberg
  • Ingolstadt
  • Innsbruck
  • Karlsruhe
  • Kassel
  • Köln
  • Leipzig
  • Leverkusen
  • Ludwigsburg
  • Mainz
  • Mannheim
  • München
  • Münster
  • Nürnberg
  • Offenburg
  • Oldenburg
  • Osnabrück
  • Passau
  • Pforzheim
  • Potsdam
  • Regensburg
  • Reutlingen
  • Rosenheim
  • Rostock
  • Salzburg
  • Starnberg
  • Stuttgart
  • Tübingen
  • Wien
  • Wiesbaden
  • Wuppertal
  • Würzburg
  • Zürich

Aus unserem Magazin

  • Buchhaltung
  • Content Marketing
  • Design
  • Digitalisierung
  • E-Business
  • E-Commerce
  • E-Mail-Marketing
  • Finanzen
  • Freelancer
  • Hosting
  • HTML
  • HTML/CSS
  • Inspiration
  • IT Sicherheit
  • JavaScript & jQuery
  • Jobs & Karriere
  • Online-Marketing
  • Programmierung
  • Public Relations
  • Rechtliches
  • Responsive Design
  • SEA – Suchmaschinenwerbung
  • SEO
  • Showcases
  • Social-Media-Marketing
  • Tipps, Tricks & Tutorials
  • Tools
  • UX Design
  • VPN
  • Webdesign
  • WordPress
  • Buchhaltung
  • Content Marketing
  • Design
  • Digitalisierung
  • E-Business
  • E-Commerce
  • E-Mail-Marketing
  • Finanzen
  • Freelancer
  • Hosting
  • HTML
  • HTML/CSS
  • Inspiration
  • IT Sicherheit
  • JavaScript & jQuery
  • Jobs & Karriere
  • Online-Marketing
  • Programmierung
  • Public Relations
  • Rechtliches
  • Responsive Design
  • SEA – Suchmaschinenwerbung
  • SEO
  • Showcases
  • Social-Media-Marketing
  • Tipps, Tricks & Tutorials
  • Tools
  • UX Design
  • VPN
  • Webdesign
  • WordPress

Rechtliches

  • Datenschutzerklärung
  • Geschäftsbedingungen (AGB)
  • Impressum
  • Kontakt
  • Privatsphäre-Einstellungen ändern
  • Historie der Privatsphäre-Einstellungen
  • Einwilligungen widerrufen
  • Nach oben ↑
  • Datenschutzerklärung
  • Geschäftsbedingungen (AGB)
  • Impressum
  • Kontakt
  • Privatsphäre-Einstellungen ändern
  • Historie der Privatsphäre-Einstellungen
  • Einwilligungen widerrufen
  • Nach oben ↑