Hallo zusammen!
Ich habe mir mal ein paar responsive Shops angeschaut und steige bei einer Sache nicht durch. Es gibt Elemente, die möchte man auf einem Iphone 3 oder ähnlich nicht anzeigen, weil es einfach „zuviel“ wird und den Weg hin zum Kauf kaum erleichtert – gegenteilig meist.
Schön und gut – werden solche Elemente eben über css und bootstrap viewpoint ausgeblendet.
Geladen werden diese natürlich trotzdem. Da kann z.B. bei einem dicken slider einiges an KB zusammenkommen. Jetzt frage ich mich halbwissend, warum (beispielhaft) der Slider nicht komplett rausfliegen kann ? Ich habs jetzt mal so gemacht wie nachfolgend.
Weil ich es eben bisher bei keinem Shop gefunden habe, scheint mir die Sache einen Haken zu haben. Es wird was dagegen sprechen – bloss was ?
<script type="text/javascript">
if (screen.width <= 400) {
document.write('[{include file="widget/reduziert.tpl"}]');
}
else {
document.write('[{include file="widget/normal.tpl"}]'); }
</script>
<noscript>[{include file="widget/normal.tpl"}]
<noscript>
Grüsse!
Natürlich kann der slider komplett rausfliegen. Der Haken ist, dass es nicht ganz so einfach umzusetzen ist. Bei Oxid wird es seit der letzten Version langsam möglich diverse Sachen hinterher per Javascript nachzuladen, aber es ist
a) nicht dokumentiert und
b) keine einheitliche fertige Lösung, die man mit 3 Mausklicks als Modul kostenlos herunterladen und installieren kann, sondern erfordert einen Eingriff ins template und einige persönliche Anpassungen und v. A. Einweisung der Mitarbeiter.
Die Lage ist allerdings nicht ganz so schlimm. Alle aktuellen Browser unterstützen das s.g. Lazyloading, bei dem die Bilder nur dann geladen werden, wenn sie auch wirklich angezeigt werden sollen. (wenn das template nicht blöd von einem mediengestalter azubi im ersten Jahr copy-pasted wurde). Viele slider Scripts unterstützen das ebenso.
[QUOTE=vanilla thunder;157657]Die Lage ist allerdings nicht ganz so schlimm. Alle aktuellen Browser unterstützen das s.g. Lazyloading, bei dem die Bilder nur dann geladen werden, wenn sie auch wirklich angezeigt werden sollen.[/QUOTE]
Wenn man Lazy Loading extra implementiert geht das natürlich. Von Haus aus geht das nicht.
display: none ist übrigens mindestens genauso böse wie document.write(). Das Zauberwort heißt Conditional Loading, um Inhalte abhängig von der Displaygröße zu laden (oder eben nicht).
Wir benutzen foundation interchange dafür
Danke….
Nach überfliegendem Einlesen auf Grund Eurer Postings, verstehe ich ein wenig besser.
Die simple Tour wie von mir zitiert kann also schon deshalb nie funktionieren, weil JS clientseitig und smarty serverseitig verarbeitet werden. Smarty hat also schon geliefert, bevor JS den viewpoint ermitteln kann.
Für den Slider ist ein LazyLoading doch in der Regel nicht so interessant – der sitzt doch meist so, dass er eh gleich geladen werden muss. Egal – ich hätte das Ding gerne weggehabt – aber mit 30 Minuten googeln ist da wohl nichts zu reissen.
Grüsse!