Oder mobile Version. Was ist ein besseres adaptives Layout oder eine mobile Version? Was ist adaptives Layout oder mobile Version zu wählen?

Dort haben wir herausgefunden, warum Sie brauchen adaptive Gestaltung was sind die vorteile davon. Wie aus dem Artikel hervorgeht, ist adaptives Design erforderlich, und jeder braucht es. Heute werden wir überlegen, was für die Website besser ist: adaptives Design oder ein separates mobile Version.

mobile Version

Die mobile Version der Website ist eine separate Version der Website, die für Smartphones und Tablets entwickelt wurde. Hat normalerweise ein Design optimiert für mobile Geräte, sodass der Inhalt in einer für Menschen lesbaren Form dargestellt wird und das Laden fast sofort erfolgt. Normalerweise auf einer Subdomain in Form von m.site.ru oder mobile.site.ru platziert.

Vorteile

Bequemlichkeit

Benutzer müssen nicht hin und her und diagonal scrollen auf der Suche nach den richtigen Inhalten, erhöhen-verringern, um den gewünschten Text zu lesen. Die gesamte Site wird in einer Spalte bereitgestellt, die Sie von oben nach unten scrollen müssen. Alle Inhalte sind in der Regel strukturiert und in logische Blöcke unterteilt.

Download-Geschwindigkeit

In der Regel ist das Design der mobilen Version sehr vereinfacht und der Code und die Skripte sind minimiert, was zu einer sehr hohen Benutzerfreundlichkeit führt schnelles Laden Website auf Mobilgeräten.

Website-Bearbeitungen

Die mobile Version ist tatsächlich eine separate Seite, was bedeutet, dass es nicht schwierig ist, Änderungen vorzunehmen. Sie müssen sich keine Gedanken darüber machen, wie Sie sicherstellen können, dass die Änderungen nur die mobile Version und nicht die Desktop-Version betreffen.

Wechsel zur Hauptversion

In den meisten Fällen kann der Benutzer problemlos zur Hauptversion der Website wechseln, wenn er die Funktionalität nutzen muss, die in der mobilen Version nicht verfügbar ist.

Mängel

Vervielfältigung

Doppelte Inhalte auf verschiedenen Subdomains wirken sich negativ auf die Suchmaschinenwerbung aus. In der Regel sind Programmierer an der Erstellung einer mobilen Version beteiligt, und SEO-Spezialisten sind an der Werbung beteiligt. Und auch wenn alle Wünsche der SEO-Spezialisten bei der Testversion berücksichtigt werden, ist es keine Tatsache, dass sie in ihrer ursprünglichen Form auf die Kampfversion migrieren werden. Oft ändert sich während der Übertragung etwas, es kommt etwas hinzu. Dadurch können wir aufgrund von Duplikaten in der mobilen Version Ranking-Probleme bekommen.

Aktualisieren

Alle Inhalte, die der Hauptseite hinzugefügt werden, müssen auf der mobilen Version dupliziert werden. Und wenn die Website zum Beispiel ist Nachrichtenportal und täglich aktualisiert werden, kann dies ein ziemlich kostspieliger Prozess sein.

Funktionseinschränkung

In der mobilen Version werden schwere Funktionsentscheidungen oft nicht übertragen. Üblicherweise werden vor der Erstellung einer mobilen Seite die Anfragen und das Verhalten von Nutzern von mobilen Geräten analysiert und anhand dieser Daten nur das gegeben, was für mobile Besucher wirklich wichtig ist.

Die mobile Version hat sich bestens bewährt und wird immer noch gerne von Webmastern genutzt. Das Gleiche gilt für mobile Anwendungen. Aber das ist schon sehr teuer, und die durchschnittliche Website kann sich die Entwicklung mobiler Anwendungen nicht leisten.

Adaptives Layout

Eine adaptiv gestaltete Website wird auf Desktop- und Mobilgeräten gleichermaßen komfortabel dargestellt.

Vorteile

Leichtigkeit der Durchsetzung

In der Regel wird beim adaptiven Layout die Bildschirmbreite an die gewünschte Displaygröße angepasst. All dies kann mit HTML und CSS durchgeführt werden. Und moderne CMS und Frameworks ermöglichen Ihnen dies mit nur wenigen Klicks. Ja, und moderne Vorlagen bieten sofort adaptives Design. Es bleibt nur, es zu installieren? und in wenigen Minuten haben Sie ein adaptives Design, das für jedes Publikum geeignet ist.

SEO

Wenn wir in der mobilen Version mit der Duplizierung von Inhalten auf verschiedenen Subdomains konfrontiert sind, gibt es hier kein solches Problem. Wird die Seite eine Adresse (URL) haben? und wenn wir die Bildschirmauflösung oder das Gerät ändern, werden wir das Design nicht beschädigen oder wir werden nicht auf die mobile Version umgeleitet. Diese Option löst das Problem von doppelten Inhalten besser als rel="canonical"-Attribute oder -Verbote in der robots.txt auf der mobilen Version.

Mängel

Schwere

In der Regel lassen sie mit Anpassungsfähigkeit die gesamte Funktionalität den Benutzern zur Verfügung. Dies bedeutet, dass mobile Besucher möglicherweise mit einem Stapel von Skripten und vielen Informationen konfrontiert werden, die auf einem kleinen Smartphone-Display nur schwer sofort erfasst werden können. Während es für Desktops normal ist, eine Größe von 200-250 KB zu haben, benötigt Mobile normalerweise weniger als 50 KB.

Zweck der Reise

Häufig besuchen Benutzer die Website, um Kontaktdaten, Wegbeschreibungen, die Verfügbarkeit von Filialen usw. zu erfahren. Und auf einigen Websites müssen sie mehrere schwere Seiten durchgehen, um ihr Ziel zu erreichen.

Keine Wahl

Wenn der Programmierer auf der mobilen Version den Block krumm gemacht und die Telefone hinter dem Logo versteckt hat, können Sie immer noch auf die Desktop-Version wechseln und zumindest mit Skalierung, aber die Kontaktdaten sehen. Wenn der Programmierer das adaptive Layout vermasselt, müssen Sie versuchen, herauszufinden, was Sie wollen, und nicht jeder kann es tun. Daher muss adaptives Design zunächst sehr gut und kompetent gesetzt und dann ebenso kompetent getestet werden.

Fazit: Adaptives Layout oder mobile Version?

Hier gibt es keine einzige richtige Antwort. Für jede Aufgabe wird ausgewählt Beste Option. Und Responsive Design, das für eine Seite ideal ist, wird nur in einem anderen Fall Usability-Probleme verursachen. Große Player und umfangreiche Websites sind möglicherweise einfacher zu handhaben App, die nur die Funktionalität enthält, die Benutzer benötigen.

Unserer Meinung nach ist adaptives Design perfekt, wenn Sie nur eine Informationsseite haben. Da das Komprimieren von Text und Bildern viel einfacher ist, als zu entscheiden, wie man einen riesigen Taschenrechner auf einer Website umkehrt, ohne die Benutzerfreundlichkeit zu verlieren.

Aber wenn Sie auf der Website haben persönliches Büro mit großer Funktionalität oder seiner Website wird es schwierig sein, auf adaptives Design zu übertragen, es ist einfacher, eine mobile Version zu erstellen, in der es bequem ist, alle Tools für Benutzer zu platzieren.

Nun, wenn Sie noch keine Website haben und gerade darüber nachdenken, eine zu erstellen, dann ist es besser, Responsive Design sofort in die Entwicklung aufzunehmen.

Die Kosten der Suchwerbung und ihr Ergebnis hängen davon ab, wie wir die Website für mobile Geräte anpassen.

Zu den Lesezeichen

Dmitry Mrachkovsky, Optimierer von Ashmanov & Partners, erklärte, wie man zwischen einer adaptiven und einer mobilen Website wählt und mit welchen nicht offensichtlichen Problemen man konfrontiert wird.

Vorteile von responsiven und mobilen Websites

Es ist schwierig, die Frage eindeutig zu beantworten, welche Technologie der Anpassung für Smartphones und Tablets effektiver ist SEO-Perspektive. Auch bei den großen Playern habe ich keinen Vorteil zugunsten irgendeiner Entscheidung festgestellt. M.Video, DNS, Wildberries, Aviasales verwenden adaptives Layout und Lamoda, 220 Volt, Ulmart, Yandex.Market verwenden mobile Websites. Aber werfen wir einen Blick darauf, welche Vorteile der Erste und der Zweite erhalten.

Adaptives Layout der Seite „M.Video“ und mobile Version der Seite „220 Volt“

Responsive Layout hilft, auf die Entwicklung einer separaten mobilen Version zu verzichten. Das hat Vorteile:

Für die Darstellung auf mobilen Endgeräten benötigen wir keine separate Seitenstruktur. Es reicht aus, die Desktop-Version der Website mit zu korrigieren mit CSS.
Für Desktop- und mobile Versionen wird eine einzige URL verwendet. Daher wird der Inhalt der Website nicht dupliziert, die Seiten konkurrieren nicht miteinander und die Werbearbeit wirkt sich auf das Ranking bei Desktop- und mobilen Suchen aus.

Die mobile Version ist eine kostenintensivere und flexiblere Lösung. Sie kann bearbeitet werden, ohne die Hauptseite zu beeinträchtigen. Dadurch haben Sie folgende Vorteile:

Das Laden einer mobilen Website kann so einfach und schnell wie möglich gestaltet werden, indem unnötige Funktionen auf Codeebene entfernt werden.
Die Benutzeroberfläche kann für mobile Benutzer verbessert werden, indem Funktionen hinzugefügt werden, die auf der Desktop-Version der Website nicht verfügbar waren.
Der Benutzer kann jederzeit auf einem mobilen Gerät zur Hauptversion der Website wechseln, wenn er möchte.

Ich möchte noch eine weitere Technologie erwähnen – RESS. Es zeigt dem Benutzer je nach Gerät eine Desktop- oder mobile Vorlage, aber die URL der Seite ändert sich nicht. RESS kombiniert die Vorteile der oben beschriebenen adaptiven und mobilen Version. Aber es hat auch zwei Nachteile: komplexe und teure Implementierung und Fehler bei der Identifizierung seltener und unbeliebter Telefonmodelle.

Probleme mit responsivem Layout

Responsive ist eine kostengünstige und bequeme Lösung, aber in Bezug auf die Suchförderung hat es mehrere Fallstricke.

Fehlinterpretation von adaptiv

Einige implementieren das adaptive Layout falsch und zeigen zwei Vorlagen gleichzeitig auf einer Seite im Code an - Desktop und Mobile. Je nach Gerät des Nutzers bleibt der gewünschte Teil des Codes sichtbar, während der Rest mit display: none ausgeblendet wird. Dies wirft drei Probleme auf:

Alle Inhaltselemente werden doppelt geladen: Texte, Bilder, H1- und H6-Überschriften, Breadcrumbs, verwandte und vorgestellte Produkte und so weiter. Und Suchmaschinen mögen wirklich keine Duplikate.
Nicht genutzte Inhaltsteile werden mit CSS ausgeblendet. Die Meinung der Suchmaschinen zu diesem Thema ist zwiespältig. Google erklärte, dass es den Inhalt versteckter Blöcke ignoriert, und Yandex - dass es den gesamten Inhalt der Seite berücksichtigt. Die meisten SEO-Experten sind sich einig, dass ein solches Schema das Risiko birgt, bestraft zu werden.
Der Code wird dupliziert und die Website wird langsamer geladen.

Eine solche Implementierung ist der falsche Ansatz für die RESS-Technologie.

Ausblenden unnötiger Elemente

Um die Benutzeroberfläche der adaptiven Version komfortabler zu gestalten, entfernen einige einige der Funktionen: ablenkende Blöcke, große Texte in Katalogkategorien und so weiter. Alles Überflüssige wird mit display: none ausgeblendet. Das Problem ist jedoch, dass der gesamte Code zum Laden der Seite verwendet wird und die Website langsam ist. Außerdem haben Suchmaschinen, wie oben erwähnt, eine kontroverse Haltung gegenüber solchen Inhalten – es besteht die Gefahr, unter Sanktionen zu fallen.

Falsche Verwendung von JavaScript

Einige verwenden JS, um die Anzeige unnötiger Blöcke auf Mobilgeräten zu vermeiden. Aber diese Methode ist nicht besser als display: none . Es besteht die Gefahr, dass Suchmaschinen die für sie bestimmten Inhalte auch in der Desktop-Version nicht indexieren. Suchmaschinen Im Allgemeinen werden AJAX-Inhalte nicht immer richtig erkannt, insbesondere wenn eine Reihe von Bedingungen für eine korrekte Indizierung nicht erfüllt sind.

Warum wird immer noch Responsive Design verwendet?

Die Wahl der adaptiven Methode wird normalerweise von zwei Hauptvorteilen bestimmt: Entwicklung von nur einer Version der Website und das Fehlen von Problemen mit mehreren URLs.

Es ist auch eine bequeme Lösung für die Werbung in mehreren Regionen. Wir konzentrieren all unsere Bemühungen auf eine Domain und erhalten Ergebnisse bei Desktop- und mobilen Suchen. Dazu müssen Sie die interessierenden Regionen mit der Site in Yandex.Directory verknüpfen.

Und erstellen Sie für Google eine Seite mit den Adressen von Filialen, damit die Suchmaschine versteht, in welchen Regionen Sie arbeiten. Adaptives Layout mit einer einzelnen Domain wird von M.Video sehr erfolgreich eingesetzt. Das Geschäft hat hohe Positionen in den mobilen und Desktop-Ergebnissen für Produkt-, Kategorie- und Informationsabfragen.

Sie können auch den anderen Weg gehen – verwenden Sie Geo-Subdomains, um die Textrelevanz von Seiten zu erhöhen. In diesem Fall werden Subdomains wie spb.site.ru, samara.site.ru, kazan.site.ru über Yandex.Webmaster Regionen zugewiesen, und dann werden Titel und Meta-Tags mit dem Toponym zugewiesen. Ein weiteres Plus ist, dass es einfach ist, separate Analysen für Geo-Subdomains einzurichten, um Ergebnisse nach Region zu verfolgen. Diese Art der Werbung wird von MediaMarkt praktiziert.

Probleme mit mobilen Versionen von Websites

Die relativ hohen Entwicklungskosten sind nicht der einzige Nachteil mobiler Websites. Hier ist eine Liste weniger offensichtlicher Probleme, auf die Sie bei der Auswahl dieser Technologie stoßen können.

Doppelte Promotionsarbeit

Die mobile Website wird getrennt von der Haupt-Website optimiert und beworben, was mehr Ressourcen erfordert als bei adaptiven. Sie müssen mit der Optimierung beginnen, damit die mobile Version korrekt indiziert wird und nicht mit der Desktop-Version konkurriert. Verknüpfen Sie sie dazu in Yandex.Webmaster und Search Console, legen Sie die richtigen rel="alternate"-Attribute fest, richten Sie die Indizierung und die Generierung von XML-Karten ein.

Chaos durch absolute Links im Inhalt

Desktop- und mobile Vorlagen laden in 99 % der Fälle Inhalte aus derselben Datenbank. Wenn es absolute Verweise auf verwendet Innenseite Desktop-Site, die das Protokoll und die Domäne angibt, werden sie auch auf der mobilen Seite angezeigt. Wenn Sie auf einen Link klicken, tritt eines von zwei Szenarien ein:

Wenn die Desktop-Version hat User-Agent, sieht der Benutzer die mobile Version der Seite.
In anderen Fällen sieht der Benutzer eine Desktop-Seite und die Arbeit, eine mobile Version zu erstellen, ist vergeblich.

In diesem Fall kann das interne Linkgewicht der Seite verletzt werden. Um dieses Problem zu vermeiden, verwenden Sie relative Links in Ihren Inhalten. Geben Sie für das href-Attribut also /page/ anstelle von https://site.ru/page/ an.

Der Inhalt und die Struktur von Desktop- und mobilen Websites können unterschiedlich sein. Daher ist es sinnvoll, den Inhalt beider bei der Suche zu indizieren, um Fehler zu vermeiden. Google empfiehlt auf der mobilen Version anzugeben, dass der Inhalt der Desktop-Seite kanonisch ist. Andererseits sagt die Suchmaschine, dass der Inhalt von nicht-kanonischen Seiten nicht berücksichtigt wird.

Bei Yandex ist diesbezüglich alles klar - es indiziert den Inhalt von Mobil- und Desktop-Seiten separat. Setzen Sie dazu einfach das Attribut rel="alternate" von der Hauptversion auf die mobile, und Sie können auch 301-Weiterleitungen von der Desktop-Version auf die mobile unter Berücksichtigung des User Agents des Geräts einrichten.

Unklare Anforderungen des Mobile-First-Index

Um den Übergang zu einem Mobile-First-Index vorzubereiten, ist es logisch, die mobile Version der Website als kanonische Seite zu wählen. Richtig, es gibt einige Unklarheiten in den Empfehlungen bezüglich Mobile-First. Die Google-Richtlinien besagen beispielsweise, dass die Inhalte der mobilen und der Desktop-Version ähnlich sein sollten, geben jedoch nicht den Grad der „Ähnlichkeit“ preis.

Aber was ist, wenn das Ranking in der Desktop-Suche einen bestimmten Inhaltsblock erfordert, der in der mobilen Version überflüssig ist, aber der mobilen Version Vorrang eingeräumt wird?

Ein Auszug aus dem Google-Leitfaden zur Indizierung mobiler Websites

Auszug aus dem Bericht von Google zur Umsetzung des Mobile-First-Index

Gedankenlose Verwendung von Turboseiten

Einige erneuern Suchmaschinen wahllos, in der Erwartung, das Ranking zu beeinflussen. Beispielsweise enthalten Yandex-Turboseiten, die vollwertige mobile Seiten in der Suche nicht ersetzen, einen kleinen Teil der Benutzerfunktionalität und sind weniger konvertierend. Wenn Sie eine kommerzielle Website haben und von der Qualität der mobilen Version überzeugt sind, sollten Sie es nicht überstürzen, "Turbo" zu implementieren - auch nicht für Seiten mit Artikeln und Rezensionen.

Reduzierung der Wirkung externer Links

Links sind immer noch wichtig für Rankings, insbesondere in Google-Suche. Wenn wir eine mobile Subdomain haben, verweisen einige Benutzer in sozialen Netzwerken und Foren darauf. Und der andere Teil verwendet Links zur Hauptadresse der Website. Infolgedessen funktionieren Links bei mobilen und Desktop-Suchen weniger, als wenn wir eine Domain hätten.

Merkmale der Förderung in den Regionen

Oben haben wir über zwei Möglichkeiten gesprochen, Adaptive regional zu fördern – mit einer einzelnen Domain und Geo-Subdomains. Betrachten Sie diese Optionen für mobile Versionen.

Im ersten Fall promoten wir die Hauptdomain und die mobile Subdomain m.site.ru. Jeder von ihnen muss die Regionen über Yandex.Directory festlegen. Das Problem ist, dass es manchmal unmöglich ist, die mobile Version der Website selbst mit der Filiale zu verknüpfen. Sie müssen sich an den technischen Support wenden, dies garantiert jedoch kein Ergebnis. Sie können keine separate Organisation für die mobile Version der Website erstellen. Wenn viele Verzweigungen vorhanden sind, kann das Binden daher lange dauern.

Die Verwendung von Subdomains wie m.spb.site.ru oder spb.m.site.ru schließen wir generell aus. Obwohl Kholodilnik.ru es zum Beispiel verwendet. Aber in diesem Fall müssen Sie die Adressierung zwischen allen Regionen von mobilen und Desktop-Versionen einrichten, sie auf dem neuesten Stand halten, Änderungen verfolgen und Dienste für Webmaster überwachen. Das ist eine riesige Arbeit, die sich wahrscheinlich nicht auszahlen wird.

Beantragung einer mobilen Angemessenheitsprüfung

Wenn Sie Yandex.Webmaster keine optimierte Version Ihrer Website zum Testen der Benutzerfreundlichkeit für Mobilgeräte übermitteln, wird sie möglicherweise nicht in den Suchergebnissen für Mobilgeräte angezeigt. Das Problem gilt auch für die Anpassung. Das passiert nicht immer, aber ich empfehle Ihnen, den Meldungen im Webmaster zu folgen.

Ein Fragment der Kommunikation mit dem technischen Support von Yandex über das Zuweisen einer Region zur mobilen Version der Website

Warum werden mobile Versionen verwendet?

Die Hauptvorteile der mobilen Versionen sind natürlich die Möglichkeit, eine separate Vorlage zu erstellen, und die hohe Downloadgeschwindigkeit. Außerdem ist es für alte Websites einfacher, eine separate mobile Version zu erstellen, als eine adaptive zu implementieren.

Auch viele SEO-Spezialisten bemerkten das Wachstum Suchverkehr nach der Einführung einer mobilen Website anstelle einer adaptiven. Obwohl ich nicht ausschließe, dass der Grund für das Wachstum darin bestand, dass es Fehler in ihrem adaptiven Layout gab, die sich negativ auf das Ranking auswirkten.

Welche Option zu wählen ist

Wenn Sie eine Website von Grund auf neu entwickeln oder ein kleines Projekt haben, sehen Sie sich das adaptive Layout genauer an. Dies ist eine wirtschaftlichere und schnellere Lösung. Aber es ist besser, die Funktionalität gleich zu planen, damit Sie in Zukunft nicht einen Teil der Seite vor der Anzeige auf mobilen Geräten verbergen müssen.

Schreiben

Wir alle kennen die Statistik: 2014 ist das Jahr, in dem mehr Menschen mit Smartphones auf das Internet zugreifen als mit Computern oder Laptops. . Sie möchten nicht, dass Ihre Website zurückbleibt, sondern genau, wie Sie Ihre Website dafür programmieren mobiles Internet? Es gibt drei Hauptoptionen, jede mit ihren eigenen Vor- und Nachteilen. In diesem Artikel werden wir die Vor- und Nachteile jedes einzelnen betrachten, um eine Auswahl zu treffen der beste Weg um Ihre Website zu entwickeln.

Option 1: Responsives Design

Responsive Design bestimmt die Bildschirmauflösung, mit der Seiten mithilfe von Medienabfragen angezeigt werden, und passt dann die Größe und das Layout der Seite entsprechend an. Google erklärte, dass er es vorziehe sich anpassendes Webdesign was ihn zu einem Schwergewicht in dieser Debatte macht.

Vorteile :

Nur eine Version jeder Seite. Die Seite passt sich an den Gerätetyp an, um Inhalte anzuzeigen (Gerätetyp wird bestimmt und dann werden andere Inhalte angezeigt).
Dieser Ansatz vereinfacht die Site-Wartung erheblich.
Responsive Design ist nicht auf die Erkennung von Benutzeragenten angewiesen, wie dies bei den beiden anderen Optionen der Fall ist. Erkennung User-Agent(d.h. zu erkennen, welcher Browser oder welches Gerät eine Webseite anfordert) ist an sich nicht schlecht, aber es ist nicht perfekt, und wenn es einen Fehler im Prozess gibt, können Benutzer davon betroffen sein falsche Version deine Seite. Darüber hinaus befreit es Such-Spider davon, Ihre Website unter verschiedenen zu durchsuchen User-Agent Das bedeutet, dass Ihre Website besser indexiert wird.
Responsive Website-Designs werden in Browsern tendenziell schneller geladen. Da alle Geräte denselben Inhalt erhalten, gibt es keinen Prozess zum Erkennen einer möglichen Anforderungsumleitung aufgrund des Benutzeragenten. Jeder weiß, dass es auf Geschwindigkeit ankommt.

Minuspunkte:

Die Neugestaltung einer bestehenden Website erfordert einen gewissen Zeit- und Arbeitsaufwand. Wenn Sie also eine große Website haben, ist die Umstellung auf responsives Design möglicherweise nicht die beste Wahl.
Abhängig vom Standort Ihrer Website kann es ziemlich schwierig sein, Inhalte auf den Bildschirm eines Mobiltelefons zu quetschen.
Navigationselemente werden nicht immer in angezeigt richtige Größe, und Elemente auf schwebenden Oberflächen funktionieren überhaupt nicht Touchscreen. Dies kann zu Änderungen in der Navigation führen.
Es gibt Zeiten, in denen responsive Seiten mit vielen Bildern langsamer geladen werden schnelle Geschwindigkeit Antwort entwerfen.

Wenn Sie sich für eine Website mit responsivem Design entscheiden, denken Sie daran, dass Sie Ihre Website unbedingt darauf überprüfen sollten verschiedene Browser und Geräte (oder verwenden Sie eine gute User-Agent Emulator), bevor Sie die Website starten.

Ein gutes Beispiel für responsives Design ist eine Website. Webseite :

Die mobile Version ändert die Seite ganz schön.

Option 2: Dynamische Bereitstellung

Die Essenz der dynamischen Bereitstellung oder Weiterleitung besteht darin, dass die User-Agent Besucher (d. h. welches Gerät er verwendet, um Ihre Website anzuzeigen) und leitet dann auf Serverebene zur gewünschten URL weiter. Die dynamische Umleitung kann auf verschiedene Weise erfolgen.

Eine Möglichkeit, eine dynamische Weiterleitung zu implementieren, ist eine unidirektionale Weiterleitung, bei der mobile Benutzer von der regulären Hauptwebsite auf ihre mobile Version umgeleitet werden.

Bei der zweiten Art, der bidirektionalen Weiterleitung, werden Benutzer auch von der mobilen Version auf die Desktop-Version umgeleitet. Die Teile des Codes, die für eine solche Weiterleitung verantwortlich sind, werden manchmal als Kontroll-Tags bezeichnet. Bei der Implementierung wird das Tag angegeben rel="alternativ" in der regulären Version, die auf die mobile Website zeigt; und auf der mobilen Website wird das Tag platziert rel="alternativ" zeigt auf die Hauptsache Vollversion Grundstück.

Vorteile:

Da die Umleitung auf Serverebene erfolgt, gibt es nur eine URL für jede Seite.
Die dynamische Weiterleitung funktioniert auch gut für normale Telefone – Mobiltelefone – die einen festen Satz von Funktionen enthalten, aber nicht so umfangreich sind wie Smartphones. Zum Beispiel können Mobiltelefone im Allgemeinen keine Anwendungen herunterladen, haben aber im Allgemeinen einige Webbrowsing-Fähigkeiten. Der große Unterschied besteht darin, dass Mobiltelefone dies nicht verarbeiten können css, sodass sie mit responsivem Design nicht gut umgehen können. Daher ist es wichtig, Ihr Publikum zu kennen und welche Art von Mobilgeräten es verwendet.
Wenn Sie es speziell für Ihre mobilen Benutzer haben möchten, können Sie dies mit dieser Option tun, da mobile Benutzer und Benutzer der regulären Version einen anderen Code anzeigen. HTML.

Minuspunkte:

Eine solche Implementierung verdoppelt den Arbeitsaufwand, da Sie eine separate Website für mobile Geräte mit einem separaten Satz von indizierten erstellen müssen HTML, erfordert eine separate SEO.
Die erforderliche Liste der Benutzeragenten-Wertzeichenfolgen erfordert ebenfalls ständiger Dienst, da neue Zeilen hinzugefügt werden müssen, wenn ein neues mobiles Gerät veröffentlicht wird.
Denken Sie schließlich daran, dass Sie " HTTP-Header Variieren„wenn Ihre Website Inhalte dynamisch bereitstellt. Der Titel hilft, den Inhalt richtig zu erhalten, und hilft der Site-Engine, ihn richtig zu cachen. Google zeigt Details zum Hinzufügen dieses Titels ( https://developers.google.com/webmasters/smartphone-sites/details#dynamicserving) .

Option 3: mobile Website

Bei dieser Option wird, wie der Name schon sagt, eine separate Domain speziell für mobile Benutzer erstellt. Die häufigsten Beispiele sind m.domain.ru oder mobile.domain.ru. Dies ist eine beliebte Option für große Einzelhändler. Eine solche Methode beinhaltet die Gestaltung von Inhalten speziell für mobile Besucher (und keine Weiterleitungen auf Serverebene).

Vorteile:

Für große Websites mit Hunderttausenden oder Millionen von Seiten wäre die Implementierung eines responsiven Designs zu viel Arbeit. Im Falle einer mobilen Website wird es möglich sein, die mobile Version der Website schrittweise zu erweitern (es ist wie eine separate Website) und es wird viel weniger Arbeit geben.
Wie bei der dynamischen Weiterleitung sieht eine mobile Website auf Mobiltelefonen besser aus als eine responsive Website. Abhängig von den demografischen Merkmalen Ihrer Website ist dies möglicherweise kein Kriterium. aber für einige Unternehmen ist es unerlässlich.

Minuspunkte:

Ihre mobile Website wird nicht von einem positiven Wachstum des Backlink-Profils zur Hauptseite profitieren (es sei denn, Sie haben eine bidirektionale Weiterleitung implementiert). Wenn Sie also möchten, dass Ihre mobilen Nutzer Sie in der organischen Suche finden können, kann dies besonders negativ sein.
Ihre mobile Website erfordert zusätzliche SEO-Arbeit. Sie müssen separate Karten einreichen XML-Sitemap für Google und Yandex. Außerdem müssen Sie Ihre Meta-Tags bearbeiten. Mobile Meta-Tags sollten kürzer sein als für die normale Website.

Hier ist ein Beispiel für eine richtig gemachte mobile Website. NYTimes.com hat eine Hauptseite für Desktop-Besucher:

UND mobile.nytimes.com für mobile Besucher:

Wie Sie sehen können, wurde der Inhalt erheblich neu formatiert und verkleinert, um ihn auf einem Mobilgerät lesbar zu machen.

Schlussfolgerungen

Machen richtige Wahl Stellen Sie für Ihre Website sicher, dass Sie sich fragen, wie viele Ihrer Besucher mobile Geräte verwenden, um auf Ihre Website zuzugreifen. Überprüfen . Wenn der Gesamtprozentsatz mobiler Verkehr um die 5 %-Marke liegt, dann können Sie sich wahrscheinlich Zeit nehmen, um für Mobilgeräte zu entwerfen.

Sollten sich die Prognosen bewahrheiten, wird die mobile Nutzung weiter zunehmen. Dann verlieren diejenigen, deren Seiten auf Mobilgeräten nicht korrekt angezeigt werden, einen erheblichen Teil des Suchverkehrs und mehr. Erstellen Sie Websites "für Menschen" und Sie werden glücklich sein!

Alle reden über Mobilität: von kleinen Marketingagenturen bis hin zu Giganten wie Yandex und Google.

In diesem Artikel verraten wir Ihnen, warum die mobile Version der Seite so viel Aufsehen erregt, was die Voraussetzungen dafür sind und ob Sie sie persönlich brauchen.

Und ich werde sofort ein großes Geheimnis enthüllen, nach seiner Implementierung begannen wir, mehr Bestellungen zu erhalten. Alle. Der Rest ist weiter.

Wofür? Wofür? Wofür?

Sie können das Thema der Notwendigkeit, die Website für mobile Geräte anzupassen, auf verschiedene Arten verschieben.

Aber global sprechen zwei gute Gründe dafür, eine mobile Version der Website zu erstellen – benutzerseitig und technisch.

Schauen wir uns jeden genauer an. Dabei wie gewohnt kurz und bündig. Wir lassen Wasser hinter dem Tor.

Benutzerfreundlichkeit

2016 stellten die Analysten von StatCounter als erste fest, dass der Anteil des mobilen Traffics den Anteil des Desktops überstieg: 51,3 % gegenüber 48,7 %.

Das bedeutet, dass im Durchschnitt jede Website im Internet häufiger von einem Telefon als von einem Computer aus besucht wird.

In Russland ist das Bild ungefähr gleich: Der Anteil von Smartphones ist höher als der Anteil von Computern und anderen Geräten. Das belegt eine Studie der GfK Rus:

Statistiken

Jedes Jahr wird die Kluft immer größer – 2018 betrug das Wachstum beispielsweise 20 %. Darüber hinaus sagen Analysten, dass dies nicht die Grenze ist.

Diese Ausrichtung sollte Sie auf jeden Fall zum Nachdenken anregen: Wie sieht Ihre Seite auf dem Bildschirm von Smartphones aus?

Und höchstwahrscheinlich ist die Antwort schlecht. Wenn Sie eine gewöhnliche, nicht angepasste Website von einem Mobiltelefon aus öffnen, wird das Surfen zu einer Suche - Sie müssen die Seiten skalieren, auf kleine Links zielen und auf eine lange Ladezeit warten.

Dazu kommen die ganze Hektik und jede Menge Ablenkungen – schließlich ist das Telefon nicht gleich Computer, wenn der Besucher ganz auf den Monitor konzentriert ist.

Benutzer werden nicht lange nach dem gewünschten Abschnitt suchen und die Oberfläche verstehen - eine bequeme Website eines Mitbewerbers ist immer im nächsten Tab geöffnet.

Suchmaschineneinstellungen

Google und Yandex drängen schon lange auf mobile Versionen. Dafür veröffentlichte die First einen speziellen Mobile-First-Index-Algorithmus, nach dem sie die Bequemlichkeit einer mobilen Seite bewertet und abhängig davon ihre Position in der Suche bestimmt.

Der zweite Algorithmus kam später heraus, liegt aber von der Wichtigkeit her ungefähr auf dem gleichen Niveau. Es heißt Wladiwostok.

Es gibt auch indirekte Gründe, die die Position der mobilen Version in der Suche beeinflussen. Suchmaschinen berücksichtigen unter anderem Verhaltensmerkmale.

Hier geht es darum, wie lange Ihre Besucher auf der Seite verweilen, wie viele Seiten sie öffnen, wie aktiv sie auf Buttons und Schalter klicken.

Wenn ein Benutzer von einem Mobiltelefon aus eine normale Desktop-Site besucht, wird er dort nicht lange bleiben.

Infolgedessen verschlechtern sich die Verhaltenseigenschaften. Dadurch kommt man auf den letzten unbewohnten Seiten von Yandex und Google vorbei.

Haben wir Sie schon überzeugt? Dann prüfen Sie selbst, ob Sie eine mobile Version benötigen bzw. von welchen Geräten Besucher auf Ihre Seite kommen.

Sie können dies in tun Google Analytics im Bericht „Zielgruppe -> Mobilgeräte -> Übersicht“. Wenn ja, dann gehen Sie zu „Berichte -> Technologien -> Geräte“.

Analytik

Wenn Sie sehen, dass es mehr als 15 % Smartphones gibt, dann ist dies eine alarmierende Glocke für Sie – Sie müssen nur die Website für mobile Geräte optimieren. Lassen Sie uns daher herausfinden, wie dies zu tun ist.

Wichtig. Diese Situation wird nicht von allen beobachtet. Und in einigen Bereichen ist die Nutzung der mobilen Version verboten, egal wie seltsam es klingen mag.

Arten von mobilen Versionen

Die meisten Websites und Online-Shops, auf die Sie gestoßen sind, verwenden einen von drei Ansätzen: Responsives Layout, separate mobile Website und dynamische Anzeige.

Um die richtige Wahl zu treffen, müssen Sie wie üblich auf Ihren Aufgaben und Fähigkeiten aufbauen.

1. Responsives Layout

Technisch gesehen ist dies eine Seite, aber die Struktur der Seiten passt sich der Größe des Geräts an.

In einer vereinfachten Version sieht das so aus: Für Computer öffnen Sie alle Menüpunkte und bauen Sie Produkte in drei Spalten auf.

Bei Tablets zeigen wir nur den Warenkorb und platzieren die Waren in zwei Spalten; für Smartphones - wir verstecken alles in der Menüschaltfläche, wir platzieren die Waren für jede Zeile.

Adaptives Layout

Der Hauptvorteil einer solchen Anpassungsfähigkeit der Website besteht darin, dass sowohl die mobile als auch die Desktop-Version dieselbe Website sind.

Das bedeutet, dass es ausreicht, alle Änderungen einmal vorzunehmen, danach erfolgt die Anpassung der Seite für alle Bildschirme automatisch.

Es kann ein Artikel hinzugefügt werden, die Sortierung geändert werden, eine neue Knopffarbe. Weitere Vorteile des adaptiven:

Billig und einfach - es ist relativ schnell und kostengünstig entwickelt, Sie können sogar ein adaptives in eine bestehende Site implementieren;
Eine Seitenadresse – praktisch für Benutzer und technisch korrekt (weniger Aufwand bei der Suchmaschinenoptimierung);
Das empfiehlt Google. Auf der Entwicklerseite gibt es eine offizielle Empfehlung zur genauen Verwendung adaptives Layout. Es gibt keine konkreten Argumente, aber das ist Google selbst.

Es gibt auch Nachteile des adaptiven Layouts. Obwohl sie im Vergleich zu anderen Optionen recht unauffällig sind. Aber wie gesagt, sie sind:

Eine Website mit großer Funktionalität lässt sich nur schwer an Mobiltelefone anpassen. Dies ist entweder unpraktisch oder es müssen einige Funktionen geopfert werden.
Langsames Laden. Erinnerst du dich, dass wir gesagt haben, dass dieselbe Seite sowohl für Telefone als auch für Computer geladen wird?
Dies sind schwere Bilder und lange Menüs und der Rest der Informationen. Um das Problem zu lösen, verwenden einige Entwickler Seitenkomprimierung, benötigen aber auch zusätzliche Anfragen an den Server und damit Zeit;
Wechsel zur Vollversion nicht möglich. Der Benutzer kann im Notfall nicht auf die Desktop-Version wechseln, um alle Funktionen zu nutzen, da die Website selbst entscheidet, in welcher Version sie angezeigt wird.

Responsive Design ist jedoch die beliebteste mobile Version des Webs.

Es wird von vielen Motoren, Designern verwendet, und übrigens, wir sind auf einigen .

2. Separate mobile Version

In diesem Fall haben Sie zwei verschiedene Sites - jede mit ihrer eigenen Adresse, ihrem eigenen Design und ihren eigenen Funktionen. Dies ist die Antwort auf die Frage: „Was ist der Unterschied zwischen der mobilen Version der Website und der adaptiven Version?“.

Die Website selbst bestimmt die Größe des Bildschirms des Besuchers und entscheidet, was angezeigt wird - die mobile Version der Website oder die Desktop-Version.

Meistens ist es die mobile Version, die im Link mit dem Buchstaben m (übersetzt mit „mobil“) beginnt.

Separate mobile Version

Dieser Ansatz ist praktisch, da Sie überhaupt nicht von der Desktop-Version abhängig sind. Sie können sich voll und ganz auf den Komfort mobiler Benutzer konzentrieren und nur das meiste übrig lassen Basisfunktionen und berücksichtigen Sie alle kleinen Dinge in der Benutzerfreundlichkeit.

Das Layout der mobilen Version unterscheidet sich stark von der Desktop-Version. Einen zerstreuten Besucher, der höchstwahrscheinlich in einem Bus herumschubst oder auf ein Smartphone schaut, werden Sie definitiv behalten können, bis sein Chef ihn sieht.

Alle Knöpfe und Schalter können so riesig gestaltet werden, dass sie sicher mit dem Finger getroffen werden.

Es gibt auch andere Argumente, eine mobile Version der Website separat zu erstellen: schnelle Ladegeschwindigkeit - in einer separaten Version werden leichte Bilder mittlerer Qualität geladen und im Allgemeinen wird die Seite auf grundlegende Elemente reduziert.

Und es ist auch möglich, auf die Vollversion der Seite zu wechseln, wenn der Besucher entscheidet, dass ihm mobile Funktionen nicht ausreichen.

Fairerweise muss man sagen, dass eine separate Version der Seite für Mobilgeräte einige Nachteile hat:

Unterschiedliche Site-Adressen für Mobiltelefone und Desktop. Dies kann SEO Probleme bereiten - Suchmaschinen sehen zwei verschiedene Websites mit demselben Inhalt.
Und herabgestufte Positionen für die Duplizierung. Um das Problem zu umgehen, müssen Sie zusätzliche Ressourcen anschließen;
Es ist unbequem, auf dem Tablet zu sitzen - darauf sind die Elemente auf dem gesamten Bildschirm verschwommen.
Und für die Desktop-Version wird der Tablet-Bildschirm nicht groß genug sein. Es stellt sich heraus, dass der Besucher in eine Sackgasse gerät;
Kostet mehr. Die mobile Version hat zwar eine eingeschränkte Funktionalität, aber bedenken Sie dennoch, dass dies eine neue Website ist, die von Grund auf neu erstellt werden muss.
Legen Sie daher für die Entwicklung einer mobilen Version der Website im Voraus ein Budget fest.
Zusätzliche Fahrzeit. Es gibt zwei Standorte, Sie müssen die Arbeit aufrechterhalten und sich sowohl dort als auch hier auf dem Laufenden halten.

Wie Sie sehen können, gibt es viele Bedenken. Aber viele große Online-Shops wählen diese Methode, da jede falsche Handlung einen Kunden vom Kauf abschrecken kann.

Wenn Sie die gleichen "gefährlichen" Verkäufe haben, müssen Sie auf die Entwicklung von E-Commerce-Websites achten.

Website des Online-Shops

3. Dynamische Anzeige (RESS)

Und der dritte Weg ist eine Symbiose der beiden vorherigen Optionen. Zunächst erkennt die Website das Gerät der Besucher und öffnet je nach Bildschirmgröße die Desktop-, Mobil- oder Tablet-Version.

Das heißt, nur die Option, die geeignet ist bestimmtes Gerät. Computer – groß und sperrig, und Smartphones – begrenzt, aber leicht. Der Ansatz reduziert die Öffnungszeit erheblich.

Der Hauptnachteil von RESS ist, dass es lang und teuer ist. Das Entwerfen einer dynamischen Anzeige ist wie das Erstellen mehrerer verschiedener Websites von Grund auf neu.

Und die Technik ist nicht perfekt. RESS ist ein relativ junges Tool, daher kann es vorkommen, dass das Gerät falsch oder gar nicht erkannt wird.

Zu den prominenten Personen, die RESS verwenden, gehört Google. Im Allgemeinen ist die Technologie, wie ich festgestellt habe, nicht bewohnbar, und wenn Sie ein begrenztes Budget haben oder die Zeit knapp wird, ist es besser, es nicht zu riskieren. Und achten Sie auf die beiden vorherigen Optionen.

Es gibt auch so etwas wie eine Gummiauflage. Einige glauben, dass dies eine Variante der mobilen Website ist, aber das ist es nicht.

Wichtig. Gummiertes Layout ist nur, wenn die Seite auch auf dem Handy, sowie auf dem PC ordentlich dargestellt wird. Und zwar völlig unverändert.

Kriterien der Idealität

Wir haben bereits gesagt, dass der Benutzer am Computer maximal auf das konzentriert ist, was er auf dem Bildschirm sieht.

Fast nichts konkurriert um seine Aufmerksamkeit. Ob es darum geht, am Smartphone zu sitzen - parallele Aufgaben, die Straße, Benachrichtigungen, Anrufe, die um Sie herum. Dies muss in erster Linie bei der Entwicklung berücksichtigt werden.

Unabhängig davon, für welchen Ansatz Sie sich entscheiden, müssen Sie daher bestimmte Regeln der Website für mobile Geräte einhalten. Hier sind die wichtigsten:

Großer dunkler Text auf hellem Hintergrund. Alle Texte gestaltet man am besten nach dem Klassiker – schwarze Schrift auf weißem Grund.
kurz Formen. Hinterlassen Sie eine Anfrage, vereinbaren Sie einen Termin, tätigen Sie einen Kauf - was auch immer der Benutzer eingeben wird, Sie müssen ein Minimum an Daten anfordern, das für den ersten Kontakt ausreicht.
Lange Formen schrecken grundsätzlich ab, was soll man zu mobilen Besuchern sagen.
Große anklickbare Elemente. Der Besucher sollte nicht zielen und Knöpfe und Schalter fangen. Es ist besser, alle interaktiven Elemente groß zu machen - versuchen Sie, sie selbst anzustupsen.
Apple und Microsoft raten, 44 mal 44 Pixel anzustreben. Der Mindestschwellenwert beträgt 24x24, aber dies ist ein letzter Ausweg.
Ladegeschwindigkeit der Website. Es gibt keine bestimmten Standards, aber Sie sollten immer nach dem Ideal streben.
Es gibt ein solches allgemeines Muster – jede Sekunde, die zum Laden einer Seite benötigt wird, reduziert proportional die Umwandlung in Verkäufe.
Sie können die mobile Version der Website auf Ladegeschwindigkeit in speziellen Diensten überprüfen, darüber etwas niedriger.
Der angegebene Formulartyp. Achten Sie bei der Zusammenstellung der Leistungsbeschreibung darauf, dass Sie dies nur beim Ausfüllen des Telefons angeben numerische Tastatur.
Gleiches gilt für Passwörter Email und andere Felder. Wenn Sie die Site selbst entwickeln, dann seien Sie nicht zu faul, für jedes Formular den passenden Typ festzulegen.
Anklickbare Kontakte. Wie bei Formularen gibt es auch bei Kontaktdaten eine besondere Art der Verlinkung.
Klicken Sie auf das Telefon - Wählen öffnet sich, auf die Mail - Mailprogramm. Benutzer werden definitiv aus Gewohnheit nach Kontakten stochern.
Informationen in einer Spalte. Keine horizontalen Scrolls und Fotos in mehreren Spalten auf einem Bildschirm.
Selbst die coolsten Flaggschiffe haben dafür keinen ausreichend großen Bildschirm. Einspaltiger Text ist besser lesbar und große Fotos zeigen alle Details.

Lifehack. Wenn Sie nur brauchen volle Informationüber den Kunden (z. B. für die Lieferung) und unterteilen Sie dann den Prozess des Ausfüllens des Antrags in mehrere Schritte.

Fordern Sie im ersten Schritt Name und Nummer an, im nächsten die Adresse und Details. Auch wenn der Nutzer zu faul ist und das Formular nicht bis zum Ende ausfüllt, haben Sie immer noch Kontakte, an die Sie sich klammern können.

Formular erfassen

MOBILITÄTSCHECK

Der beste Experte, der Ihnen sagt, ob Ihre Website benutzerfreundlich ist, ist ein Besucher. Führen Sie einige lautstarke Tests Ihrer mobilen Version durch.

Wählen Sie aus dem Umfeld dasjenige aus, das am besten zur Beschreibung Ihres potenziellen Käufers passt: nach Alter, Beruf, Interessen.

Bitten Sie einen Freiwilligen, eine Bestellung aufzugeben - lassen Sie ihn den gesamten Weg des Käufers durchlaufen. Störe oder korrigiere ihn einfach nicht.

Lassen Sie alles so realistisch wie möglich sein – Sie werden nicht neben jedem Besucher sitzen und erklären, wo er klicken muss.

Alle Schwierigkeiten oder Verwirrungen sollten von Ihrem Probanden laut kommentiert werden.

Und Sie spielen weiterhin Spion: Analysieren Sie die Aktionen und machen Sie sich stillschweigend Notizen in einem Notizbuch. Sie können nur als letztes Mittel helfen, wenn der Freiwillige völlig in einer Sackgasse steckt.

Technische Prüfung

Wenn Sie sich vergewissert haben, dass alle Elemente vorhanden sind und die Benutzeroberfläche klar und vorhersehbar ist, fahren Sie mit der technischen Seite fort.

Leiten Sie die Website durch verschiedene Dienste, um Fehler und Kommentare zu sammeln. Wenn Sie es selbst reparieren können, nein, wissen Sie, was Sie in das TOR für den Programmierer schreiben müssen.

Google Search Console- offizieller Dienst von Google. Es zeigt, wie die Website auf dem durchschnittlichen Smartphone-Bildschirm aussieht, und gibt Verbesserungsvorschläge.

Erinnern Sie sich, als wir über den Mobile-First-Index-Algorithmus sprachen? Der Dienst basiert nur auf seiner Arbeit, also vernachlässigen Sie diesen Punkt nicht.

Google Search Console

Yandex-Webmaster- ein ähnlicher Dienst von Yandex. Bevor Sie hier nachsehen, müssen Sie die Website zum Webmaster-Panel hinzufügen und die Rechte daran bestätigen (laden Sie eine kleine ausgestellte Datei herunter).

Erst dann können Sie den Dienst über „Extras -> Prüfen“ nutzen mobile Seiten". Das Ding ist auch nützlich - mit Empfehlungen und Kommentaren.

Yandex-Webmaster

Überprüfen Sie von der Bing-Suche. Ja, so eine Suchmaschine gibt es auch. Lassen Sie nur sehr wenige Leute es benutzen, aber jetzt brauchen Sie sie nicht.

Der Dienst kann Fehler sehen, auf die die beiden vorherigen nicht achten werden. Nun, wie sie sagen, es kann nicht schlimmer werden.

Überprüfen Sie von der Bing-Suche

Sichtkontrolle

Nach den technischen Kontrollen geht es an die Sichtkontrolle. Natürlich können Sie die Website von Ihrem Telefon aus überprüfen, aber Ihre Besucher müssen dies tun verschiedene Geräte– von Breitbild-Flaggschiffen bis hin zu Budget-Smartphones.

Um alle im Auge zu behalten, verwenden Sie Dienste, um die Website auf verschiedenen Bildschirmen anzuzeigen. Hier sind einige davon:

responsinator.com - zeigt alle gängigen Geräte auf einmal auf einer Seite. Es gibt zehn davon im Dienst: Pixel 2 (und Androids im Allgemeinen), iPhones und iPads.

Responder.com

iloveadaptive.com - Sie können auswählen, welche Plattformen gleichzeitig angezeigt werden sollen, ohne verschiedene Geräte zu mischen.

Von zusätzlichen Leckereien: In der oberen rechten Ecke befinden sich grundlegende Indikatoren für die Ladegeschwindigkeit der Seite.

iloveadaptive.com

quirktools.com - zeigt nur ein Gerät gleichzeitig an, aber was für eine Auswahl. Alle Bildschirme sind in Gruppen unterteilt: moderne Smartphones, Tastentelefone, Computer und Fernseher.

Oben ist ein praktisches Lineal mit der Bildschirmgröße in Pixel und zusätzliche Funktionen zum Drehen und Scrollen.

quirktools.com

Es gibt einen Haken bei den Diensten - egal wie oft Sie sie ausprobieren, sie werden Ihnen keine vollwertige Anzeige bieten.

Aufgrund unterschiedlicher Plattformen, Technologien und Entwicklungsansätze kann sich das Bild auf dem Dienst und in einem echten Telefon unterscheiden - ein Pixel mehr, ein Pixel weniger.

Im Allgemeinen beeinträchtigt dies die Qualität der Mobilität nicht sehr, aber es ist besser, dies im Auge zu behalten.

Übrigens. Mit welcher Bildschirmgröße genau Besucher zu Ihnen kommen, erfahren Sie in derselben Metrik. Statistiken befinden sich unter „Standardberichte -> Technologien -> Anzeigeauflösungen“.

Kurz zu den wichtigsten

Wenn Sie sich also für die mobile Version entscheiden, wählen Sie zuerst die geeignete Methode und stellen Sie dann sicher, dass der Entwickler nicht schummelt.

Aber vor allem, machen Sie einen guten Job. Schließlich ist es eine Sache, alles gut präsentiert zu haben, und eine andere, alles zu verkaufen. Und dafür reicht nur der technische Teil nicht aus.

Außerdem ist es schade, dass Sie gerade jetzt an die mobile Version denken. Die Zeiten, in denen gesagt wurde, dass dies sehr relevant sei, sind bereits vorbei, und die mobile Revolution ist gekommen.

Die Anpassung der Website für Smartphones ist jetzt eine Standardfunktion. Unser für Sie Fachberatung- Zweifel beiseite schieben und zur Sache kommen.

Etwa 20 % des Datenverkehrs in RuNet entfallen auf mobile Betriebssysteme. Und diese Zahl gewinnt weiter an Dynamik. Ist das nicht ein Grund, darüber nachzudenken, ob Sie Ihre Website für mobilen Traffic anpassen sollten, da dies eine völlig andere Zielgruppe ist?

Responsive Design für unterschiedliche Bildschirmauflösungen elektronischer Gadgets ist längst zum modernen Standard in der Website-Entwicklung geworden. Allerdings ist der Anteil solcher Seiten im Internet noch nicht groß. Und es gibt noch weniger Websites, die über eine eigene mobile Version verfügen. Es lohnt sich also, eine separate Version der Website zu erstellen Mobiltelefone Oder reicht es aus, das Design adaptiv zu machen?

Warum benötigt die Seite eine mobile Version?

Es ist viel bequemer, die mobile Version der Website von Smartphones und Mobiltelefonen aus zu verwenden: Es ist kein horizontales Scrollen erforderlich, alle Funktionen funktionieren korrekt (auf einigen nicht angepassten Websites ist es sogar unmöglich, Waren in den Warenkorb zu legen! ).
In der mobilen Version können Sie sich entwickeln Zusatzfunktionen, die sich speziell an diese Besucherzielgruppe richten: SMS-Versand direkt von der Seite aus organisieren, Standort und Entfernung zur nächsten Verkaufsstelle ermitteln etc.
Die Navigation solcher Seiten erfolgt angepasst an den Touchscreen (Touchscreen), was auch deutlich komfortabler ist.
Die mobile Version der Website ist leichter, hat weniger Code und wird daher schneller geladen, was die Kosten des Benutzers für den Download senkt, wenn er für mobilen Datenverkehr bezahlt.
Suchmaschinen verwenden mobile Suche Für Telefone wird daher die mobile Version der Website darin höher eingestuft, was bedeutet, dass es mehr Übergänge zu Ihrer Website geben wird.

Arten der mobilen Version der Website

Mobile Version kann sein identisch mit der Hauptseite: Struktur, Inhalt, Design wiederholen. Dieser Effekt kann sogar mit speziellen Diensten erzielt werden, ohne Entwickler zu kontaktieren.

Unabhängige mobile Version der Website. Hier sind Struktur und Funktionalität bereits komplett verändert, nur Style-Matches werden wiederholt, teilweise Elemente und Inhalte, damit der User weiß, dass er sich auf der gleichen Seite befindet.

Was wird für die mobile Version der Website benötigt?

Design. Vielleicht die wichtigste Zutat. Die neuesten Designtrends für mobile Websites sind ultimativ leicht und einfach.
Kompatibilität. Die Website sollte auf den gängigsten Bildschirmauflösungen (240 x 320, 480 x 320 und einige andere) korrekt angezeigt werden. Auf solchen Seiten ist es besser, kein oder minimales Javascript zu verwenden, verwenden Sie xhtml.
Content-Optimierung. Dies gilt insbesondere für Bilder: Sie sollten sowohl in der Größe als auch in Kilobyte leicht sein.
Benutzerfreundlichkeit. Eine gute Navigation ist der Schlüssel zu einer erfolgreichen mobilen Website!

Mobile Version oder Responsive Design?

Eine genaue Antwort auf diese Frage werden Sie nicht finden. Es gibt unterschiedliche Standpunkte, die sich auf die Nachteile sowohl der einen als auch der zweiten Option berufen.

Zu den Hauptnachteilen des adaptiven Designs beziehen sich auf die Tatsache, dass das „Gewicht“ der Website groß bleibt, was bedeutet, dass das Laden der Website immer noch lange dauert. In der Entwicklung ist Responsive Design einfacher als die mobile Version, aber es kann auf dem mobilen Bildschirm nicht deaktiviert werden, während der Benutzer, wenn ihm die mobile Version nicht gefällt, jederzeit zur Standardversion der Website wechseln kann.

Welche Websites benötigen eine mobile Version?

Untersuchungen zeigen, dass es ratsam ist, eine mobile Version der Website für die folgenden Arten von Websites zu erstellen:

Referenzseite
Soziale Netzwerke und Dienstleistungen
Internetdienste
Online Einkaufen

Wenn Sie bereits darüber nachgedacht haben, ob Ihre Website eine mobile Version benötigt oder nicht, analysieren Sie die Zugriffe auf die Website für letztes Jahr durch Analysesysteme. Liegt der Anteil des mobilen Traffics bei 15 % oder mehr, liegt die Antwort auf der Hand!

Zahlen

Sie haben sich noch nicht entschieden? Dann betrachten Sie diese Statistiken:

Mobiltelefone werden von 87 % der Gesamtbevölkerung genutzt. Anscheinend sind sie nicht nur bei kleinen Kindern!
Höhe Mobile Commerce wird in den nächsten 5 Jahren voraussichtlich um das 99-fache zunehmen!
Nur 21 % der Websites sind für die Arbeit mit angepasst mobile Geräte. Sie haben immer noch die Chance, Ihren Anteil am Traffic zu erhalten!

Nützliche Statistiken finden Sie unten in der Infografik (anklickbar).