marctrix: Design: Apple Homepage (hübsch und zugänglich für Schwindler)

problematische Seite

Hej alle,

einen interessanten Scroll-Effekt, den ich so noch nicht gesehen habe, gibt es auf der iPhone X-Seite zu bestaunen.

Warum ich das mal hier poste: Parallax Scrolling sorgt bei vielen Menschen für Schwindel (35% der Über-50-Jährigen, wenn ich mich nicht irre). Ich bin einer, der noch nicht in diese Altersgruppe gehört aber trotzdem dafür sehr empfänglich ist.

Also setzt so etwas vorsichtig ein und eigentlich kann man nur sagen: ausschließlich nach ausgiebigen Tests mit Betroffenen!

Apple gelingt es meinem ästhetischen Empfinden nach wunderbare optische Effekte zu erzeugen, die ich ohne jede Übelkeit genießen kann.

Auch wenn ich Ideen dazu habe, wie man so etwas umsetzen könnte: ich habe weder in den Quelltext geschaut, noch versucht es nachzubauen. Erst mal möchte ich es einfach nur genießen. Und habe trotzdem schon was gelernt, zumindest eine Inspiration — ich denke, wir sehen hier mal wieder, womit uns tausende von Fertig-Themes demnächst zuballern werden, bis der Effekt völlig ausgelutscht ist — und zack! hat mich die Realität wieder. 😟

Wie die kalte Dusche nach der Sauna…

Marc

  1. problematische Seite

    Das Gewabbel spricht mich 0 an. Da wird mir eher ein wenig schwindelig, obwohl ich dafür sonst nicht anfällig bin.

    1. problematische Seite

      Hej chorn,

      Das Gewabbel spricht mich 0 an. Da wird mir eher ein wenig schwindelig, obwohl ich dafür sonst nicht anfällig bin.

      Interessant. Danke für die Rückmeldung! Offenbar wird das bei verschiedenen Menschen von unterschiedlichen Faktoren ausgelöst.

      Marc

  2. problematische Seite

    Hallo marctrix,

    echtes Parallax-Scrolling sieht aber noch anders aus (es sei denn, Apple liefert mir eine andere Seite als Dir).

    Was mich viel mehr stört, ist diese Ausgabe des Chrome Netzwerktrace. Wenn ich die Seite (bei blank geputztem Cache) erstmalig aufrufe, sehe ich:

    54 Requests, 1.3 MB transferred, Finish 2.21s, DOMContentLoaded: 1.76s

    Dann scrolle ich langsam die Seite durch, bis zum Ende, und finde dann:

    126 Requests, 12,2 MB transferred, …

    (vorhin waren es 128 Requests, 15.8 MB transferred, keine Ahnung wieso).

    Ich habe es nicht mobil probiert, dazu ist mir mein Datenvolumen zu schade. Die Idee der "Singlepage-Website" finde ich irgendwie komplett daneben. Vor allem, wenn eine Seite unbekümmert Dinge wie ein "large.mp4" mit insgesamt 3,7 MB nachlädt (vermutlich ist das diese Frau, die ihr Grinsen auf das Katzengesicht überträgt)

    Rolf

    --
    Dosen sind silbern
    1. problematische Seite

      Hallo Rolf,

      echtes Parallax-Scrolling sieht aber noch anders aus

      Yep, meist schlechter und Schwindel induzierend.

      Ich habe es nicht mobil probiert, dazu ist mir mein Datenvolumen zu schade. Die Idee der "Singlepage-Website" finde ich irgendwie komplett daneben. Vor allem, wenn eine Seite unbekümmert Dinge wie ein "large.mp4" mit insgesamt 3,7 MB nachlädt (vermutlich ist das diese Frau, die ihr Grinsen auf das Katzengesicht überträgt)

      Und die Bezeichnung large.mp4 lässt in dir nicht den Verdacht aufkeimen, dass auf Geräten mit kleineren oder geringer aufgelösten Displays kleinere Ressourcen geladen werden könnten?

      MfG, at

    2. problematische Seite

      Hej Rolf,

      echtes Parallax-Scrolling sieht aber noch anders aus (es sei denn, Apple liefert mir eine andere Seite als Dir).

      Nein, ich denke nicht. Ab wie viel Schwindel fängt denn Parallax an? 😂

      Ich hatte eigentlich nur das "X" über dem ersten iPhone gemeint und es ging mir in meinem Posting nur um diesen Effekt, den ich nett finde. Für den braucht man nur eine Grafik und das X. Vermutlich wird man das einfach mit dem Buchstaben "X" realisieren können.

      Was mich viel mehr stört, ist diese Ausgabe des Chrome Netzwerktrace. Wenn ich die Seite (bei blank geputztem Cache) erstmalig aufrufe, sehe ich:

      54 Requests, 1.3 MB transferred, Finish 2.21s, DOMContentLoaded: 1.76s

      Dann scrolle ich langsam die Seite durch, bis zum Ende, und finde dann:

      126 Requests, 12,2 MB transferred, …

      (vorhin waren es 128 Requests, 15.8 MB transferred, keine Ahnung wieso).

      Ein Teil im Cache?

      Ja, das ist heftig. Dass ich davon kein Freund bin, ist bekannt, glaube ich. 😉

      Ich habe es nicht mobil probiert, dazu ist mir mein Datenvolumen zu schade.

      Ja, mein Hauptkritikpunkt. Ladezeiten sind Seitenbetreibern wichtiger als Besucher. Wenn mir eine Seite zu langsam ist, gehe ich einfach. Schlimm ist, wenn dann im Hintergrund schon 12,1 MB übertragen wurden und es bei 12,2 MB weiter gegangen wäre. Auf den Kosten, für die ich rein gar nichts erhalten habe, bekomme ich als Gegenleistung rein gar nichts. Im Gegenteil hat es mich Lebenszeit und die Welt in der ich leben muss saubere Luft gekostet!

      Die Idee der "Singlepage-Website" finde ich irgendwie komplett daneben. Vor allem, wenn eine Seite unbekümmert Dinge wie ein "large.mp4" mit insgesamt 3,7 MB nachlädt (vermutlich ist das diese Frau, die ihr Grinsen auf das Katzengesicht überträgt)

      Wäre interessant mal zu sehen, wie viele Daten bei mobiler Nutzung übertragen werden — vielleicht abhängig vom verwendeten Gerät. Aber ich bin

      1. zu faul
      2. zu geizig
      3. besitze ich nicht mehrere iPhones
      4. auf dem iPhone keine Tools für eine entsprechende Analyse (oder geht das mobil auch mit Chrome?)

      Marc

      1. problematische Seite

        Hi marctrix!

        Wäre interessant mal zu sehen, wie viele Daten bei mobiler Nutzung übertragen werden — vielleicht abhängig vom verwendeten Gerät.

        Ich habe gerade mal die Chrome Developer Tools bemüht, den Cache geleert und ein iPhone 6 mit 3G-Verbindung simuliert. Ohne zu Scrollen wurden initial 1,6 MB übertragen, beim Scrollen werden Inhalte dynamisch nachgeladen, am Seitenende lag das Gesamtvolumen bei 2,3 MB. Reproduzierbar war das Ergebnis allerdings nicht, andere Messungen haben am Ende auch 3,4 MB und 1,9 MB gezeigt. Eine Erklärung für die Schwankungen habe ich nicht prompt parat.

        Ich persönlich finde das Volumen vertretbar und bin bekennender Fan von ausdrucksstarker visueller Sprache, solange sie nicht exklusiv gesprochen wird. Ein flüchtiger Blick in den Quelltext enthält einige Hinweise darauf, dass das hier auch nicht der Fall ist.

        1. problematische Seite

          Danke, @1unitedpower, für deine Mühe!

          Trotz meiner mantraartig wiederholten Empfehlung, dass Webseiten nicht mehr als 1MByte übertragen sollen, mag ich mir so etwas auch hin und wieder gerne ansehen. Mal abgesehen davon, dass diese ganze Seite Werbung ist, ist es doch keine unerwünschte Werbung. Als Mann vom Fach ist mir auch klar, dass diese Effekte in hoher Qualität entsprechendes Volumen verbrauchen.

          Daher bin ich gespalten, was die Apple-Homepage angeht. Einerseits gefällt sie mir, andererseits sind das schon erhebliche Datenmengen und dem Otto-normal-Surfer ist nicht unbedingt klar, was ihn das kostet. Immerhin gibt es weit oben einen Link zu mehr informativen Details, die etwas schlichter sind und weniger inklusivvolumen verbraten dürften…

          Gruß,

          Marc