+++LIVE+++ #WWSIV heute ab 20:00 Uhr LIVE auf Twitch! +++LIVE+++

HTML von a bis z-z II: Inhaltszerstückelung

Folge №51 · Veröffentlicht am: · Spielzeit: 115 Minuten

Entwickler*innen, Entwickler*innen, Entwickler*innen! Semantische Inhaltssektionierungselemente sind das Thema. Weil so keiner bei Google findet: wir sprechen über die HTML-Elemente die den Inhalt grob strukturieren, wie header, footer, main, section, article etc. Dabei geht’s auch mal in die eine oder andere Untiefen der impliziten roles. Dazu servieren YouTube CSS-Tutorials und zeigen was man mit der Shape-Detection API so anstellen kann. Wer in der HTMHölle lebt, wird diese Sendung lieben!

Shownotes

Begrüßung – [00:00:54]

Retro

Property der Woche: Shape Detection API – [00:33:22]

Tagesthema: Content Sectioning

  1. Warum überhaupt Content Sectioning? – [00:37:44]
  2. <address> – [00:44:47]
  3. <article> – [00:48:36]
  4. <aside> – [00:54:40]
  5. <footer> – [00:58:39]
  6. <header> – [01:01:58]
  7. <h1>-<h6> – [01:08:31]
  8. <main> – [01:17:26]
  9. Einwurf WWSIF Shorts und AI – [01:25:17]
  10. <nav> – [01:31:05]
  11. <section> – [01:36:46]
  12. Accessibility und aria-label – [01:40:52]

GeilTeil

Das Ende – [01:51:11]

Kommentare

Name

Jens Grochtdreiskommentierte

am

Schönen Dank für die neue Serie. Bei Screenreadern bin ich immer wieder mit meinen Testmöglichkeiten am Hadern. Aber vor allem damit, dass diese Software noch disparater ist, als die darunter liegenden Browser.

Ich behelfe mir gerne mit ein paar Übersichten über Unterstützung von Elemente – manchmal ist das ernüchternd. Ich habe Euch mal hier die m.E. hilfreichsten zusammengestellt:

https://gist.github.com/jensgro/72842c322678390f9080c387b6d66cb0

Ich freue mich über weitere Links. Die habe ich in meinem Raindrop-Account. Aber es gibt bestimmt noch ein paar weitere.

Name

Moritzkommentierte

am

Sehr hilfreich, danke!

Kommentiere!
Folgendes HTML erlaubt
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> 

Die E-Mail-Adresse wird nicht öffentlich angezeigt.

Wir sind im Moment live auf Twitch!