BITV/9.1.1 - Textalternativen: Unterschied zwischen den Versionen

VisuellWikitext

Aktuelle Version vom 26. April 2024, 09:59 Uhr

Einleitung

Arten von Grafiken

Bedienelement (Web-Entwickler)
Informative Grafik (Inhaltsverantwortliche)
Layoutgrafik (Web-Entwickler)
Symbol (Inhaltsverantwortliche)

Bedienelement

Grafik-Bedienelemente

Verlinkte, informative Grafik
Benötigt Alternativtext
Soll das Ziel (Link) bzw. die Aktion (Schaltfläche) bezeichnen.

Informative Grafik

Ist im Wiki fast immer zum Originalbild verlinkt (im Gegensatz zu einer Webseite).
Benötigt Alternativtext
Kann auch eine Text-Alternative benötigen (z.B. bei einem Organigramm).

Hinweis: Derzeitige BlueSpice MediaWiki 1.39 Version benutzt keine klare Zuordnung von Bild und Bildunterschrift (wäre für Bildschirmlesegeräte besser, Beispiel). Dies geht erst ab neueren Versionen).

Beispiel

Teamarbeit zahlt sich aus

Galerie

Details-Menü
Menü "alle Aktionen"

Layoutgrafik

Nicht von Inhaltsverantwortlichen erstellt, kann aber in Vorlagen vorkommen. Bei der Erstellung neuer Vorlagen müssen Bilder immer überprüft werden (gibt es Layoutgrafiken vs. Informationsgrafiken?)
Leerer Alternativtext macht bei Inhaltsgrafiken keinen Sinn und sollte nicht umgesetzt werden.
- Vorschaubild: Wiki fügt automatisch den Bildnamen ein.
- Einfaches Bild: Wiki fügt alt tag ohne Wert ein.

Symbol

Als Grafik eingebunden

Benötigt Alternativtext

Symbol-Droplet

Immer mit Text zusammen benutzen, da Droplet-Symbole nicht vorgelesen werden:

Richtig:

Zeitplan

Falsch:

Bildschirmlesegerät

Media-Viewer kann im Benutzermenü deaktiviert werden.

Feedback zur Dokumentation ist im Community-Forum möglich.

@@ Zeile 1: / Zeile 1: @@
+== Einleitung ==
-==Arten von Grafiken==
+=== Arten von Grafiken ===
-===Bedienelement===
-[[Datei:BITV-content-UI graphics.png|alternativtext=3 Menü-Icons aus der BlueSpice Oberfläche: Zusatzmenü, Globale Aktionen und Benutzermenü|mini|150x150px|Grafik-Bedienelemente|ohne|verweis=https://training-margit.bluespice.cloud/wiki/Datei:BITV-content-UI_graphics.png]]Absatz einfügen
+* Bedienelement (Web-Entwickler)
+* Informative Grafik  (Inhaltsverantwortliche)
+* Layoutgrafik (Web-Entwickler)
+* Symbol  (Inhaltsverantwortliche)
+==Bedienelement==
+[[Datei:BITV-content-UI graphics.png|alternativtext=3 Menü-Icons aus der BlueSpice Oberfläche: Zusatzmenü, Globale Aktionen, Benutzermenü und Seitenaktionen|mini|150x150px|Grafik-Bedienelemente|ohne]]
 *Verlinkte, informative Grafik
 *Benötigt Alternativtext
-===Informative Grafik===
+*Soll das Ziel (Link) bzw. die Aktion (Schaltfläche) bezeichnen.
+== Informative Grafik ==
+*Ist im Wiki fast immer zum Originalbild verlinkt (im Gegensatz zu einer Webseite).
 *Benötigt Alternativtext
-*Kann auch Text-Alternative benötigen
+*Kann auch eine Text-Alternative benötigen (z.B. bei einem Organigramm).
-===Layoutgrafik===
-*Nicht von Inhaltsverantwortlichen erstellt
+Hinweis: Derzeitige BlueSpice MediaWiki 1.39 Version benutzt keine klare Zuordnung von Bild und Bildunterschrift (wäre für Bildschirmlesegeräte besser, [https://de.wikipedia.org/wiki/Wikipedia:Barrierefreiheit Beispiel]). Dies geht erst ab neueren Versionen).
-*Leerer Alternativtext
-===Symbol===
+=== Beispiel ===
-*Alternativtext
+[[Datei:19220.jpg|alternativtext=Infografik eines Geschäftsteams, die wie Zahnräder zusammenarbeiten.|ohne|mini|Teamarbeit zahlt sich aus]]
+=== Galerie ===
+<gallery widths="300" heights="300">
+Datei:stsv alle aktionen.png|alt=Menü mit ausgewähltem Menüpunkt 'alle Aktionen'|Details-Menü
+Datei:stsv Quelltext bearbeiten.png|alt=Ausgewählter Menüpunkt 'Quelltext bearbeiten' im Alle-Aktionen-Menü|Menü "alle Aktionen"
+</gallery>
-==== Symbol-Droplet ====
+== Layoutgrafik ==
-Immer mit Text zusammen benutzen:
+*Nicht von Inhaltsverantwortlichen erstellt, kann aber in Vorlagen vorkommen. Bei der Erstellung neuer Vorlagen müssen Bilder immer überprüft werden (gibt es Layoutgrafiken vs. Informationsgrafiken?)
+*Leerer Alternativtext macht bei Inhaltsgrafiken keinen Sinn und sollte nicht umgesetzt werden.
+**Vorschaubild: Wiki fügt automatisch den Bildnamen ein.
+**Einfaches Bild: Wiki fügt alt tag ohne Wert ein.
-Richtig:
+== Symbol ==
-<br>[[Zeitplan 2023|{{Icon|bi bi-clock|}}Zeitplan]]
+=== Als Grafik eingebunden ===
+*Benötigt Alternativtext
+[[Datei:support.png|alternativtext=Support-Hotline Icon|40x40px]]
+=== Symbol-Droplet ===
+Immer mit Text zusammen benutzen, da Droplet-Symbole nicht vorgelesen werden:<br>
+'''Richtig:'''
 {{Icon|bi bi-clock|}}Zeitplan
@@ Zeile 25: / Zeile 51: @@
-Falsch:<br>
+'''Falsch:'''<br>
 {{Icon|bi bi-clock|}}
-[[Zeitplan 2023|{{Icon|bi bi-clock|}}]]
+== Bildschirmlesegerät ==
+* Media-Viewer kann im Benutzermenü deaktiviert werden.