//
archives

Responsive Design

Diese Schlagwort ist 5 Beiträgen zugeordnet

9 Features, die eine mobile Website enthalten sollte

Auf ActiveMobi habe ich diese interessante Infografik entdeckt. Sie beschreibt 9 Features, die eine Website enthalten sollte, um Nutzer mobiler Endgeräte zu erreichen. Auch wenn die Infografik schon ein Jahr alt ist, so beschreibt sie doch ganz gut die wichtigsten Aspekte – gerade in Zeiten, in denen nicht nur für Google & Co. die mobile Nutzbarkeit zu einem zentralen Rankingkriterium geworden ist.

Top 9 Features Mobile Consumers Want On Your Mobile Website-Infographic

9 Features, die eine mobile Website enthalten sollte

Courtesy of: ActiveMobi

Gedankenspiele-Lesetipps vom 06.10.2014

Posted from Diigo. The rest of my favorite links are here.

Gute Infografik: Was macht responsives Webdesign aus?

What is responsive website design

www.verveuk.eu

Responsive Webdesign: Nützliche Tools und offene Fragen

Im Rahmen einer größeren Studie, an der ich derzeit noch arbeite, habe ich mich ein wenig intensiver mit dem Thema Responsive Design von Webseiten beschäftigt. „Responsive“ zählt derzeit wohl zu den Buzzwords, die in kaum einem Bingo fehlen dürfen – egal ob im Zusammenhang mit „Design“, „Website“, „Web“, „Advertising“ oder was auch immer.

Warum? Responsive Webdesign reagiert auf die immer intensivere Informationsaufnahme über vielfältige mobile Devices mit unterschiedlichen Displays. Es passt sich automatisch der Displaygröße an, was angesichts der komplexen Seiten auch einen höheren Programmieraufwand erfordert. Auf diese Weise werden die Inhalte einheitlich unabhängig von der Ausgabeplattform – Desktop, Laptop, Tablet, Smartphone – angezeigt. Heute will plötzlich jeder seine Webseite „responsive“ gestalten. Dabei hat „Responsive Webdesign“ durchaus seine Nachteile, die Patrick Voelcker ausführlich in seinem kritischen Blog-Beitrag beleuchtet.

6 Tools im Test
Doch mit dieser Diskussion über Sinn und Unsinn will ich mich hier heute weniger auseinandersetzen. Vielmehr habe ich einige der Tools getestet, die mir teils über Twitter empfohlen – danke dafür nochmals! – und die zum Teil bei t3n kürzlich beschrieben wurden. Kurz zu meinen Ergebnissen.

a) Das viel beschriebene und nett anzusehende Am I Responsive ist nicht mehr als eine Spielerei. Das Layout lässt sich nur anhand von vier Größen von Apple-Geräten testen – und ausschließlich in einem fixierten Format.

b) Besser gefällt mir schon deviceponsive.com: Visuell ansprechend kann man überprüfen, wie die Inhalte der eigenen oder einer fremden Webseite auf Apple-Geräten, auf dem Kindle sowie dem Samsung Galaxy – jeweils sowohl im Portrait- als auch im Landscape-Format – angezeigt werden.

c) Der Responsive Design Test arbeitet etwas anders: Hier lässt sich die Webseite eingeben und dann nicht anhand von Markengeräten sondern anhand konkreter Ausgabegrößen von Geräten – bis 240px, bis 320px, bis 480px, bis 768px, bis 1024px – überprüfen. Eine ähnliche Darstellung bietet auch Matt Kersleys Responsive Design Testing Tool.

d) Wer seine Inhalte vor allem auf Smartphones – vertikal wie horizontal – testen will, dem ist der Mobile emulator ans Herz gelegt. Beim Test werden dazu Größen, Auflösungen, Bilder etc. berücksichtigt; auch die genaue Größe des Bildschirmes lässt sich individuell eingeben.

e) Top finde ich den ResponsiveTest. Im DropDown-Menü lassen sich zahlreiche Marken von Smartphones, Tablets, Laptops und Desktops individuell auswählen. iPhone 3 bis iPhone 5, Samsung S2 bis S4, diverse Blackberrys und HTCs, verschiedene iPads, Kindles und Barnes & Nobles oder Samsung Pads, dazu Laptops und Desktops von Dell, Sony, HP und vielen anderen zeigen die Vielfalt dieses Tools. Hilfreich: Alle Geräte lassen sich vom Hoch- auch ins Breitformat bewegen, also genau so, wie User ihre Geräte auch nutzen. Wie das perfekt funktioniert, habe ich mit der Webseite der Marke Illy getestet, die – bis auf Blackberry – perfekt auf die verschiedenen Ansichten optimiert ist.

Thema mobile Webseiten

Trotz allen hilfreichen Tools: Eine Problematik lösen sie alle nicht. Um diese kurz zu beschreiben: Wer beispielsweise tchibo.de in eines der Tools eingibt, der erhält beim Format Smartphone das Ergebnis eines nicht responsiven Designs (siehe Abb. 1). Wenn ich dagegen in den Safari- oder Crome-Browser meines iPhone 4 die Webseite tchibo.de eingebe, wird sie mir sehr sauber angezeigt (siehe Abb. 2).

Dies gilt nicht nur für diese Marke, sondern auch für viele anderen. Ich habe dies beispielsweise für t3n.de, sport1.de, arbeitsagentur.de, vw.de und weitere Marken getestet.

Dies scheint darauf zurückzuführen zu sein – so vermute ich, lasse mich aber gerne korrigieren –, dass für die Marken spezielle mobile Webseiten entwickelt wurden. Dies lässt dann den Umkehrschluss wiederum zu, dass mit all diesen Tools zwar getestet werden kann, ob eine Webseite Responsive Webdesign hat oder nicht. Ob sie trotzdem gerade auf Smartphones perfekt angezeigt wird, dies können die Tools nicht immer anzeigen.

Die Lesetipps in den Gedankenspielen vom 16. August 2013

Posted from Diigo. The rest of my favorite links are here.

%d Bloggern gefällt das: