Änderungen von Dokument Erstellung barrierefreier Inhalte
Zuletzt geändert von Carina Enke am 26.11.2025
Von Version 199.1
bearbeitet von Katharina Schönefeld (Admin)
am 28.02.2024
am 28.02.2024
Änderungskommentar:
Es gibt keinen Kommentar für diese Version
Auf Version 210.1
bearbeitet von Katharina Schönefeld (Admin)
am 28.02.2024
am 28.02.2024
Änderungskommentar:
Es gibt keinen Kommentar für diese Version
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. ... ... @@ -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"]].