Hallo Gabriele,

Roberts Hinweise auf das Wiki sind auf jeden Fall hilfreich. Das Thema "Menü" wird in der Artikelgruppe Navigation behandelt. Dies richtig und zugänglich zu machen, ist nicht trivial. Ob es mit den neuen command-Attributen ohne JavaScript lösbar ist, weiß ich noch nicht. Bisher brauchte man JavaScript für eine gute UX bei Assistenztechniken.

Ein @media-gesteuertes Grid-Layout für deine Seite scheint auf den ersten Blick trivial. Aber…

Du sagst, du hast Erfahrung. Dann solltest Du wissen, dass zwei Screenshots/Skizzen nicht reichen, um etwas hinreichend genau zu spezifizieren. Spontan fallen mir folgende Unklarheiten auf:

• Sollen Thema1 bis Thema10 in der "Schmal" Ansicht hinter dem Hamburger-Button erscheinen?
• Sind die Links zu Datenschutz und Impressum am unteren Bildschirmende festgenagelt oder muss man, um sie bei längerem Artikeltext zu erreichen, nach unten scrollen? Oder anders gefragt: welche Teile der Seite sollen scrollen, wenn der Artikel oder auch die Themenbox zu hoch sind?
• Es sieht so aus, als würde der "Text" neben dem "Bild" nicht über die Breite der Themenliste hinausragen und der "Seitentitel" über dem Artikel zentriert sein. Was soll im Layout passieren, wenn da nicht "Text", sondern "Textverarbeitungsprogramm" steht? Was soll passieren, wenn dieser "Text" in den "Seitentitel" hineinragt? Nach welchen Vorgaben soll die Breite verteilt oder umgebrochen werden?
• Wo landet in der schmalen Ansicht die Themen-Überschrift? Und vor allem: Was ist <h1> und was ist <h2>? Wenn die Themen-Überschrift die h1 sein soll, dann darf sie nicht einfach weggelassen werden.

Die Auswirkungen der Antworten können von klein bis gravierend reichen. Ohne Antworten ist zu vermuten, dass ein Muster-Wireframe deinen Wünschen nicht gerecht wird.

Rolf