Themes

Responsive Webdesign: 15 kostenlose WordPress-Themes

18. April 2012
von

Als Betreiber einer Seite, die WordPress als Motor benutzt, ist man mit großer Flexibilität gesegnet, was die Erweiterungsmöglichkeiten angeht. Wenn jedoch ein Layout gefragt ist, welches auch auf mobilen Geräten funktioniert, kann guter Rat schnell teuer werden.

Webdesign für mobile Geräte: Die Alternativen

Vor allem aus diesem Grund, aber natürlich zudem wegen der schnellen Einsatzbereitschaft, waren spezielle mobile Themes, wie etwa WPTouch lange Zeit das Mittel der Wahl. Besucher mit mobilen Clients erhielten eine ganz eigene, auf das kleine Display optimierte Darstellung der Inhalte, die jedoch sehr standardisiert war. Raum für eigenes Design, von CI-Konformität ganz zu schweigen, war nicht gegeben.

So griffen Betreiber mit größerem Budget zur zweigleisigen Lösung. Meist unter eigener Subdomain wurde eine komplette zweite Seite mit eigenem Webdesign aufgebaut, die dann optimal auf Mobilgeräte angepasst werden konnte, mit der eigentlichen Hauptseite jedoch bisweilen nicht einmal mehr die Inhalte teilte.

Erst in jüngerer Zeit wurden auch für Seitenbetreiber ohne Webdesign-Skills oder entsprechendem Budget Lösungen verfügbar, die auf den Prinzipien des Responsive Webdesign basieren. Hier werden für die unterschiedlichen Displaygrößen eigene CSS-Stylesheets erstellt und per Mediaquery an die entsprechenden Geräte ausgeliefert, wodurch auch UI-Elemente, Logos und sonstige Seitenbestandteile optimal dargestellt werden.

Wir stellen im Folgenden 15 interessante Vertreter responsiver und kostenloser WordPress-Themes vor:

[1] Skeleton

Skeleton basiert, der Name deutet es bereits an, auf dem Skeleton-Framework. Das Skeleton-Framework, das mit dem Begriff Boilerplate treffender beschrieben ist, stellt verschiedene CSS- und Javascript-Dateien für das schnelle, dabei mobile Webdesign bereit. Es basiert auf dem populären 960er Grid und skaliert von dort aus hinab zu mobilen Bildschirmauflösungen. Das gleichnamige WordPress-Theme integriert weitere Funktionalitäten und legt dabei besonderen Wert auf die Konsistenz der Bedienung über alle Geräte hinweg. So hat es etwa den Formularanpasser Formalize und das Options-Framework an Bord.

Mehr Informationen zu Skeleton | Demo

[2] Origin

Origin besticht durch Minimalismus und elegante Optik. Es basiert auf dem Hybrid-Core-Framework, ist also als Ausgangspunkt für Childtheming gedacht. Zur einfachen Anpassung an deutsche Bedürfnisse wird ein .po/.mo für die Übersetzung mitgeliefert. Neben der englischen liegt eine französische Version bereits vor.

Mehr Informationen zu Origin | Demo

[3] iTheme2

iTheme2 erinnert stark an ältere Apple-Websites und ist aufgrund des sehr technischen Layouts sicherlich prädestiniert für Websites, die sich thematisch in die gleiche Richtung bewegen. iTheme2 bringt zwei verschiedene Skins und einen Slider für Featured Posts mit. Auch wenn es zunächst nicht so aussieht: iTheme2 ist kostenlos verfügbar.

Mehr Informationen zu iTheme2 | Demo

[4] Hatch

Hatch, aus dem gleichen Hause wie Origin stammend, ist ganz ähnlich wie dieses aufgebaut. Auch Hatch ist als Parenttheme konzipiert und bringt die erforderlichen Dateien für die Anpassung an die deutsche Sprache mit. Ansonsten ist es allerdings eher als Portfolio-Website für Fotografen oder Designer geeignet. Zur Umsetzung der gesamten Präsentationsfunktionalität (Galerien etc.) setzt Hatch auf WP-Bordmittel. Lediglich eine separate Lightbox, hier Fancybox, wird mitgeliefert.

Mehr Informationen zu Hatch | Demo

[5] Ambrosia

Ambrosia basiert auf Paul Irishs HTML5 Boilerplate, setzt also auf HTML5/CSS3. Das Theme ist recht minimalistisch, was die Verwendbarkeit als mobiltaugliches Design vereinfacht. Entwickler John Tsevdos verspricht, dass sich das Theme automatisch an die Screens von iOS-Devices anpasst. Ambrosia kommt zwar nicht direkt mit einer deutschen Übersetzung daher, ist aber so gebaut, dass es in verschiedene Sprachen übersetzt werden kann. Ambrosia integriert die Google Fonts Library.

Mehr Informationen zu Ambrosia | Demo

[6] Ari

In einer Übersicht von kostenlosen WordPress-Themes mit responsivem Layout dürfen natürlich keinesfalls die fantastischen Themes aus dem Hause Elmastudio fehlen. Den Anfang macht Ari, ein vom Grundsatz her minimalistisches, aber flexibel auch grafisch aufblasbares Theme mit deutscher und englischer Sprachführung. Auf der Theme-Seite zu Ari hält Elmastudio ein Showcase mit Livebeispielen abgewandelter Ari-Layouts vor.

Mehr Informationen zu Ari | Demo

[7] Yoko

Yoko positioniert Elmastudio als gut geeignet für größere Blogs oder Magazine, wohingegen Ari mehr den Einzelblogger zufrieden stellen soll. Ich habe mich an diese Positionierung gehalten und betreibe mein persönliches Blog, die Blogmanufaktur, unter Ari und mein größeres Anti-Abmahnprojekt Lebensmittelfotos.com unter Yoko. Auch zu Yoko unterhält Elmastudio ein Showcase mit teils so stark abgewandelten Derivaten, dass man den Ursprung kaum wiedererkennen kann. Das spricht für die große Flexibilität des Themes.

Mehr Informationen zu Yoko | Demo

[8] WidePhoto

WidePhoto aus dem Hause Buzzrain ist ein responsives WP-Theme, welches dazu gedacht ist, Fotos bildschirmfüllend zu präsentieren. Lediglich eine kleine Navigation in der linken oberen Ecke steuert die Blogfunktionalität. So überrascht es nicht, dass WidePhoto in der Lage ist, sich an alle Bildschirmauflösungen anzupassen.

Mehr Informationen zu WidePhoto | Demo

[9] GridPhoto

GridPhoto ist neben WidePhoto und Photolistic (nicht responsiv) das dritte freie Theme aus dem Hause Buzzrain. GridPhoto eignet sich hervorragend für die Präsentation von Fotos, Bildern oder Screenshots. Wie der Name vermuten lässt, ordnet das Theme die zu präsentierenden Medien in einem Grid, einem Gitternetz, an. Das Grid skaliert dynamisch je nach Auflösung des Besucherclients. So ist eine stets optimale Darstellung gewährleistet.

Mehr Informationen zu GridPhoto | Demo

[10] Pronto Free Masonry Gallery

Ebenfalls gridbasiert arbeitet das Theme Pronto Free von WPExplorer. Anders als GridPhoto orientiert es sich jedoch eher an Pinterest. Will man nicht nur grafische Medien, sondern auch den einen oder anderen Text unterbringen, kann Pronto Free wohl bessere Dienste leisten. Auch bei Pronto Free skaliert das Grid mit der Größe des Browserfensters.

Mehr Informationen zu Pronto Free | Demo

[11] Respo

Respo, das ist doch mal ein sprechender Name. Respo ist offensichtlich responsiv und basiert auf dem Theme-Framework Themnific. Es orientiert sich entfernt in die gleiche Richtung wie das Ari-Theme, eignet sich mithin eher für kleinere Websites und Einzelblogger. Respo liefert den jQuery-Slider Flexslider gleich mit und arbeitet, wie viele andere responsive Themes, auf der Basis eines Grids.

Mehr Informationen zu Respo | Demo

[12] Grid Theme Responsive

Grid Theme Responsive aus dem Hause dessign.net ist ein weiteres Theme, das sich bestens für die Präsentation etwa von Fotografen-Portfolios eignet. Nach eigenen Angaben ließen sich die Entwickler von modernen Modemagazinen inspirieren. Schick am gridorientierten Layoutkonzept des Themes ist das Infinite Scrolling, das bei Erreichen des unteren Bildrandes weitere Inhalte nachlädt. So entsteht der Eindruck einer einzigen riesigen Fotowand.

Mehr Informationen zu Grid Theme Responsive | Demo

[13] Gridly

Gridly von Eleven Themes kommt für mich optisch dem Senkrechtstarter Pinterest am nächsten. Lediglich eine Topbar unterbricht das ansonsten von links nach rechts durchgängige Präsentationsgrid. Gridly kommt in zwei Farbvarianten und ist nach Angaben der Entwickler auf die iPhone-Darstellung optimiert. Ich konnte jedoch auch auf meinem Android-Phone responsives Verhalten feststellen. Besonders elegant: Die Anpassung bei Größenänderung des Browserfensters ist sanft animiert.

Mehr Informationen zu Gridly | Demo

[14] Ascetica

Ascetica, erstellt auf der Basis des Hybrid Core Frameworks, bedient die gleiche Zielgruppe wie Elmastudios Ari-Theme. Auch vom Layout insgesamt ähneln sich die beiden minimalistischen Themes deutlich. Ascetica bringt zur Präsentation von Featured Posts den Flexslider mit und ist neben den Themes von Elmastudio mein persönlicher Favorit dieser Übersicht.

Mehr Informationen zu Ascetica | Demo

[15] Responsive Theme

So nüchtern wie der Name ist auch die Optik dieses ganz frischen und in sehr aktiver Entwicklung befindlichen WordPress-Themes aus dem Hause ThemeID. Responsive Theme ist daher eher als Startpunkt für ein eigenes Design zu verstehen. Die Entwickler geben Unterstützung sogar über ein angegliedertes Forum. Spenden werden gern genommen.

Mehr Informationen zu Responsive Theme | Demo

Alle Screenshots im Überblick:

(do)

ist seit 1994 im Netz unterwegs, aber bereits seit fast 30 Jahren in der IT daheim. Seit 2008 schreibt er für Dr. Web, seit 2012 ist er Chefredakteur des Magazins. Man findet ihn auch auf Twitter und Facebook, aktiver ist er allerdings auf Google+.

14 Kommentare zu „Responsive Webdesign: 15 kostenlose WordPress-Themes
  1. Stephan am 18. April 2012 um 09:07

    Tolle Themes, aber die von Elmastudio gefallen mir immer noch am besten…schlicht und trotzdem irgendwie edel :)…aber wer sich mit dem Erstellen von WordPress-Themes auskennt, sollte eigentlich keine allzu großen Probleme haben, selbst mittels Media-Queries sein eigenes Responsive-Webdesign-Theme zu erstellen.

  2. [...] Dr. Web] adscale_slot_id="NDFkZTAw"; Teile den [...]

  3. [...] Hier geht es zu den 15 Responsive WordPress Themes. [...]

  4. DanielB am 3. Juni 2012 um 09:22

    Vielen Dank für die Übersicht der Themes. Genau nach so etwas habe ich gesucht. Sie sind einfach, leicht händelbar und auf mobilen Geräten einsatzbereit.

  5. Mika am 30. Juli 2012 um 10:17

    Diese Artikel hat viele Besucher verdient. Vielen Dank !

  6. [...] Extra: 15 WordPress Themes die für mobile Geräte optimiert wurden gibt es hier bei Dr.Web. Hier kann viel Geld gespart werden, vor allem weil die Themes sehr hochwertig und edel entworfen sind! [...]

  7. [...] 15 kostenlose Responsive WordPress Themes [...]

  8. Meister Web am 17. September 2012 um 00:52

    Vielen Dank für diese Liste mit Themes!
    Sind ein paar echt coole Themes dabei!
    Grüsse

  9. [...] diese Funktion verfügen. Eine weitere Übersicht zu 15 kostenlosen WordPress-Themes hat dr.web in einem Artikel erstellt. Suchen Sie sich doch gleich eines der Themes für Ihre Webseite aus [...]

  10. Pedro am 21. Dezember 2012 um 23:54

    Hallo zusammen, da ich jetzt schon zig Foren durchsucht habe und keine Lösung gefunden habe versuch ich es hier.
    Ich habe mit dem Hatch Them Verbindungsabbrüche und kann mich dann auch nicht mehr einloggen. Kann das an WP. 3.5 liegen?

    PS: Die Seite ist echt genial… hätte ich schon vor zwei Wochen wissen sollen.

    Vielen Dank
    Pedro

  11. Sophie am 8. Februar 2013 um 13:51

    Vielen Dank für diese sehr nützliche Sammlung an WordPress-Themes. Habe bisher hauptsächlich englische Seiten zu dem Thema gefunden und freue mich, nun endlich auch was deutschsprachiges gefunden zu haben!

  12. smoking.gnus am 20. März 2013 um 07:35

    Hallo und Guten Morgen allen miteinander,

    danke für diese schöne und vor allem hilfreiche Übersicht responsiver WordPress Themes. Kommt mir gerade gelegen, da ich derzeit eine Website in eigener Sache realisieren möchte, basierend auf WP.

    Besten Dank und weiter so…
    Ludewich K.

  13. Antwortende Post(s) | Engelspost(s) am 23. April 2013 um 00:03

    [...] Und wo sucht man, wenn man Themes sucht, die responsive und umsonst sind? Richtig, bei DR.Web! Hier findet ihr 15 kostenlose Responsive WordPress-Themes. Wie ihr seht, die Auswahl an Responsive [...]

Ein Kommentar? Schön!

Wir freuen uns immer über Leser, die durch nützliche und konstruktive Beiträge zum Thema eine Diskussion anstoßen oder den Artikel mit weiteren Informationen anreichern. Alle Kommentare werden in diesem Sinne moderiert. Zum Kommentar-Fairplay gehört für uns auch der Einsatz von rel="nofollow". Bitte verwenden Sie zudem als Namen weder eine Domain noch ein spamverdächtiges Wort. Vielen Dank!