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

CSS Grundgerüst automatisch erstellen lassen Der erste Wurf eines Templates ist recht nervig. Ich weiss nicht wie ihr vorgeht, aber ich beginne erst einmal damit die komplette Struktur in HTML au...
Bacon.js – Bezier-Kurven für Texte Das Leben eines Webworkers ist nicht einfach, vor allem dann wenn man einem Kunden erklären muss, dass ein Bild mit Transparenz - auch wenn es dreimal...
Lint für CSS Und noch ein Lint! Über das für jQuery habe ich ja bereits berichtet, nun gibt es das Ganze auch für CSS als Webapp mit dem Namen CSS Lint. Frei nach ...
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.