Ein Relaunch für die Website des Leipziger Yogastudios Yoga.raum stand an. Eine der Anforderungen war die Umsetzung in Responsive Webdesign. Als Redaktionssystem kam WordPress zum Einsatz. Auf Basis des Responsive Themes entstand mittels Child-Theme das neue Webdesign, das Farben und Grafikelemente des alten Designs übernommen hat.
Beim wöchentlichen Kursplan habe ich mich gegen Responsive-Tables-Umsetzung entschieden, da die Übersichtlichkeit darunter gelitten hätte. Per media query gibt es zwei Varianten – eine Tabellenansicht für große Bildschirme und eine Listenansicht für Smartphones.
Auf der Seite Workshops kommen Responsive Data Tables (css-tricks) zum Einsatz.
Ab einer bestimmten Bildschirmbreite werden Tabellen per media query und CSS dazu gezwungen, sich nicht wie Tabellen zu ‚verhalten‘. Alle Tabellenelemente bekommen die CSS-Eigenschaft block-level. Im Falle dieser Tabelle reicht das schon. Die einzelnen Workshops werden optisch voneinander getrennt durch die alternierenden Farben der geraden und ungeraden Tabellenzeilen.
Ab einer bestimmten Bildschirmbreite werden Tabellen per media query und CSS dazu gezwungen, sich nicht wie Tabellen zu ‚verhalten‘. Alle Tabellenelemente bekommen die CSS-Eigenschaft block-level. Im Falle dieser Tabelle reicht das schon. Die einzelnen Workshops werden optisch voneinander getrennt durch die alternierenden Farben der geraden und ungeraden Tabellenzeilen.
