Textelemente: Absätze, Listen und Hervorhebungen
Strukturieren Sie echte Inhalte mit den passenden Text-Tags.
Textelemente: Absätze, Listen und Hervorhebungen ist eine kostenlose Web Accessibility Academy-Lektion auf CoddyKit. Dies ist Lektion 2 von 4. Du kannst die komplette Lektion unten kostenlos lesen – dann übst du sie direkt im Browser mit einem integrierten Code-Editor und einem KI-Tutor rund um die Uhr. Sie ist Teil des Web Accessibility Academy-Lernpfads, und dein Fortschritt wird über Web und CoddyKit-App synchronisiert. Der Web Accessibility Academy-Kurs umfasst insgesamt 4 Lektionen.
Teile dieser Lektion wurden noch nicht übersetzt und werden auf Englisch angezeigt.
Mark Up Real Content
Text is most of the web, so marking it up correctly matters most. The right text elements make content readable for everyone, including screen reader users.
Paragraphs Are p
Wrap each block of prose in a p tag. It groups sentences into a real paragraph that assistive tech can navigate one chunk at a time.
<p>Accessibility helps everyone.</p>Do Not Fake Spacing
Avoid stacking empty divs or br tags to space text. Use real paragraphs and let CSS handle the gaps. Structure should come from the tag, not the styling.
Lists Are for Lists
When items belong together, use a real list. Screen readers announce the count, like list of three items, giving users instant context.
Unordered vs Ordered
Use ul when order does not matter and ol when it does, like steps. Each item lives in an li, never a loose div.
<ol>
<li>Open the door</li>
<li>Step inside</li>
</ol>Emphasis Means em
The em tag marks words you would stress when speaking. Screen readers can change tone, so the emphasis is actually heard, not just seen.
<p>This is <em>really</em> important.</p>Importance Means strong
The strong tag flags text of high importance, like a warning. It is meaning, not just bold styling, so it carries weight to assistive tech.
b and i Are Visual Only
The b and i tags only change appearance with no added meaning. Reach for em and strong when the stress or importance actually matters.
Quotes Have Tags Too
Use blockquote for a quoted block and q for a short inline quote. The semantics tell users the words came from somewhere else.
<blockquote>Build for everyone.</blockquote>Code and Abbreviations
Wrap inline code in code and spell out shortenings with abbr. These small tags add the precise meaning sighted readers infer from context.
<abbr title="Accessibility">a11y</abbr>Meaning Over Looks
The rule for text is simple: choose the tag for its meaning, then style it freely. Looks are CSS; structure is HTML.
Quick Check
Let us pick the meaningful tag.
Recap
Use p for prose, ul and ol for lists, and em and strong for real emphasis. Pick tags for meaning and leave the looks to CSS. 🎉
Häufig gestellte Fragen
Ist die Lektion „Textelemente: Absätze, Listen und Hervorhebungen“ kostenlos?
Ja — der vollständige Text von „Textelemente: Absätze, Listen und Hervorhebungen“ ist hier im Web kostenlos zu lesen. Um sie interaktiv zu üben (integrierter Code-Editor und 24/7 KI-Tutor) und den Rest des Web Accessibility Academy-Kurses freizuschalten, upgrade auf CoddyKit PRO. Der Web Accessibility Academy-Kurs umfasst insgesamt 4 Lektionen.
Was lerne ich in „Textelemente: Absätze, Listen und Hervorhebungen“?
Strukturieren Sie echte Inhalte mit den passenden Text-Tags. Du übst Web Accessibility Academy mit praktischem Code, den du direkt im Browser ausführst, und ein 24/7 KI-Tutor beantwortet deine Fragen während du die Lektion bearbeitest.
Brauche ich Erfahrung, um Web Accessibility Academy zu starten?
Keine Vorkenntnisse erforderlich. Web Accessibility Academy auf CoddyKit ist für Anfänger bis fortgeschrittene Lernende strukturiert, sodass du hier starten oder von Anfang an beginnen und in deinem eigenen Tempo voranschreiten kannst. Dies ist Lektion 2 von 4.
Wie lange dauert die Lektion „Textelemente: Absätze, Listen und Hervorhebungen“?
Die meisten CoddyKit-Lektionen dauern etwa 5–10 Minuten. Jede ist kompakt und interaktiv, sodass du stetig Fortschritte machst und genau dort weitermachst, wo du aufgehört hast – im Web und in der App.
Kann ich in dieser Web Accessibility Academy-Lektion Code schreiben und ausführen?
Ja. Jede Web Accessibility Academy-Lektion enthält einen integrierten Code-Editor, sodass du echten Code direkt in deinem Browser schreibst und ausführst und sofort KI-Feedback erhältst — ohne lokale Einrichtung erforderlich.
Alle Lektionen in diesem Kurs
- Tags haben Bedeutung: Warum div-Suppe scheitert
- Textelemente: Absätze, Listen und Hervorhebungen
- Der Accessibility Tree: Was Screenreader hören
- Nativ oder benutzerdefiniert: Wann Sie ein echtes Element verwenden sollten