Deutscher Abschnitt

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Inhaltselement Text und Bild

Bildbeschreibung: Für zusätliche Informationen oder Copyright

@Alex Schuppich

Text wird ganz normal im Editorfeld eingetragen, die Bilder werden jedoch gesondert hochgeladen und dann zum Inhaltselement hinzugefügt.

Was muss ein Bild eingetragen haben um barrierefrei zu sein?

Das wichtigeste Element ist der 'Alternative Text', dieser muss ausgefüllt sein da Screenreader ihn vorlesen.
Bildtitel ist unwichtig da er ja nur als  Mouseover zum Tragen kommt, Bildbeschreibung kann verwendet werden um zusätzliche Informationen zum Bild zu bringen und um z.B. Copyright angaben zu machen. Die Bildbeschreibung sollte sich vom alternativen Text unterscheiden da sonst zweimal dasselbe vorgelesen wird.

Alternativer Text, Bildtitel und Bildbeschreibung können direkt bei den eingefügten Bilder überschrieben werden, falls die Texte, die über die Dateiliste zu den Bildern hinzugefügt worden sind, für den Anwendungsfall nicht passen.

Es stehen eine Reihe von Layout-Varianten zur Verfügung:

  • Oben
  • Unten
  • Links
  • Rechts
  • Links umlaufend 
  • Rechts umlaufend
  • Links Portrait

Alternativer Text

Dies ist die Bildbeschreibung

Alternativer Bildtext

Die Bildbeschreibung

Bilder in Rasterelementen

Im obigen Bilde+Text Element erstreckt sich der Hintergrund der Liste unschön über die ganze Breite.
Ein möglicher Workaround ist z.B. stattdessen ein Rasterelement 50%/50% zu verwenden und links das Bild, rechts den Text zu platzieren.

Es stehen eine Reihe von Layout-Varianten zur Verfügung:

  • Oben
  • Unten
  • Links
  • Rechts
  • Links umlaufend 
  • Rechts umlaufend
  • Links Portrait

Dynamische Inhaltselemente: Text und Bild links umlaufend

Alternativer Text

Bildbeschreibung @univie

Text wird ganz normal im RTE (Rich Text Editor - das 'Word' im TYPO3 Backend) eingetragen. Die Bilder werden jedoch gesondert hochgeladen und dann zum Inhaltselement hinzugefügt. Der Vorteil gegenüber Bildern, die direkt im RTE eingebunden werden, ist die responsive Darstellung. Bei umlaufendem Layout kann es zu Problemen mit der Darstellung kommen, es hängt sehr von den verwendeten Text-Elementen ab (siehe Liste unten).

Bildtitel und Bildbeschreibung können direkt bei den eingefügten Bilder überschrieben werden, falls die Texte, die über die Dateiliste zu den Bildern hinzugefügt worden sind, für den Anwendungsfall nicht passen.

Dieses Bild-Text Element ist auf 'links umlaufend' gestellt.

Dynamische Inhaltselemente: Text und Bild rechts umlaufend

Alternativer Text

Bildbeschreibung

Text wird ganz normal im RTE (Rich Text Editor - das 'Word' im TYPO3 Backend) eingetragen. Die Bilder werden jedoch gesondert hochgeladen und dann zum Inhaltselement hinzugefügt. Der Vorteil gegenüber Bildern, die direkt im RTE eingebunden werden, ist die responsive Darstellung. Bei umlaufendem Layout kann es zu Problemen mit der Darstellung kommen, es hängt sehr von den verwendeten Text-Elementen ab (siehe Liste unten).

Bildtitel und Bildbeschreibung können direkt bei den eingefügten Bilder überschrieben werden, falls die Texte, die über die Dateiliste zu den Bildern hinzugefügt worden sind, für den Anwendungsfall nicht passen.

Dieses Bild-Text Element ist auf 'rechts umlaufend' gestellt.

Dynamische Inhaltselemente: Text und Bild oben

Alternativer Text

Bildbeschreibung

Text wird ganz normal im RTE (Rich Text Editor - das 'Word' im TYPO3 Backend) eingetragen. Die Bilder werden jedoch gesondert hochgeladen und dann zum Inhaltselement hinzugefügt. Der Vorteil gegenüber Bildern, die direkt im RTE eingebunden werden, ist die responsive Darstellung. Bei umlaufendem Layout kann es zu Problemen mit der Darstellung kommen, es hängt sehr von den verwendeten Text-Elementen ab (siehe Liste unten).

Bildtitel und Bildbeschreibung können direkt bei den eingefügten Bilder überschrieben werden, falls die Texte, die über die Dateiliste zu den Bildern hinzugefügt worden sind, für den Anwendungsfall nicht passen.

Dieses Bild-Text Element ist auf 'oben' gestellt.

Dynamische Inhaltselemente: Text und Bild unten

Text wird ganz normal im RTE (Rich Text Editor - das 'Word' im TYPO3 Backend) eingetragen. Die Bilder werden jedoch gesondert hochgeladen und dann zum Inhaltselement hinzugefügt. Der Vorteil gegenüber Bildern, die direkt im RTE eingebunden werden, ist die responsive Darstellung. Bei umlaufendem Layout kann es zu Problemen mit der Darstellung kommen, es hängt sehr von den verwendeten Text-Elementen ab (siehe Liste unten).

Bildtitel und Bildbeschreibung können direkt bei den eingefügten Bilder überschrieben werden, falls die Texte, die über die Dateiliste zu den Bildern hinzugefügt worden sind, für den Anwendungsfall nicht passen.

Dieses Bild-Text Element ist auf 'unten' gestellt.

Alternativer Text

Bildbeschreibung

Dynamische Inhaltselemente: Text und Bild rechts

Text wird ganz normal im RTE (Rich Text Editor - das 'Word' im TYPO3 Backend) eingetragen. Die Bilder werden jedoch gesondert hochgeladen und dann zum Inhaltselement hinzugefügt. Der Vorteil gegenüber Bildern, die direkt im RTE eingebunden werden, ist die responsive Darstellung. Bei umlaufendem Layout kann es zu Problemen mit der Darstellung kommen, es hängt sehr von den verwendeten Text-Elementen ab (siehe Liste unten).

Bildtitel und Bildbeschreibung können direkt bei den eingefügten Bilder überschrieben werden, falls die Texte, die über die Dateiliste zu den Bildern hinzugefügt worden sind, für den Anwendungsfall nicht passen.

Dieses Bild-Text Element ist auf 'rechts' gestellt.

Alternativer Text

Bildbeschreibung

Dynamische Inhaltselemente: Text und Bild links

Alternativer Text

Bildbeschreibung

Text wird ganz normal im RTE (Rich Text Editor - das 'Word' im TYPO3 Backend) eingetragen. Die Bilder werden jedoch gesondert hochgeladen und dann zum Inhaltselement hinzugefügt. Der Vorteil gegenüber Bildern, die direkt im RTE eingebunden werden, ist die responsive Darstellung. Bei umlaufendem Layout kann es zu Problemen mit der Darstellung kommen, es hängt sehr von den verwendeten Text-Elementen ab (siehe Liste unten).

Bildtitel und Bildbeschreibung können direkt bei den eingefügten Bilder überschrieben werden, falls die Texte, die über die Dateiliste zu den Bildern hinzugefügt worden sind, für den Anwendungsfall nicht passen.

Dieses Bild-Text Element ist auf 'links' gestellt.

Dynamische Inhaltselemente: Text und Bild links Portrait

Alternativer Text

Bildbeschreibung

Text wird ganz normal im RTE (Rich Text Editor - das 'Word' im TYPO3 Backend) eingetragen. Die Bilder werden jedoch gesondert hochgeladen und dann zum Inhaltselement hinzugefügt. Der Vorteil gegenüber Bildern, die direkt im RTE eingebunden werden, ist die responsive Darstellung. Bei umlaufendem Layout kann es zu Problemen mit der Darstellung kommen, es hängt sehr von den verwendeten Text-Elementen ab (siehe Liste unten).

Bildtitel und Bildbeschreibung können direkt bei den eingefügten Bilder überschrieben werden, falls die Texte, die über die Dateiliste zu den Bildern hinzugefügt worden sind, für den Anwendungsfall nicht passen.

Dieses Bild-Text Element ist auf 'links Portrait' gestellt.

Bildergalerie schmal

Animiertes Gif

Animierte GIFs funktionieren prinzipiell, allerdings müssen Sie die Bildgröße so wählen das das Bild auf die Seite passt (max. 820 px Breite) und weiters beim Bild 'In Originalgröße anzeigen' aktivieren. Ansonsten wird das Bild automatisch umgerechnet und dadurch die Animation zerstört.