Änderungen von Dokument Erstellung barrierefreier Inhalte

Zusammenfassung

• Seiteneigenschaften (1 geändert, 0 hinzugefügt, 0 gelöscht)
• Anhänge (0 geändert, 2 hinzugefügt, 0 gelöscht)
  • Texteditor-Bilder-Alternativtext.png
  • Texteditor-Bilder-dekorativ.png

Details

Seiteneigenschaften

Inhalt

...	...	@@ -305,28 +305,30 @@
305	305
306	306	* Kurz halten: Der Alternativtext sollte nur die wichtigsten Informationen enthalten. Grobe Richtlinie: 125 Zeichen.
307	307	* Informationen beschreiben: Nur die für den Kontext (z.B. den Text) relevanten Informationen, die das Bild übermitteln soll, beschreiben.
308		-* Bilder, die nur der Gestaltung dienen, sollten keinen Alternativtext (leeres alt-Attribut) haben und idealerweise als Hintergrundbilder via CSS eingebunden werden.
	308	+* Bilder, die nur der Gestaltung dienen, sollten keinen Alternativtext (leeres alt-Attribut) erhalten. Im Texteditor können Sie diese Bilder als dekorativ markieren.
309	309
310	310	{{info}}
311		-Tipp: Stellen Sie sich vor, Sie würden das Bild einer Person am Telefon beschreiben. Welche Details erwähnen Sie, welche lassen Sie aus, da sie im Kontext nicht relevant sind?
	311	+**Tipp für gute Alternativtexte:** Stellen Sie sich vor, Sie würden das Bild einer Person am Telefon beschreiben. Welche Details erwähnen Sie, welche lassen Sie aus, da sie im Kontext nicht relevant sind?
312	312	{{/info}}
313	313
314	314
315	315	==== Alternativtext im Texteditor Tiny MCE hinterlegen ====
316	316
317		-[[image:attach:Texteditor-Bildbeschreibung.png||data-xwiki-image-style="img-screen" data-xwiki-image-style-border="true" width="500"]]
	317	+[[image:Texteditor-Bilder-Alternativtext.png||data-xwiki-image-style="img-screen" data-xwiki-image-style-border="true" width="500"]]
318	318
319	319
320	320	==== Alternativtext im HTML hinterlegen ====
321	321
322		-**Alternativtext mit dem Attribut alt**
323		-
324	324	{{code}}
325	325	<img ... alt="Der Schaum auf einem Kaffee bildet ein schreiendes Gesicht." />
326	326	{{/code}}
327	327
328		-**Leeres alt-Attribut für Bilder ohne relevante Informationen**
	326	+==== Bild als dekorativ markieren ====
329	329
	328	+[[image:Texteditor-Bilder-dekorativ.png||data-xwiki-image-style="img-screen" data-xwiki-image-style-border="true" height="224" width="300"]]
	329	+
	330	+**Im HTML: Leeres alt-Attribut für Bilder ohne relevante Informationen**
	331	+
330	330	{{code}}
331	331	<img ... alt=" " />
332	332	{{/code}}
...	...	@@ -361,7 +361,6 @@
361	361
362	362	{{layout-section ac:type="two_right_sidebar"}}
363	363	{{layout-cell}}
364		-
365	365	=== Alternativen für Videos und Audio-Dateien bereitstellen ===
366	366
367	367	Beim Einsatz von Medien sollten die Informationen stets auch in einer alternativen Form angeboten werden. Neben der Bildbeschreibung (Alternativtext) für Bilder sollte an reine Audio-Inhalte (z.B. Podcasts) und Video-Inhalte mit Bild und Ton gedacht werden.

Texteditor-Bilder-Alternativtext.png

Author

...	...	@@ -1,0 +1,1 @@
	1	+XWiki.katharina

Größe

...	...	@@ -1,0 +1,1 @@
	1	+78.1 KB

Inhalt

Texteditor-Bilder-dekorativ.png

Author

...	...	@@ -1,0 +1,1 @@
	1	+XWiki.katharina

Größe

...	...	@@ -1,0 +1,1 @@
	1	+5.8 KB

Inhalt