Image lazy loading – Bilder laden wenn sie gebraucht werden

Warum

Eine klassische Newsseite besitzt eine Vielzahl von Bildern und hat – so es denn auch was zu berichten gibt – einen größeren Umfang. Aktuelle Browser laden beim Aufrufen eines HTML-Dokumentes alle Bilder runter die enthalten sind. Am PC stört das wenige und ist seltener ein Nachteil, bei mobilen Websites bedeutet es aber das eine Menge Daten geladen werden, von denen ich unter Umständen nichts habe, da ich nur die neusten 3 Einträge überfliege und dann weiter surfe. Die restlichen Bilder bekomme ich, aufgrund des kleinen Viewports, nicht mal im Augenwinkel mit. Neben den verbrennen von mobilen Datenvolumen blockiert das Laden von Bildern natürlich in dem Moment Bandbreite, die ich für andere Resourcen besser brauchen kann.

Weiterlesen


Responsive Images – hochauflösende Bilder auf Smartphones und Tablets

Um eine möglichst hohe Bildschärfe zu erzielen besitzen aktuelle Smpartphones eine hohe Pixeldichte. Damit Bilder dort entsprechend gut aussehen, benötigen diese eine höhere Auflösung, wie wir sie bei gleicher Größe der Darstellung vom Desktop gewohnt sind. Um jedem Device ein optimales Bild zu liefern und Resourcen nicht unnötig zu verschwenden in dem man immer ein großes Bild ausliefert, bietet sich das, noch recht neue, srcset Attribut des img-Tags an. Im folgen stelle ich dieses kurz vor und zeige wie ich es bisher verwende.

Weiterlesen


Beim Scrollen über Elemente Touch-Events verhindern

Möchte man interaktive Elemente auf einem Smartphone oder anderen Touch-Devices benutzerfreundlich machen, so bietet es sich an diese so umzusetzen, dass die User die komplette Fläche des Elements für eine Interaktion touchen können, statt nur ein kleines Icon oder Text. Problematisch wird es, wenn solch ein Element die komplette Breite des Screens einnimmt und der User beim darüber  scrollen mit dem Finger versehentlich eine Interaktion auslöst. Dies kann zum Beispiel schnell bei einen klassischen Listing passieren. Ein guter Zeitpunkt dies mit einigen Zeilen jQuery JavaScript zu verbessern.

touchOnScroll

Weiterlesen


Xposed Framework bald für Lollipop

Viele Entwickler haben bereits darauf gewartet und gebetet. Nun endlich wurden die Gebete erhört. Der Xposed Framework Macher hat angekündigt, dass eine baldige Veröffentlichung seiner Installer-App ansteht. Wer Xposed noch nicht kennt, man kann hiermit über diverse Module sehr stark in das System von Android eingreifen ohne dass man ein seperates ROM installieren muss.

Weiterlesen