Um diese Einstellungen optimal einsetzen zu können sind ein erweitertes technisches Verständnis sowie HTML und CSS Kenntnisse hilfreich.
Mit Meilenstein 12 kann die angezeigte Größe des Bildes eines einzelnen Inhalts-Abschnitts für verschiedene Bildschirmgrößen individuell angepasst werden. Insbesondere für kleinere Bildschirmgrößen auf mobilen Geräten gibt es dadurch mehr Gestaltungsmöglichkeiten.
Diese Option steht für folgende Formatter des Inhalts-Anschnitts zur Verfügung:
- Text und Bild
Es gibt zwei Einstellungsmöglichkeiten:
- Bildgröße (Desktop)
Dies gilt für die Bildschirmgrößen MD, LG und XL. - Bildgröße (Mobil)
Dies gilt für die Bildschirmgrößen XS und SM.
Siehe auch Inhalts-Abschnitt: Grundformen sowie Bildschirmgrößen.
Nimmt ein Bild in der Desktop-Darstellung mindestens 4 Spalten ein, oder ist hier "Vorgabe" einstellt, so nimmt es in der Vorgabe der Mobil-Darstellung automatisch die gesamte Spaltenbreite ein.
Nimmt ein Bild in der Desktop-Darstellung nur 1, 2 oder 3 Spalten ein, so nimmt es in der Vorgabe der Mobil-Darstellung die dopplete Spaltenbreite, also 2, 4 oder 6 Spalten ein.
Hinweis: Mit Meilenstein 12 wurde die Vorgabe-Bildgröße für die Mobil-Darstellung wie oben beschrieben geändert. Vorher war das Bild per Vorgabe kleiner, nahm also nicht die gesamte Spaltenbreite ein.
Für Formatter, welche den Text neben das Bild stellen, gelten folgende Vorgaben:
In der Desktop-Darstellung (Bildschirmgößen MD, LG und XL) verwendet das Bild 4/12 und der Text 8/12 der verfügbaren Spaltenbreite.
In der Mobil-Darstellung (Bildschirmgößen XS und SM) wird das Bild nicht mehr neben, sondern über den Text gesetzt. Bild und Text nehmen die gesamte Spaltenbreite ein.
Dies ist ein Typoblindtext. An ihm kann man sehen, ob alle Buchstaben da sind und wie sie aussehen. Manchmal benutzt man Sätze, die alle Buchstaben des Alphabets enthalten. Sehr bekannt dafür ist dieser: The quick brown fox jumps over the lazy old dog. Wichtig sind auch Âçcèñtë, ebenso wie Kapitälchen, Kerning oder Ligaturen (sehr pfiffig). Gerne werden heute auch Emojis wie z.B. 😇😀😉👍🏻🐶🍎 oder ⚽️ in Texten verwendet.
Für Formatter, welche den Text über oder unter das Bild stellen, gilt folgende Vorgabe:
In der Desktop-Darstellung und der Mobil-Darstellung nehmen Bild und Text die gesamte Spaltenbreite ein.
Dies ist ein Typoblindtext. An ihm kann man sehen, ob alle Buchstaben da sind und wie sie aussehen. Manchmal benutzt man Sätze, die alle Buchstaben des Alphabets enthalten. Sehr bekannt dafür ist dieser: The quick brown fox jumps over the lazy old dog. Wichtig sind auch Âçcèñtë, ebenso wie Kapitälchen, Kerning oder Ligaturen (sehr pfiffig). Gerne werden heute auch Emojis wie z.B. 😇😀😉👍🏻🐶🍎 oder ⚽️ in Texten verwendet.
Diese folgenden Beispiele zeigen, wie die Anpassung der Bildgröße sich auf die Darstellung eines Inhalts-Abschnitts auswirkt. Dabei wird das Layout Überschrift oben, Bild links, Text rechts (das Bild umfließend) verwendet.
Die eingestellten Bildgrößen für Desktop und Mobil sind in diesen Beispielen "vertauscht", der erste Abschnitt hat also auf dem Desktop das kleinste Bild, Mobil aber das größte.
Bitte beachten Sie, dass - abhängig von der Breite der aktuellen Spalte - extreme Einstellungen der Bildgröße möglicherweise keine guten Ergebnisse erzeugen. Sehr kleine Bildgößen wie (1/12) oder (2/12) erzeugen in den folgenden Beispielen ein winziges Bild, während sehr große Bildgrößen wie (10/12) oder (11/12) dem umfließenden Text keinen Platz lassen.
Dies ist ein Typoblindtext. An ihm kann man sehen, ob alle Buchstaben da sind und wie sie aussehen. Manchmal benutzt man Sätze, die alle Buchstaben des Alphabets enthalten. Sehr bekannt dafür ist dieser: The quick brown fox jumps over the lazy old dog. Wichtig sind auch Âçcèñtë, ebenso wie Kapitälchen, Kerning oder Ligaturen (sehr pfiffig). Gerne werden heute auch Emojis wie z.B. 😇😀😉👍🏻🐶🍎 oder ⚽️ in Texten verwendet.
Dies ist ein Typoblindtext. An ihm kann man sehen, ob alle Buchstaben da sind und wie sie aussehen. Manchmal benutzt man Sätze, die alle Buchstaben des Alphabets enthalten. Sehr bekannt dafür ist dieser: The quick brown fox jumps over the lazy old dog. Wichtig sind auch Âçcèñtë, ebenso wie Kapitälchen, Kerning oder Ligaturen (sehr pfiffig). Gerne werden heute auch Emojis wie z.B. 😇😀😉👍🏻🐶🍎 oder ⚽️ in Texten verwendet.
Dies ist ein Typoblindtext. An ihm kann man sehen, ob alle Buchstaben da sind und wie sie aussehen. Manchmal benutzt man Sätze, die alle Buchstaben des Alphabets enthalten. Sehr bekannt dafür ist dieser: The quick brown fox jumps over the lazy old dog. Wichtig sind auch Âçcèñtë, ebenso wie Kapitälchen, Kerning oder Ligaturen (sehr pfiffig). Gerne werden heute auch Emojis wie z.B. 😇😀😉👍🏻🐶🍎 oder ⚽️ in Texten verwendet.
Dies ist ein Typoblindtext. An ihm kann man sehen, ob alle Buchstaben da sind und wie sie aussehen. Manchmal benutzt man Sätze, die alle Buchstaben des Alphabets enthalten. Sehr bekannt dafür ist dieser: The quick brown fox jumps over the lazy old dog. Wichtig sind auch Âçcèñtë, ebenso wie Kapitälchen, Kerning oder Ligaturen (sehr pfiffig). Gerne werden heute auch Emojis wie z.B. 😇😀😉👍🏻🐶🍎 oder ⚽️ in Texten verwendet.
Dies ist ein Typoblindtext. An ihm kann man sehen, ob alle Buchstaben da sind und wie sie aussehen. Manchmal benutzt man Sätze, die alle Buchstaben des Alphabets enthalten. Sehr bekannt dafür ist dieser: The quick brown fox jumps over the lazy old dog. Wichtig sind auch Âçcèñtë, ebenso wie Kapitälchen, Kerning oder Ligaturen (sehr pfiffig). Gerne werden heute auch Emojis wie z.B. 😇😀😉👍🏻🐶🍎 oder ⚽️ in Texten verwendet.
Dies ist ein Typoblindtext. An ihm kann man sehen, ob alle Buchstaben da sind und wie sie aussehen. Manchmal benutzt man Sätze, die alle Buchstaben des Alphabets enthalten. Sehr bekannt dafür ist dieser: The quick brown fox jumps over the lazy old dog. Wichtig sind auch Âçcèñtë, ebenso wie Kapitälchen, Kerning oder Ligaturen (sehr pfiffig). Gerne werden heute auch Emojis wie z.B. 😇😀😉👍🏻🐶🍎 oder ⚽️ in Texten verwendet.
Dies ist ein Typoblindtext. An ihm kann man sehen, ob alle Buchstaben da sind und wie sie aussehen. Manchmal benutzt man Sätze, die alle Buchstaben des Alphabets enthalten. Sehr bekannt dafür ist dieser: The quick brown fox jumps over the lazy old dog. Wichtig sind auch Âçcèñtë, ebenso wie Kapitälchen, Kerning oder Ligaturen (sehr pfiffig). Gerne werden heute auch Emojis wie z.B. 😇😀😉👍🏻🐶🍎 oder ⚽️ in Texten verwendet.
Dies ist ein Typoblindtext. An ihm kann man sehen, ob alle Buchstaben da sind und wie sie aussehen. Manchmal benutzt man Sätze, die alle Buchstaben des Alphabets enthalten. Sehr bekannt dafür ist dieser: The quick brown fox jumps over the lazy old dog. Wichtig sind auch Âçcèñtë, ebenso wie Kapitälchen, Kerning oder Ligaturen (sehr pfiffig). Gerne werden heute auch Emojis wie z.B. 😇😀😉👍🏻🐶🍎 oder ⚽️ in Texten verwendet.
Dies ist ein Typoblindtext. An ihm kann man sehen, ob alle Buchstaben da sind und wie sie aussehen. Manchmal benutzt man Sätze, die alle Buchstaben des Alphabets enthalten. Sehr bekannt dafür ist dieser: The quick brown fox jumps over the lazy old dog. Wichtig sind auch Âçcèñtë, ebenso wie Kapitälchen, Kerning oder Ligaturen (sehr pfiffig). Gerne werden heute auch Emojis wie z.B. 😇😀😉👍🏻🐶🍎 oder ⚽️ in Texten verwendet.
Dies ist ein Typoblindtext. An ihm kann man sehen, ob alle Buchstaben da sind und wie sie aussehen. Manchmal benutzt man Sätze, die alle Buchstaben des Alphabets enthalten. Sehr bekannt dafür ist dieser: The quick brown fox jumps over the lazy old dog. Wichtig sind auch Âçcèñtë, ebenso wie Kapitälchen, Kerning oder Ligaturen (sehr pfiffig). Gerne werden heute auch Emojis wie z.B. 😇😀😉👍🏻🐶🍎 oder ⚽️ in Texten verwendet.
Das folgende Beispiel zeigt, wie die Anpassung der Bildgröße sich auf die Darstellung eines Inhalts-Abschnitts auswirkt wenn der Text über oder unter dem Bild ausgegeben wird.
In diesem Fall wird das Bild auf die gewählte Bildröße angepasst und zentriert über bzw. unter dem Text dargestellt.
Die zentrierte Darstellung des Bildes wird in diesem Fall auch in der Mobil-Darstellung verwendet.
Dies ist ein Typoblindtext. An ihm kann man sehen, ob alle Buchstaben da sind und wie sie aussehen. Manchmal benutzt man Sätze, die alle Buchstaben des Alphabets enthalten. Sehr bekannt dafür ist dieser: The quick brown fox jumps over the lazy old dog. Wichtig sind auch Âçcèñtë, ebenso wie Kapitälchen, Kerning oder Ligaturen (sehr pfiffig). Gerne werden heute auch Emojis wie z.B. 😇😀😉👍🏻🐶🍎 oder ⚽️ in Texten verwendet.