Responsive Webdesign mit WordPress

Wie schaffen Sie es, dass auch mobile Nutzer Ihre Website lieben? Finden Sie es heraus! Bild von ©Production Perig – de.fotolia.com

Die mobile Internetnutzung ist auf dem Vormarsch. Täglich befinden sich Millionen User mit ihrem Smartphone auf der Datenautobahn. Laut Statistiken verwenden Ca. 81% das Smartphone, um im Netz zu surfen (Stand 2016). Doch jeder mobile Nutzer hasst Websites, die nicht mobil optimiert sind. Responsive Webdesign wird dabei immer mehr bei WordPress Seiten zum Thema, denn damit können Sie Ihre Website für alle Endgeräte optimieren. Nur wenn Sie Responsive Webdesign beherrschen, schaffen Sie es heutzutage, die mobilen Nutzer auf Ihre Seite zu ziehen.

Dieser Beitrag zeigt Ihnen, wie Sie genau das tun können. Was genau Responsive Webdesign ist und wie Sie eine Website entwickeln, die mobile Nutzer lieben werden, erfahren Sie in diesem Artikel.

Responsive Webdesign – Das Internet aus der Sicht eines mobilen Nutzers

Die Zeiten, an dem man nur Zuhause vor dem PC im Internet gesurft hat, sind vorbei. Immer mehr und immer öfter nutzen Menschen also die Datenautobahn von ihren Smartphones oder Tablets.

Mobile Geräte unterscheiden sich jedoch von PCs und Laptops in der

  • Bildschirmgröße
  • Nutzbarkeit in Hoch- oder Querformat
  • Bedienung über einen Touchscreen
  • evtl. geringeren Datenrate, wenn unterwegs über 3G gesurft wird

Es gibt über 200 verschiedene Auflösungen, in denen Ihre Webseite angezeigt werden könnte. Im Idealfall sollte die Seite auf allen Geräten übersichtlich und ansprechend dargestellt werden und somit für eine gute Usability sorgen. Denn wenn User unablässig zoomen und scrollen müssen, erhöht das Ihre Absprungrate.

Meist war hierbei die Lösung, zwei Versionen der Website anzubieten: Eine Desktopversion und eine mobile Version. Doch diese Methode ist zu umständlich und längst überholt mit den verschiedenen Anforderungen, denen eine Website heutzutage gerecht werden muss.

Responsive Design sorgt dafür, dass die Website von allen Gerätetypen aus nutzbar ist. Dabei nutzt es ein flüssiges Raster, bei dem die verschiedenen Webseiten-Elemente wie Texte und Bilder nicht in Größen in Pixel, sondern in Prozentwerten definiert sind und sich der Größe des jeweiligen Displays anpassen.

Außerdem werden im CSS-Code Breakpoints gesetzt. Dies sind Punkte, die bestimmen, ab wann sich das Layout verändert. So kann zum Beispiel eingestellt werden, dass ein Bild unter statt neben dem Text angezeigt wird, sodass die Breite des Displays unter eine bestimmte Pixelzahl sinkt. Das passendste Layout wird jeweils ermittelt, in dem sogenannte Media-Queries den Typ und die Eigenschaften des jeweiligen Endgerätes abfragen.

Im Großen und Ganzen wirkt Responsive Webdesign teuer und umständlich. Doch ist es den Aufwand wert? Die Antwort lautet ganz einfach: Ja. Denn das Geld, dass Sie für ein gutes Responsive Webdesign ausgeben, können Sie über höhere Umsätze wieder einholen, wenn durch eine gute Performance Ihrer Website mehr auf diese zugreifen.

Darum ist es besonders wichtig, dass Sie Ihre Website mobil optimieren

Der Mobile-First-Index wurde von Google schon im November 2016 angekündigt. Demnach bewerten Google nicht länger nur eine Version einer Seite, sondern ausschließlich die Ansicht über mobile Endgeräte. Dabei wird die Nutzung von Responsive Design, die Implementierung dynamischer Inhalte und die Ladezeit der Website genau betrachtet.

Webseiten, die dabei nicht gut abschneiden, können im Folgenden benachteiligt werden. Um also vor Suchmaschinen wie Google gut dazustehen, sollten Sie auf jeden Fall dafür sorgen, dass Ihr Internetauftritt mobil optimiert ist.

Was ist das Besondere an Responsive Webdesign mit WordPress?

WordPress ist eines der am meisten genutzten Content Management Systeme (CMS) auf dem Markt. Fast 33% aller Webseiten, die ein CMS nutzen, sind WordPress Seiten. Und als bekanntestes Redaktionssystem will WordPress natürlich auch bei der Entwicklung des mobilen Internets mithalten. Dafür vereinfacht es die Etablierung von Responsive Design um ein vielfaches.

Denn mit WordPress brauchen Sie die Größe Ihrer Texte und Bilder nicht mehr mühsam im Code zu definieren, sondern können diese einfach durch Themes oder Plugins anpassen.

Responsive Themes

Eine bestehende WordPress Seite auf ein neues Theme umzustellen ist nicht schwer, aber oft ziemlich aufwendig. Denn dabei bedarf es Anpassungen in den Bereichen des Logos, des Headers, des Contents und des Footers.

Das Ergebnis nach diesem Aufwand wird jedoch sehr zufriedenstellend sein: Die meisten Responsive Themes passen sich optimal den Anforderungen verschiedener Bildschirmgrößen an. Zudem ist es bei vielen Themes möglich, Retina-optimierte Logos hochzuladen, die auf Displays mit hoher Pixeldichte besonders scharf und professionell wirken.

Responsive WordPress Themes gibt es wie Normale Layouts im WordPress Theme Verzeichnis entweder kostenlos oder kostenpflichtig. Die meisten Themes sind kostenlos in der Basisversion und bieten bei einem Upgrade auf eine kostenpflichtige Version weitere Features, die entweder mehr Anpassungsmöglichkeiten bieten oder die Nutzung des Themes erleichtern.

Responsive Plugins

Neben Themes gibt es noch eine weitere Möglichkeit, Ihre WordPress Seite für mobile Endgeräte zu optimieren: Plugins. Die Arbeit dieser Programme beschränkt sich jedoch auf die Ansicht für Smartphones und bietet so nur zwei Versionen an: Die Smartphone Ansicht und die für Desktop PCs. Der Webseitenbesucher kann auch zwischen beiden Ansichten eine auswählen.

Damit ist Ihre Seite nicht hundertprozentig responsiv für alle Bildschirmgrößen, dafür ist der Umstellungsaufwand aber auch nicht so groß. Responsiven WordPress Themes gegenüber haben Plugins noch einen weiteren Vorteil: Die Ladezeit Ihrer Seite ist deutlich geringer. Und eine erhöhte Webseitengeschwindigkeit ist vor Suchmaschinen besonders attraktiv. Dadurch wird Ihr Internetauftritt im Internet höher angesetzt, wodurch Sie einen höheren Traffic auf Ihrer Website generieren können.

Eines der bekanntesten Programme für die Erstellung mobiler Websites ist WP Touch. Dieses Plugin ist kostenlos in der Basisversion, die Premiumversion ist ab 79 $ (ca. 69,70 €) pro Jahr verfügbar.

So viel kostet Responsive Webdesign mit WordPress

Bis vor wenigen Jahren galt bei responsiven Webseiten die Prämisse, dass das Design vor allem aufwendig und teuer ist. Mobile Websites waren dadurch immer an die Überlegung geknüpft, ob sie den Aufpreis wert sein würden. Doch vor allem mit der wachsenden Beliebtheit von WordPress gilt heute eine andere Grundregel.

Die Bereitstellung von mobil optimierten Websites ist bei der Anzahl an Nutzern, die über Smartphone und Tablet im Web surfen, mittlerweile unabdingbar. Und da es über WordPress Themes, Plugins und Templates gibt, die die Optimierung vereinfachen, ist der Aufwand nicht mehr so hoch. Dazu kommt, dass responsive Webdesign je nach dem ausgewählten Theme oder der ausgewählten Erweiterung nicht mehr teurer als normale Webseiten sein müssen.

Generell kann man bei responsivem Design für WordPress Seiten mit einem Preis rechnen, der kaum einen Unterschied zu dem normalen Preis für WordPress Webdesign aufweist. Dieser bestimmt sich über den Umfang der zu Erstellenden Website und der Anzahl an zu Installierenden Plugins.

Im Großen und Ganzen können Sie für die Erstellung einer professionellen und erfolgreichen Website mit einem Preis ab 700 € für eine schlichte Basiswebsite rechnen. Alle Angebote, die von Webdesign Agenturen darunter angeboten werden, deuten darauf hin, dass entweder Kostenfallen im Vertrag versteckt sind, oder dass die Website basierend auf einem bereits bestehenden Template erstellt wird. Das bedeutet, dass Ihre Website nicht individuell erstellt, sondern dass nur Ihr Logo und Content eingefügt wurde. Diese Webseiten erwecken auf Nutzern oft den Eindruck, dass sie „von der Stange“ seien und konvertieren zudem wenig.

Achten Sie vor allem bei dem Angebot einer Webagentur darauf, dass alle aufgeführten Kosten nachvollziehbar mit den erbrachten Leistungen verbunden sind. Durch diese Kostentransparenz können Sie weder zu viel noch zu wenig für Ihr Projekt ausgeben.

Immer Responsive mit WPscaling

Wir von WPscaling erstellen Ihnen professionell Ihre Website – garantiert konvertierend und responsiv. Dabei nutzen wir Layouts, die wir bereits im Vorfeld auf die Usability und die Konversionsstärke getestet sind, damit Sie aus Ihrer Website das Beste rausholen können. Wenn Sie bestimmte Erweiterungen und Programme für Ihren Onlineauftritt brauchen, ist das für uns kein Problem – wir installieren Ihnen auf Wunsch alle Programme, die Sie brauchen.

Hierbei arbeiten wir schnell, professionell und garantiert mit fehlerfreiem Code für eine optimale Umsetzung Ihres Projektes. Damit Sie auf eine reibungslose Zusammenarbeit mit uns bauen können, stellen wir Ihnen direkt zu Anfang einen persönlichen Projektmanager zur Seite, an den Sie sich bei Fragen und Problemen wenden können.

Wir haben Sie überzeugt? Dann kontaktieren Sie uns und starten Sie noch heute mit uns durch!