Blog-Trainer

WordPress-Seminare seit 2006

Was Ihre Website wirklich braucht: ein „Responsive Design“

| 24.554 mal gelesen |

Websites können auf manchen Browsern großartig aussehen, auf anderen gleichzeitig vollkommen zerschossen. Natürlich ist es eine gute Idee, hin und wieder zu prüfen, ob die Website W3C-konform ist. Da moderne Browser aber recht fehlertolerant sind, ist das oft nur eine akademische Übung. Sie nutzt niemandem, schadet aber auch keinem.

Auch Ihre Website wird zunehmend mobil betrachtet.
Wann haben Sie zuletzt Ihre Serverstatistiken unter „Browsers“, „Screen Resolution Stats“ oder „Operating System Stats“ angesehen? Sie werden erstaunt sein, wie viele Besucher Ihre Website inzwischen mobil besuchen. iPhone/iOS, Android, Nokia/SymbianOS, IEMoble/WindowsPhone und iPad/iOS tummeln sich dort, wo kürzlich noch Windows- und MacOS-Nutzer mit ihren großen Bildschirmen allein zu Gast waren.

Jetzt bitte keinen Schreck bekommen!
Mobile Endgeräte vom Smartphone bis zum Tablet haben eins gemeinsam: Die horizontale Auflösung ist mickrig, sie reicht von 320 Pixeln am iPhone bis zu 768 Pixeln am iPad. „Normale“ Screendesign starten bei 1024 Pixeln. Das war viele Jahre lang das absolute Minimum für die Bildschirmbreite. Die Chancen stehen also gut, dass auch Ihre Website einen großen Schirm braucht. Das gilt auch für Ihr WordPress: Fast alle gängigen Themes benötigen 1024 Pixel in der Breite.

So sieht Ihre Website auf Smartphones aus: Katastrophal!
Schauen Sie Ihre Website auf einem Smartphone an. Das Ergebnis wird ernüchternd bis erschreckend sein. Sie werden spontan die Lupe suchen. Zwar schwört mancher Mobilnutzer auf „haptische Gesten“, mit denen man das Bild auseinanderzerren kann. Aber diese Krücke benutzt in der Praxis niemand wirklich.

Fakt ist: Wenn Ihre Website nicht mobiltauglich ist, wird sie bei weiterer Smartphoneverbreitung sinkende Besucherzahlen haben!

Gibt es eine Lösung?
wordpress-workshopJa. Wenn Sie heute eine Website starten oder relaunchen, so sollte diese ein „Responsive Design“ haben. Vereinfacht gesprochen bedeutet das, dass Ihre Website in Abhängigkeit von der Breite des Anzeigegerätes unterschiedlich optimiert dargestellt wird, jedoch immer so, dass ein Vergrößern („Einzoomen“) oder seitliches Rollen („Scroll“) nicht nötig sind. Das erhöht die Nutzbarkeit der Seite ungemein!

Responsive Themes für WordPress
Die gute Nachricht: Auch für WordPress gibt es bereits „Responsive Themes“. Das neue Standardtheme „Twenty Eleven“ gehört dazu. Innovative Webdesigner haben sich auf das Thema fokussiert, wie diese Zusammenstellung von 10 freien Responsive WordPress-Themes zeigt.

Auch auf meinem Blog nutze ich seit einigen Wochen das Responsive Theme „Yoko“ von Elmastudio aus Stuttgart. (Danke an Ellen und Manuel!) Von Ellen stammt auch dieser interessante Artikel: Webseiten-Navigationen in responsive Webdesigns analysiert. Und wer noch mehr Lesestoff sucht, dem sei auch folgender Artikel empfohlen: „The ultimate responsive web design roundup“.

Fazit
Responsive Design und Responsive Themes machen Ihre Website wirklich mobiltauglich, und zwar ohne Doppelaufwand für mobile Subdomains.

Wenn Sie selbst an Ihrem WordPress schrauben, so stellen Sie jetzt auf ein Responsive Theme um! Wenn Sie jedoch einen externen Webdesigner oder eine Agentur an Ihrer Website schrauben lassen, so fragen Sie diese am besten noch heute, ob sie sich schon einmal mit Responsive Design, CSS3 und HTML5 befasst haben. Falls die Antwort negativ ausfällt oder zögerlich kommt, so zögern Sie nicht, noch heute Ihren Webdesigner oder Ihre Agentur zu wechseln.

Was Ihre Website wirklich braucht: ein
Was Ihre Website wirklich braucht: ein
Was Ihre Website wirklich braucht: ein
Was Ihre Website wirklich braucht: ein
Was Ihre Website wirklich braucht: ein

Das könnte Sie auch interessieren:

12 Kommentare

  1. User von iPhones//Smartphones und iPads wollen meist was anders von einer Website,
    seltenst ist ein responsive Design daher die beste Lösung,
    zB.:
    große Bilder, die einfachst runterscaliert werden, haben dennoch ne irre Ladezeit, die nicht gut ist.

    es ist eine Möglichkeit von vielen, damit eine Website auf vielen Ausgabegeräten für NutzerInnen gemacht werden kann,
    aber eben nur eine Möglichkeit von vielen,

  2. Das mit den großen Bildern ist wohl wahr. Mein Header von 43 KByte ist da schon grenzwertig. Aber das weiss man ja, seit es Websites gibt, Und große Bilder sind kein Charakteristikum von Responsive Design. Im Gegenteil.

    Welche Möglichkeit nutzt du, um Websites mobiltauglich zu machen?

  3. Danke für die schöne Übersicht und die informativen Links!

    Es ist eigentlich erstaunlich, wie lange es gedauert hat, bis die Einsicht durchgedrungen ist, dass man mobilen Nutzern etwas Vernünftiges anbieten muss. Bei Museen und Kultureinrichtungen sind die Webstites und Blogs bislang mit dem mobilen Browser meist nicht zu genießen.

    Wir haben bisher WPTouch für unser Blog eingesetzt, was recht gut funktioniert. Bin gespannt wie das mit Twenty Eleven & Co. funktioniert.

  4. Sehr schöne Fragestellung bzw Denkanstoß an die Webseitenbesitzer.
    Ich bin seit gestern auch mit dem neuen Responsive Design (von Ellen) online gegangen.

    Zur Problematik mit großen Bildern. Natürlich ist das ein „Problem“. Jedoch was ist die Alternative? Hat man ein „normales“ Design so sind die Bilder genauso groß wie mit dem sich anpassenden Design. Also macht das schonmal keinen Unterschied.
    Was ist mit einem eigenen Theme nur für Smartphones? Ich finde das nicht gut. Denn erstens gibt es dazu kaum Auswahl (nur WP Touch), was ich jedoch abgelehnt habe.

    Da das Thema aber gerade erst gestartet ist wird sich zu dem Thema Bildgröße sicherlich auch bald eine Lösung finden lassen. Zb werden nur verkleinerte Bilder geladen wenn sie unter einer bestimmten Auflösung des Browsers liegen.

  5. Pingback: Responsive Layout | Hauptstadtkind

  6. Ich bin vor ein paar Tagen mit meinem Blog it4kmu live gegangen und habe ebenfalls das Theme Yoko von Ellen. Als Blog Anfänger weiß ich noch nicht, was so ein Theme alles können soll, aber das Yoko Theme macht mir einen sehr aufgeräumten Eindruck und dass die Seiten in Smartphones und Tablets PC gut dargestellt werden, war mir auch von Anfang an wichtig.

  7. Upps. Vielen Dank das ich auf eurer Seite mal diesen schönen Bericht gefunden habe, ehern zufällig. Ich habe mit keinster Silbe an die Auflösung der Webseite in einem Smartfone gedacht und es ist wirklich erschreckend. Zeit zum handeln..;)
    Grüsse
    Petra

  8. Hi ich versuch sooft ich Zeit habe eigene Designs für iPhone und Co zu machen oder ich nutz die (Bezahl)Version von WP Touch

    selbst auf reinen NerdSeiten sind derzeit an die 2.5% mit Smartphones und Co unterwegs bei mir,
    ich gebe zu, das „drängt“ mich noch nicht soooo irre,
    es sticht im Kopf:solltest endlich Dir Zeit nehmen, aber irrster Druck ist es noch nicht.

    wo ich bemerk, dass Smartphone Besitzer eher Gebrauch machen sind:
    FirmenSeiten, also wo ist die nächste Pizzeria, welcher Film im Kino,
    etc, richtig Lesen und Stöbern tun zumindest die mir bekannten Besitzer diverser iPhones und Co iPads nicht, (noch nicht) vielleicht

    und ich kanns drehen wie ich mag,
    die meisten Kunden wollen eine „schöne“ Website – seltenst, verstehen sie darunter so gut wies geht „bildlos“
    und bei der rasanten Veränderung am Markt der Medien, hol ich mir da lieber „Plugins“ Software von Menschen, die sich nur damit beschäftigen

    allerdings geb ich Dir uneingeschränkt recht,
    wenn ein WebDesigner zumindest nicht massiv drauf aufmerksam macht, verfehlt er seinen Job,

  9. huch kam grad drauf, dass ich die falsche Email noch im „kopierkasten“ hatte, also die Monika da oben ohne Avatar, das bin ich 😉

  10. Zwei Münchener Designer, Steve Glas und Sebastian Neumann, haben das Problem auch gesehen und bieten für Mittelständler und Unternehmer die Gestaltung und Programmierung von Webseiten, die auch auf Smartphones noch lesbar sein dürften 😉

  11. Vor ca. 12 Jahren gab es diese Thematik schon einmal und spätestens im Verlauf der UMTS Lizenzen wurde auch lauthals an allen Ecken die Notwendigkeit erwähnt seine Webseiten Handy-tauglich zu machen – im besonderen durch eine automatische Erkennung auf eine reduzierte Version umzuschalten.

    Damals war das ein Hype unter vielen, wie so oft im Internet.

    Ich denke zum jetzigen Zeitpunkt (aber halt ca. 12 Jahre nach Einführung des ersten Web-fähigen Handys) ist sowohl die Basis wie auch das generelle Verhalten der Nutzer vorhanden um wirklich auch Überlegungen in diese Richtung anzustellen.

    Bevor man aber wirklich handelt, sollte man sich über die eigenen Statistiken einen Überblick verschaffen. Nicht immer lohnt der Aufwand (und nicht jede Seite lässt sich im Handumdrehen durch ein plugin nachrüsten).

    Hinsichtlich zu großer Grafiken würde ich jedoch Widersprechen. Schon jetzt sind Flatrates keine Seltenheit und deren Verbreitung wie auch schnellere Übertragung werden zunehmen. Daher ist die Datengröße ein zu vernachlässigender Faktor den die Zukunft regeln wird.

    Vielmehr sollte eine gute Anbindung an das Netz der Hebel sein an dem man ansetzen sollte. Schon jetzt sind es nicht die großen Datenmengen die den Nutzer im Normalfall stören, sondern die schlechte Datenrate bis die Seite übertragen ist. Manchmal bietet ein Providerwechsel mehr Qualität für mobile und normale Leser als es eine sonstige Umstellung der Darstellung vollbringen kann.

  12. Pingback: Internet-Seite zu Diät - gestaltet mit "Yoko" | Portionsdiät