So machen Sie Ihre WordPress-Site in kürzester Zeit druckerfreundlich

Ist Ihre WordPress-Website druckerfreundlich? Wenn Sie keine Ahnung haben, worauf diese Frage hinaus soll, ist es möglicherweise nicht …

Während einige WordPress-Theme-Entwickler Unterstützung für druckerfreundliche Inhalte einbauen, ist dies meistens nicht der Fall. Und das bedeutet, dass Sie die Dinge selbst in die Hand nehmen müssen, wenn Sie möchten, dass die Leute Ihre Inhalte in einer Weise drucken können, die tatsächlich lesbar ist … worüber ich heute sprechen werde.

In diesem Beitrag erfahren Sie, was eine Website druckerfreundlich macht und wie Sie Ihre eigene WordPress-Website mit CSS oder einem Plugin druckerfreundlich gestalten können.

Was macht eine Website druckerfreundlich?

Ihre Website enthält unzählige Elemente, die es den Benutzern leicht machen, die gesamte Website zu durchsuchen. Navigationsmenüs, interne Hyperlinks, Seitenleisten… all das ist gut für die Besucher Ihrer Website im Internet, da sie so neue Informationen finden und zwischen verschiedenen Seiten wechseln können.

Aber wenn es darum geht, einen bestimmten Inhalt von Ihrer Website zu drucken, sind diese Elemente nur im Weg. Denken Sie einmal darüber nach… Menschen können nicht auf Ihr Navigationsmenü klicken oder mit Ihrer Seitenleiste auf der gedruckten Seite interagieren. Daher ist es nicht besonders hilfreich, wenn sie Ihr oberes Navigationsmenü ausdrucken, wenn sie Ihren Inhalt auf einem Blatt Papier lesen.

Darüber hinaus werden die auf Ihrer Website verwendeten Schriftarten und Schriftgrößen manchmal nicht so gut auf die Abmessungen der gedruckten Seite übertragen.

Und schließlich werden viele Leute Ihre Inhalte in Schwarzweiß drucken (und Farbtinte ist teuer!). Daher ist es immer eine gute Idee, Ihren druckerfreundlichen Inhalt in Graustufen zu gestalten.

Aus diesem Grund umfasst die druckerfreundliche Gestaltung Ihrer Website hauptsächlich:

• Ändern Sie Schriftarten, Größe und Abstände, um die Lesbarkeit auf einer normalen Seitengröße zu verbessern
• Entfernen überflüssiger Elemente wie Anzeigen, Navigation und Seitenleisten, die auf einer gedruckten Seite nicht hilfreich sind
• Farben dämpfen, wenn Sie viele nicht-schwarze und weiße Elemente verwenden

Also, wie kann man das eigentlich tun? Lass es uns herausfinden…

So machen Sie Ihre Website mit CSS druckerfreundlich

Im nächsten Abschnitt zeige ich Ihnen einige WordPress-Plugins, die Ihnen helfen können, Ihre Site druckerfreundlicher zu gestalten, ohne sich in CSS eingraben zu müssen. Wenn Sie jedoch die volle Kontrolle über das Aussehen der Druckerversion Ihrer Site haben möchten, können Sie die Druckversion Ihrer Seite mithilfe von Medienauswahlen gestalten.

Der grundlegende CSS-Baustein für Ihren druckerfreundlichen Inhalt ist dieser:

 @media drucken {
/* Druckerspezifische Stile finden Sie hier */
}

Alle CSS-Stile, die Sie dieser Medienerklärung hinzufügen, wirken sich nur auf die gedruckte Version Ihrer Seite aus.

Wohin gehst du von dort? Nun, es ist schwer, eine genaue Antwort zu geben, da vieles von Ihren spezifischen Vorlieben und Ihrem Thema abhängt.

Im Allgemeinen sind jedoch einige der Dinge, die Sie mit CSS tun möchten:

• Verwenden Sie display:none , um Elemente wie Seitenleisten, Navigationsmenüs, Suchformulare und alles andere zu entfernen, was auf der gedruckten Seite nicht hilfreich ist.
• Legen Sie eine lesbare Schriftgröße fest. Das Punkte-zu-Pixel-Diagramm von Reed Design ist hilfreich, um herauszufinden, wie sich Pixel auf die Schriftgrößen beziehen, mit denen Sie in druckerfreundlicheren Programmen wie Microsoft Word oder Google Docs vertraut sind.
• Verwenden Sie eine Serifenschrift für Ihre Druckerstile, da sie für die meisten Menschen auf der gedruckten Seite leichter zu lesen ist.
• Ändern Sie die Farben, insbesondere wenn Sie eine tintenintensive Hintergrundfarbe verwenden. Die meisten Browser verwenden in vielen Situationen standardmäßig einen weißen Hintergrund – aber es ist gut, sich zu vergewissern, da jedes Problem eine Menge Tinte verschwenden kann.

Wenn Sie nur die vier oben genannten Dinge tun, sollten Sie bereits eine ziemlich druckerfreundliche Website haben. Wenn Sie jedoch noch weiter gehen möchten, können Sie auch fortgeschrittenere Taktiken implementieren. Sie können beispielsweise :after verwenden, um die URL eines beliebigen Links auszudrucken. Dadurch werden unnötige Medien aus Beiträgen entfernt (wie Videos – nicht sehr hilfreich in gedruckter Form) und mehr.

Wenn Sie einige spezifischere Beispiele für druckerfreundliche CSS-Stile in Aktion haben möchten, sollten Sie diesen Beitrag vom Smashing Magazine lesen, da sie eine ganze Beispielseite durchgehen.

Einige WordPress-Plugins, um Ihre Website druckerfreundlich zu machen

Wenn Sie es vorziehen, sich mit CSS nicht die Hände schmutzig zu machen, können Sie sich wie üblich an ein WordPress-Plugin wenden. Sie haben eine Reihe von verschiedenen Optionen, aber hier sind ein paar Empfehlungen.

Bevor ich jedoch anfange, möchte ich darauf hinweisen, dass diese Plugins nur funktionieren, wenn Benutzer auf die dedizierte Schaltfläche " Drucken" klicken, die von jedem Plugin bereitgestellt wird. Sie wirken sich nicht auf den Druckstil Ihrer Site aus, wenn ein Benutzer direkt zur Druckoption in seinem Browser wechselt.

WP-Druck

WP-Print ist ein beliebtes kostenloses Plugin, mit dem Sie eine druckerfreundliche WordPress-Site erstellen können. Zusätzlich zum Hinzufügen einer dedizierten Print This- Schaltfläche bietet Ihnen das Plugin auch eine benutzerfreundliche Oberfläche. Dies ist immer Sie, um viele der Einstellungen anzupassen, die ich im vorherigen CSS-Abschnitt besprochen habe.

Ich war gespannt, wie dieses Plugin mit Divi und dem Divi Builder funktioniert. Also habe ich einen kurzen Testpost erstellt, um zu sehen, wie die Dinge funktionieren. So sieht die Webversion meines Testbeitrags aus:

Und so sieht die druckerfreundliche Version dieses Beitrags aus ( denken Sie daran – Sie können die Funktionsweise von Bildern anpassen – mein Beispiel verwendet nur die Standardeinstellung ):

Besonders schön an dem Plugin ist, dass es automatisch Zitate für In-Content-Links hinzufügt. Es entfernt auch alle Navigationsoptionen.

Seien Sie sich jedoch bewusst – Sie müssen sich damit wohlfühlen, in den Vorlagendateien Ihres Themes zu wühlen, um die Schaltfläche „Drucken“ hinzuzufügen . Es ist so ziemlich nur ein Kopier- und Einfügejob – aber Anfänger können es ein wenig verwirrend finden.

Preis: Kostenlos | Mehr Informationen

Drucken, PDF, E-Mail von PrintFriendly

Bevor ich weitergehe, möchte ich mit der Haupteinschränkung dieses Plugins beginnen – die kostenlose Version ist werbefinanziert. Nicht ideal…aber das Plugin selbst ist ganz nett und die Werbung ist nicht besonders aufdringlich.

Wenn das kein Dealbreaker ist oder Sie bereit sind, auf Pro zu aktualisieren, lesen Sie weiter…

Das WordPress-Plugin von PrintFriendly integriert den PrintFriendly-Dienst in Ihre Site. Dies ist ein cooler Service, der nicht nur die überflüssigen Teile Ihres WordPress-Themes entfernt, sondern Ihren Benutzern auch eine gewisse Kontrolle darüber gibt, wie ihre gedruckte Seite aussieht.

Wie WP-Print bietet Ihnen das Plugin eine Druckschaltfläche. Wenn Sie auf diese Schaltfläche klicken, öffnet sich ein Lightbox-Fenster. Hier können Benutzer eine Vorschau der Druckversion anzeigen sowie die Bild- und Textgröße anpassen:

Es hat nicht die coole Link-Zitat-Funktion von WP-Print, aber ich denke, es ist großartig wegen der Kontrolle, die es Ihren Besuchern bietet. Und eine weitere schöne Sache ist, dass es den Lesern auch leicht gemacht wird, Ihren Beitrag als PDF oder E-Mail zu teilen oder herunterzuladen.

Preis: Kostenlos mit Werbeunterstützung. Pro-Version beginnt bei $4 pro Monat | Mehr Informationen

Dinge zusammenfassen

Es stimmt zwar, dass die Mehrheit Ihrer Besucher Ihre Inhalte online konsumiert, aber das bedeutet nicht, dass Sie die Leute, die Ihre Inhalte auf Papier ausdrucken möchten, vollständig ignorieren sollten. Das Erstellen einer druckerfreundlichen Website ist eine einmalige Sache. Und sobald Sie es eingerichtet haben, können Besucher Ihre Inhalte nach Bedarf drucken und gleichzeitig ein großartiges Erlebnis haben.

Nun zu Ihnen – drucken Sie jemals Inhalte von einer Website? Was gefällt Ihnen und/oder nicht gefällt Ihnen an den druckerfreundlichen Versionen der meisten Websites?

Miniaturansicht des Artikels von AVIcon / shutterstock.com