it-swarm.com.de

Wie wichtig ist responsives Webdesign?

Ich habe in letzter Zeit verschiedene Meinungen zu den Vor- und Nachteilen der Verwendung von responsivem Webdesign gehört und mich gefragt, ob es für kleine Unternehmen, die auf kleine geografische Gebiete ausgerichtet sind, erforderlich ist, responsives Webdesign zu implementieren.

Einige Unterfragen, die ich diesbezüglich habe, umfassen:

  1. Ist es besser, responsives Webdesign zu verwenden, als separaten Code für verschiedene Dimensionen/Geräte zu verwenden?

  2. Kann sich dies potenziell auf SEO auswirken (positiv oder negativ)?

  3. Was sind die Hauptprobleme, die bei der Optimierung einer Website für ein Unternehmen mit dieser Entwurfsmethode auftreten können?

29
lifetimes

Die Idee dahinter ist, Ihren Besuchern unabhängig vom Gerät ein optimales Surferlebnis zu bieten. Da die Anzahl Ihrer Besucher, die ein Mobilgerät verwenden, wahrscheinlich eher zunimmt als abnimmt, ist es absolut sinnvoll, diese Route zu wählen.

Für Blogs und CMS gibt es eine Reihe erschwinglicher (um nicht zu sagen billiger) Themen, mit denen Sie sofort testen können, ob Ihnen das, was Sie erhalten, gefällt (überprüfen Sie es mit allen Ihren oder einigen Geräten Ihrer Kunden).

  1. Solange Sie einen besonderen Grund haben, versuchen Sie immer, sich auf eine Codebasis zu konzentrieren. Ein Grund könnte sein, dass Sie eine spezialisierte Website wie eine "Web-App" anbieten möchten.

  2. SEO: nein. So gut und so schlecht wie ein nicht reagierendes Layout.

  3. Am Anfang muss man etwas mehr planen. Welche Inhalte sollen auf dem kleinsten Gerät angezeigt werden, wie soll die Reihenfolge der Inhalte sein? Sachen wie diese. Oder: Sieht mein Inhalt in jeder meiner unterstützten Dimensionen gut aus? Möglicherweise möchten Sie auch die Größe Ihrer Bilder für jede der Dimensionen optimieren, um nicht nur browserskalierte Bilder, sondern auch Bilder in Originalgröße bereitzustellen. Wenn Ihr CMS das nicht unterstützt, ist es etwas mehr Arbeit.

Wenn Sie Anzeigen von einer externen Quelle einbeziehen möchten, müssen Sie auch überprüfen, ob die angegebenen Formate gut zusammenpassen.

Bearbeiten:

Lassen Sie mich hinzufügen, dass Sie bei vorhandenen historischen Webanalysedaten (z. B. Google Analytics) auf einfache Weise die Anzahl der Benutzer von Mobilgeräten im Vergleich zu Nicht-Mobilgeräten ermitteln, die verwendeten Geräte (bis hin zur tatsächlichen Hardware) identifizieren und die Bildschirmauflösungen überprüfen können ("Sehen sie tatsächlich meine Seiten oder nur einen Teil davon und müssen scrollen?").

Zweite Änderung:

Laut diesem Beitrag "Mobile Websites vs. Responsive Design: Was ist die richtige Lösung für Ihr Unternehmen?" "im Google Analytics-Blog hat eine Website, die im Hinblick auf Responsive Design konzipiert wurde, folgende Vorteile:

  • Einfache Aktualisierung
  • Optimiert für Suchmaschinen
  • Hinzufügen von Konvertierungs- und Weiterleitungscodes

Die Vorteile der separaten mobilen Site:

  • Entwerfen für mobile Benutzeranforderungen
  • Quicke-Site-Erstellung
  • Tolle DIY-Möglichkeiten

Der Artikel "Responsive Design - Nutzung der Möglichkeiten von Medienabfragen" im offiziellen zentralen Blog von Google Webmaster bietet eine gute Einführung in die Umsetzung von "Responsive Design".

"Mobile-optimierte Websites erstellen" bei Google-Entwicklern lautet:

"Google empfiehlt Webmastern, die branchenweit bewährten Methoden für responsives Webdesign zu befolgen, dh für alle Geräte denselben HTML-Code bereitzustellen [...]"

12
initall

Ich denke, es ist wichtig, zuerst zu verstehen, dass "responsive design" (RD) ein Modewort ist (wenn ich Width: 100% auf ein Element setze, habe ich genau dort ein RD, um es zu übertreiben) und daher seine Bedeutung erscheinen wichtiger als es wirklich ist, da es am Ende wie alles andere bedingt ist.

Muss RD implementiert werden?

Um darauf zu antworten, müssen Sie einige Definitionen angeben:

  1. Wer ist Ihre Zielgruppe?
  2. Welche Art von Publikum ist Ihr Ziel?
  3. Was ist der Zweck Ihrer Website?
  4. Von wo aus wird (in den meisten Fällen) auf Ihre Website zugegriffen?
  5. usw.

Dies ist der Marketinganalyse sehr ähnlich. Es geht darum, das richtige Medium für das richtige Publikum zu haben (vielleicht sitzt Ihr Publikum den größten Teil des Tages vor einem Computer oder ist mit dem neuesten iPhone unterwegs usw.). Tun sie beides, dann ist RD natürlich zentral.

Ist es besser, responsives Webdesign zu verwenden, als separaten Code für verschiedene Dimensionen/Geräte zu verwenden?

Hängt von der Komplexität der Benutzeroberfläche ab und davon, wie Sie sie verwenden. In den meisten Fällen kann eine typische Seite mit verschiedenen CSS-Sätzen für die verschiedenen Anzeigen gerendert werden. Komplexere oder anspruchsvollere Benutzeroberflächen erfordern jedoch möglicherweise andere Ansätze, sodass es sinnvoll sein kann, je nach verwendetem Gerät (z. B. Google Maps, Multitouch-Oberfläche) eine andere Seitenstruktur und -strategie zu präsentieren.

Kann es SEO beeinflussen (positiv oder negativ)?

SEO ist mehr über Inhalt als Design. Nur Google weiß, ob sie Design, aber Design/Layout gewichten. Wenn Ihr Inhalt jedoch von hoher Qualität ist, wird dies mehr gewichtet als das tatsächliche Design.

Was sind die Hauptprobleme, die bei der Optimierung einer Website für ein Unternehmen mit dieser Entwurfsmethode auftreten können?

Design für das falsche Publikum. Analysieren Sie Ihr Ziel und liefern Sie nach Möglichkeit aktuelle technische Daten (z. B. Besucherprotokolle mit Informationen zur Plattform usw.).

Neue Technologie ist immer riskant, ref. das HTML5-Problem für Facebook. Es ist zu diesem Zeitpunkt noch nicht ausgereift und wirft verschiedene Probleme auf, die denen des IE6 im Vergleich zu Standardproblemen ähneln.

Halte es so einfach wie möglich. Ausgefallene Webseiten sind nur eine sehr kurze Zeit wertvoll, bis der Benutzer Ihre Seite tatsächlich verwenden muss. Wenn es eine halbe Sekunde dauern muss, bis eine Überblendung für jeden Klick abgeschlossen ist, geht der Benutzer ziemlich schnell verloren. Sachen wie diese.

3
epistemex

Ich habe die anderen Antworten überflogen und mir verzeiht, wenn ich überflüssig bin. Ich mache jeden Tag über 8 Stunden am Tag Responsive Design. Erfahrung, meine Arbeitgeber wollen es, weil es von Google als bevorzugte Methode gerühmt wird und gut rationalisiert. (und wenn von Google als die Art und Weise gerühmt, etwas zu tun, das höchstwahrscheinlich am besten für SEO funktioniert)

Ist es besser, responsives Webdesign zu verwenden, als separaten Code für verschiedene Dimensionen/Geräte zu verwenden?

Ich würde sagen, es ist besser, ja. Der Großteil Ihres Codes ist derselbe, was weniger Arbeit bedeutet als das Schreiben einer iPhone-App, einer Droid-App, einer iPad-App oder einer Kindle-App.

Kann sich dies potenziell auf SEO auswirken (positiv oder negativ)?

Vom Design her halte ich es für neutral; Aus statistischer Sicht schneiden meine responsiven Designs jedoch sehr gut ab. Kunden lieben sie, und Kunden lieben es, sie zu nutzen.

Was sind die Hauptprobleme, auf die ich stoßen könnte, wenn ich eine Website mit dieser Entwurfsmethode für ein Unternehmen optimiere?

Das ist zunächst etwas schwierig. Sie müssen einige Nachforschungen zu Medienabfragen anstellen und am besten einige Mobilgeräte zum Testen verwenden. Beachten Sie, dass das Ändern der Größe Ihres Fensters auf Ihrem Desktop in der Nähe liegt. Die Darstellung des Internets auf Mobilgeräten ist jedoch manchmal anders als erwartet. Ich habe zum Beispiel eine responsive Site entworfen, bei der ich eine BG-Wiederholung für den Header verwendet habe und die sich auf dem Desktop über den gesamten sichtbaren Bereich erstreckt. Unter iOS wird es jedoch aus irgendeinem Grund gekürzt ...

Ich empfehle, etwas Responsive Design zu lernen und auszuprobieren. Schauen Sie sich diese Website für einen Starthilfe an: http://html5boilerplate.com

Um die Frage im Titel zu beantworten: Es ist wichtig und es ist wichtig, dass Sie sich dessen bewusst sind und wie Sie dafür entwerfen. Sollten Sie sich entscheiden, es nicht zu verwenden, sollten Sie bereit sein, diese Haltung zu verteidigen, da Ihr Kunde möglicherweise eingestellt ist auf diesen Entwurf haben. Nach meiner Erfahrung lieben Kunden und Kunden das reaktionsschnelle Design. Zufriedene Kunden und zufriedene Kunden sind für mich Grund genug, dem nachzugehen :)

2

Ich möchte mich nur mit einer anderen Perspektive einschalten:

Nein, es ist nicht obligatorisch oder sogar empfohlen. Es kommt darauf an, wer Ihre Zielgruppe ist. Sehen Sie sich Ihre Analysen an und sehen Sie, wie viel Prozent von Mobilgeräten stammen. Gibt es bei Mobilgeräten einen signifikanten Rückgang im Vergleich zu Ihren Desktop-Benutzern?

Um ein Beispiel zu geben, wo ich arbeite, reagiert unsere Site nicht. 90% unserer Zugriffe kommen jedoch von Desktop-Benutzern. Die Absprungraten und die Abschlussraten für Ereignisse sind auf Desktop-, Mobil- und Tablet-Computern nahezu identisch.

Solange es keine Rechtfertigung für eine Änderung gibt, besteht für uns kein finanzieller Anreiz, dies zu tun. Das Sprichwort, dass mitreißende Aussagen wie 50% der Benutzer mobil sind oder dass etwas nur dann zutrifft, wenn alle Benutzer Ihre Zielgruppe sind. Ansonsten ist es völlig irrelevant und es folgt eine schlechte Logik.

Sie müssen nur den Prozentsatz der Nutzer auf Mobilgeräten anzeigen, auf die Sie abzielen. Insbesondere für B2B-Anwendungen werden die meisten Menschen in ihrer Freizeit nicht auf ihre Telefone schauen. Sie erhalten von Montag bis Freitag Datenverkehr auf Desktop-Computern.

1
Ryan

Responsives Webdesign ist von entscheidender Bedeutung. Wenn Sie eine neue Website erstellen, MÜSSEN Sie dafür sorgen, dass Ihre Website reaktionsschnell ist. Bereits jetzt stammen 50% des Datenverkehrs von Mobilgeräten und Tablets, und dies wird nicht nur zunehmen, es wird auch die eindeutig dominierende Form der Internetnutzung sein.

Für kleine Unternehmen, die auf kleine geografische Gebiete ausgerichtet sind, ist dies sogar noch kritischer. SEO wird für ein neues kleines Unternehmen sehr schwierig. Wenn Ihr Produkt jedoch gut ist, können Sie die Anzahl der Personen maximieren, die das teilen, was Sie tun.

Wenn es darum geht, soziale Medien zu lesen, nutzen die Menschen heute meist mobile Geräte - in der Regel morgens im Bett und abends im Bett.

Wenn Ihre Website auf einem mobilen Gerät nicht mehr verwendet werden kann, gehen alle Freigaben, die Ihre relevante Zielgruppe erreichen, verloren. Das wollen Sie nicht. Es ist wichtig, dies zu vermeiden.

In Bezug auf responsiven oder separaten Code: Der Hauptnachteil von responsivem Design ist, dass es nicht so schnell ist wie separate Codebasen. Dieser Geschwindigkeitsverlust wird vernachlässigbar sein, sicherlich im Fall eines kleinen lokalen Unternehmens, bei dem andere Faktoren in den Sinn kommen, warum die Website 0,2 Sekunden langsamer ist als andere.

Der große Vorteil von Responsive Design ist, dass Sie dieselbe Codebasis beibehalten. Dies reduziert Wartungskosten, Testkosten und Entwicklungskosten.

Das Wichtigste bei SEO ist heutzutage die "Website-Qualität" - die Website-Qualität ist schwer zu messen, aber im Allgemeinen verwendet Google die Absprungrate und die Zeit vor Ort, um dies zu messen. Wenn Ihre Website mobil ist, werden 50% Ihres Traffics eine hohe Absprungrate und eine hohe Anzahl von Besuchern mit geringem Engagement aufweisen (weniger als 10 Sekunden auf der Seite).

Dies setzt Sie dem Risiko von Google-Strafen aus - sehen Sie sich Google Panda und die neuen (letzte Woche) Exact Match Domain Strafen an, die beide Websites für "niedrige Qualität" bestrafen.

Die Hauptprobleme, denen Sie bei der Optimierung einer Website für ein Unternehmen mit dieser Methode begegnen könnten, sind, dass es sich um ein neues Schlagwort handelt, das jeder braucht. Es gibt also Cowboys, die für etwas unglaublich Leichtes lächerlich hohe Preise verlangen.

Ich habe zum Beispiel kürzlich eine Website erstellt, die einen Shop, ein Forum, einen Bereich für Fragen und Antworten sowie verschiedene andere Seiten, Blogs usw. enthält, die innerhalb eines Tages für alle Geräte voll funktionsfähig sind.

Hier sind die Grundlagen für das, was Sie tun müssen:

  1. Passen Sie die Körperpolsterung und die Ränder an
  2. Bewegen Sie die Menüs auf der linken oder rechten Seite in Dropdown-Listen, und verstecken Sie sie möglicherweise unter einer Optionsschaltfläche oben.
  3. Ändern Sie die Größe der Container und verwenden Sie die Breite 100%, wo Sie können
  4. Ändere alle deine Bilder auf 100% Breite
  5. Entscheide, welche Dinge auf dem Telefon nicht benötigt werden (Werbung?) Und entferne sie (Anzeige: keine)

Hier ist ein Beispielcode:

@media screen and (max-width:480px) {
body {
margin:5px;
padding:0px;
}
.advertbox {
display:none;
}
}

Das bedeutet, dass Sie mit einer Klasse von "Advertbox" alles von Smartphones entfernen (mit einer maximalen Breite von 480px) und die Body Margin reduzieren.

Wenn Sie eine neue Site erstellen, ist dies noch einfacher, da Sie sicherstellen können, dass Sie ein übersichtliches Design mit netten, übersichtlichen Klassen und einem für alle Geräte geeigneten Design erstellen.

Ich hoffe das hilft!

1
Dave Hilditch