Druck-Stylesheets total Technikwürze 133

Herzlich willkommen zu einer neuen Folge Technikwürze. Heute mit dem Thema Druck Stylesheets total und, hier im virtuellen Skype Studio für euch am Mikrofon, sind der Sascha Postner und?

Der Peter Hallo.

Herzlich willkommen zu Technikwürze, eurem Design und Webstandard Podcast. Von und mit David Maciejewski, Nadja Müller, Sascha Postner und Daniel Jagdzelt.

Ja, schön, dass ihr alle wieder am Gerät seid und uns, lauscht, während wir heute über, die Grundlagen von Druck Stylesheets sprechen. Mit diesem Thema oder mit diesem Titel, findet sich auch ein interessanter Artikel im Netz, und zwar von Peter. Peter, herzlich willkommen in der Technikwürze.

Hallo Sascha, herzlichen Dank für die Einladung.

Ja, lustigerweise, als ich, mich mit, meiner eigenen Webseite und der Optimierung für Druck Stylesheets auseinandergesetzt hab, bin ich über deinen Artikel gestoßen und wir hatten ja kurz darauf auch dann Kontakt, bezüglich dieser Technikwürze-Folge. Du hast dich damit also schon ein bisschen intensiver auseinandergesetzt?

Ja, quasi. Also das war bei mir ähnlich, wie ich hier die Seite aufgesetzt hab, Peter Wotzek, wollte ich auch eine relativ schöne Druckversion haben und, hab mich dann auf die Suche begeben und bei der Gelegenheit dann gesagt: „Okay, jetzt hast du schon so viel zusammen recherchiert, dann kannst du auch eigentlich einen Artikel draus machen."

Ja, genau. Er ist auch, recht interessant zu lesen und du hattest ja irgendwie auch versprochen, dass du da noch eine aktualisierte Variante dann online stellen wirst, die Tage.

Ist es. Genau. Also wenn's klappt, Montag, also sprich mit dem, mit der Veröffentlichung der Sendung sollte dann auch der Artikel aktualisiert sein.

Ja, das, das ist, das ist schön. Nichtsdestotrotz ist er ja so schon, nicht nur gut lesbar, sondern auch inhaltlich ganz interessant. Also, vielleicht sollten wir ganz kurz erklären, worüber wir überhaupt reden, wenn wir von C, also von Print oder Druck Stylesheets, sprechen.

Also jeder, der sich so mit Webstandards auseinandersetzt und, CSS intensiv benutzt, um seine Webseiten zu stylen, der hat wahrscheinlich schon mal mitbekommen, dass es sogenannte Mediatypen gibt, die man bei der Einbindung der, Stylesheets, nutzen kann, um halt eben nur für bestimmte Mediatypen die Stylesheets, zu verwenden.

Und wir sprechen quasi darüber, dass man das für die, für das Medium, Drucker oder, Print, wie es dann in Englisch so schön heißt,- -ebenfalls machen kann und so quasi, seine Webseite für den, fürs Ausdrucken komplett anders gestalten kann, als es, für die Bildschirmdarstellung ist.

Ja, das ist im Prinzip eigentlich korrekt. Also man kann da, ich sag mal, das Unnötige entfernen und das, was man eigentlich nur dann aufs Papier bringen will oder möchte, auch dann, über die, Druck Stylesheets dann auch tatsächlich dann, ja, für, für den Ausdruck dann auch optimiert, bereitstellen.

Genau. Vielleicht verlieren wir ganz kurz noch mal 'n, 'n Wort zu den Mediatypen im Allgemeinen. Also, wenn man nach CSS-Mediatypen oder solchen Sachen im, im Internet sucht, dann findet man da eine ganze Handvoll. Ich muss zugeben, dass ich jetzt nicht, geschafft habe, herauszufinden, was jetzt wirklich alles tatsächlich unterstützt wird.

Und, bei der, W3C, also beim World Wide Web Consortium, ist auch zu lesen, dass quasi sich da in naher Zukunft wohl noch viel ändert, nicht zuletzt, weil ja ständig neue, neue Geräte auf den Markt kommen. Also im Großen und Ganzen kann man wahrscheinlich davon ausgehen, dass neben, also dass die anderen Sachen, es gibt halt zum Beispiel, Screen, ganz klar für Computerbildschirme.

Es gibt Print für zum Ausdrucken, Projection, für Projektoren oder solche Dinger, also Beamer, Handheld, dann gibt's Braille für Braille-Geräte, diese quasi der Blindenmonitor, ne.

Wo diese kleinen Nöpfels rauskommen.

Genau das. Ich hab lustigerweise auf dem Barcamp in, in, in Essen, Barcamp Ruhr, hatte ich, da hatte jemand, so ein Braille-Gerät mit. Das,- -, war ganz interessant, das mal zu sehen, zumal er uns dann auch erzählt hat, wie teuer das ist. Und das war-

Die sind schweineteuer. Also ich hab da auch mal auf, das war, glaube ich, auf der EVA-Tagung Gelsenkirchen. Da sagte auch einer so: „Die Dinger wären so was von unverschämt teuer. Da wäre, sagen wir mal, so ein Screenreader wie Jaws eigentlich, schon preiswert im Vergleich dazu."

Ja genau, diese Variante, die hatte irgendwie nur vierzig Zeichen, war dann allerdings auch schon so Deluxe mit Bluetooth-Anbindung und die kostete mal eben siebeneinhalb tausend Euro. Ich dachte: „Ja, das war mal günstig."

Genau. Hin. Media Markt mal gucken.

Na ja, also man kann zum Beispiel davon ausgehen, dass so was wie, Braille, der Braille-Mediatype, oder auch der, da gibt's auch Aural für Sprachsynthesizer, dass die quasi dann wahrscheinlich von bestimmten Browsern, wie Jaws oder so unterstützt werden, aber so 'ne richtige...

Also es scheint halt nicht ganz so etabliert zu sein, während man von, also bei Screen und Print, also sicher sein kann, dass es unterstützt wird und Handheld hab ich halt tatsächlich auch schon genutzt und das hat auch funktioniert.

Ja, ich find eigentlich auch gut. Also wirklich geläufig Screen für die Bildschirmausgabe, Print für den, für den Druckbereich und Handheld, aber alles andere wie Aural oder Braille, solche Dinger Uff, nee, also ich fällt jetzt auch spontan keine Webseite ein, wo ich sagen könnte: Okay, hier ist der Mediatyp, Braille oder, oder Oral verwendet worden. Also da müsste ich wirklich, da müsste man wirklich anfangen zu recherchieren mal.

Vielleicht irgendjemand von den Zuhörern fällt was spontan ein, der kann es ja in die Kommentare reinschreiben, aber so an sich jetzt von mir von meiner Seite, obwohl ich mich auch immer wieder gelegentlich mit dem Thema Accessibility beschäftige, aber nö, fällt mir leider kein, kein Beispiel ein. Leider nicht.

Ja, also, einbinden kann man diese Dinger dann halt auf unterschiedliche Ebene, je nachdem halt auch, wie man seine, Style Sheets einbindet. Da wollen wir jetzt aber, glaube ich, also da sollten wir jetzt nicht ganz so intensiv drauf eingehen, wo da die Schwierigkeiten und die Unterstützungen sind.

Also es gibt halt die Möglichkeit quasi, wenn man die externe Datei einbindet, im, im Head des HTML-Dokuments, da quasi eben Media auszuzeichnen oder halt zum Beispiel über die Add-Media-Regel einzelne, CSS-, Regeln dann in der Datei erst, einem bestimmten Medium, zuzuordnen. Aber das wird jetzt einfach auch zu weit führen.

Ja, also da, da kann man, ich sag mal, da kann man schon fast eine eigene Sendung von machen. Also ich hatte noch vor, vor der Sendung mal kurz recherchiert und der Jens Meier, also er plädiert, würde ich mal sagen, für die elegante Lösung, das über die Add-Media-Regel zu machen. Eine CSS-Datei, und, die verschiedenen, Bereiche halt über diese Add-Media-Regel anzusprechen, also für Screen, halt das für die Bildschirmausgabe, für Print, für den Printbereich.

Vor dem Hin-- Also ar-argumentiert vor dem Hintergrund der Serveranfragen, dass wenn man mehrere Style-Sheet-Dateien im Headbereich einfügen würde, dass die Serveranfrage natürlich dadurch höher wäre und eine Style-Sheet-Datei würde das Ganze schlanker, eleganter machen und nach seiner Meinung auch wär's die, die beste Lösung halt.

Deswegen also kann man da … Im Endeffekt, sag ich, sollte das jeder so machen, wie, wie, wie er es vielleicht für am besten hält, wobei ich mittlerweile selber zu der, zu der, zu dem Weg tendiere, das alles mit einer CSS-Datei abzuvorstücken anstatt-

Das ist auf jeden Fall sehr löblich. Bei mir ist es eher so, dass ich, einfach nicht das, die richtige, wie sagt man gleich, Disziplin habe, um das durchzuziehen. Also ich hab das bei meiner eigenen Seite gemerkt, dass ich, also die, die, Druck-CSS-Datei, die doch, doch einiges brauchte.

Also, dass ich dann hinterher in meiner, wenn ich das jetzt in einer CSS-Datei machen würde, doch irgendwie die einzelnen Sachen wiederzufinden und dann ständig irgendwie, bestimmte Regeln dann doch zu überschreiben oder, also noch mal genau zu checken, welche Regel jetzt da, die dominantere ist. Das, ja, ich hab, ich hab das halt mit zwei Dateien gelöst, aber im Endeffekt ist es wahrscheinlich wirklich auch 'ne, 'ne Frage des persönlichen Geschmacks.

Ja, würde ich auch sagen. Also deswegen oder halt des, des persönlichen Könnens oder wie weit man da auch mittlerweile schon, sagen wir mal, routiniert ist. Deswegen also ich gehe mittlerweile diesen Weg. Klar, muss da auch ab und zu mal noch ein bisschen Kopf kratzen und wundere mich: Ja, warum funktioniert das jetzt nicht? Und bin dann da am Suchen halt, aber, ich gehe mittlerweile diesen Weg, das alles mit einer CSS-Datei sozusagen fertig zu machen.

Okay, dann kommen wir mal darauf, was wir genau mit dieser einen CSS-Datei fertig machen. Also zunächst einmal, also gibt's natürlich ein paar Sachen, die man, wenn man das, Ganze optimiert für die Druckausgabe, ausblenden kann. Also, ich sag mal, beim-- Also ich, ich zum Beispiel hab bei mir die Navigation ausgeblendet und ja, also ich hab jetzt mittlerweile keine Werbeanzeigen mehr auf der Seite drauf, aber man kann halt natürlich auch so Google-Anzeigen und solches Gedöns halt ausblenden.

Das macht, natürlich schon mal relativ viel Sinn. Also möglicherweise irgendwelche Footer, wo ein Impressum-Link drauf ist oder solche Sachen.

Ja. Also ich bin da-- Wie gesagt, Navigation muss nicht unbedingt in die, in die Printausgabe rein. Okay, ich sag mal jetzt eine kleine Seite, wie zum Beispiel ein Blog, wo man vielleicht in der-

Lass mich dich kurz unterbrechen, weil du bist so gut wie gar nicht mehr verständlich hier, im Skype gerade. Das ist, etwas unangenehm.

Diese technische Störung wurde Ihnen präsentiert von Skype.

Da bin ich wieder.

So, jetzt klingt's auch gleich viel besser. Gut, dann, waren wir gerade da stehen geblieben, wie genau? Ausblenderei. Also, du sagtest, du, also wenn's komplexer wird, was Flyouts angeht und so.

Kann man das wirklich ausblenden halt. Also wie gesagt, große Portalseiten haben ja dann doch relativ umfangreiche Menüs und, da würde ich auf jeden Fall sagen, dass man das, ausblenden kann. Bei kleinen Seiten, Blogs oder so was kann man's überlegen, aber muss es, man kann es nicht, aber, ich würd's auch bei kleinen Seiten einfach ausblenden. Genauso wie Suchmasken oder auch Formularfelder. Also ich weiß nicht, warum man Formularfelder jetzt unbedingt in die Druckversion mit reinnehmen sollte.

Also find ich jetzt nicht wirklich sinnvoll halt, weil wenn das Formular so gut aufgebaut ist, bekommt man ja meistens sowieso eine Bestätigungs-Mail und da steht ja sowieso dann noch mal die ganzen Angaben drin. So gesehen, macht das keinen Sinn. Bei der Fußzeile weiß ich nicht. Da bin ich hin- und hergerissen. Dirk Jesse mit seinem Jamel Framework, sagt ja auch, Footer kann weg. Ich weiß nicht.

Also Copyright-Hinweise drin und, so manch ein Kunde, der sagt: „Warum ist, warum ist der Copyright-Hinweis nicht mehr da?" Und, da würd ich dann schon sagen, sollte man die Fußzeile drinlassen, wobei man das natürlich noch über diese Pseudoelemente after oder before noch mit reinbringen kann, aber na ja, anderes Thema, kommt noch. Aber Wie gesagt, Fußzeile bin ich immer hin- und hergerissen.

Also ich tendiere dazu, das von Fall zu Fall zu entscheiden und einfach abzuwägen, ob man jetzt die Fußzeile mit reinnimmt oder ob so, ob man sie rausschmeißt.

Ja. Ja, also ich denke, das also auch ähnlich geht's ja auch bei den Formularfeldern. Also, es kommt drauf an, wenn man halt wirklich ein komplettes Formu-- Wenn man jetzt eine Seite hat mit ’nem, mit ’nem reinen Anmeldeformular oder so, dann und da sonst sowieso nicht so viel drauf ist, dann ist das ja, wenn die Seite mal ausgedruckt wird, wahrscheinlich der einzige Grund, warum sie ausgedruckt wäre. Wenn man's dann bewusst ausblendet.

Aber wie gesagt, das muss man ja auch im Einzelfall im, bei, bei dem Einsatz, sehen dann, ob's Sinn macht oder nicht. Aber im Prinzip ist es ja, wenn man sich über so einen Print-Style-Sheet Gedanken macht, doch im Regelfall so, dass auf jeden Fall der Content interessiert und nicht unbedingt, die Navigation oder, zum Beispiel der rechte Bereich, der oft jetzt so im Blockstyle rechts dann irgendwie, Tech Cloud oder, irgendwie die, wichtigsten Kommentare oder solche Sachen beinhaltet.

Also wobei ich meine jetzt Kommentare halt aus anderen Artikeln oder so. Ja, generell kann man natürlich auf diese Art und Weise, also während man jetzt zum Beispiel hingeht und sagt, zum Beispiel, man blendet die Navigation über Display none in diesem,, CSS-Style aus, kann man so natürlich alles andere, stylen und anpassen.

Also, hat man zum Beispiel, mit viel Farbe gearbeitet, dann kann man eben jetzt hingehen und dort sagen, okay, ich möchte das Ganze in Schwarz-Weiß haben, oder, man, blendet halt die ganzen Designelemente aus, die jetzt viel Farbe beim Drucken irgendwie verbrauchen würden. Es gibt ja scheinbar sowieso einiges an Problemen bei dem Drucken von Hintergrundbildern.

Ich habe das nicht im Einzelnen evaluiert, aber wenn man sich mal die Artikel so ansieht, dann stellt man schon fest, dass da immer wieder Probleme auftreten.

Ja, also ich glaube, Hintergrundbilder, wenn, kann das, glaube ich, auch wieder nur einer der Opera, der das Teil oder auch nur teilweise dann wieder mitnimmt, Teil. Über den anderen Browser, also Internet Explorer ja sowieso nicht. Aber, bei dem Achter habe ich's jetzt aber selber auch noch nicht ausprobiert. Müsste man, aber ich, ich gehe da mal von aus, das kann der nicht, so pauschal will ich es jetzt einfach mal sagen. Aber warum sollte man auch die Hintergrundbilder mit, mit ausdrucken?

Also ich denke mal, da kann man dann wirklich sagen, Background entweder weiß oder transparent setzen und, weil letztlich, vielleicht will das auch nicht jeder in Farbe ausdrucken, sondern nur in Schwarz-Weiß. Und, wenn man dann mit normalem Schwarz-Weiß-Drucker versucht, irgendwie eine supertoll farbig gestaltete Seite auszudrucken. Na ja, danke.

Gibt dann eher so eine, so eine graue Soße irgendwie und, da s-würde ich dann sagen: Okay, Hintergrund weiß, Schriftfarbe schwarz und, da ist man dann eigentlich schon auf einem guten Weg, so was wie Grundeinstellungen angeht.

Wie stehst du zu, Schriftart? Also ich meine, da gibt's ja dann wieder die, Standarddiskussion, Serifen oder nicht.

Also bei mir ist zum Beispiel auf meiner eigenen Seite, ich hab halt mir, Georgia als, auch als Hauptschrift ausgesucht, die so ein bisschen auch zum Style der Seite gehört und hab die jetzt natürlich auch dann beim Print, benutzt, weil ich einfach auch fand, dass das so ein bisschen zu der, zu der Marke gehört, ja, oder zu dem, zu der Visual Identity oder wie man das auch immer dann nennen möchte.

Aber, würdest du da ’ne, ’ne, ’ne Anpassung vornehmen, wenn man zum Beispiel keine S-- Also eine Schrift ohne Serifen benutzt hat?

Ich würd das auch von Anwendungsfall zu Anwendungsfall oder sage ich jetzt mal vom Kundenfall zu Kundenfall unterscheiden. Also es gibt Kunden, die, sagen, auch wenn man jetzt ’ne, ’ne, ’ne, ’ne Serife auf der, normalen Webseite benutzt, die sagen dann auch: „Sieht aber ein bisschen altmodisch aus.“ Hatte ich also jetzt zum Beispiel einen Fall und, da wurden ein bisschen hin und her diskutiert, aber letztendlich, hat man dann auf diese Serife dann halt verzichtet.

Und in der Druckversion, ja, also persönlich find ich, ist eine Serife einfacher zu lesen. Ne, also die-- Im Lesefluss ist es einfacher und die Wortbilder erschließen sich halt einem auch, schneller. Ist so der klassische Standard, oder beziehungsweise dieser, der klassische Grundsatz, den halt, den's aus dieser, den, den man im Printbereich kennt, halt dass einfach Serifen halt einfacher zu lesen sind. In der Druckausgabe, ja, das muss man dann halt wirklich, für sich persönlich entscheiden.

Auf meiner Seite, Peter Rotzek, habe ich ja auch bei der Druckversion, mich für eine Serife entschieden und, bei meiner, sage ich jetzt mal, Agenturseite, da ist es, eine serifenlose halt. Also deswegen, ja, man muss es von Fall zu Fall unterscheiden. Wobei ganz klar, geht man, sage ich jetzt mal, von dem Grundsatz aus oder von der Empfehlung her, was man aus, aus der Typografie kennt her, dass eine Serife in, in, auf dem Papier halt, einfacher zu lesen ist.

Also ich-- Auch da muss man entscheiden und auch abwägen.

Ja, hängt wie, hängt wie immer vom Einzelfall ab, würde ich sagen.

Ja, oder halt dann auch natürlich halt dann, wenn man ein Kundenprojekt hat, wenn auch dann der Kunde sagt: „Okay, nee, das, ’ne Serifenlose passt jetzt besser in unsere Corporate Identity rein“, halt solche Geschichten. Das muss man halt alles mit beachten halt und, da natürlich dann auch dementsprechend dann, ja die beste Wahl treffen. Wobei natürlich bei den, bei den Web, Schriften halt die Wahl na ja relativ eingeschränkt ist.

Ja, das stimmt ja leider. Ja, also, man, man kann halt, oder man-- Ich denke, was halt so ein bisschen, im Raum steht, ist, dass natürlich immer auf den Einzelfall zu achten ist, also je nachdem auch, was man ein- und ausblenden will. Was ich zum, was ich ganz spannend finde, ist, der Umgang auch mit, mit Hyperlinks. Da findet man in den unterschiedlichen Artikeln, auch unterschiedliche, Meinungen zu.

Ich find eigentlich, dass man, Dass es durchaus Sinn macht, die zu kennzeichnen, auch in der Druckversion. Ich mein, mir ist schon klar, dass man da nicht draufklicken kann, aber, möglicherweise-- Also mein Ansatz ist generell bei diesem, bei diesem Druck-Style Sheet, den, den, dem Endnutzer noch so viel, Entscheidungsfreiheit mitzugeben wie, wie möglich. Also es stört in der Regel nicht, find ich, dass die, Hyperlinks markiert sind.

Eher könnte ich mir vorstellen, dass wenn jemand zum Beispiel für ´n, für jemanden eine Seite ausdruckt, und er sagt: „Ja, guck mal und da sind überall,...“ Also es ist einfach nett zum Beispiel zu erkennen, dass jeder, jeder, also bestimmte Begriffe zum Beispiel lexikalisch verlinkt sind oder so.

Während umgekehrt der Fall halt sein kann, wenn man dann halt den reinen Text ausgedruckt bekommt, ohne dass man erkennt, wo da noch Hyperlinks sind, dass man dann ja auch in dem Moment, wo man den Text auf dem Papier liest, nicht sieht, dass wenn man auf die Seite geht, an der Stelle vielleicht weitergehende Informationen hinter einem Link si-sitzen. Dementsprechend, du hattest in deinem Artikel, quasi, als Beispiel, angedeutet, es macht Sinn, die, die Links halt eben zu unterstreichen.

Ich mein, ich halte mich eher auch an den Grundsatz, don't mess with underline, also, ne Links generell zu unterstreichen. Das muss natürlich zum Design passen. Aber das macht halt schon Sinn. Also ob man die jetzt, also ich hab die, glaube ich, beim, das weiß ich gar nicht mehr, bei meinem, Style Sheet dann auch farbig gemacht in so ’nem, dunklen, Bordeauxrot, was dann halt, wenn man's schwarz-weiß ausdrücken würde, würde, grau wäre oder so.

Und unterstrichen, das macht, glaube ich, auf jeden Fall Sinn.

Ja. Ja, also da gibt’s ja auch, sagen wir mal, zwei verschiedene oder ja doch zwei verschiedene Sichtweisen kann man schon fast sagen. Also der, der klassische Typograf würde wahrscheinlich sagen, auch wenn's beim Printdokument geht, also auch beim Ausdruck deiner Webseite. Unterstreichen? Nee, geht gar nicht. Also wenn, dann höchstens sozusagen fett oder vielleicht mit einer anderen Farbe hinterlegen.

Aber also, ich sag mal, die gängige Praxis ist eigentlich so meistens so, was ich denn seh, ist, dass auch in dem, in der Druckausgabe halt die, die Links halt mit Underline halt kenntlich gemacht worden sind.

Ja. Also ich würd das auf jeden-- Also das wär so mein Ansatz, den, den ich da auch, begehen würde, aber da muss man wahrscheinlich auch im Einzelfall gucken, wofür man, also was die Zielgruppe, die man anspricht, denn, also wofür sie’s denn ausdrucken wird. Also, ich hatte, in ’nem Vorgespräch schon mal gesagt, also mein Chef zum Beispiel, ich glaube, der wird wahnsinnig werden.

Also was heißt, der würde, er wird jedes Mal wahnsinnig, wenn er was ausdruckt und es nicht genauso aussieht wie auf dem Bildschirm. Also das ist ja tatsächlich und daher auch überhaupt die Initiative, mit Print Style Sheets zu arbeiten, doch in vielen Browsern noch ’ne Katastrophe. Also es gab ja, es gibt jetzt so in moderneren Browsern durchaus gute Ansätze, die dann also auch eine vernünftige Druckausgabe zutage fördern, ohne dass man jetzt explizit mit, Print Style Sheets gearbeitet hat.

Aber eigentlich ist es selbst bei, beim modernen Firefox oder auch im Internet Explorer, sieben oder sogar acht teilweise immer noch ein Witz. Also, je nachdem, wie designt worden ist. Jetzt wollen wir mal gar nicht über so Katastrophal-Designs mit, Layouttabellen und so reden. Also zumindest aus meiner Ansicht katastrophal. Designs oder, oder, oder, Flashseiten oder sonst was.

Aber mein Chef zum Beispiel würde sich wahrscheinlich so eine Funktion im Browser wünschen, die in dem Moment einen Screenshot macht und den dann quasi auf die Seite-- Seitengröße anpasst und das dann ausdruckt, so. Jetzt, also da, da muss man halt wissen, w-was erwarten die Leute wohl bei einer bestimmten Form von, von Seite? Also geht's dann da eher darum, dass sie quasi das Design ausdrucken wollen, um es halt irgendjemandem zu zeigen? Oder geht's mehr um die Inhalte?

Also da wird sicherlich, jemand, der, zum Beispiel ein grafisch betontes Portfolio hat, anders denken als jemand, der halt wissenschaftliche Texte publiziert, so.

Ja. Obwohl ich glaub, die vorherrschende Meinung oder so die, die, die gängige Praxis ist eigentlich, dass, in der Regel gesagt wird, im Vordergrund auch, ja, oder im Vordergrund bei der Druckausgabe steht der Content, also der eigentliche Inhalt und alles andere halt, kann zurücktreten. Klar, ich sag mal, bei, beim, beim Grafiker, der natürlich ein sehr bildlastiges Portfolio hat, der will natürlich, dass natürlich sein, seine Arbeiten im Vordergrund stehen halt.

Aber in dem Fall, würd ich jetzt mal sagen, hat der, der Grafiker, der wahrscheinlich auch, ich sag mal, sein, sein, sein, seine Referenzen als PDF, die er an den Kunden weitergeben kann im, im Notfalles hat. Also so gesehen. Aber wenn, wenn die Bilder jetzt keine überdimensionierte, Größe haben, lassen die sich ja auch recht gut in, in einem Print Style Sheet sozusagen unterbringen halt. Problematisch wird's klar bei Flashseiten halt. Also da ist natürlich, ja, Ausdruck weiß ich nicht.

Ja, also, bleiben wir mal beim Thema generell sieht anders aus als, auf dem Bildschirm. Es gibt ja die Möglichkeit, quasi, Inhalt an, im Druck, im Ausdruck anzuzeigen, den man auf dem Bildschirm nicht sieht, auf vielfältige mög, vielfältigen Wege. Etwas, was man, wovon man immer wieder liest, ist halt CSS generierter Inhalt. Du hattest vorhin schon kurz die Stichworte genannt: Pseudo-Elemente, before, after.

Ja, genau.

Das ist ganz spannend. Du hattest jetzt in deinem Artikel, den, den Hinweis oder das Beispiel gebracht, bezüglich auf Links. Also wir haben ja grade schon über, drüber gesprochen: Zeichne ich Links aus, zeichne ich sie nicht aus.

Genau, ja.

Und hier gibt's halt dann die Möglichkeit, quasi immer nach einem verlinkten Begriff, nach einem, einer verlinkten Phrase, die, Adresse Automatisch anzuhängen. Zum Beispiel in Klammern zu schreiben, http://www.Technikwürze.de oder so. Also dann den quasi den, die, das Ziel des Links quasi hinten anzufügen über dieses Pseudoelement.

Das, kann man dann so-- also das, das, man, man, das läuft halt so, ich sprech für die Leute, die jetzt im Auto sind und den Rechner nicht vor der Tür haben, vorm, vorm Gesicht haben, würde das zum Beispiel bei CSS so aussehen, dass man sagt, A als, also der, der Link-Tag, der A-Tag, dann 'ne, eckige Klammer, in der href, H-R... Wie auch immer, wie spricht man das eigentlich aus? Keine Ahnung. Genau.

Also href Doppelpunkt after, dann kommt die geschweifte Klammer für die CSS-Anweisung und da kommt dann, der, kommt dann Content Doppelpunkt und dann in Anführungsstrichen zum Beispiel attr für Attribut in Klammern, href. So, und das würde halt nach jedem A-Tag, ein-einmal die Adresse, die in dem href steht, darstellen. So.

Das ist natürlich ganz nett, weil man dann quasi im Ausdruck sofort die Adressen der ganzen Links hat, kann bei 'ner Seite, wo sehr viele und vor allen Dingen auch sehr lange Links drin sind, extrem scheiße aussehen. Ist mir dann aufgefallen. Also.

Das sieht dann nicht mehr wirklich so richtig-- Also es, es stört dann auch beim Lesefluss eigentlich. Also sobald, ich sag mal, tatsächlich die URLs, 'ne bestimmte Länge überschreiten, ja, stört das einfach den Lesefluss mal. Man muss dann immer von zum nächsten Wort immer mit dem Auge springen und das macht eigentlich dann die ganze Sache dann auch ein bisschen schon fast unleserlich.

Aber da glaube ich, gibt's, auch keine wirklich gute Lösung, obwohl ich eine Lösung gefunden habe, auf die können wir aber auch noch gleich zu sprechen kommen, wo man, dieses, die Pseudoelemente umgeht, sondern das Ganze halt, also die Druckversion, oder beziehungsweise die Ausgabe der, der, der eigentlichen Hyperlinks, am Ende des Dokumentes stellt und das Ganze mit JavaScript realisiert. Ist 'ne ganz interessante Geschichte, aber können wir im Anschluss, hinten dranhängen.

Genau, gehen wir gleich noch kurz drauf ein. Bei diesen Pseudoelementen, ist nämlich noch zu erwähnen, dass man, noch ein paar andere Möglichkeiten, hat. Also, Beispiele können eben zum Beispiel sein, dass man bei Bildern, die Alt-Attribute auch ausgibt, hinter oder vor dem Bild, je nachdem. Oder dass man, bei Zitaten quasi die Quelle, ausgibt, die, ja auch hoffentlich öfter dabei steht, oder zum Beispiel bei, -

Abkürzungen, Akronymen.

Genau, genau die Abkürzungen oder auch, Title oder so von, von, Elementen, auf die gleiche Art und Weise. Also wie das dann, nachdem jetzt meine, Buchstabierversuche gerade glaube ich tendenziell eher für Gelächter gesorgt haben, bei den Zuhörern, würde ich vorschlagen, ihr schaut dann einfach mal, in Peters Artikel, da ist das ganz schön, aufbereitet.

Das-- eins der Probleme ist dann natürlich, dass dieses, diese Pseudoelemente before und after schlichtweg ein, nicht von allen Browsern unterstützt werden. Also, in allererster Linie, welche Überraschung, ist es natürlich der Internet Explorer, der da, Probleme bereitet und, einige ältere Opera-Versionen auch.

Aber also ich hab das-- es ist ja auch so 'n Ding, also wenn man das generell so gestaltet, dass das quasi, 'n Bonus ist, also dass das trotzdem verständlich bleibt, wie man ja immer bei solchen Sachen arbeiten sollte- -dann ist es halt quasi was, was die Leute mit 'nem normalen Browser halt quasi on top bekommen und alle anderen, nicht wirklich drunter leiden müssen, sondern halt einfach nur 'n bisschen zusätzliche Information fehlt so.

Ja, also im Prinzip geht die, wenn man diese, diese sogenannten Pseudoelemente einsetzt, also leidet die Druckversion darunter nicht, außer wenn die Hyperlinks jetzt superlang sind. An sich, ist es 'ne sinnvolle Bereicherung. Klar, die Leute, die jetzt mit dem Internet Explorer sechs oder sieben unterwegs sind, die gucken einfach in die Röhre. Die sehen dann nur den Unterstrich oder den farbig markierten Link. Aber mittlerweile auch der Internet Explorer acht, der kann das ja.

Also so gesehen hat sich da, Microsoft 'n bisschen angestrengt und, auch das mittlerweile berücksichtigt. Aber na ja, sieben und sechs sind halt immer noch relativ gut verbreitet, sag ich mal. Und, so gesehen, wenn man da für Kundenprojekte arbeitet, wird's dann halt schwierig halt.

Also spätestens dann auch dann teilweise wird's dann vielleicht schwierig, wenn der Auftraggeber die Seite sich, selber mal anschaut und sich zum Beispiel einfach mit dem Firefox mal guckt und dann anschließend mit dem Internet Explorer und dann sagt irgendwie: „Moment mal, aber das sieht ja jetzt wieder völlig anders aus.“ Da muss man dann natürlich schon, sag ich mal, im Vorfeld auch den Kunden dann dementsprechend briefen und sagen, : „Internet Explorer wird nicht funktionieren, zumindestens nicht mit, über Pseudoelemente.“ Ist im Prinzip dann eigentlich für moderne gute Browser eigentlich nur gedacht und, 'ne zusätzliche Sache, aber, Druckversion ist auf jeden Fall lesbar und funktioniert noch und, leidet auch nicht darunter, sondern es ist einfach 'ne, ja, 'ne zusätzliche Information, die, nicht verlorenge, gegangen ist dann in der, in der Druckversion.

Genau, also, was dann noch, bevor wir jetzt gleich noch so zwei, drei Alternativen eingehen, was man noch kurz ansprechen sollte, sind, CSS-Regeln, Anweisungen, die, - Noch weniger unterstützt werden. Also, das, was ich eigentlich ganz schade finde, weil da gibt’s eigentlich ganz schöne, Möglichkeiten. Das ist unter anderem Add Page, womit man quasi so ’n bisschen das Seitenlayout definieren kann von der Druckseite.

Also da gibt’s dann so Elemente drin wie, Size, wo man, die Seitengröße, definieren kann und auch sehr spannend, quasi sagen kann, ich möchte standardmäßig, im Querformat ausgedruckt werden. Das heißt also, wenn ich die Print-, Funktion des Browsers benutze, dann dreht der automatisch die Seite und packt das da drauf. Kann natürlich sehr viel Sinn machen. Es, dazu gehört auch Schnittmarken ausdrucken zu können oder linke und rechte Seiten definieren.

Also dass man halt sagt, wenn man ’nen langen Text hat, ich, ich definiere linke und rechte Seiten. Das ist schon so ’n bisschen Spielerei, weil wer druckt, also wer bereitet jetzt ’n Buch so auf? Das, passiert ja nicht viel. Aber spannend ist und das hat mich doch sehr gewundert: Es gibt, eine CSS, ist das dann Regel oder Anweisung? Ich bin überfragt. Sehr peinlich. Egal. Auf jeden Fall Page Break Before heißt das Ganze. Und, Page Break Before oder Page Break After.

Und die wird wahnsinnigerweise sogar schon vom Internet Explorer 4 unterstützt. Also, man, man wundert sich, aber da gibt’s halt tatsächlich die Möglichkeit, wenn man jetzt zum Beispiel, ’ner Überschrift erster Ordnung, also H1 zum Beispiel, die Regel mitgibt,, Page Break before und dazu dann quasi, Always, sagt, dann würde halt quasi immer, die, Überschrift erster Ordnung eine neue Ausdrucksseite, starten. Man kann genauso das andersrum machen mit Page Break After.

Also dass man zum Beispiel irgendwie so was sagt wie immer nach einem Zitet, immer nach einem Zitat soll ’ne neue Seite beginnen oder solche Sachen. Das fand ich ganz spannend. Habe ich jetzt noch nicht ausführlich testen können, weil ist mir auch erst heute untergekommen. Aber macht zumindest, wenn man tatsächlich wirklich mal längere Seiten druckt, Sinn. Es gibt dann auch noch, Orphans und, Windows, die, Schusterjungen oder respektive Hurenkinder verhindern sollen.

Aber ähnlich wie diese Page-Anweisung funktioniert das eigentlich nur im Opera und da auch nur, total buggy. Also dementsprechend kann man sich das eher knicken im Moment.

Also die, also die Sachen kann man wirklich, also leider, leider, nicht anwenden, obwohl’s wirklich, wie du schon sagst, sehr spannende, Eigenschaften sind, mit denen man mit Sicherheit so ’ne Druckversion auch, ja noch ganz schön aufpeppen könnte, aber nu ja, müssen wir wahrscheinlich noch ’n bisschen warten, bis das irgendwann mal unterstützt wird. 2000 ich weiß nicht was.

Genau, im Internet Explorer 12 wahrscheinlich, ne? Ja, du hattest grade, Alternativen angesprochen. Also, ich bin jetzt ganz gespannt auf, die Geschichte mit den Angaben als, als Endnoten quasi. Erzähl mal.

Ja. Ja, also ich hab wie gesagt ’n bisschen rumgegoogelt und bin dann bei A List Apart fündig geworden und der Artikel heißt Improving Link Display for Print. Und, der Gedanke ist eigentlich, dahinter, man kennt das ja zum Beispiel von Büchern her oder Magazinen, dass, die, Quellverweise bei Magazinartikeln zum Beispiel am Ende sind, bei Büchern ist es entweder am Ende des Kapitels oder unten auf der Seite oder dann es gibt noch extra dann ich sag mal einen eigenen Quellverweis.

Und, diese Grundidee hat man versucht halt, oder nicht nur versucht, sondern baut das Ganze mit JavaScript nach im Prinzip halt. Das heißt, die, Links im Text werden mit ’ner Fußnote versehen und am Ende des Dokuments werden dann die, die eigentlichen Hyperlinks in ’ner geordneten Liste aufgeführt. So, das hat natürlich den Vorteil, selbst bei längeren, URLs leidet der Fließtext nicht darunter. Und, das Ganze sieht dann, recht, recht ansehnlich aus.

Also ich fand’s, so von der Idee her und von der Umsetzung, recht spannend und ich denke mal, das kann man mit Sicherheit auch für den produktiven Einsatz gut nutzen. Einziger Nachteil ist natürlich, wenn JavaScript deaktiviert ist, funktioniert das Ganze nicht mehr. Und, das Ganze funktioniert aber dafür im Internet Explorer 6.

Also so gesehen, wenn man diese Pseudoelemente nicht verwenden will oder kann oder möchte, kann man immer auf diese JavaScript-Variante zurückgreifen und auch sicher sein, dass, selbst der Internet Explorer 6 damit noch umgehen kann und, die Hyperlinks gehen halt nicht verloren.

Das, ist auf jeden Fall ’n spannendes, also tatsächlich ’n spannendes, ’n spannender Ansatz. Lass mich kurz fragen, ohne den Artikel jetzt gelesen zu haben. Also das heißt, pas-- also erfordert das irgendwie ’n Administrationsaufwand? Oder ist es halt so, dass das Ding wirklich von alleine die Links durchgeht? Oder, kann man irgendwie, also und die dann durchnummeriert?

Oder muss man jeden einzelnen Link markieren und hat man die Möglichkeit, quasi zu sagen, ich möchte all, ich möchte aber nur Links berücksichtigen, die hier im, ich sag jetzt mal Bereich, im Container Content sind oder so? Weil sonst wird ja auf einmal vielleicht, wenn man jetzt die Navigation noch einbeziehen würde bei dem Print-Style Sheet, würde die ja auch mit, durchnummeriert. Ist das-

Also ich hab den Artikel jetzt auch leider nur überflogen, weil der mir auch heute Morgen erst unter die Finger gekommen ist. Und, ah, wenn ich das jetzt richtig in Erinnerung hab, werden, bezieht sich das hauptsächlich, also man kann es schon so aussteuern, dass oft tatsächlich nur die Links, also im eigentlichen Content-Bereich halt auch berücksichtigt werden. Also das, das wird aufgeteilt so v-von, von dem Skript her in sogenannte Container-IDs.

Das sind dann halt die Links, die die Fußnote bekommen und die sogenannten Target-IDs, das sind dann im Prinzip, die, die URLs, die am Ende in dieser geordneten Liste auftauchen halt. Also es ist, so f- Man braucht auch keinen, ich glaub, das Script ist auch so weit, gebaut, dass es, relativ schnell ohne große Eingriffe auch verwendet werden kann. Also ich hab's selber noch nicht ausprobiert.

Ich wollte das demnächst auch mal machen halt, mal einfach mal ausprobieren, vielleicht auch mal bei einer eigenen Seite. Und, aber ich fand's wie gesagt so v-vom, vom Gedanken her, vom Aufbau her, dass man das einfach trennt, und so mit dem Fließtext so auch dann, in seiner, im Lesefluss erhalten kann, schon 'ne recht gute Idee.

Gerade wenn's, ich sag mal, um, um Seiten geht, die sehr textlastig sind und wo dann vielleicht auch viele, Links sind, die auf, auf andere Seiten referenzieren oder jetzt auch noch mal auf Erklärungen bei Wikipedia und solche Geschichten. Und da kann's ja schon mal sein, dass man da wirklich dann, innerhalb von ein oder zwei, drei Absätzen dann schon mal, ich sag mal, vielleicht fünf oder sechs, sieben, acht Links hat.

Und das sieht dann schon 'n bisschen wirr aus und so wär das 'ne wirklich intelligente und auch 'ne, 'ne schöne Lösung, halt das einfach optisch zu trennen, aber dennoch die Information zu erhalten.

Ja, ja, also wie gesagt, klingt auf jeden Fall sehr Jetzt höre ich mich gerade mal sehr viel selbst. Ah, jetzt, jetzt geht's wieder. Klingt auf jeden Fall sehr spannend. Die, 'ne andere Alternative, die man da hätte, da können wir auch noch mal kurz drüber diskutieren, wäre ja, quasi Elemente auf der Seite für die unterschiedlichen Medientypen aus- oder einzublenden.

Das heißt also nicht, die jetzt, explizit mit After oder Before einzufügen, denn dabei kann man jetzt nicht mit ganz kom-- also nicht mit größeren komplexen Strukturen arbeiten. Also ich hatte zum Beispiel bei mir so die Überlegung, da haben wir vorhin schon mal kurz drüber gesprochen, Copyright, Hinweise in der, im, im Footer oder so.

Ich wollte ganz gerne, irgendwie am Ende jeder Seite einen Kasten einfügen, der halt so sagt, diese Seite ist halt, von, also dieser, dieser, diese Inhalte sind von folgender Seite. Da sollte dann die Adresse quasi, also die, die, die URL zu der Seite sein, weil, zwar wird die ja normalerweise automatisch mit auf die, mit auf die, in den Header der Druckausgabe reingedruckt vom Browser.

Mir war aber wichtig, dass die jetzt quasi, wenn auch wenn das unterdrückt wird, das kann man ja abschalten, quasi, trotzdem mit irgendwo auf, in, in der Seite zu finden ist mit in dem Ausdruck. Und gleichzeitig wollte ich halt noch so, Informationen, mit reinpacken, also quasi so 'n kleinen, About this page oder, also über diese Seite und über diesen Inhalt, Kasten dazufügen.

Das ging halt letztendlich nicht mit den Before, Anweisungen, weil dann also mit verschachtelten HTML-Tags oder so, das ging nicht. Und jetzt, habe ich mir kurz überlegt, ob's, Sinn macht, quasi, unten einen Standardkasten drunter zu machen, wo ich dann ja auch schön mit PHP arbeiten kann, um dann irgendwie Adressen oder so reinzufügen oder irgendwelche anderen Sachen und, diesen dann in, in dem Screen Stylesheet quasi mit Display none auszubil, auszublenden und im Print, dann halt einzublenden.

Hab mich zwar im Endeffekt dagegen entschieden, weil ich einfach irgendwie mir das Markup jetzt nicht fürs Screen verhauen wollte, für diese Printgeschichte und hab mich dann halt entschieden, wirklich nur unten hinzuschreiben mit diesem, After, mit dem After Element, irgendwie, also dieses kommt von der und der Seite und dann über PHP im Stylesheet, also total um Dreiecken, dann halt da die Adresse einzufügen.

Aber was hältst, was hältst du davon, wenn man halt tatsächlich, Inhalte, über die Mediatypen dann, kenntlich macht oder eben ausblendet?

Also ich hab's zum Beispiel ja bei meiner eigenen Seite, da hab ich ja, in der Druckversion, also wenn man die Seite ausdrucken will, ganz oben steht ja make it simple and stupid CSS mit optimierter Druckversion. Das ist ja auch im Prinzip so, so 'ne Geschichte, die halt, mit, After entstanden ist. Da hab ich dann einfach, in, in der Druckstylesheet, in den Druckstyle Sheets reingeschrieben, dass halt dieser Satz in, in der Druckversion erscheinen soll.

Das kann man natürlich auch jetzt mit einem Copyright-Hinweis verbinden. Also man kann dann anstatt irgendwie diesen, diesen make it simple and stupid Satz da reinschreiben, irgendwie Copyright, Firma XY oder so oder auch dann, irgendwas anderes noch reinschreiben.

Man muss halt immer nur ran, dran denken halt, dass es klar Internet Explorer sechs oder sieben können damit nicht umgehen, die können's nicht anzeigen und alles andere, ja, das sind dann schon wie gesagt solche Geschichten, wo man dann halt auch das, das Markup wieder belasten muss. Man blendet das aus mit, entweder mit Display none oder man schiebt es aus dem sichtbaren Bereich raus. Was-- Aber das sind alles so, sagen wir mal, so, so Behelfslösungen dann mehr oder weniger halt.

Deswegen, tendiere ich da eigentlich dazu, wenn, Informationen im, im Footer vorhanden sind, die auch, in der Druckversion mit reingehören oder mit reingehören sollten, sollte man die auch mit reinnehmen und dann den Footer dann halt nicht ausblenden. Schwierig. Es kommt ja natürlich immer drauf, es kommt natürlich immer drauf an, wie der Footer jetzt halt im Markup aufgebaut ist.

Wenn da jetzt zum Beispiel, was man von vielen englischen Seiten ja auch kennt, dass mittlerweile im Footer ja auch so 'ne kleine Sitemap mit reingebaut wird. Also das war ja zum Beispiel letztens bei einem Kundenprojekt für eine Agentur. Da kam in den Footer noch zusätzlich halt die Sitemap noch mal mit rein. Da wird's natürlich schon schwierig halt. Da kann man, schon die Sitemap ausblenden, aber den Copyright-Hinweis wieder, wieder reinholen und solche Geschichten.

Also da fängt man schon an, so 'n bisschen an zu, zu hantieren und, schon 'n bisschen vielleicht auch zu zaubern, aber, ja, wenn man das natürlich, ich sag mal, sauber machen will, ohne jetzt zusätzliches Markup zu belasten. Dann, bleibt eigentlich diese, diese, die Pseudoelemente eigentlich nur noch übrig und man muss dann da halt auch einfach den Weg gehen und sagen: „Okay, kann der Internet Explorer sechs oder sieben nicht."

Ja, also ich-- vor allen Dingen, wenn man sich mal, du hast ja ein paar Beispiele zusammengetragen. Ich habe da auch noch zwei, drei, die packen wir dann natürlich mit in die, in die Show Notes rein. Wenn man sich dann mal die Beispiele anguckt und bedenkt, wie, wie, wie es sonst so aussieht, dann, ist da schon also wirklich, einiges erreichbar, was beeindruckt, sage ich mal so.

Also das heißt, dafür, dass man sich dann halt, verhältnismäßig wenig Mühe geben muss und man muss ja jetzt auch nicht für jeden Artikel dieses Ding neu anpassen. Das heißt, man steckt da einmal ein bisschen Arbeit rein und dann ist es halt eigentlich gut. Dann, da geht schon was. Also man muss es jetzt tatsächlich wahrscheinlich nicht überkomplizieren.

Passt.

Aber apropos überkomplizieren und wenig Arbeit reinstecken- Das wäre jetzt so mein letzter Punkt auf der Liste. Ich weiß nicht, ob ich da völlig v-verpeilt, drangegangen bin, als ich mich drum gekümmert habe oder ob du eine wesentlich bessere Lösung hast, aber ich bin ja, mir ist das so auf den Quark gegangen, das zu testen.

Also, wenn man dann halt anfängt und, doch noch, noch ein bisschen ein paar kleine Feinheiten irgendwie, schöner gestalten will oder ein paar kleine Gags einbaut, so dass man halt sagt, ich möchte da... Also ich habe zum Beispiel auf meiner Seite das Logo dann so ein bisschen kleiner gemacht und da halt irgendwie oben mit in die Seite positioniert und so.

Ich, du musst, also ich habe dann halt jedes Mal quasi im Browser das neu laden müssen und dann immer wieder, ich bin dann immer wieder auf Print Preview gegangen- -und habe mir das halt angeguckt. Das war ultra nervig.

Ja, das, das, das stimmt. Also wenn man, ich sage mal, anfängt, wenn man mit den beschränkten Mitteln, die wir sozusagen haben und, es ist ja nun mal beschränkte Mittel, also viel kann man da nicht machen halt. Also man kann natürlich versuchen, das Beste rauszuholen, aber wenn man da wirklich anfangen will, so ein bisschen zu zaubern, ja, muss man auch schon wieder anfangen, dann halt das auch in den verschiedenen Browsern halt einfach sich mal testweise anzugucken.

Das, das ist wohl wahr, das ist richtig halt. Also da kommt man, da kommt man dann wirklich nicht drumherum. Wenn man das einfach nur, sage ich mal, linear aufbaut von oben nach unten runter, dann ist es relativ einfach halt. Wobei dieses einfach, das ist immer so, ich habe es zwar auch in meinem ei-Artikel reingeschrieben, dass es eigentlich, relativ einfach ist und jetzt nicht mit einem wirklich super großen Zeitaufwand verbunden ist.

Es wird natürlich schon ein bisschen, muss ich auch zugeben, komplexer und auch umfangreicher, wenn man, an großen Seiten arbeitet. Da muss man natürlich dann schon mal auch, dann verschiedene Seiten ausprobieren.

Dann hat man halt nicht nur die Startseite und dann vielleicht eine Content-Seite, die aussieht wie alle anderen, sondern hat man vielleicht, weiß ich nicht, drei, vier, fünf, sechs oder acht sogar verschiedene Inhaltsseiten, die auch unterschiedlich aussehen und, die sollten natürlich halt dann auch in, in der Druckversion halt dann natürlich auch, gut rüberkommen und auch optimal sein. Und da muss man dann natürlich schon, ein bisschen Zeitaufwand, investieren.

Aber ich sage mal, wenn man, eh es gewohnt ist, ich sage mal, mit, mit gewissen Standards zu arbeiten und, ich sage mal, seine IDs immer einheitlich zu benennen, hat man da natürlich, ja, ich will jetzt nicht sagen Mini Framework, aber man, kann da schon sich das Leben einfacher machen, weil man dann hat einfach auch dann teilweise irgendwelche CSS, Snippletschen, die man auch immer wieder verwenden kann, die man dann dementsprechend vielleicht noch mal ein bisschen anpassen muss.

Aber, so gesehen, wenn man hier mit Standards arbeitet, kann man sich das Leben dann auch in diesem Bereich auch wieder deutlich einfacher machen und deswegen, Standards, zu benutzen, einzusetzen und, da auch einheitliche Standards zu fahren, lohnt eigentlich immer und sollte man auch grundsätzlich machen, egal ob man jetzt seine eigene Seite baut oder ob man jetzt in der Agentur arbeitet, ob man jetzt freiberuflich unterwegs ist, wie auch immer, macht das Leben einfach deutlich einfacher.

Ja. Gut, hast du noch irgendwelche Anmerkungen?

Ja, ich hab dann auch, einfach mal geschaut, so ein paar Beispiele halt, die man so im Netz finden kann zu diesem Thema halt, wo die Druckversion ja vielleicht so okay umgesetzt worden ist oder aus, aus meiner Sicht dann vielleicht auch ganz gut. Also List apart zum Beispiel hat, finde ich, eine ganz, gute Druckversion, die ist recht gut gelo-gelungen halt. Das Webstandard-Magazin habe ich mir dann auch rausgenommen, weil das ja momentan wirklich in aller Munde ist und, überall auch erscheint.

Im Windo-- Windows Browser allerdings fand ich sie ein bisschen zu klein. Nee, umgekehrt, Quatsch, nee. Im Mac OS, da war sie für meine Verhältnisse irgendwie ein bisschen zu klein und im, im Windows Browser okay. Und dann habe ich mir natürlich noch hier die aktuellen Bienepreisträger aus dem Jahr 2008, rausgezogen. Da ist einmal der Hauptbahnhof Wien benutzt als Basis, für das gesamte CSS YAML. Ich finde allerdings und es, ich-- Was heißt finde?

Also ich kann nicht verstehen, warum man bei der, bei der Printausgabe, bei den Print Stylesheets, die, die Breite der, des, druckbaren Bereichs, mit 580 Pixel festgesetzt hat und das Ganze dann noch mit Important festbetoniert hat. Und dann noch mal 'ne, 'ne Mindestbreite angegeben hat von 400 Pixel und die dann auch noch mal mit Important sozusagen einbetoniert hat. Also das kann ich nicht verstehen.

Also man nutzt den, den, den Platz, den man eigentlich in so einer Druckversion hat, nicht ganz aus und, sieht auch alles ein bisschen klein aus und man hat auch weder Schriftgröße jetzt in der Druckversion, definiert, und solche Geschichten. Also man hat ja im Prinzip eigentlich nur das Layout definiert und die Breite. Merkwürdig. Also kann ich nicht wirklich nachvollziehen, was man sich dabei gedacht hat. Fand ich jetzt nicht so wirklich gelungen.

Darmkrebs, zum Beispiel auch als Basis YAML, - Hat eine ganz ordentliche Druckversion, ist wirklich gebrauchbar halt. Und gelungen, find ich, ist die Gemeinde Schönefeld. Die hat also wirklich eine sehr schöne Druckversion und hier wurde auch tatsächlich, sage ich mal, so, Punkte auch berücksichtigt, die ich auch in meinem Artikel halt auch, aufgeführt hab, wie zum Beispiel, dass man halt die Schriftgröße nicht in Pixel angeben soll, sondern in Punkt und solche Geschichten.

Abstände besser in, in, in Millimeter oder Zentimeter anzugeben, als, das Ganze auch in Pixel zu definieren und solche Geschichten. Und die ist wirklich also f-für meinen Geschmack, gelungen. Sieht anständig aus, kann man gut ausdrucken und ist wirklich, gut umgesetzt worden. Was mich allerdings total umgehauen hat, ist, dass hier diese Seite Five Simple Steps, wo man ja auch dieses kleine Büchlein bestellen kann, eine Druckversion hat. Eigentlich hat sie überhaupt keine Druckversion.

Das ist irgendwie alles ein bisschen, bisschen -- Es sieht irgendwie ein bisschen merkwürdig aus. Also ich glaube, da muss der liebe Herr Bolton noch mal ran, sag ich jetzt mal. Also da war ich ein bisschen sozusagen, schockiert halt. Zumal ich das Buch, jetzt als PDF mittlerweile gelesen hab, und ich, das ganz gut fand und aber bei der Druckversion hat er wahrscheinlich irgendwie aufgehört. Weiß ich. Keiner oder hat keine Lust mehr gehabt oder ich weiß nicht.

Ja, wahrscheinlich war es einfach schwierig genug, das Buch zu drucken, aber

Wahrscheinlich hat er gesagt: „Nee, komm, jetzt auch noch Printversion fürs Internet. Ey, lasst mich alle in Ruhe."

Die Leute sollen ja auch das Buch kaufen. Das ist-

Genau, richtig. Die Leute sollen das Buch kaufen und nicht die Druck-- die Webseite ausdrucken. Ja. Ja, genau. So gesehen halt, ja, waren das so wie gesagt ein paar Beispiele, die ich mir so rausgesucht hab und wirklich hervorgestochen ist, das ist halt diese Gemeinde Schönefeld und, woher dann mich so ein bisschen überrascht war, aber Five Simple Steps halt.

Also da kann man mal sehen, halt wie unterschiedlich auch wenn man mit einem Framework arbeitet wie YAML, wie unterschiedlich Druckversionen ausfallen können. Also gerade Hauptbahnhof Wien, warum die das wie gesagt mit fünfhundert Pixel Breite festbetoniert haben. I know. Keine Ahnung. Weiß ich nicht. Also find ich irgendwie sinnlos.

Macht auch keinen Sinn, weil, man verschenkt einfach gut irgendwie ein Drittel vom Platz, den man, hat und den man auch gut nutzen kann und die Schrift wirkt dadurch auch ziemlich klein schon. Und, na ja, okay.

Ja, ich würd, ich würde fast sagen, dann, müssen wir die Hörer mit diesem Rätsel, quasi in, in, die Woche entlassen. Vielleicht findet sich ja, der eine oder andere, der, des Rätsels Lösung weiß. Weißt du, wer die Seite gemacht hat? Also weißt du, wo, wo, wo die herkommt?

Hauptbahnhof Wien, ist Österreich. Nee, keine Ahnung. Ich hab jetzt nicht ins, ich hab jetzt nicht in den, ins Impressum reingeschaut. Nee, leider nicht. Nein.

Ah, okay.

Ich hab nur die Druckversion angeguckt.

Und da stand's nicht drin, ja. Ich, würde einfach mal sagen, wenn jemand weiß, wer's gemacht hat, frage er mal nach. Also, keine Ahnung. Wir werden die Beispiele auf jeden Fall verlinken in den Shownotes und dann könnt ihr selber noch mal reingucken und, seht mal, wie, wie die Unterschiede so aussehen und was man halt tatsächlich mit den einzelnen Lösungen machen kann. Die Artikel, die wir erwähnt haben, werden wir natürlich auch verlinken.

Ja, falls ihr noch Anmerkungen habt, irgendwelche Best-Practice-Beispiele oder halt, nette Techniken, wie man das Ganze angehen kann, dann, wie immer Kommentare gerne gesehen. Und ansonsten, bedanken wir uns fürs Zuhören und, freuen uns, euch bei der nächsten Sendung wieder begrüßen zu dürfen.

Jo, danke schön.

Mehr Qualität im Webdesign durch Webstandards. Tipps und Tricks zur Umsetzung findet ihr bei den Webkrauts auf Webkrauts.de. Für ein besseres Web.

Weitere Informationen und die Links zur Sendung auf technikwürze.de.