figure Grafikeinbindung

Zusammenfassung

Abbildungen können "generisch" via figure oder - in den meisten Fällen spezifischer - über screenshot eingebunden werden.

Bei der Einbindung von Grafiken bzw. Screenshots sollte auf die folgenden Punkte geachtet werden:

Größe/Dimensionen

Grafiken sollten nicht breiter als 550 Pixel sein. Diese Empfehlung gilt, wenn als Ausgabeformat u.a. PDF gewählt ist und somit eine fixe (meist DIN A4) Breite und Höhe gegeben ist. Gegebenenfalls können passende Ausschnitte gewählt werden, oder die Abbildung in einer Grafikbearbeitungssoftware skaliert werden.

Ist die Abbildung größer als der dafür zur Verfügung stehende Raum, wird - in der PDF-Ausgabe - die Grafik rechts und/oder unten abgeschnitten. Sollen auch größere Abbildungen unbeschnitten dargestellt werden, müssen diese entweder im Vorfeld mit einer Grafikbearbeitung skaliert werden, oder es wird das Attribut width="X%" für das Element <imagedata> genutzt. Siehe auch Beispiel A.3, „Skalierungsbeispiele für Abbildungen“ und „Landscape figure.

Dateiformat

Bevorzugt wird das Dateiformat Portable Network Graphics (PNG) gewählt. Dies wird von dem von zpub genutzten fo-Formatierer fop nativ unterstützt, bietet "echte" Transparenz via Alphakanal und verlustfreie Kompression.

Weiter ist auch die gute Unterstützung von Scalable Vector Graphics (SVG, deutsch skalierbare Vektorgrafiken) zu nennen.

Auflösung

Wenn möglich sollten die Abbildungen und Screenshots in einer Auflösung von 96dpi vorliegen (sofern die Bildbearbeitung die Auflösung in die Grafikdatei einbettet), dies garantiert qualitativ beste Ergebnisse. Ein Screenshot unter Microsoft Windows XP/7™ hat eine Auflösung von 96dpi.

Abbildung A.1. Screenshot (unskaliert: 698x406px, 96dpi)

Screenshot (unskaliert: 698x406px, 96dpi)

Eine Verdoppelung der DPI - bei gleichbleibenden Dimensionen - führt zu kompakteren Grafiken, die im Ausdruck in Größe und Schärfe/Lesbarkeit als passender empfunden werden. Alternativ können auch - sollte die Dimensionen der Ausgabe zu klein geraten - geringere Erhöhungen der DPI genutzt werden. Die geänderte Auflösung muß auch im Dateiformat gespeichert werden, was je nach Bildbearbeitungssoftware und Format unterschiedlich zu erreichen ist. Beim Speichern ist darauf zu achten, dass als Format "PNG" und "Auflösung speichern" gewählt ist:

Abbildung A.2. Screenshot (unskaliert: 698x406px,192dpi)

Screenshot (unskaliert: 698x406px,192dpi)

Abbildung A.3. Screenshot (kein ClearType; unskaliert: 698x406px,192dpi)

Screenshot (kein ClearType; unskaliert: 698x406px,192dpi)

Screenshots

Screenshots können auf unterschiedlichste Weise erzeugt werden - über die Taste Druck beispielsweise wird der aktuelle Bildschirminhalt in der Zwischenablage gespeichert, über Programme wie XnView kann der Bildschirm- oder Fensterinhalt präziser erfasst und zumindest rudimentär bearbeitet werden. Ab Microsoft™ Windows 7 können sämtliche Screenshoterstellungen (einzelnes Fenster, gesamter Desktop, individueller Bereich etc.) über das zu Windows gehörende Snipping Tool komfortabel erstellt werden.

Die Bildqualität (Lesbarkeit von Schriften) von Screenshots wird durch eine Skalierung stark beeinträchtigt und sollte daher vermieden werden. Eine Erhöhung des DPI-Werts dageben bringt erzeugt in der PDF-Ausgabe qualitativ hochwertige, jedoch in ihren Dimensionen kleinere Abbildungen. Nicht-grafische Abbildungen wie Photos können dagegen relativ problemlos skaliert werden.

Beispiel A.3. Skalierungsbeispiele für Abbildungen

Abbildung A.4. Pixelleiste (unskaliert)

Pixelleiste (unskaliert)


Abbildung A.5. Pixelleiste (Breite: 80%)

Pixelleiste (Breite: 80%)


Abbildung A.6. Pixelleiste (Breite: 5cm)

Pixelleiste (Breite: 5cm)



Einbindung via figure

Abbildung A.7. Abbildung figure

Abbildung figure

Beispiel A.4. Abbildung ohne Untertitel

<figure>
  <title>Abbildungstitel</title>
    <mediaobject>
      <imageobject>
        <imagedata fileref="images/dateiname.png"/>
      </imageobject>
    </mediaobject>
</figure>


Einbindung via figure mit Untertitel (caption)

Abbildung A.8. Beispielabbildung mit Untertitel figure

Beispielabbildung mit Untertitel figure

Untertitel des Abbildung - caption


Beispiel A.5. Abbildung mit Untertitel (caption)

<figure>
  <title>Abbildungstitel</title>
  <mediaobject>
    <imageobject>
      <imagedata fileref="images/dateiname.png"/>
    </imageobject>
    <caption>
      <para>Untertitel des Abbildung - caption</para>
    </caption>
  </mediaobject>
</figure>


Einbindung via screenshot

Abbildung A.9. Screenshot-Titel

Screenshot-Titel

Beispiel A.6. Screenshot

<figure>
<title>Screenshot-Titel</title>
  <screenshot>
    <mediaobject>
      <imageobject>
        <imagedata fileref="images/dateiname.png"/>
      </imageobject>
    </mediaobject>
  </screenshot>
</figure>