Slider sind ein beliebtes Element, um im Header, auf der Startseite oder im Portfolio einer Webseite spezielle Inhalte hervorzuheben. Ein riesiger Trend ist es, die Slider immer größer und sogar Bildschirm füllend zu gestalten. Ich finde die Featured-Slider besonders für Portfolios und Firmen-Präsentationen geeignet. Um zu zeigen, was man als Webdesigner alles aus den animierten Elementen herausholen kann, hier eine kleine Auswahl besonders kreativer Slider.
1. Haus
2. David A. Molanphy
3. Omnia Connect
4. Giraffe Restaurants
5. Nuemedia Web Design
6. CreamScoop
7. Malcolm Reading Consultants
8. TRÜF
9. Mark Boulton Design
10. Bunton
11. Sketchen
12. kollektivdreinull
13. Sven Prim
14. HWO Architects
15. Webdesign Zwolle
16. Buffalo
17. Brown Advertising
18. Violet
19. Andreas Ovefelt
20. Marie Catrib’s
Inspirationen zur eigenen Umsetzung
Um deinen eigenen Slider zu bauen, kannst du entweder ein JavaScript-Plugin oder, falls du WordPress verwendest, eines der praktischen WordPress-Plugins nutzen. Hier einige Ansätze, die dir bei der Umsetzung deines Sliders weiterhelfen.
- Ein sehr schöner JavaScript-Slider vor allem für die Präsentation von Bildern ist der Nivo-Slider.
- Den vielseiten Slidedeck-Slider gibt es als JavaScript- oder WordPress-Plugin. In meinem Artikel »Individuelle Featured Content Slider mit dem Slidedeck WordPress-Plugin« kannst du nachlesen, was du mit dem Slider alles anstellen kannst.
- Der Coin Slider hat ähnliche Funktionen, wie der Nivo-Slider und ebenfalls schöne Animations-Effekte.
- Der Featured Content Slider von CSS Tricks zeigt bereits kleine Vorschaubilder der Featured Posts an.
- Mit dem Easy Slider 1.7 von CSS Globe kannst du ebenfalls leicht anzupassende Slider bauen.
- Falls du eine WordPress-Seite hast ist der Artikel »Top 10 Content Slider Plugins for WordPress« bei Speckboy sehr hilfreich.
Wie gefallen dir die Featured Content-Slider? Kennst du noch weitere Webseiten, die ein schönes Slider-Element haben oder hilfreiche Slider-Plugins, um einen eigenen Slider zu bauen? Über dein Feedback und weitere Tipps freue ich mich sehr!
5 Kommentare
Wieder ein sehr guter Beitrag.
Finde es gut das du nicht nur die ganzen Websiten mit den tollen Beispielen auflistest, sondern auch eigene Lösungswege vorschlägst.
Wobei mir grade auffällt, dass das wirklich schicke Design von Sven Prim, extrem lange Ladezeiten hat. Zumindest bei mir. Sowas ist natürlich nicht wünschenswert und schreckt potenzielle Kunden eher ab.
Antwort an Robin
Hallo Robin,
vielen herzlichen Dank für deinen Kommentar und das tolle Feedback :-)
Du hast Recht, Sven Prims Portfolio braucht schon ein bisschen lang zum Hochladen. Es solches Portfolio ist als Kunden-Referenz eventuell weniger geeignet. Da wäre ein schickes Design mit weniger aufwendiger Programmierung vielleicht besser geeignet :-)
Viele Grüße,
Ellen
Vielen Dank für die schöne Auflistung. Besonders gut gefällt mir das Beispiel von Webdesign Zwolle. Dreimal darfst du raten, wieso ;)
Antwort an Barbara Frolik
Hallo Barbara,
vielen Dank für dein Feedback. Hehe, wie hätte es anders sein können ;-) Die Schafe sind aber auch echt niedlich, und machen sich prima auf dem Slider :-)
Viele Grüße,
Ellen
Mit Slideshows im Header arbeite ich schon länger, aber Deine Auflistung hat mich inspiriert, dass man aus diesem Feature deutlich mehr herausholen und echte Informationen transportieren kann. Im Grunde kannst Du mit einem Content-Slider eine völlig neue Usability schaffen …
Liebe Grüße aus Bayern
Matthias