Hans und Anselm quatschen in bestem Wissen und doch einiger Ausführlichkeit über Bildformate und Bildoptimierung auf Webseiten und geben wertvolle Tipps für Webentwickler und Designer, um bessere Bildqualität bei geringer Dateigröße auszuliefern. Alles mit praktischen Tipps und nicht nur Theorie.
Schaunotizen
- [00:00:13] Bildformate und -optimierung
- Angesichts der Tatsache, dass Apple im Herbst mit HEIF ein ganz neues Bildformat an die Massen bringen wird, sehen wir uns gewillt, noch einmal für fast alle gängigen Probleme und Herausforderungen im Alltag des Webentwicklers und Designers Lösungen zu finden und Empfehlungen zu geben. Wir sprechen über Barrierefreiheit, Suchmaschinenoptimierung, Bildoptimierung auf dem eigenen Rechner oder dem Server und generelle Workflows und Ideen, um auch Kunden mitzugeben, wie Bilder optimiert werden können.
[00:52:32] Keine Schaunotizen
- sonar
- sonar ist ein absolut umfangreiches, flexibles Linting-Tool für Webseiten mit Dutzenden an Anwendungsszenarien.
Kommentare
Matthias #
Geschrieben am 1.08.2017 um 09:03
Danke für den umfassenden Überblick. Zum Thema Srcset oder Picture würde ich allerdings noch anmerken wollen, dass es schon Präferenzen für bestimmte Einsatzbereiche gibt. Generell sagt man, IMG mit srcset sollte in allen Fällen verwendet werden, in denen das Bild sein Aussehen, seine Seitenverhältnisse usw. über alle Breakpoints beibehält. Dann kann der Browser selber entscheiden, welches angebotene Bild er verwenden möchte. Das kann der normalerweise ganz gut. Picture sollte man für Bilder mit echter Art-Direction nehmen. Wenn ich bei bestimmten Breakpoints ein anderes oder anders bearbeitetes Bild vorgesehen habe. Grund dafür ist vor allem, dass ich eindeutige Breakpoints festlegen kann, an die sich der Browser dann auch hält.
Das nur als kleiner Zusatz vom Webdesigner.
Hans #
Geschrieben am 1.08.2017 um 17:15
Sehr gutes tl;dr zu srcset und picture. Danke!
Grafikdesigner #
Geschrieben am 10.08.2017 um 23:40
Sehr interessanter Beitrag. Auch für einen Print-Designer! ;-)
RSS-Feed zu diesem Beitrag
Kommentare sind für diesen Beitrag geschlossen.