Änderungen von Dokument Erstellung barrierefreier Inhalte

Zusammenfassung

• Seiteneigenschaften (1 geändert, 0 hinzugefügt, 0 gelöscht)

Details

Seiteneigenschaften

Inhalt

...	...	@@ -24,11 +24,9 @@
24	24	{{/layout-cell}}
25	25
26	26	{{layout-cell}}
27		-{{panel title=""}}
28		-**Inhalt**
	27	+{{panel title="Inhalt"}}
	28	+{{toc start="2"/}}
29	29
30		- {{toc start="2"/}}
31		-
32	32	**Verwandte Themen**
33	33
34	34	* [[Texteditor>>doc:LMS.Benutzerhandbuch OPAL.Lehren.Weitere Funktionen.Texteditor.WebHome]]
...	...	@@ -55,14 +55,12 @@
55	55
56	56	Überschriften sollten nicht über die Schriftgröße sowie z.B. über die Formatierung Fett/Bold gestaltet werden, sondern über die HTML-Elemente <h1>, <h2>, <h3> bis <h6>. Die Hierarchie der Elemente (z.B. <h2> folgt auf <h1>) muss dabei eingehalten werden.
57	57
58		-{{section}}
59		-{{column}}
	56	+
60	60	==== Formate im Texteditor Tiny MCE nutzen ====
61	61
62	62	[[image:attach:Texteditor-Formate-Überschriften.png||data-xwiki-image-style="img-screen" data-xwiki-image-style-border="true" width="500"]]
63		-{{/column}}
64	64
65		-{{column}}
	61	+
66	66	==== HTML-Code nutzen ====
67	67
68	68	{{code language="xml"}}
...	...	@@ -73,21 +73,16 @@
73	73	<h5>Überschrift 5. Ordnung</h5>
74	74	<h6>Überschrift 6. Ordnung</h6>
75	75	{{/code}}
76		-{{/column}}
77		-{{/section}}
78	78
	73	+
79	79	=== Absätze und Hervorhebungen ===
80	80
81	81	Absätze, Gestaltung von Zitaten oder Hervorhebungen durch umrahmte Textabschnitte helfen, einen Text aufzulockern und bei Bedarf zu den relevanten Informationen zu springen.
82	82
83		-{{section}}
84		-{{column}}
85	85	==== Formate im Texteditor Tiny MCE nutzen ====
86	86
87	87	[[image:attach:Texteditor-Formate-Absätze-Hervorhebungen.png||data-xwiki-image-style="img-screen" data-xwiki-image-style-border="true" width="500"]]
88		-{{/column}}
89	89
90		-{{column}}
91	91	==== HTML-Code nutzen ====
92	92
93	93	{{code language="xml"}}
...	...	@@ -99,9 +99,8 @@
99	99	{{error}}
100	100	(% style="color:#333333" %)Die Elemente <div> und <span> haben keine Bedeutung (Semantik) und sollten nur verwendet werden, um z.B. die Gestaltung per CSS oder dynamische Anpassungen per JavaScript zu realisieren.
101	101	{{/error}}
102		-{{/column}}
103		-{{/section}}
104	104
	94	+
105	105	=== Listen ===
106	106
107	107	(% style="color:#333333" %)Listen können verwendet werden, um Informationen übersichtlich, kurz und knapp darzustellen. Wählen Sie zwischen ungeordneten und geordneten bzw. nummerierten Aufzählungen.
...	...	@@ -217,9 +217,9 @@
217	217
218	218	**Bildunterschrift mit den HTML-Elementen figure und figcaption**
219	219
220		-{{code layout="LINENUMBERS"}}
	210	+{{code language="html" layout="LINENUMBERS"}}
221	221	<figure>
222		- <img ... alt="Alternativtext">
	212	+ <img data-cke-saved-src="..." src="..." alt="Alternativtext">
223	223	<figcaption>Bildtitel / Bildunterschrift</figcaption>
224	224	</figure>
225	225	{{/code}}
...	...	@@ -242,14 +242,14 @@
242	242	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?
243	243	{{/info}}
244	244
245		-{{section}}
246		-{{column}}
	235	+
	236	+
247	247	==== Alternativtext im Texteditor Tiny MCE hinterlegen ====
248	248
249	249	[[image:attach:Texteditor-Bildbeschreibung.png||data-xwiki-image-style="img-screen" data-xwiki-image-style-border="true" width="500"]]
250		-{{/column}}
251	251
252		-{{column}}
	241	+
	242	+
253	253	==== HTML-Code nutzen ====
254	254
255	255	**Alternativtext mit dem Attribut alt**
...	...	@@ -263,8 +263,6 @@
263	263	{{code}}
264	264	<img ... alt=" " />
265	265	{{/code}}
266		-{{/column}}
267		-{{/section}}
268	268
269	269	{{info}}
270	270	Für Bilder sollte auch der Kontrast geprüft werden. Das Hauptobjekt im Bild sollte sich ausreichend vom Hintergrund abheben. Tipps erhalten Sie bei [[leserlich.info>>url:https://www.leserlich.info/kapitel/bilder.php||shape="rect"]].