(Meta)-Infos zu Texten

[marctrix]

Hej alle,

Ich mache mir gerade ein paar Gedanken zu längeren Texten. Ich finde es immer schön, wenn ein paar Informationen vorne weg stehen.

Wenn es barrierefrei sein soll (und das soll es ;-) ), müssten über diese Beschreibungen mittels aria-describedby auch Screenreader-Nutzer informiert werden.

Meiner Meinung nach wären diese Infos am Anfang des Artikels gut aufgehoben - also im header. Sauber verpackt in aufklappbare Elemente, um Sehenden anzuzeigen, dass es Infos gibt, ohne aber den eigentlichen Text aus dem Viewport zu schieben.

Meine Idee habe ich in einem Codepen veröffentlicht. Falls die nur ist (ich habe die jedenfalls so noch nicht gesehen), kann das Beispiel gerne ins Wiki übernommen werden - ich werde es meinerseits in einem Buch nutzen.

Hier geht es zum Beispiel

Hat jemand was zum Meckern/zu verbessern?

Marc

[Matthias Apsel]

Hallo marctrix,

Meiner Meinung nach wären diese Infos am Anfang des Artikels gut aufgehoben - also im header. Sauber verpackt in aufklappbare Elemente, um Sehenden anzuzeigen, dass es Infos gibt, ohne aber den eigentlichen Text aus dem Viewport zu schieben.

Doch. Finde ich sehr gelungen. Man sieht solche Zusammenfassungen immer öfter. Es spricht auch nichts dagegen, die Zusammenfassung ausgeklappt zu lassen, imho.

Meine Idee habe ich in einem Codepen veröffentlicht. Falls die nur ist (ich habe die jedenfalls so noch nicht gesehen), kann das Beispiel gerne ins Wiki übernommen werden - ich werde es meinerseits in einem Buch nutzen.

Danke.

Hat jemand was zum Meckern/zu verbessern?

nach „ca“ fehlt der Punkt.

Bis demnächst
Matthias

[marctrix]

Hej Matthias,

Hat jemand was zum Meckern/zu verbessern?

nach „ca“ fehlt der Punkt.

;-)

Ist erledigt (habe es ausgeschrieben) - danke für die Rückmeldung!

Marc

[Sanddorn22]

Danke Marc, für das anschaulich dokumentierte Beispiel.

Finde ich ein praktisches und hilfreiches Mittel bei der Gestaltung. Und sehr sauber umgesetzt. Die Lösung für den fehlenden Punkt gefällt mir auch. ;-)

Gruß
Sanddorn22

[marctrix]

Hej Sanddorn22,

danke für das Lob - alle Beispiele sind natürlich frei nutzbar. - Eine Lizenz wie GPL spare ich mir. Ich denke, die Erfindungshöhe ist nicht hoch genug, um ein Urheberrecht überhaupt zu rechtfertigen...

Von daher habe ich vermutlich eh keine rechtlichen Ansprüche, will aber deutlich machen, dass Weiterverbreitung ausdrücklich gewünscht ist!

Vielleicht wird das Web ja durch diesen und andere Codepens ein bisschen barriereärmer!

Bei @Gunnar Bittersmann finden sich übrigens auch immer interessante Codebeispiele ;-)

Ich nehme nicht an, dass er etwas frei zugänglich online stellt, was nicht genutzt werden sollte!

Marc

[Matthias Apsel]

Hallo marctrix,

Meine Idee habe ich in einem Codepen veröffentlicht. Falls die nur ist (ich habe die jedenfalls so noch nicht gesehen), kann das Beispiel gerne ins Wiki übernommen werden

Finden wir auch eine passende Stelle im Wiki?

//@Matthias Scharwies

Bis demnächst
Matthias

[Matthias Apsel]

Hallo marctrix,

Noch mal deutlich, damit es nicht beim circa-Punkt untergeht.

Es ist meiner Meinung nach nicht notwendig, die zusätzlichen Infos initial zu verstecken, im Gegenteil bedeuten sie doch einen zusätzlichen Klick. open existiert. Schließlich dienen die Zusatzinfos ja jedem Nutzer - sie liefern Informationen, ob der folgende Artikel überhaupt der Richtige für ihn sein könnte.

Dennoch ist mMn. das details-Element semantisch korrekt. Für eine besonders gute Nutzererfahrung sollte man sich den Zustand des details-Elements merken, zum Beispiel im localStorage.

Bis demnächst
Matthias