Push-Nachrichten von MacTechNews.de
Würden Sie gerne aktuelle Nachrichten aus der Apple-Welt direkt über Push-Nachrichten erhalten?
Forum>Entwickler>CSS Drucklayout - was beachten?

CSS Drucklayout - was beachten?

dom_beta13.10.1201:04
Hallo,

ich versuche mich gerade daran, ein sinnvolles CSS Drucklayout zu erstellen.

Dabei fällt mir auf, dass dies doch nicht so einfach ist wie gedacht.

Habt ihr ein paar Tipps was man beachten sollte und wie man den Druck verbessern kann?

Danke sehr!

MfG
„...“
0

Kommentare

maliker13.10.1202:54
Wie schon bei deinen letzten Fragen. Mag dir gern helfen, aber werd mal etwas konkreter
0
_mäuschen
_mäuschen13.10.1214:41
http://aktuell.de.selfhtml.org/artikel/css/drucklayout/
0
dom_beta13.10.1221:47
maliker
Wie schon bei deinen letzten Fragen. Mag dir gern helfen, aber werd mal etwas konkreter

OK.

Ich hätte gerne ein Drucklayout, wo die Seitenränder in jedem Browser immer 2 cm breit sind; zudem soll das Layout überall gleich sein.
„...“
0
Metti
Metti13.10.1221:56
So wie ich HTML verstanden habe (CSS ist doch Teil von HTML?) ist gerade hier nicht ein gleiches Aussehen der Zweck des Ganzen. HTML ist eine Seitenbeschreibung, die versucht, eine Vorgabe soweit wie Möglich auf dem aktuellen Ausgabegerät anzuzeigen.
Wenn Du auf identisches Aussehen Wert legst, benutze PDF.

Insbesondere Deine erwähnten 2cm Rand sind mit HTML nicht machbar. HTML ist keine Layoutsoftware. Ich habe HTML so verstanden, dass man sagt: "Zeichne ein gelbes Auto oben links in die Ecke."
Das sieht bei jedem anders aus.

So mein Verständnis. Allerdings ist das schon älter und ich würde es lediglich als rudimentär bezeichnen. HTML wurde ja deutlich erweitert.

Gruß, Stefan Mettenbrink.
0
sierkb13.10.1223:27
dom_beta:
Ich hätte gerne ein Drucklayout, wo die Seitenränder in jedem Browser immer 2 cm breit sind

Wie jetzt nun? Web-Browser oder Print (Drucker)? Bitte entscheiden Sie sich. Jetzt. Jedem Medium (Bildschirm, Drucker, Mobil, Voice, Präsentation (Beamer) etc.) sein dafür optimiertes Stylesheet.

Und wer oder was hindert Dich, ein Stylesheet bzw. CSS-Anweisungen für Print-Layout zu schreiben, das z.B. per media="print" bzw. media queries , automatisch eingebunden und vom Drucker abgefragt wird, sollte einer anfragen und wo Du den betreffenden Elementen, die Du ausgedruckt haben willst, keine Pixel-Größen mitgibst, sondern eben Milimeter- bzw. Zentimeterangaben?
Will heißen: wenn Du beim Druck-Layout einen 2cm breiten Rand haben willst, warum gibst Du Deinem betreffenden Element bzw. dem body-Element des betreffenden Dokuments nicht einfach einen margin: 2cm mit? Und dasselbe Element hat für den normalen Bildschirm dann meinetwegen einen margin von 10px.
Referenziert und unterschieden dann eben z.B. durch die bekannte Notation à la <link rel="stylesheet" type="text/css" media="screen" href="default.css"> und <link rel="stylesheet" type="text/css" media="print" href="print.css">. Der Browser (oder ein anderer Benutzeragent des Endgerätes) zieht sich für die Bildschirmausgabe das für die Bildschirmausgabe bestimmte Stylesheet, beim Ausdrucken wird von ihm automatisch das Stylesheet für das Druck-Layout ausgewählt und mitgegeben.

Und wo ist jetzt das Problem für Dich? Du weißt, wo Du Dich informieren kannst. Du kennst die Anlaufstellen. Du weißt, wo die Spezifikation dazu zu finden ist, Du kannst Google/Bing/Yahoo/whatever bedienen. Einmal die richtigen Stichworte eingegeben (z.B. ), und Du findest unzählige Hilfeseiten und Tutorials mit Beispielen zum Thema. Z.B. ,

Wieso so faul und bequem und so einfallslos bei der Recherche nach Wissen und Lösungen? *kopfschüttel*
zudem soll das Layout überall gleich sein.


Warum sollte es nicht gleich sein auf gleichen Ausgabemedien?

Metti:

So wie ich HTML verstanden habe (CSS ist doch Teil von HTML?)

Wenn ich Deinen Beitrag so lese komme ich zu dem Schluss: Du bist völlig fehlinformiert bzw. hast weder HTML noch CSS auch nur im Ansatz verstanden. Sorry.

CSS ist NICHT Teil von HTML. Beides sind eigenständige, sich ergänzende, aber sich nicht gegenseitig bedingende Sprachen. Zumal HTML älter ist als CSS, von seiner Herkunft her, SGML, sogar deutlich älter.
HMTL ist eine Auszeichnungssprache (Markup Language). Mit ihr werden Elemente gemäß ihrer inhaltlichen Bedeutung (=Semantik) ausgezeichnet, dem INhalt eine Struktur verliehen. Also zum Beispiel ein Absatz à la "dies ist ein Absatz", eine Überschrift "dies ist eine Überschrift", ein Video-Element: "dies ist ein Video-Element", ein Bild: "dies ist ein Bild", eine Liste: "dies ist eine Auflistung", eine Tabelle: "dies ist eine Tabelle" etc. pp. HTML gibt dem Inhalt eine Struktur. Mehr nicht. Es sagt NICHTS aus über die Darstellung, das Aussehen und die Positionierung dieser Struktur.
CSS ist eine Formatierungssprache für Gestaltungs- bzw. Stilvorlagen, mit der nicht nur allen Elementen einer Auszeichnungssprache (also z.B. HTML, XML, SVG etc. pp.) ein Aussehen gegeben werden kann, sondern allen möglichen Elementen in Software, wenn man das entsprechend kombiniert.
ist gerade hier nicht ein gleiches Aussehen der Zweck des Ganzen.

Bzgl. HTML nicht, bzgl. CSS: kommt aufs Ausgabemedium drauf an. Dadurch, dass es Webstandards sind, ist das Ziel durchaus, unter gleichen Bedingungen, gleiche Ergebnisse hervorzurufen und unter nicht gleichen Bedingungen eben den Bedingungen jeweils angepasste Ergebnisse.
HTML ist eine Seitenbeschreibung, die versucht, eine Vorgabe soweit wie Möglich auf dem aktuellen Ausgabegerät anzuzeigen.

Nein, ist es nicht. Es ist eine Auszeichnunssprache. HTML ist keine Seitenbeschreibungssprache. Das ist ein grundlegender Unterschied. Eine Seitenbeschreibungssprache (PDF ist im Gegensatz dazu eine Seitenbeschreibungssprache) beschreibt pixelgenau, wo welches Element einer Seite wie positioniert ist und zu erscheinen hat. Genau das kann eine Auszeichnungssprache wie HTML oder XML oder die aus den 60er Jahren stammende Grundlage von HTML, SGML, nicht. Und es ist auch nicht die Aufgabe von HTML, das zu können. HTML gibt Inhalt eine Struktur gemäß dessen Semantik. Deswegen heißt es auch Hypertext Markup Language. Markup. Also Auszeichnung. Wie bei einem (Preis-)Etikett: diese Ware ist ein Tisch. Evtl. um die weitere Auszeichnung erweitert: diese Ware kostet 350EUR. Über Aussehen, Form, Farbe, Gestaltung der Ware wird damit nichts ausgesagt. Soll auch nicht. Ist nicht die Aufgabe einer Auszeichnungssprache (Markup Sprache) wie HTML (oder XML).
CSS hingegen verleiht dieser Struktur ein Aussehen (das ggf. jederzeit geändert werden kann, ohne dass die Struktur bzw. die Bedeutung der einzelnen Struktur-Elemente geändert wird), Größe, Farbe, Positionierung der einzelnen Elemente dieser Struktur können damit definiert werden.
Wenn Du auf identisches Aussehen Wert legst, benutze PDF.

Insofern richtig. Kommt aber drauf an, was man wofür bezweckt. Einsatzzweck und Ausgabemedium bzw. potentielle Ausgabemedien sind hier der ausschlaggebende Punkt.
Insbesondere Deine erwähnten 2cm Rand sind mit HTML nicht machbar.

Mit HTML nicht. Ist auch gar nicht der Sinn und die Aufgabe von HTML. Mit CSS ist es hingegen sehr wohl machbar. Weil u.a. genau dazu CSS da ist.
HTML ist keine Layoutsoftware. Ich habe HTML so verstanden, dass man sagt: "Zeichne ein gelbes Auto oben links in die Ecke."
Das sieht bei jedem anders aus.

Du sagst richtig, dass es keine Layotsoftware ist, erklärtst dann aber genau das Gegenteil, dass es das doch sei.
HTML ist in der Tat KEINE Layoutsprache.

HTML ist NICHT "Zeichne ein gelbes Auto oben links in die Ecke." Genau das NICHT.
Es ist vielmehr: "Das ist ein Fenster". "Das ist eine Tür". "Das ist ein Sitz". "Das ist ein Lenkrad". "Das ist ein Reifen". "Das ist ein Motor". "Das ist der Kofferraumdeckel". "Das ist das Dach". etc. pp.
Wie und in welcher Anzahl diese Einzelteile grob zusammen zusammengesetzt sind, ergibt grob die Form und Umrisse eine Autos, die Struktur. Wie sie jedoch genau ausssehen, positioniert sind, zueinanderstehen, welche Farbe und Größe sie haben, diese Feinheiten werden durch CSS definiert.
So mein Verständnis. Allerdings ist das schon älter und ich würde es lediglich als rudimentär bezeichnen.

Hiermit hoffentlich aufgebessert bzw. korrigiert bzw. der Grundstein gelegt für eine grundlegende Korrektur/Überarbeitung desselben.
0
dom_beta14.10.1201:50
sierkb
dom_beta:
Wie jetzt nun? Web-Browser oder Print (Drucker)? Bitte entscheiden Sie sich. Jetzt. Jedem Medium (Bildschirm, Drucker, Mobil, Voice, Präsentation (Beamer) etc.) sein dafür optimiertes Stylesheet.

Es geht hier ausschließlich um die Druck-Ausgabe.

sierkb
Will heißen: wenn Du beim Druck-Layout einen 2cm breiten Rand haben willst, warum gibst Du Deinem betreffenden Element bzw. dem body-Element des betreffenden Dokuments nicht einfach einen margin: 2cm mit? Und dasselbe Element hat für den normalen Bildschirm dann meinetwegen einen margin von 10px.

Das bedeutet, daß der Rand von 2 cm nur bei body gesetzt werden darf?

Dabei fällt mir ein, was sagt ihr zu diesem Druck Stylesheet?

@page { 
size:21.0cm 14.85cm; 
size: portrait; 
margin:2cm 
}

  * { 
float : none !important ; 
display : block !important ; 
width : auto !important; 
height : auto !important 
}  

#NavObenG, #NavUnten {
display : none !important
}

 h1,h2,h3,h4 {
text-align : center


ul {
list-style:disc !important}

Ich rätsele gerade darüber, ob diese von mir selbst gebastelten Angaben überhaupt sinnig sind.

sierkb
zudem soll das Layout überall gleich sein.


Entweder habe ich mich falsch ausgedrückt oder du hast mich falsch verstanden.

Ich möchte gerne, das mein Print CSS Layout bewirkt, daß ein Ausdruck möglichst überall gleich aussieht.


MfG
„...“
0
dom_beta14.10.1205:29
Hallo,

hat es einen Sinn, weswegen beim Druck keine Auflistungszeichen erscheinen?
„...“
0
Metti
Metti14.10.1208:09
dom_beta
Wenn ich Deinen Beitrag so lese komme ich zu dem Schluss: Du bist völlig fehlinformiert bzw. hast weder HTML noch CSS auch nur im Ansatz verstanden. Sorry.

Danke für Die Erklärungen!
Insbesondere der Bereich CSS ist an mir offensichtlich völlig vorbei gegangen. So wie Du HTML beschreibst, hatte ich es auch (im Groben) verstanden, allerdings einige Begriffe durcheinander gebracht.

Gruß, Stefan Mettenbrink.
0
dom_beta14.10.1218:25
Hey!
Metti
dom_beta
Wenn ich Deinen Beitrag so lese komme ich zu dem Schluss: Du bist völlig fehlinformiert bzw. hast weder HTML noch CSS auch nur im Ansatz verstanden. Sorry.

Den Satz mit "Wenn ich ..." habe ich nicht verfasst, sondern sierkb.
„...“
0

Kommentieren

Diese Diskussion ist bereits mehr als 3 Monate alt und kann daher nicht mehr kommentiert werden.