/ XML User Group Berlin (#XUGBER) Christin Sandmann-Götz

Transkript

1 Satz-Automation aus XML PrintCSS Möglichkeiten und Grenzen / XML User Group Berlin (#XUGBER) Christin Sandmann-Götz

2 Christin Sandmann-Götz Studium: Buch- und Medienproduktion (B. Eng., HTWK Leipzig) Medienmanagement (M. Eng., HTWK Leipzig) Schwerpunkt: Electronic und Cross Media Publishing pagina GmbH: Content Engineer / XML-Entwickler XSL-Entwicklung (XML, XSLT and XSD) CSS-Entwicklung (CSS Paged Media/PrintCSS)

3 Varianten der automatisierten Print-(PDF-)Erstellung XML + Satzsystem: Automatisierte Verarbeitung von XML-Daten in InDesign, 3B2, Miles Oasys Programmierkenntnisse notwendig Teilweise mit WYSIWYG-Layoutmodus XSL-FO: Seitenbeschreibungssprache in komplexer XML-Syntax Wird nicht mehr offiziell weiterentwickelt Datentransformation zwingend notwendig»the answer is probably to invest in CSS, not XSL-FO, these days«liam QUIN, W3C HTML/XML + CSS: Sprache des Web, einfacher in der Anwendung Viele Anwender beherrschen bereits HTML und CSS Idealfall: Keine Datentransformation notwendig»3 mal so schnell wie XSL-FO«[Lernkurve & Layouterstellung] NELLIE MCKESSON, O Reilly

4 Varianten der automatisierten Print-(PDF-)Erstellung Warum CSS an Stelle von XSL-FO für die Print- (PDF-)Erstellung? CSS ist offizieller W3C-Nachfolger des XSL-FO-Standards für seitenbasiertes Rendering aus XML-Daten W3C positioniert CSS als universelle, crossmediale Layoutsprache für strukturierte Daten»one language to rule them all«css = Sprache des Web (einfache Syntax, einfach in der Anwendung, viele Entwickler die CSS beherrschen, ) Lässt sich meist nahtlos in Verlagsworkflows integrieren Warum also nicht auch für PDF s?!

5 PrintCSS in der Praxis Was braucht man? HTML oder XML als Datenbasis CSS als Layoutsprache Renderer zur Erstellung der PDF-Binärdatei

6 CSS-Renderer Übersicht (ernstzunehmender) CSS-Renderer Prince XML (XML+HTML) Website Kosten: ab $495 Beispiele Antenna House (XML+HTML) Website Kosten: ab $1, Beispiele PDFreactor (HTML only) Website Kosten: ab $2, Beispiele Callas pdfchip (HTML only) Kosten: ab Website Vivliostyle (HTML only) Website Beispiele Kostenlos für Einsatz im Browser Kostenpflichtige Commandline-Version

7 PrintCSS Die Spezifikation CSS Paged Media Module Paged Media Module Level 3 Working Draft Editor s Draft (Stand: ) (Stand ) Generated Content for Paged Media Module Working Draft Editor s Draft (Stand: ) (Stand ) Fragmentation Module Level 3 Candidate Recommendation Editor s Draft (Stand ) (Stand: )

8 PrintCSS Was ist möglich? (1/7) Seitenformatierung {size: breite hoehe;} Satzspiegel und { margin: kopfsteg bund-/außensteg fußsteg; { margin-right: bundsteg; margin-left: außensteg; { margin-right: außensteg; margin-left: bundsteg; }

9 PrintCSS Was ist möglich? (2/7) Seitenformatierung Musterseiten teil { size: breite hoehe; margin: kopfsteg bund-/außensteg fußsteg;... } Zuweisung über page: kapitel { page: teil;... }

10 PrintCSS Was ist möglich? (3/7) Seitenformatierung teil:left {... {... } } Seitenzahlen content: counter(page); Kolumnentitel /*Initialisieren*/ string-set: kolumne content(); /*Ausgeben*/ content: string(kolumne);

11 PrintCSS Was ist möglich? (4/7) Fußnoten Fußnote positionieren fussnote {float: footnote;} Seitenbereich für {...} } Fußnotenzähler und -marker ::footnote-call { content: counter(footnote); font-variant-position: super; } ::footnote-marker { content: counter(footnote); }

12 PrintCSS Was ist möglich? (5/7) Querverweise XML Text <verweis intern="#kap4-4"/> CSS verweis { content: '(siehe Kapitel»', /* Inhaltsverweis */ target-text( attr(intern), content() ) '«, S. ' /* Seitenverweis */ target-counter( attr(intern), page ) ')'; } Ergebnis Text (siehe Kapitel»Querverweise«, S. 85)

13 PrintCSS Was ist möglich? (6/7) Umbrüche Seitenumbruch kapitel {page-break-before: always;} abbildung {page-break-inside: avoid;} kapitel:first-of-type {page-break-before: right;} Hurenkinder und Schusterjungen abs { widows: 2; orphans: 2; } Silbentrennung abs { hyphenate-lines: 3; hyphenate-before: 2; hyphenate-after: 4; }

14 PrintCSS Was ist möglich? (7/7) Druck-Spezifika CMYK-Farben color: device-cmyk(0%, 75%, 100%, 0%); Auflösung von Abbildungen abbildung { image-resolution: 300dpi; }

15 PrintCSS Was ist möglich? und vieles mehr

16 PrintCSS in der Praxis Was braucht man (optimalerweise) noch? CSS-Präprozessor (z. B. Less, Sass, )

17 Exkurs und Demo Less-CSS Less ist eine dynamische Stylesheet-Sprache, die die Fähigkeiten von CSS mit Variablen, Mixins, Operationen und Funktionen erweitert. Somit ist u. a. die Vermeidung von Code- Wiederholungen möglich, das CSS strukturierter sowie die Pflege und Anpassung des Codes einfacher Durch die Nutzung von Less ist das Schrieben von CSS effizienter. Da Less eine Obermenge von CSS ist, ist CSS-Code gleichzeitig auch gültiger Less-Code. I Z. Weniger ist mehr: So optimierst du mit LESS deinen CSS-Workflow Weblinks: lesscss.org lesscss.de

18 Showcase»Droemer Knaur«Projektbeschreibung Anforderung: kostengünstige, automatisierte PDF s von E-Book-Only-Titeln Ausgangsdaten: auskorrigiertes parsx-xml der E-Book-Produktion Lösung: PrintCSS-Rendering mit Antenna House in parsx Aufwand: 3 AT für 4 Reihenlayouts (CSS) und eine XSLT- Tranformation (für Inhaltsverzeichnisse und Kolumnentitel) Ergebnis: ca. 152 PoD-Titel von Herbst 15 Frühjahr 18 mit PrintCSS produziert

19 Showcase»Droemer Knaur«Demo Droemer Knaur-PoD-Titel

20 Showcase»Droemer Knaur«Projektbeschreibung Bewusste Entscheidung gegen XSL-FO Endprodukt misst sich bewusst nicht an InDesign-Satz Kompromisslösung was Detailtypografie betrifft, aber kein fauler Kompromiss

21 Showcase»Droemer Knaur«Vorteile für den Verlag Initialkosten schnell amortisiert, sehr geringe laufende Produktionskosten Kann mit Selfpublishing-Plattformen mithalten, bleibt dadurch für junge Autoren attraktiv Herstellung mit CSS-KnowHow kann eigene Reihenlayouts erstellen oder bestehende erweitern Kann schnell neue (Produkt-)ideen testen z. B. PoD-Titel als Großdruck z. B. Lektoratsausdruck

22 Showcase»Droemer Knaur«parsX-Demo Großdruck

23 Showcase»Droemer Knaur«parsX-Demo Lektoratsausdruck

24 Showcase»Narr Verlag«Projektbeschreibung Anforderung: automatisierte PDF s (Druck- und E-PDF) von Dissertationen Ausgangsdaten: konvertiertes und auskorrigiertes Word-Daten Lösung: PrintCSS-Rendering mit Antenna House in parsx parsx-xml aus Umsetzung: zurzeit 8 Reihenlayouts (CSS) und XSLT-Tranformationen (u. a. für Inhaltsverzeichnisse, Kolumnentitel, Tabellen- und Abbildungsverzeichnis)

25 Showcase»Narr Verlag«Demo Narr ConfigSetting»modern«

26 Showcase»Narr Verlag«Demo Narr ConfigSetting»klassisch«

27 Showcase»Narr Verlag«Demo Narr ConfigSetting»Sammelband/modern«

28 Showcase»Bund Verlag«Projektbeschreibung Anforderung: Automatisierte Satzvorschau im MAM-Systems Ausgangsdaten: XML-Daten Lösung: PrintCSS-Rendering mit Antenna House aus sitefusion Umsetzung: 5 Reihenlayouts (CSS) und XSLT-Tranformationen (u. a. für verschiedene Inhaltsverzeichnisse, Kolumnentitel und Kustode, Zähler)

29 Showcase»Bund Verlag«Demo Bund BetrVG

30 Showcase»S. Fischer Verlag«Projektbeschreibung Anforderung: Rendering von PDF-Füllanzeigen für Printtitel aus normalen XML-Daten für E-Book/Print mit PrinceXML Ausgangsdaten: parsx-xml Lösung: PrintCSS-Rendering mit PrinceXML in parsx Aufwand: 1 AT Ergebnis: Start der Produktion im Jan 2018

31 Showcase»S. Fischer Verlag«Demo Fischer-Anzeigensatz Zarah und Zottel

32 Showcase»IUBH«Projektbeschreibung Anforderung: vollautomatische Produktion aus einem Redaktionssystem mit medienneutraler Datenhaltung der Lerninhalte für Zweitverwertung in App, Moodle, etc. Ausgangsdaten: XML-Daten nach IUBH-Schema Lösung: PrintCSS-Rendering mit AntennaHouse aus Redaktionssystem Aufwand: 10 AT

33 Showcase»IUBH«Demo IUBH Studienskript

34 PrintCSS in der Praxis PIs zur Umbruchsteuerung Vollautomatischer Satz? Ja gerne, aber Eigenentwicklung im parsx-framework: PrintCSS-PI s Processing Instructions zum manuellen Eingriff in das Satzbild Basiert auf einer Kombination aus XSLT und CSS

35 PrintCSS in der Praxis PIs zur Umbruchsteuerung Satzbefehl Umbruch auf neue Seite Umbruch auf neue rechte Seite Umbruch auf neue linke Seite Umbruch in neue Spalte Zeilenwechsel Zeilenwechsel mit Trennstrich Zeilenwechsel, austreibend Zeilenwechsel, austreibend, mit Trennstrich Trennfuge Trennverbot Leerzeile Halbe Leerzeile PI <?printcss ns?> <?printcss nsr?> <?printcss nsl?> <?printcss nsp?> <?printcss nz?> <?printcss nz-?> <?printcss nza?> <?printcss nza-?> <?printcss tf?> <?printcss tv?> <?printcss lz?> <?printcss lzh?>

36 PrintCSS in der Praxis PIs zur Umbruchsteuerung <abs>... gelber Post-it-Zettel um meine Aufmerksamkeit.<?printcss nza?> Auf dem einen stand»kaffee ist aus«...</abs>... <abs>»die kleinen Freuden des Alltags«, murmelte ich und <?printcss tv?>machte mich daran [...]<

37 Grenzen und Potenzial (1/2) Grenzen (Noch) kein WYSIWYG-Editor vorhanden Bildplatzierung teilweise schwierig Debugging nur durch erneutes Rendering Teilweise immernoch XSLT- oder JavaScript-Eingriffe notwendig Generierte Inhalte (Index, Inhaltsverzeichnis, etc.) Typographische Feinjustierung Bildworkflow und Color Management

38 Grenzen und Potenzial (2/2) Potenzial Automatisierung in Digital First Workflows Trennung von Content (XML), Code (XSLT) und Layout (CSS) Ein Content Mehrere Layouts Mehrere Medien» aber nur EINE Stylingsprache Schnelle Umsetzung neuer Produktformen (z. B. für PoD) oder schnelles Prototyping für angereicherte Lektorats-PDF s / interne Previews

39 Fazit Keine Verdrängung des klassischen Auflagensatzes Chance für neue (automatisierte) Produktformen individualisierte/personalisierte Produkte Previews & Leseproben (Satzfahnen, Umfangschätzung, etc.)

40 PrintCSS in der Praxis Lessons learned Empfehlung: Verwendung eines CSS-Präprozessors (Less, Sass, ) Entscheidung für einen Renderer Eignet sich das Projekt überhaupt für PrintCSS? Unterschiedliches Rendering bei gleichem CSS mit verschiedenen Renderern Noch recht viele proprietäre CSS-Erweiterungen Notwendiges Know-How (neben CSS): XSLT (und/oder JavaScript), für Datentransformation und Eingriffe in den Satzprozess (z. B. für generierte Inhalte wie Index, Inhaltsverzeichnis, etc.)

41 Vielen Dank für Ihre Aufmerksamkeit! Fragen? Anregungen? Christin Sandmann-Götz, pagina GmbH, Tübingen

42 Leseliste Relevante W3C-Standards Paged Media Module Level 3 CSS Generated Content for Paged Media Module CSS Fragmentation Module Level 3 Weitere Empfehlungen: ANDREW, RACHEL. Designing For Print With CSS CRAMER, DAVE; HYDE, ADAM. Paged Media GÖTZ, CHRISTIN. PrintCSS. Das CSS paged media Modul. Grundlagen und Referenz KLEINFELD, SANDERS. The Case for Authoring and Producing Books in (X)HTML5. KLEINFELD, SANDERS. HTML5 is the Future of Book Authorship MCKESSON, NELLIE. Building Books with CSS