Mobile Optimierung für bestehende Websites: Audit, Touch und Checkout

Über 60 Prozent aller Besuche kommen vom Smartphone, bei Onlineshops mit jungem Publikum oft 80 Prozent. Wer diese Besucher schlecht bedient, verliert Umsatz, und zwar messbar. Dazu bewertet Google seit 2019 die mobile Version einer Website. Mobile Optimierung ist damit keine Kür mehr, sondern die Grundlage für Sichtbarkeit und Anfragen.

SchubertMedia entwickelt seit über 20 Jahren Websites in Erfurt und betreut Kunden in Thüringen und im übrigen deutschsprachigen Raum. Auf dieser Seite geht es um bestehende Websites: Wie wir prüfen, wo es auf dem Smartphone hakt, womit wir das messen und was dabei herauskommt.

Stand: Aktualisiert am 07.09.2026 | Autor: Nico Schubert, Inhaber SchubertMedia, Erfurt | Schwerpunkte: Webentwicklung, Mobile UX, Performance

Warum Mobile-First heute über Umsatz entscheidet

In unseren Projekten in Erfurt und Thüringen wiederholen sich die Muster. Diese Zahlen tauchen immer wieder auf:

Eine schlechte mobile Website kostet also jeden Tag Kunden. Das Gute daran: Mobile Optimierung lässt sich messen, planen und an klaren Stellen anpacken. Wir reden nicht lange, wir setzen um.

Mobile-Optimierung versus Responsive Design: die Begriffe sauber sortiert

Beide Begriffe werden oft gleichgesetzt. Sie meinen aber Verschiedenes:

• Mobile-Optimierung ist das Ganze: Konzept, Gestaltung, Geschwindigkeit, Bedienung und SEO für mobile Nutzer, meist an einer Website, die schon online ist.
• Responsive Design ist die Technik dahinter. Es sorgt dafür, dass sich Layout und Inhalte an die Bildschirmgröße anpassen.

Responsive Design ist also ein Bauteil der Mobile-Optimierung, nicht dasselbe. Diese Seite behandelt das Ganze. Für die reine Layout-Frage beim Neubau einer Website lesen Sie unsere Seite zu Webdesign.

Mobile-First Design statt nachträglich responsive

Mobile-First heißt: erst fürs Smartphone entwerfen, dann für Tablet und Desktop erweitern. Der Ansatz hat sich durchgesetzt, weil er die Grenzen kleiner Geräte von Anfang an mitdenkt, statt sie hinterher wegzuretuschieren.

Was Mobile-First konkret bedeutet

Vier Grundsätze, die in jedem unserer Projekte gelten:

• Das Wesentliche zuerst: Der knappe Platz zwingt dazu, die Botschaft zu sortieren.
• Weniger Code: Was für kleine Geräte gebaut ist, ist von Haus aus schneller.
• Touch von Anfang an: Bedienelemente werden für Finger entworfen, nicht für Mauszeiger.
• Progressive Enhancement: Grundfunktion für alle Geräte, Komfort für die leistungsfähigen.

Mobile-First in der Praxis

Aus den Grundsätzen werden konkrete Entscheidungen. Diese fünf stehen bei uns immer auf der Liste.

Touch-UX und Bedienbarkeit

Ein Finger ist ungenauer als ein Mauszeiger. Dafür kann er wischen, zoomen und lange drücken. Gute mobile Bedienung nutzt das, statt dagegen zu arbeiten.

Touch-Target-Größen

Die Mindestmaße kommen aus den Richtlinien von Apple und Google.

Touch-Gesten sinnvoll einsetzen

Mobile Nutzer erwarten, dass Inhalte auf Gesten reagieren. Vier davon setzen wir gezielt ein:

• Wischen: Bildergalerien, Karussells, Tabs
• Zoomen mit zwei Fingern: Bilder, Karten, Detailansichten
• Langes Drücken: Kontextmenüs, weitere Optionen
• Nach unten ziehen: Aktualisieren bei Listen und Feeds

Hover-Effekte vermeiden

Ein Touchscreen kennt kein „Darüberfahren“. Was wichtig ist, muss sichtbar sein. Zusatzinformationen zeigen wir per Tipp oder über kleine Hinweis-Schaltflächen.

Mobile Performance: warum Smartphones strenger getestet werden

Smartphones haben weniger Rechenleistung und oft eine schlechtere Verbindung. Eine Sekunde mehr Ladezeit kann auf dem Handy 20 Prozent der Anfragen kosten.

Wichtigste Hebel

Diese fünf Maßnahmen bringen in unseren Projekten am häufigsten den entscheidenden Sprung:

• Bilder als WebP oder AVIF, per srcset in passender Größe
• Lazy Loading für Bilder und iFrames unterhalb des sichtbaren Bereichs
• Critical CSS direkt im HTML, der Rest nachgeladen
• JavaScript aufteilen, Skripte von Drittanbietern nur laden, wenn sie gebraucht werden
• Systemschriften oder Webfonts mit font-display: swap

Die ganze Tiefe zum Thema Geschwindigkeit steht auf der Seite zur Ladezeit-Optimierung, die drei Kennzahlen LCP, INP und CLS erklärt die Seite zu Core Web Vitals.

Mobile SEO und Mobile-First Indexing

Seit 2019 nimmt Google die mobile Version einer Website als Grundlage für Index und Ranking. Was mobil fehlt, fehlt meist auch im Index.

Mobile-First Indexing Checkliste

Jede Website prüfen wir gegen diese fünf Punkte. Fehlt einer, sieht man das in der Sichtbarkeit.

• Gleicher Inhalt: mobil und am Desktop dasselbe, keine versteckten Bereiche
• Strukturierte Daten: JSON-LD in beiden Versionen
• Mobil nutzbar: Viewport gesetzt, Text lesbar, Touch-Elemente mit Abstand
• Mobile PageSpeed: LCP unter 2,5 Sekunden, INP unter 200 Millisekunden, CLS unter 0,1
• Keine Interstitials: bildschirmfüllende Pop-ups beim ersten Aufruf kosten Ranking

Lokale Suchen sind überdurchschnittlich oft mobil. Wer in Erfurt eine Werbeagentur sucht, tut das meist am Smartphone. Mobile Optimierung und lokale Suche gehören deshalb zusammen. Die technische Seite behandelt unsere Seite zu Technical SEO.

Mobile Commerce: Checkout, Filter und Suche optimieren

Für Onlineshops ist das Smartphone der Ort, an dem Kaufabbrüche passieren. Wir empfehlen PrestaShop als Shopsystem für den deutschen Markt und kennen die typischen mobilen Stolperstellen.

Mobile Checkout

Der Checkout entscheidet auf dem Smartphone noch stärker als am Desktop über Kauf oder Abbruch. Sechs Punkte stehen bei uns immer auf der Liste:

• Checkout auf einer Seite statt in vier Schritten
• Gastbestellung als Standard, Kundenkonto freiwillig
• passende Eingabetypen: type="tel", type="email", inputmode je Feld
• Express-Zahlung mit PayPal, Apple Pay, Google Pay
• Adressvorschläge vom Browser oder einem Dienst
• Adressprüfung, während getippt wird

Mobile Filter und Sortierung

Filter werden auf kleinen Bildschirmen schnell unbenutzbar. Drei Regeln helfen:

• Filter als Overlay statt seitlich, mit gut sichtbarer Schaltfläche „Anwenden“
• aktive Filter als Schlagworte anzeigen, einzeln löschbar
• Sortierung als Auswahl von unten, nicht als winziges Dropdown

Mobile Suche

Neben dem Menü ist die Produktsuche der wichtigste Weg zum Kauf. Vier Punkte machen sie brauchbar:

• Suchfeld oben in der Kopfzeile, groß genug zum Antippen
• Vorschläge beim Tippen: Produkte, Kategorien, Marken
• letzte Suchen merken
• Tippfehler verzeihen, am besten mit ElasticSearch oder Algolia

Was nach dem Klick passiert, steht auf unserer Seite zur Conversion-Optimierung.

Buchungs- und Termin-Software auf Mobile

Für Hotels, Praxen, Friseure, Werkstätten und Berater ist die Terminbuchung am Smartphone der wichtigste Weg zum Kunden. Darauf achten wir:

• Kalender, die sich mit dem Finger bedienen lassen, nicht nur mit der Maus
• Zeitfenster, die groß genug für den Daumen sind
• Buchungs-Schaltfläche, die beim Scrollen unten stehen bleibt
• Telefonnummer sichtbar und antippbar, für alle, die lieber anrufen
• Datenschutzhinweis kurz und auf dem Handy lesbar

Page-Builder mobile-fest machen

Viele WordPress-Websites laufen mit Elementor, Divi, Bricks oder Beaver Builder. Bequem für die Redaktion, aber mobil schnell unordentlich, wenn niemand hinsieht.

Typische Mobile-Probleme bei Page-Buildern

Diese fünf Symptome finden wir fast in jedem Page-Builder-Audit:

• zu kleine Schrift in Spalten, die mobil untereinander rutschen
• riesige Hintergrundbilder ohne mobile Alternative
• Karussells, die auf Touch schlecht reagieren
• Container in Containern mit zu viel Innenabstand
• Animationen, die auf dem Handy ruckeln

Was wir tun

Mit diesen Eingriffen sehen Page-Builder-Websites auch mobil sauber aus, ohne dass die Redaktion etwas verliert:

• mobile Vorschau für jeden Abschnitt einrichten und prüfen
• weniger Spalten auf dem Smartphone, Reihenfolge gezielt festlegen
• eigene Bilder für mobile Ansichten hinterlegen
• Animationen auf dem Handy abschalten
• eigenes CSS dort, wo der Builder nicht weiterkommt

Häufige Mobile-Optimierungs-Fehler

Diese sechs Fehler finden wir in fast jedem Mobile-Audit. Wer sie kennt, macht sie seltener.

Unser Mobile-Audit-Prozess

Wir prüfen mobile Websites in fester Reihenfolge, auf drei Ebenen.

Echte Geräte

Emulatoren zeigen nicht alles. Wir testen auf iPhone 14 und 15, Samsung Galaxy S22 und S23, iPad und einem Android-Gerät der Mittelklasse. Seltenere Modelle laufen über BrowserStack.

Standard-Tools

Dazu kommen fünf Werkzeuge, jedes für einen anderen Blickwinkel:

• Google Mobile-Friendly Test: der Pflichttest für jede Seite
• PageSpeed Insights (Mobile): Core Web Vitals und Laborwerte auf einen Blick
• Chrome DevTools Device Mode: schnelle Simulation, auch mit gedrosseltem Netz
• Lighthouse Mobile: wiederholbare Messung, gut für vorher und nachher
• Sitebulb: mobile Probleme über die ganze Website hinweg

Manueller Durchgang

Jemand aus dem Team geht den wichtigsten Weg der Besucher mit dem Smartphone durch und schreibt jede Stolperstelle auf. Das findet Fehler, die kein Werkzeug sieht.

Case Study: Mobile Conversion plus 38 Prozent in 8 Wochen

Ende 2024 kam ein Thüringer Mode-Onlineshop mit dem typischen Bild zu uns: viel mobiler Verkehr, aber mobil deutlich weniger Käufe als am Desktop.

Ausgangslage:

• mobiler Anteil an den Besuchen: 74 Prozent
• Absprungrate mobil: 78 Prozent
• Conversion-Rate mobil: 0,82 Prozent
• Conversion-Rate Desktop: 2,1 Prozent
• Abbrüche im mobilen Checkout: 71 Prozent

Maßnahmen in 8 Wochen:

• alle Touch-Ziele auf mindestens 48 Pixel, mit Abstand
• Checkout auf einer Seite statt in vier Schritten
• Express-Zahlung mit Apple Pay und PayPal
• mobile Filter als Auswahl von unten, aktive Filter als Schlagworte
• Suchvorschläge mit Algolia
• Bilder als WebP mit srcset und Lazy Loading
• JavaScript aufgeteilt, Drittanbieter-Skripte ausgedünnt
• LCP von 3,8 auf 1,6 Sekunden

Ergebnis nach 8 Wochen:

• Absprungrate mobil: 41 Prozent (minus 37 Prozentpunkte)
• Conversion-Rate mobil: 1,13 Prozent (plus 38 Prozent)
• Abbrüche im mobilen Checkout: 49 Prozent (minus 22 Prozentpunkte)
• mobiler Umsatz: plus 52 Prozent
• LCP mobil: 1,6 Sekunden

Das Projekt hat rund 6.500 Euro für Audit und Umsetzung gekostet und sich nach sechs Wochen bezahlt gemacht. Die anonymisierten Vorher-Nachher-Screenshots zeigen wir auf Anfrage.

Brauchen Sie noch AMP?

Meist nicht. Google hat AMP fallen gelassen, seit 2021 hängt auch das Nachrichten-Karussell nicht mehr daran. Mit sauberer mobiler Optimierung erreichen Sie dieselbe Geschwindigkeit ohne die Einschränkungen und ohne eine zweite Code-Basis. Das Geld steckt man besser in die Core Web Vitals.

Warum SchubertMedia aus Erfurt?

Wir sind ein inhabergeführtes Unternehmen in Erfurt. Sie sprechen mit dem Entwickler, der die Arbeit macht, nicht mit einem Vertrieb.

• Über 20 Jahre Webentwicklung, Schwerpunkt Mobile, Geschwindigkeit, SEO
• Eigene Testgeräte: iOS und Android in mehreren Größen, regelmäßig erneuert
• Systeme: WordPress, PrestaShop, TYPO3, eigene PHP-Anwendungen
• Vor Ort in Erfurt, persönlicher Kontakt, deutsches Hosting auf Wunsch
• Festpreise, wo sie passen
• Whitelabel für Agenturen ohne eigene Mobile-Leute

Mehr zur Website-Optimierung insgesamt, zu Ladezeiten und zu Technical SEO.

Häufige Fragen zur Mobile-Optimierung

Diese acht Fragen kommen in fast jedem Erstgespräch. Fehlt Ihre, melden Sie sich.

Was ist Mobile-First Design?

Eine Website wird zuerst fürs Smartphone entworfen und dann für größere Bildschirme erweitert. Das ergibt weniger Code, klarere Gewichtung und bessere mobile Werte bei Google.

Wann lohnt sich eine Mobile-Optimierung?

Sobald mehr als 30 Prozent der Besuche mobil sind oder die mobile Conversion deutlich unter der am Desktop liegt. Für Shops und lokale Anbieter ist Mobile Optimierung Pflicht.

Was kostet eine professionelle Mobile-Optimierung?

Ein Mobile-Audit kostet 600 bis 1.500 Euro. Die Überarbeitung einer kleineren Website 2.500 bis 5.000 Euro. Größere Shops kalkulieren wir je Projekt.

Wie lange dauert die Optimierung?

Schnelle Gewinne sind nach ein bis zwei Wochen sichtbar. Eine komplette mobile Überarbeitung dauert je nach Umfang 4 bis 10 Wochen.

Brauche ich noch AMP?

Meist nicht. Google setzt nicht mehr darauf. Mit guter Mobile Optimierung erreichen Sie dieselbe Geschwindigkeit ohne die Einschränkungen.

Was bedeutet Mobile-First Indexing?

Google nimmt seit 2019 die mobile Version Ihrer Website als Grundlage für Index und Ranking. Was mobil fehlt, wird nicht oder schlechter indexiert.

Wie testen Sie meine Website?

Auf echten Geräten mit iOS und Android in mehreren Größen, mit Lighthouse, dem Mobile-Friendly Test und PageSpeed Insights, und mit einem Durchgang von Hand.

Optimieren Sie auch Page-Builder wie Elementor oder Divi?

Ja. Elementor, Divi, Bricks und Beaver Builder sind bei uns Alltag, samt ihrer typischen mobilen Fallen.

Hinweis: Mobile Optimierung ist nicht mit einem Projekt erledigt. Neue Geräte, neue Browser und neue Gewohnheiten der Nutzer verlangen Pflege. Wir bleiben dran. Letzte Aktualisierung: 07.09.2026.