Liebe Experten,
bis jetzt bin ich immer drum rum gekommen, aber jetzt muss ich druckfähige HTML-Seiten erstellen, möglichst IE und Mozilla-tauglich.
Hat jemand Erfahrungen, wie man das am Besten machen kann?
Wie siehts mit den Maßen aus, damit alles auf eine DIN A4 Seite passt? Oder kann man mit CSS vielleicht sogar alles papiertauglich machen? Selfhtml sagt ja, dass die entsprechenden syle-sheets noch nicht funktionieren.
Liebe Experten,
bis jetzt bin ich immer drum rum gekommen, aber jetzt muss ich
druckfähige HTML-Seiten erstellen, möglichst IE und
Mozilla-tauglich.
In erster Linie Schriften, die sich auf weißem Hintergrund gut abheben und kein Tabellen-Layout. Damit sollte man schon einiges hinbekommen.
Wie siehts mit den Maßen aus, damit alles auf eine DIN A4
Seite passt? Oder kann man mit CSS vielleicht sogar alles
papiertauglich machen? Selfhtml sagt ja, dass die
entsprechenden syle-sheets noch nicht funktionieren.
Das Papier ist in erster Linie nur ein Wiedergabegerät mit fest vorgegebenen Dimensionen, insofern sind die Maße kein echtes Problem. Schwierig wird es nur, wenn Elementie wie z.B. komplexe Tabellen nicht mehr in irgendeiner Dimension aufs Papier passen.
Um z.B. sicherzustellen, dass alles auf eine Seite passt, gibt es keine Möglichkeit. HTML ist nie als Layoutsprache entwickelt worden, noch viel weniger als Sprache für Printmedien. Dafür gibt es besser geeignete Formate und Systeme wie z.B. (La)TeX.
CSS funktioniert ganz gut (mit den üblichen Einschränkungen beim IE). Ich habe irgendwann mal ein wenig rumexperimentiert:
Alle Seiten haben ein print-Stylesheet, das dafür sorgt, dass die Schrift schwarz auf weißem Hintergrund ist und die Layoutelemente wie Rahmen oder Menüspalte nicht angezeigt werden. Auf der Links-Seite arbeite ich noch dran, die Länderflaggen durch den Text im alt-Attribut zu ersetzen, irgendwo habe ich auch eine einigermaßen lauffähige Version davon rumfliegen.
Hallo Ruwi!
bis jetzt bin ich immer drum rum gekommen, aber jetzt muss ich
druckfähige HTML-Seiten erstellen, möglichst IE und
Mozilla-tauglich.
[…]
Ja, grundsätzlich immer mit CSS. Ich arbeite normalerweise „nur“ mit DIV-Layern, denen ich IDs zuweise. Vielleicht kannst Du z.B. etwas mit folgendem (noch ziemlich unfertigen) Layout anfangen: http://nsuro80web.gmxhome.de/ - Dort habe ich innerhalb des Body’s noch DIV’s mit id=seite, =menu, =inhalt usw. eingebaut, um das Design später unabhängig nur per Style zu gestalten. Wichtig erscheint mir dabei, dass der Text fliesst und die Grösse variable bleibt. (z.B. für den Bildschirm body { font-size:100%; } h1 { font-size:1.5em; } h2 { font-size:1.2em; } p { font-size:0.9em; } - für Druckausgabe ggf. die Masseinheit „pt“ verwenden.)
Ferner, was ziemlich unbekannt sein dürfte, lassen sich Klassen miteinander kombinieren, was ggf. interessant für Dich ist. (Nur halt Vorsicht mit HTML-Layout-Editoren, die hauen evtl. die zweite Klasse einfach weg.) Beispiel:
**Hier dreht sich alles um ...**
Wichtig beim Drucken ist, dass Du gewisse Seitenränder nicht unterschreitest. Als recht tauglich für (alle) Tintenstrahldrucker ist ein unter Seitenrand von 1.8cm. Oben reichen i.d.R. 1.0cm. - Ein benutzerfreundlicher linker Rand: 2.2cm. 
Ansonsten ist eines der wesentlichen Probleme, dass der Benutzer die Seitenränder im Browser selbst einstellen kann, wenn er das überhaupt kann.
Vielleicht hält http://www.DrWeb.de/ wieder 'mal etwas Aktuelles dazu vor. Unbedingt x hinsurfen.
HTH
CU DannyFox64
Pixelbreite oder CSS oder SSI/PHP
Mit CSS kann man zum Drucken Inhalte ausblenden, Schriften verändern, also alle Formate komplett umstellen. Wird von aktuellen Browsern (Opera 7.54/6.06b, Mozilla/Firefox, IE > 5.0) verstanden. Beispiele sind Artkel bei GMX, drweb.de.
Für ein Uralt-Tabellen-Layout habe ich ca. 560 Pixel Breite auf Windows-Rechnern als DINA4 passend immer genutzt.
SSI oder PHP kann einen LInk auf eine Druckausgabe anbieten. Beispiel meine kleine Portalseite (Linksammlung privat). http://klafuenf.de
Wenn Du SSI nutzen kannst (apache Webserver bzw. …X-Maschine für den Webserver) finde ich das zum schnell mal machen mit CSS am einfachsten. Wenn Du im Quelltext beim mir stocherst findest Du aber außer den Kommentarzeilen nix. Willst du es wissen, dann Mail mich an. Ansonsten empfehle ich Dir bei http://drweb.de die Rubrik »SSI« zu lesen. Wenn es dich interessiert, sende ich dir den ganzen Klumpatsch auch gerne als PDF-Sammlung zu (dank CSS eben ohne die überflüssige Navigation gedruckt). Drweb weiß wie es geht.
PHP ist dazu die Mörderlösung. Dürfte so oder ähnlich beim Spiegel (diese Seite Drucken) auch funktionieren. Ist aber SEHR aufwändig.
Gruß
Stefan
Hallo „ruwi“!
„ruwi“ schrieb:
bis jetzt bin ich immer drum rum gekommen, aber jetzt muss ich
druckfähige HTML-Seiten erstellen, möglichst IE und
Mozilla-tauglich.Hat jemand Erfahrungen, wie man das am Besten machen kann?
Ein paar hilfreich Links hierzu:
http://www.einfach-fuer-alle.de/artikel/druck/
Leicht verstärkter Druck
http://www.grammiweb.de/praxis/ssi11.shtml
Druckoptimierte Seitenvarianten
http://cgi.xwolf.de/cgi/printview.shtml
PrintView - Seiten komfortabel drucken
http://www.css4you.de/printproperty.html
CSS-Referenz: Drucklayout
Wie siehts mit den Maßen aus, damit alles auf eine DIN A4
Seite passt? Oder kann man mit CSS vielleicht sogar alles
papiertauglich machen? Selfhtml sagt ja, dass die
entsprechenden syle-sheets noch nicht funktionieren.
Meinst Du dies:
http://aktuell.de.selfhtml.org/tippstricks/css/druck…
CSS: Stylesheet für ein Druck-Layout
Gruss Oliver
Vielen Dank für die Tipps… hat mir super weitergeholfen…