BLOG

Mobile Website oder responsives Design?

 

Wann benötigt man eine mobile Website für Smartphones, Tables etc. und wie richtet man diese am Besten ein? Darum dreht es sich in unserem heutigen Beitrag.

In den meisten Fällen wird ein sogenanntes responsives Design verwendet. Dieses ordnet die Inhalte auf mobilen Geräten automatisch an. So dass sie auf einem kleineren Bildschirm gut lesbar sind. Es gibt aber noch andere Möglichkeiten, die eigene Website mobil zu machen.

Hier möchte ich die drei gängigsten vorstellen:

Programmierung einer Website speziell für mobile Geräte

Man kann extra eine Seite nur für mobile Benutzer programmieren. Diese lässt sich einfach über WordPress verlinken. Ein Plug-In erkennt automatisch, wenn ein Besucher über ein Tablet oder Smartphone zugreift.

Diese Vorgehensweise ist zunächst etwas aufwendiger und kostenintensiver. Doch gerade für größere Unternehmen, die viel Inhalt auf ihrer Website haben, kann es Sinn machen. Eine spezielle mobile Website kann nämlich das ein oder andere Element weglassen. Zudem lassen sich Texte verkürzen, um auf dem Smartphone übersichtlicher zu sein.

 

Mobile Website über WordPress erstellen

WordPress erlaubt es eine Seite für mobile Geräte direkt über ein Plug-In namens „WP Touch“ zu erstellen. So spart man etwas Zeit, da man nicht alles doppelt machen muss. Dieses Plug-In gibt es als Gratis- und Pro-Version. Es erlaubt, ein passendes Theme für die mobile Version auszuwählen. So kann die Seite wie die reguläre WordPress-Seite verwaltet werden.

 

Zweites WordPress im Unterordner installieren

Diese Variation geht einher mit der 2. Möglichkeit. Man kann beim einfach in einem Unterordner ein zweites WordPress installieren. Dieses wird dann einfach für mobile User verlinkt. Der Vorteil hierbei ist, dass WordPress bereits bekannt ist in seinen Funktionen. Man kann dabei über die WordPress Multisite Funktion mehrere Seiten zusammenschalten.

Zudem betreffen gegebenenfalls auftretende Fehler nicht sofort beide Seiten. Dies geht auch Domain-übergreifend, ist aber etwas komplizierter. Wer nicht mit Plug-Ins arbeiten will, für den ist dieses Vorgehen eine gute Lösung.

Hier hast du ein Mal einen Überblick zu diesem Thema bekommen. Ich will hier nicht zu sehr ins Technische gehen, aber es gibt schon einiges zu beachten. Daher ist das allerwichtigste zunächst ein Mal die Frage, ob man überhaupt eine mobile Website benötigt.

In vielen Fällen braucht man die nämlich ehrlich gesagt nicht. Außer eben bei sehr umfassenden Unternehmens-Websites, für mehr Übersicht. Hierfür finde ich persönlich die Variante mit dem WP Touch Plug-In am besten, da sie viel Arbeit und Zeit spart. Benötigt man keine mobile Version, kann man auf ein responsives Design zurückgreifen. Das macht es einem meistens einfacher und spart viel Arbeit.

Ich hoffe dir hat dieser Beitrag weitergeholfen und freue mich sehr über Fragen und Anregungen in den Kommentaren.

Über mich

Pascal Basel
Webdesigner & Online Marketer

Hier blogge ich über die Themen: Webdesign, WordPress & Online Marketing.

Gerne kannst du mich auch persönlich fragen -> Kontakt

Hol dir jetzt ein unverbindliches Angebot für deine Website & Dein Online Marketing

Kontaktiere mich. Ich freue mich darauf, dich und dein Projekt kennenzulernen.

Zustimmung Datenschutz

13 + 15 =

<style><!-- [et_pb_line_break_holder] -->#blogpost li {<!-- [et_pb_line_break_holder] -->margin-bottom: 20px;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->#blogpost ul {<!-- [et_pb_line_break_holder] -->list-style: none;<!-- [et_pb_line_break_holder] -->padding-left: 25px<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->#blogpost ul li:before {<!-- [et_pb_line_break_holder] -->color: #f77f00;<!-- [et_pb_line_break_holder] -->font-family: ETModules;<!-- [et_pb_line_break_holder] -->content: "5";<!-- [et_pb_line_break_holder] -->margin-left: -25px;<!-- [et_pb_line_break_holder] -->position: absolute;<!-- [et_pb_line_break_holder] -->}<!-- [et_pb_line_break_holder] --></style>