Ausdruck von Webseiten

"Datei drucken" & mehr

Jeder Browser kann normale Webseiten am PC-Drucker ausgeben.
Diese Funktion wird eher selten benutzt, man will mit dem PC eher die Papierflut eindämmen. 		Immer mehr Programme verwenden Webseiten als User-Interface. Wenn hier der Ausdruck von Informationen vorgesehen ist, dann sind einige Design-Aspekte zu berücksichtigen.
In der Regel werden eigene Ausdruck-Seiten erstellt und für das Medium Papier optimiert.
HTML Hypertext Markup Language
Größe Größe und Seitenverhältnis für Ausdruck und Monitor
Fläche Verfügbare Fläche, Rand
Farben Nicht alles muss bunt gedruckt werden
Hintergrund Der Monitor ist geduldig, aber Papier ist immer weiss
Schrift Standard-Schriften kommen immer korrekt an
Bilder Überraschungen beim Ausdruck ?
Regie Regie und Konsumverhalten für Ausdruck und Monitor
Zeit und Kosten Druckfarben sind teuer
Kontrolle  
PHP & Perl  
PDF Standard gewährleistet unveränderte Original-Dokumente auf jedem PC
PostScript What you see is what you get
JavaScript Programmierter Ausdruck von Webseiten
CSS Cascading Style Sheets (CSS) - Technik bietet spezielle Print-Funktionen

Größe und Seitenverhältnis
PC-Monitore gibt es in vielen Größen, Bildschirm-Fenster werden von den AnwenderInnen auf unterschiedliche (kleinere !) Maße eingestellt. Standard-Monitore sind im Querformat mit Seitenverhältnis 1,33 zu 1 (4 zu 3) angelegt, NoteBooks und große Grafik-Monitore auch in anderen Größen und Verhältnissen.
Bei der Standard-Auflösung von 72 dpi (72 Pixel/Zoll) beträgt die Bildschirm-Größe zwischen 282x212 mm und 677x423 mm
Das Monitor-Layout muss so optimiert werden, dass bei jeder Größe und bei jedem Seitenverhältnis ein übersichtliches und ansprechendes Erscheinungsbild zustande kommt. Eine A4-Papierseite ist stets 210x297 mm groß, das Seitenverhältnis beträgt daher 1 zu 1,41 (Wurzel(2)).
Ein Layout für fixe Größe ist meist rascher und einfacher zu erstellen, wird sich jedoch im Normalfall erheblich vom Monitor-Layout unterscheiden !

Verfügbare Fläche
Am PC-Monitor wird die gesamte verfügbare Fläche durch viele Elemente verkleinert: Fenster-Rahmen und Titel-Leisten, Rollbalken (scrollbars), Menüleisten, Symbolleisten, usw. Zu diesen technischen Einschränkungen kommen solche durch die eigene Software: Rahmen (frames), Navigations-Bereiche, Bedienungs-Elemente, ... Auf einer Papierseite fallen die Monitor-Beschränkungen weg, dafür müssen sie Platz für andere Elemente opfern:
PC-Drucker können nicht abfallend (bis zum Rand) drucken. Die Randbreite ist für jedes Drucker-Modell unterschiedlich und kann oft auch noch indivuell eingestellt werden.

Planen sie daher großzügige (!) Ränder ein und testen sie den Ausdruck ihrer Webseiten, nach Möglichkeit auf verschiedenen Druckern. Die Druckfläche wird weiter eingeschränkt durch Kopf- und Fußzeilen, die jeder Browser vorsieht !

Farben
Für PC-Monitore können sie heute die Beherrschung von (mindestens 256) Farben voraussetzen, sie können und sollen daher Farbe als sinnvolles Gestaltungs-Mittel einsetzen. Private PC-Drucker sind ebenfalls meist farbfähig, hier ist Farbe jedoch ein Zeit- und Kostenfaktor:
Schwarzweiss (s/w) lässt sich meist rascher und vor allem wesentlich (!) billiger drucken.
Im kommerziellen Bereich dominieren noch für einige Zeit s/w-Drucker. Auch dieser Bereich wird zunehmend von Farbdruckern erobert, das Kosten-Argument gilt jedoch auch hier !
Ihre Ausdruck-Seiten müssen daher unbedingt auf s/w-Druckern ein anprechendes Ergebnis liefern. Verwenden sie Farbe auf Ausdruck-Webseiten - wenn überhaupt - sparsam (!).
Wenn sie Farben einsetzen, dann am besten dunkle, satte Farbtöne - diese werden von s/w-Druckern schwarz oder wenigstens dunkelgrau gedruckt. Helle Farben werden in hellgrau (kaum lesbar), im schlimmsten Fall in weiss umgewandelt. 		Als Luxus-Variante können sie ihren AnwenderInnen die Auswahl zwischen eigens optimierten s/w und Farb-Ausdrucken bieten. Bei Verwendung von CSS erfordert das kaum zusätzlichen Aufwand.

Hintergrund
Übliche Browser drucken weder Hintergrund-Farben noch -Bilder. Dafür werden zwar eigene Menü-Optionen angeboten, sie sollten sich jedoch nicht darauf verlassen, dass ihre AnwenderInnen diese auch finden. Verzichten sie daher besser auf Hintergrundfarben und -Bilder auf Ausdruck-Webseiten.

Schrift
Verwenden sie zur Angabe der Schrift-Familie in Webseiten nur mehr CSS:
<span style="font-family: Verdana, Arial, Helvetica, sans-serif ">Schrift-Familie in CSS-Syntax</span>
Verzichten sie auf die veralteten <font>-tags:
<font face="Arial, Helvetica, sans-serif">Schrift-Familie in veralteter <font>-Syntax</font>
Bei Angabe mehrerer Schrift-Familien sucht der Browser der Reihe nach die angegebenen Schriften und verwendet die erste zutreffende Schrift-Familie.
Generische Schriften:
Auf jedem PC können andere Schriften installiert sein. Einige wenige (!) können sie mit großer Wahrscheinlichkeit auf allen Betriebssystemen erwarten (z.B. Arial, Courier, Times, ...), andere mit geringerer Wahrscheinlichkeit.
Falls sie (nur) eine Schrift angeben, die auf dem PC nicht installiert ist, dann ist das Resultat nicht vorhersehbar: Ihr Browser gibt das Dokument natürlich aus, sie haben jedoch die Gestaltung völlig aus der Hand gegeben. 		Der Ausweg aus diesem Dilemma sind Generische Schriften: In jedem Betriebssystem sind die "generischen Schriftnamen"
cursive, fantasy, monospace, sans-serif und serif auf bestimmte installierte Schriften festgelegt.
Durch Verwendung der generischen Namen können sie daher zumindest den allgemeinen Typ der verwendeten Schrift festlegen. Für die professionelle Praxis eignen sich nur sans-serif (Überschriften), serif (Fliesstext) und monospace ("Schreibmaschine" - fixe Zeichenbreite).
Die Auswahl von Schrift-Familien:
► Geben sie immer (!) eine generische Schrift als letzte der Liste an.
► Geben sie nur Schriften an, die mit hoher Wahrscheinlichkeit verfügbar sind. Sonderschriften scheiden aus ! (Ausnahme: An PDF-Dokumente können sie eine Sonderschrift "mitgeben"). 		► Rechnen sie mit unterschiedlichen Textlängen ! Je nach Schrift (und Drucker) benötigt der gleiche Text unterschiedlich viel Platz.
► Falls sie keine anderen Vorgaben haben, verwenden sie für Überschriften Non-Serif-Schriften, für Fließtext Serif-Schriften.

Bilder
► Drucker "bearbeiten" Bilder bei der Ausgabe.
Stellen sie durch geeignete Maßnahmen ihren Einfluss auf die Ausgabe sicher: Unabhängig vom Drucker und seiner Software müssen ihre Grafiken und Bilder in gesicherter Qualität, rasch und mit geringem Farbverbrauch gedruckt werden.

► Überlegen sie den Einsatz von Farben: Der Aufwand an Zeit und Kosten (!) ist ungleich höher als für Schwarzweiss (s/w).
Farben sind gerechtfertigt, je geringer Anzahl und Größe der Bilder sind, und wenn damit wesentlich mehr oder bessere Informationen transportiert werden.
► In Standard-Diagrammen, die zahlreich und immer wiederkehrend ausgedruckt werden, ersetzen sie Farben durch Muster und Raster.

► s/w-Drucker (z.B. die meisten Laserdrucker) können prinzipiell keine Farben ausdrucken und ersetzen Farben durch Raster verschiedener Graustufen. Ihre Ausdruck-Webseiten dürfen dabei keine wesentlichen Verluste erleiden.
Verwenden sie dunkle Farben Grauwert > 50%) hoher Sättigung - sie werden in Dunkelgrau oder schwarz ausgedruckt. Vermeiden sie helle Farben (Grauwert < 50%) - sie werden evtl. in hellgrau (schlecht sichtbar), schlimmstenfalls in weiss ausgegeben.

► Die beste Alternative zu bunten Farben in Diagrammen sind Muster. Im Idealfall verwenden sie nur Schwarz (keine Grauwerte) und lockere Muster (kleiner Flächen-Grauwert). Das beschleunigt den Ausdruck, spart Kosten, ergibt gute Qualität (Seiten trocknen rascher, sind nicht wellig) und lässt sich problemlos faxen. 		► Beschäftigen sie sich mit dem Thema "Raster": Jede Farbfläche wird in eine (große) Anzahl einzelner Punkte zerlegt
Bei Verwendung von Bildern: Farben durch s/w-Raster ersetzen.
Das sollten sie in Standard-Diagrammen bereits bei der Herstellung berücksichtigen, damit ersparen sie sich die Nachbearbeitung.
Bilder (Portrait, Landschaft, ...) lassen sich mit jedem professionellen Grafik-Programm in s/w-Raster-Bilder umsetzen, das lässt sich in guten Programmen auch automatisieren.

► Rasterpunkte dürfen nicht "ausreißen" (Helligkeit 0%) oder "zusammenwachsen" (Helligkeit 100%). Die Helligkeit einer Farbfläche wird daher meist auf eine Raster-Helligkeit von 10-90% umgesetzt. Tipp: Betrachten sie Bilder unterschiedlicher Druckqualität (Zeitungen .. Magazine .. Kunstdruck) mit einer Lupe.

► Setzen sie nicht zu feine Raster ein, falls es die Anwendung nicht erfordert. Gröbere Raster werden meist sauberer gedruckt (Papier wird nicht wellig, Tinte trocknet rascher) und lassen sich ohne Qualitätsverlust faxen.

Regie & Konsumverhalten
In diesem Punkt unterscheiden sich die Medien Web und Print grundlegend.

► Gedruckte Seiten enthalten keine Bedienungs-Elemente.
Das spart Platz, macht aber andere Navigationshilfen (Inhaltsangabe, Kapitel-Struktur, Index, ...) notwendig.
► Sounds, Animationen usw. fallen ersatzlos weg, sie müssen an deren Stellen gutes Layout und interessante Inhalte anbieten.
► Druckwerke werden eher sequentiell konsumiert, man "springt" weniger zwischen den verschiedenen Seiten. Verweise (analog zu Links) müssen daher stark beschränkt werden.
► Grafiken und Tabellen dürfen auf Papier wesentlich mehr Details enthalten als am PC-Monitor. Die Grenze ist nur durch Papier- und Schriftgröße (Lesbarkeit) gesetzt.
► Lange Tabellen erstrecken sich über mehrere Seiten - bringen sie auf jeder (!) Seite die Überschriften der Zeilen/Spalten an ! 		► Archivierung:
Papier wird weniger für die laufende Konsumation verwendet, sondern zunehmend für die Archivierung. Legen sie daher besonderen Wert auf eine klare, übersichtliche Struktur.

+ Geben sie immer (!) Datum und Zeit, nach Bedarf die aktuelle Version im Ausdruck an.
+ Rechnen sie damit, dass die Seiten-Bindung verloren geht: Jede Seite enthält daher den eindeutigen (!) Namen des Dokuments und die Seiten-Nummer.
+ Falls sie dynamische Seiten (z.B. Datenbank, ...) ausgeben, drucken sie (am Anfang...) eine eindeutige Angabe, mit welcher Anfrage das jeweilige Dokument erstellt wurde.
+ Drucken sie Hinweise aus, wo/wie man sich neue, aktuelle Versionen ausdrucken kann.

Zeit & Kosten
Zeitbedarf und Druck-Kosten sind nur für Amateurseiten vernachlässigbar. Professionelle Ausdrucke müssen rasch erfolgen und sollen geringste Kosten verursachen.

Die speziellen Anforderungen für den Ausdruck lassen sich mit unterschiedlicher Technik erfüllen: 		Besonders für die (wiederholte) Archivierung umfangreicher Dokumente sind diese beiden Argumente sehr wichtig.
+ Verzichten sie in diesem Fall unbedingt auf Farben. Schwarzweiss ist rascher und wesentlich (!) billiger.
+ Hintergrund-Farben oder Bilder sind ausgeschlossen.
+ Verwenden sie ausschliesslich Standard-Schriften.
+ Reduzieren sie allenfalls die Anzahl von Grafiken.
+ Verwenden sie in Diagrammen Muster statt Farben, setzen sie Farbflächen in Raster um.

Kontrolle
Kontrollieren sie den Ausdruck-Vorgang selbst:
Stellen sie den AnwenderInnen Ausdruck-Buttons oder -Menübefehle zur Verfügung. 		Der Standard-Ausdruck sollte schwarzweiss (s/w) sein, Farbdrucke bieten sie am besten als Option an.

PHP & Perl
PHP verfügt über keine Druck-Funktionen, weil PHP-Programme normalerweise auf WebServern ausgeführt werden, wo ein Ausdruck unerwünscht ist. Mit PHP (Perl, ...) können sie jedoch dynamische Webseiten erstellen, welche die oben erwähnten JavaScript-Funktionen zur Steuerung des Ausdrucks verwenden.

PDF
Das PDF-Dateiformat von Adobe bietet besonderen Komfort für den Ausdruck von Dokumenten:

► Die Ausgabe ist unabhängig vom Betriebssystem oder (meistens/weitgehend) vom verwendeten Drucker.
► PDF-Dokumente können nicht (leicht) illegal verfälscht werden.
► Man kann den Dokumenten spezielle Schriften "mitgeben".
► PDF-Dokumente bieten mehr als ein bloßer Ausdruck: Sie lassen sich ansehen, drucken, speichern, weitersenden, ...
► Die Ausgabe von PDF ist kosten- und lizenzfrei auf jedem gängigen Betriebssystem verfügbar. 		Moderne Programmiersprachen (PHP, Perl, ...) bieten Bibliotheks-Funktionen zur Erstellung von PDF-Dokumenten an. Der Aufwand zur Programmierung ist jedoch relativ hoch - diese Form der Ausgabe wird dann verwendet, wenn die Ansprüche an die Qualität sehr hoch sind und/oder die Verbreitung in großen Stückzahlen erfolgen soll.

Im Umfang normaler PHP-Distributionen sind keine PDF-Funktionen enthalten.
Sie müssen daher ein PHP_PDF-Modul aus dem Internet besorgen und installieren. Es gibt einige (kommerzielle) Produkte dazu, z.B. ClibPDF
Alternativ gibt es ein interessantes OpenSource-Projekt von SourceForge: http://sourceforge.net/projects/pdf-php:
Diese Lösung arbeitet mit einer PHP-Library und kommt ohne zusätzliches Modul aus.

Postscript
PS ist eine "Seiten-Beschreibungs-Sprache". Damit werden alle zu druckenden Elemente in Klartext (plain text) definiert.
Eine PS-Datei ist unabhängig von Betriebssystem und Drucker, die Ausgabe erfolgt "so gut, wie das betreffende System es kann".
Mit PS können sie Layouts konzipieren, die auf jedem PS-Drucker "genau" eingehalten werden.

Bei Einführung von PostScript wurde erstmals das Schlagwort von "What You See Is What You Get" (WYSIWYG) geprägt. Einschränkungen sind jedoch durch technische Grenzen (Drucker-Randbreite) gesetzt. 		Für die Ausgabe von PS wird ein PS-Interpreter-(Programm) benötigt. Hochwertige Drucker haben den PS-Interpreter integriert, billige Modelle benötigen eine eigene PS-Treiber-Software. Postscript (GhostScript) ist auf den meisten Linux-Systemen verfügbar, auf Windows jedoch nur in Profi-Systemen. Daher scheidet diese Technik scheidet für Standard-Ausdruck leider aus.
Zum Inhaltsverzeichnis Homepage von PS-Trainer   >   Entwicklung   >   HTML