Mobile und Responsive

Durchgehend konsistent dank Responsive Design und dem richtigen mobilen Konzept

Stefan
Web-Strategie Web-Relaunch Website Web-Projekte Mobile Responsive Webdesign Personas

Alexander Gessler

Über den Autor

Alexander Geßler ist studierter Industrie- und Interface Designer und arbeitet als Interaction Designer in Berlin bei der Infopark AG. Er ist Experte mit langjähriger Erfahrung in der Umsetzung mobiler Konzepte und Webseiten mit Responsive Webdesign.


Durchgehend konsistent dank Responsive Design und einem mobilen Konzept

Dass immer mehr Nutzer mobil im Internet surfen, ist nichts Neues. Welches Ausmaß die mobile Webnutzung inzwischen hat, belegt unter anderem Googles Entscheidung, den Mobile Index zum primären Index zu machen [https://webmasters.googleblog.com]. Spätestens jetzt sollten Sie deshalb Ihre Webseite mit Reponsive Design für alle Endgeräte optimieren. So stellen Sie Ihr Unternehmen und Ihre Produkte unabhängig vom Medium durchweg konsistent dar.


Mobile First

Statt einer abgespeckten mobilen Version bringen Sie mit Responsive Webdesign Ihren Webauftritt in vollem Funktionsumfang auch zum mobilen Nutzer, denn die Inhalte passen sich fließend an die technischen Bedingungen der jeweiligen Endgeräte an – nicht nur an die Bildschirmgröße, Orientierung und Auflösung, sondern auch an die Navigationsmöglichkeiten per Tastatur, Maus oder Touchscreen.

Statt eines starren Seitenlayouts werden die Inhaltselemente in der übersichtlichsten Anordnung angezeigt, ohne dass der Nutzer seitlich hin- und her scrollen oder zoomen muss.

Abgesehen vom Bedienkomfort, der erhöhten Reichweite und besseren Nutzerzufriedenheit spart Responsive Webdesign Zeit und Geld, weil nur eine Webseite erstellt und gepflegt werden muss.


Technologie und Konzept

Moderne Lösungen wie Content-Management-Systeme oder fertige Frameworks wie Bootstrap bieten bereits eine Reihe von standardisierten Grundlagen, die den Aufwand für die Programmierung von Responsive Websites merklich verringern. Praktische Tipps zur technischen Umsetzung finden Sie in unserem Whitepaper.

Daneben macht es Sinn, die Webseite von vorne herein konsequent auf eine optimale Nutzererfahrung auszulegen: Inhalte auf das Wesentliche zu reduzieren und immer die einfache Bedienung sowie übersichtliche Darstellung der wichtigsten Informationen in den Vordergrund zu stellen, egal ob der Nutzer mobil oder auf dem PC unterwegs ist. 

Die Faustregel ist: Was auf dem Smartphone funktioniert, sollte grundsätzlich auch auf dem Desktop funktionieren und umgekehrt.



Die sechs wichtigsten Themen für eine erfolgreiche mobile Strategie

Die folgenden Punkte sollten Sie berücksichtigen, um zukunftsfähige mobile responsive Webseiten zu entwickeln.

list 850178  340

Haken

Personas

Analysieren Sie zunächst Ihre verschiedenen Zielgruppen – und zwar gründlich. Wen genau wollen Sie ansprechen? Wie erreichen Sie diese Nutzer am besten? Wo und wie suchen diese Nutzer nach Informationen, und was erwarten sie von Ihrem Webauftritt? Erstellen Sie zu den verschiedenen Zielgruppenbereichen relevante Personas, also Typen-Steckbriefe. Dabei helfen Ihnen etwa Datenanalysen – unter anderem aus Webseitendaten –, die Analyse von Social Media-Trends und –Themen sowie Zielgruppenbefragungen. 


Was motiviert diese jeweiligen Personas? Welche Interessen haben sie? Welche Lebenswerte vertreten sie? Sie wollen diese Personas letztendlich auch auf der emotionalen Ebene für sich und Ihr Produkt einnehmen.

Haken

Content

Inhalt kommt vor Design: Eine Webseite kann immer nur so gut sein wie ihre Inhalte. Das schickste Design nutzt nichts, wenn der Besucher nicht die Informationen findet, die er sucht. Überlegen Sie sich genau, welche Botschaften Sie an wen vermitteln wollen. 


Setzen Sie Prioritäten. Die Inhalte sollten sich dabei von den jeweiligen Personas ableiten. Moderne Webseiten und CMS/CRM-Systeme können Inhalte personalisiert ausspielen und aus Standardbausteinen in Millisekunden automatisch eine zielgruppengerechte Ansprache zusammenstellen. 

Nutzen Sie die technischen Möglichkeiten, um personalisiertes Echtzeit-Marketing wirksam umzusetzen. Ihre Personas bilden die Struktur und den Ausgangspunkt dahinter.

Haken

Mobile First

Planen Sie ausgehend vom mobilen Nutzer – auch wenn das momentan nicht Ihre wichtigste Zielgruppe ist. Warum? Der Ansatz „Mobile first“ konzipiert eine Website zuerst für kleine mobile Endgeräte, um dann im nächsten Schritt davon ausgehend die Tablet- bzw. Desktop-Versionen zu adaptieren. Diese Methode hat den Vorteil, dass die Beschränkungen mobiler Endgeräte dazu anhalten, die Website zunächst möglichst schlank zu gestalten. 


Später ist es einfach, die Seiten so zu erweitern, dass sie auch auf großen Endgeräten gut dargestellt werden. So machen Sie Ihren Webauftritt wirklich zukunftsfähig.

Haken

Reduktion

Fassen Sie sich kurz: Schon allein um die Seite nicht unnötig zu verlangsamen, sollten Sie auf eine Überfrachtung mit Bildern, Videos und Details verzichten. Die Gestaltung sollte die Botschaft unterstreichen, nicht davon ablenken. Denken Sie daran, dass viele Nutzer auch nach Bildern statt nach Begriffen suchen. Ihre Bilder sollten also ebenfalls relevante Informationen vermitteln.

Haken

CDN

Achten Sie zusätzlich auf die Datenmengen, um Nutzer nicht durch lange Ladezeiten zu frustrieren und Ihr Suchmaschinenranking nicht negativ zu beeinflussen. Die Nutzung eines Content Delivery Network (CDN) oder eines CMS mit eingebundenem CDN stellt sicher, dass Bilder und Videos schnell an Ihre Webseitenbesucher geliefert werden, egal, von wo auf der Welt aus die Nutzer Ihre Website abrufen. 


Mit Diensten wie dem Amazon CloudFront CDN lässt sich weltweit eine optimale und ausfallsichere Web-Performance selbst bei Lastspitzen erzielen, zu einem verbrauchsabhängigen Preis.

Haken

Storytelling

Überlegen Sie sich, wie Sie Ihre Webseitenbesucher mit Storytelling und Content Marketing optimal ansprechen. Gerade mobile Anwender haben eine extrem kurze Aufmerksamkeitsspanne. Umso wichtiger ist es, ihr Interesse mit relevanten Inhaltsangeboten zu wecken und sie dabei nicht nur zu informieren, sondern auch zu unterhalten. Die Inhalte können dabei zum Beispiel in Form von kurzen Artikeln, Interviews, Videos, Ratgebern oder Anwenderstorys bereitgestellt werden. Das Wichtigste ist, dass sie originell, aktuell, ansprechend und gut aufbereitet sind – und einen echten Mehrwert bieten. 


Erzeugen Sie einen Dialog, indem Sie Call to Action-Elemente integrieren, etwa die Anmeldung zu einem Newsletter oder die Teilnahme an einer Umfrage. Überzeugte Nutzer werden Ihre Webseite immer wieder besuchen, sich zunehmend mit Ihrer Marke identifizieren und sie im Idealfall auch als ‚Brand Ambassador’ weiterempfehlen. Und: gute Inhalte sind ebenfalls ein wichtiger SEO-Faktor.


infopark  26 von 161

Sollten Sie weitere Informationen zum Thema Web-Strategie, mobile Strategie und Responsive Webdesign benötigen, freuen wir uns wenn Sie mit uns in Kontakt treten. 

Einen umfassenden Überblick zur Optimierung von Webseiten erhalten Sie auf der relaunch Konferenz