SlickMap – Sitemaps schnell und einfach als Unordered List mit CSS

Es gibt nicht einen Kunden, der nicht auf seiner noch so winzigen Homepage eine Sitemap haben will. Der tiefere Sinn erschliesst sich zumeist nicht. Wenn er auch über sonst nichts diskutiert, aber über die Punkte in der Sitemap wird gekämpft bis Blut fliesst. Hat man netterweise ein CMS (oder eine eCommerce-Lösung) im Einsatz, steht man zusätzlich vor dem Problem, diese zu automatisieren. In der Regel endet die Sitemap immer in einem riesen Rumgewürge, die das, was der Kunde sehen will, gerade nicht so anzeigt wie er denkt, und man eine statische Version hinterlegt. Erschwerend kommen dann noch Design-/Darstellungs-Probleme hinzu.

Demo einer SlickMap

Genau aus diesem Grund habe ich mit sehr großem Interesse SlickMap CSS in Augenschein genommen. Die kleine CSS-Datei erstellt keine Sitemap, sie hilft lediglich bei der Darstellung. Das reicht aber auch schon, da sie so sowohl bei automatisch generierten, als auch statischen Sitemaps eingesetzt werden kann. Sie baut dabei auf eine ziemlich simple Unordered List auf, wie man dieser Beispiel-Seite entnehmen kann.

Die 12kb große CSS schafft es dabei so gut wie ohne Klassenangaben oder IDs eine Sitemap vernünftig darzustellen. Änderungen an dieser gehen aufgrund der intuitiv benutzbaren ul-Struktur wie nichts. Wirft man einen Blick in die CSS merkt man schnell, das auch die Farben ziemlich schnell anzupassen sind, und insofern ist der kleine Helfer eine astreine Wahl, um die eigene Web-Entwicklung zu vereinfachen und zu beschleunigen.

Ähnliche Beiträge

Einfaches HTML Testing mit dem HTML Inspector Damals, als ich noch den Firefox verwendet habe, gab es ein nettes Tool mit dem man testen konnte ob HTML valide ist. Dann kam HTML5, alles wurde ande...
Der ultimative CSS gradient Generator CSS Gradients sind nicht nur ein neuer Hype, sondern eine äußerst sinnvolle Sache, da sie helfen, statische Grafiken loszuwerden und schnell austausch...
CSS Refresh ohne Reload, dafür mit JavaScript Seien wir doch mal ehrlich, was ist die am meisten genutzte Taste auf eurer Tastatur? Richtig! F5 - Reload! ;) Das nervige Reloaden einer Seite kann d...
CSS Reset vs. Normalize Die Tage ging ein Aufschrei durch Twitter: die HTML5-Boilerplate hat den CSS-Reset raus geworfen, und durch ein Normalize ersetzt. Ich war relativ ers...

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.