{"id":946,"date":"2011-01-13T11:34:30","date_gmt":"2011-01-13T10:34:30","guid":{"rendered":"http:\/\/www.sachaheck.net\/blog\/?p=946"},"modified":"2011-01-13T11:34:30","modified_gmt":"2011-01-13T10:34:30","slug":"epub-satzspiegel-rander","status":"publish","type":"post","link":"https:\/\/www.sachaheck.net\/blog\/digital-media\/epub-satzspiegel-rander","title":{"rendered":"ePub: Satzspiegel bzw. Seitenr\u00e4nder definieren"},"content":{"rendered":"<p><strong>[Erg\u00e4nzung zum eBook \/ ePub Leitfaden <a href=\"https:\/\/www.sachaheck.net\/blog\/indesign\/indesign-ebook-leitfaden\" target=\"_blank\">Teil 1<\/a> + <a href=\"https:\/\/www.sachaheck.net\/blog\/indesign\/indesign-to-epub\" target=\"_blank\">Teil 2<\/a>]<\/strong><\/p>\n<p>Vor ein paar Tagen erhielt ich eine Anfrage, ob es m\u00f6glich sei, in einem eBook \u2013 einem ePub \u2013 Seitenr\u00e4nder zu definieren. Tats\u00e4chlich hatte ich mir bisher keine Gedanken \u00fcber einen Satzspiegel gemacht aber es ist eigentlich ganz einfach m\u00f6glich, einen Satzspiegel im ePub zu definieren. Allerdings gibt es ja keine linke und rechte Seiten, aber damit unser Text nicht an den R\u00e4ndern unseres Readers klebt, sollte man diesen kleinen Schritt schon vornehmen.<\/p>\n<h2>L\u00f6sung per xpgt-Datei<\/h2>\n<p>Es gibt m.W. zwei M\u00f6glichkeiten, den Satzspiegel im ePub zu definieren. Die erste l\u00e4uft \u00fcber eine extra Datei die nicht automatisch zu einem ePub geh\u00f6rt, d.h. man mu\u00df diese nachtr\u00e4glich erstellen. Das w\u00e4re eine sog. page-template.xpgt-Datei. So eine Datei benutzte XML-FO-Technologie um Seitenr\u00e4nder und Templates zu definieren in dieser Art:<\/p>\n<pre>&lt;fo:simple-page-master master-name=\"page\"\r\n \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 margin-bottom=\"1.5em\"\r\n \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 margin-top=\"1.5em\"\r\n \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 margin-left=\"1.5em\"\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 margin-right=\"1.5em\"&gt;\r\n<\/pre>\n<p>Da diese Technik aber veraltet ist, werde ich nicht weiter ins Detail gehen, sondern wir kommen zur aktuell g\u00e4ngigen L\u00f6sung:<\/p>\n<h2>L\u00f6sung per CSS<\/h2>\n<p>Die aktuelle L\u00f6sung basiert auf CSS. Ohne Satzspiegel im ePub sieht unser eBook bspw. so aus:<\/p>\n<p><img loading=\"lazy\" class=\"alignnone size-full wp-image-947\" title=\"ePub_ohne_Satzspiegel\" src=\"https:\/\/www.sachaheck.net\/blog\/wp-content\/uploads\/2011\/01\/ePub_ohne_Satzspiegel.jpg\" alt=\"\" width=\"440\" height=\"649\" srcset=\"https:\/\/www.sachaheck.net\/blog\/wp-content\/uploads\/2011\/01\/ePub_ohne_Satzspiegel.jpg 440w, https:\/\/www.sachaheck.net\/blog\/wp-content\/uploads\/2011\/01\/ePub_ohne_Satzspiegel-203x300.jpg 203w\" sizes=\"(max-width: 440px) 100vw, 440px\" \/><\/p>\n<p>Durch einfaches Hinzuf\u00fcgen der folgenden paar CSS-Zeilen \u2026<\/p>\n<p><img loading=\"lazy\" class=\"alignnone size-full wp-image-948\" title=\"CSS_Satzspiegel\" src=\"https:\/\/www.sachaheck.net\/blog\/wp-content\/uploads\/2011\/01\/CSS_Satzspiegel.jpg\" alt=\"\" width=\"174\" height=\"88\" \/><\/p>\n<p>\u2026 sieht unser ePub schon direkt freundlicher aus und wird nicht mehr so erdr\u00fcckt:<\/p>\n<p><img loading=\"lazy\" class=\"alignnone size-full wp-image-949\" title=\"ePub_Satzspiegel_nachher\" src=\"https:\/\/www.sachaheck.net\/blog\/wp-content\/uploads\/2011\/01\/ePub_Satzspiegel_nachher.jpg\" alt=\"\" width=\"440\" height=\"679\" srcset=\"https:\/\/www.sachaheck.net\/blog\/wp-content\/uploads\/2011\/01\/ePub_Satzspiegel_nachher.jpg 440w, https:\/\/www.sachaheck.net\/blog\/wp-content\/uploads\/2011\/01\/ePub_Satzspiegel_nachher-194x300.jpg 194w\" sizes=\"(max-width: 440px) 100vw, 440px\" \/><\/p>\n<p>Eigentlich ganz einfach. Man mu\u00df nur wissen, dass die M\u00f6glichkeit besteht :-)<\/p>\n<div class=\"shariff\"><ul class=\"shariff-buttons theme-default orientation-horizontal buttonsize-medium\"><li class=\"shariff-button twitter shariff-nocustomcolor\" style=\"background-color:#1e3050\"><a href=\"https:\/\/twitter.com\/share?url=https%3A%2F%2Fwww.sachaheck.net%2Fblog%2Fdigital-media%2Fepub-satzspiegel-rander&text=ePub%3A%20Satzspiegel%20bzw.%20Seitenr%C3%A4nder%20definieren\" title=\"Bei X (Twitter) teilen\" aria-label=\"Bei X (Twitter) teilen\" role=\"button\" rel=\"noreferrernoopener nofollow\" class=\"shariff-link\" style=\"; background-color:#000000; color:#fff\" target=\"_blank\"><span class=\"shariff-icon\" style=\"\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" height=\"1em\" viewBox=\"0 0 512 512\"><!--! Font Awesome Free 6.4.2 by @fontawesome - https:\/\/fontawesome.com License - https:\/\/fontawesome.com\/license (Commercial License) Copyright 2023 Fonticons, Inc. --><style>svg{fill:#ffffff}<\/style><path d=\"M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z\"\/><\/svg><\/span><span class=\"shariff-text\">twittern<\/span>&nbsp;<\/a><\/li><li class=\"shariff-button facebook shariff-nocustomcolor\" style=\"background-color:#4273c8\"><a href=\"https:\/\/www.facebook.com\/sharer\/sharer.php?u=https%3A%2F%2Fwww.sachaheck.net%2Fblog%2Fdigital-media%2Fepub-satzspiegel-rander\" title=\"Bei Facebook teilen\" aria-label=\"Bei Facebook teilen\" role=\"button\" rel=\"noreferrernoopener nofollow\" class=\"shariff-link\" style=\"; background-color:#3b5998; color:#fff\" target=\"_blank\"><span class=\"shariff-icon\" style=\"\"><svg width=\"32px\" height=\"20px\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 18 32\"><path fill=\"#3b5998\" d=\"M17.1 0.2v4.7h-2.8q-1.5 0-2.1 0.6t-0.5 1.9v3.4h5.2l-0.7 5.3h-4.5v13.6h-5.5v-13.6h-4.5v-5.3h4.5v-3.9q0-3.3 1.9-5.2t5-1.8q2.6 0 4.1 0.2z\"\/><\/svg><\/span><span class=\"shariff-text\">teilen<\/span>&nbsp;<\/a><\/li><li class=\"shariff-button linkedin shariff-nocustomcolor\" style=\"background-color:#1488bf\"><a href=\"https:\/\/www.linkedin.com\/sharing\/share-offsite\/?url=https%3A%2F%2Fwww.sachaheck.net%2Fblog%2Fdigital-media%2Fepub-satzspiegel-rander\" title=\"Bei LinkedIn teilen\" aria-label=\"Bei LinkedIn teilen\" role=\"button\" rel=\"noreferrernoopener nofollow\" class=\"shariff-link\" style=\"; background-color:#0077b5; color:#fff\" target=\"_blank\"><span class=\"shariff-icon\" style=\"\"><svg width=\"32px\" height=\"20px\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 27 32\"><path fill=\"#0077b5\" d=\"M6.2 11.2v17.7h-5.9v-17.7h5.9zM6.6 5.7q0 1.3-0.9 2.2t-2.4 0.9h0q-1.5 0-2.4-0.9t-0.9-2.2 0.9-2.2 2.4-0.9 2.4 0.9 0.9 2.2zM27.4 18.7v10.1h-5.9v-9.5q0-1.9-0.7-2.9t-2.3-1.1q-1.1 0-1.9 0.6t-1.2 1.5q-0.2 0.5-0.2 1.4v9.9h-5.9q0-7.1 0-11.6t0-5.3l0-0.9h5.9v2.6h0q0.4-0.6 0.7-1t1-0.9 1.6-0.8 2-0.3q3 0 4.9 2t1.9 6z\"\/><\/svg><\/span><span class=\"shariff-text\">mitteilen<\/span>&nbsp;<\/a><\/li><\/ul><\/div>","protected":false},"excerpt":{"rendered":"<p>Vor ein paar Tagen erhielt ich eine Mail ob es m\u00f6glich sei, in einem eBook \u2013 einem ePub \u2013 Seitenr\u00e4nder zu definieren. Tats\u00e4chlich hatte ich mir bisher keine Gedanken \u00fcber einen Satzspiegel gemacht aber es ist eigentlich ganz einfach m\u00f6glich, diesen im ePub zu definieren.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"ngg_post_thumbnail":0},"categories":[100],"tags":[206],"_links":{"self":[{"href":"https:\/\/www.sachaheck.net\/blog\/wp-json\/wp\/v2\/posts\/946"}],"collection":[{"href":"https:\/\/www.sachaheck.net\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.sachaheck.net\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.sachaheck.net\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.sachaheck.net\/blog\/wp-json\/wp\/v2\/comments?post=946"}],"version-history":[{"count":7,"href":"https:\/\/www.sachaheck.net\/blog\/wp-json\/wp\/v2\/posts\/946\/revisions"}],"predecessor-version":[{"id":956,"href":"https:\/\/www.sachaheck.net\/blog\/wp-json\/wp\/v2\/posts\/946\/revisions\/956"}],"wp:attachment":[{"href":"https:\/\/www.sachaheck.net\/blog\/wp-json\/wp\/v2\/media?parent=946"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.sachaheck.net\/blog\/wp-json\/wp\/v2\/categories?post=946"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.sachaheck.net\/blog\/wp-json\/wp\/v2\/tags?post=946"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}