Verschwommene Bilder auf dem Android-Browser

8

Ich habe seit Wochen versucht, das herauszufinden, und habe keine wirklichen Lösungen gefunden. Ich habe einen Workaround gefunden, aber ich finde es sehr ärgerlich.

Die Bilder werden auf dem Standardbrowser meines Galaxy S3 verschwommen geladen, aber in Chrome & amp; Firefox laden sie perfekt ohne die Problemumgehung. Die Bilder sind 2x bereits für High-DPI-Bildschirme, so dass das nicht das Problem ist.

Bei der Arbeit wird Text in den Link eingefügt. Ich lege "."

%Vor%

und machen die Schriftgröße sehr klein.

%Vor%

Screenshot ohne Workaround: Ссылка

Screenshot mit Workaround: Ссылка

Jede Hilfe wäre willkommen! Ich habe mir die Haare ausgezogen, um das herauszufinden. Es muss eine Lösung geben, da facebook mobile und andere mobile Seiten schöne gestochen scharfe Bilder / Icons laden. Danke!

    
Igor 30.04.2013, 22:16
quelle

2 Antworten

5

Ich hatte das gleiche Problem und fand heraus, dass die Ursache des Problems position:fixed und z-index im Standard-Android-Webbrowser ( nicht Chrome!) ist.

Nach dem Entfernen dieser CSS-Attribute wurden alle meine Bilder sehr klar und deutlich.

Aus meiner Erfahrung ist position:fixed ein no-go für Mobilgeräte, insbesondere für Android- und ältere iOS-Versionen. Das einzige mobile Betriebssystem, das ich kenne, das mit position:fixed umgehen kann, ist iOS6 und höhere Versionen.

Update: Bisher ist das einzige Problem, das ich kenne, einfach die Kombination von position:fixed und z-index zu vermeiden. Manchmal reicht es aus, den Z-Index loszuwerden, oder% o_de% überhaupt nicht für iOS und Android. Es ist sowieso keine gute Übung auf dem Handy. Außerdem kannst du nur dafür beten, dass Chrome Android Stock Browser als Standard-Browser in Zukunft so schnell wie möglich auf den meisten Android-Geräten ersetzen wird.

    
Timo 28.05.2013 08:24
quelle
-1

Ich merke von Ihren Screenshots, dass Sie dies gerade über Ihr 4G testen (zB: mobile Verbindung).

Haben Sie versucht, die Tests über WLAN zu wiederholen? Sie müssen sicherstellen, dass Sie den Cache beim Vergleich nicht abrufen. Daher sollten Sie Ihren Browser in den privaten Browsing- / Inkognito-Modus versetzen. Dies wird dazu führen, dass Sie neue Assets vom Host abholen, anstatt intern zwischengespeicherte Assets zu verwenden Browser-Cache jedes Mal).

Der Grund, warum ich die Internetverbindung des Geräts erwähne, ist, dass ich letztes Jahr auf ein wirklich ähnliches Problem gestoßen bin und nach vielem Suchen zu der Erkenntnis kam, dass es der Proxy des Netzwerkes ist, die Bilder vor der Auslieferung zu komprimieren, um Bandbreite zu sparen / p>

Ich bin vielleicht daneben, aber es ist sicherlich etwas, was Sie überprüfen sollten, damit Sie diese Möglichkeit zumindest von Ihrer Liste überspringen können.

Wenn sich herausstellt, dass es so ist, dann ist das eine wirklich interessante Diskussion über das Ganze: Ссылка

Die schlechte Nachricht ist, dass mobile Netzwerke nicht immer auf No-Cache-HTTP-Header achten.

Die drei einfachsten verfügbaren Optionen sind:

  • Erstelle deine Bilder über https - das Netzwerk speichert keinen verschlüsselten Datenverkehr;
  • Servieren Sie Ihre Bilder über einen anderen http-Port;
  • Verwenden Sie die Daten-URL, um die Bilder in-line einzubetten (obwohl es zu diesem Zeitpunkt Auswirkungen auf die Browser-Unterstützung gibt).

Schließlich gibt es in der htaccess-Datei des HTML5-Boilerplate eine Teilumgehung, durch die diese Effekte gemildert werden können. In der Datei htaccess:

%Vor%

Dies funktioniert mit den paar britischen Netzwerken, die ich getestet habe, aber Ihre Ergebnisse können variieren.

    
johnkavanagh 23.05.2013 10:06
quelle

Tags und Links