lahme websites - ein konzepterproblem. ux congress 2015

Jens Jacobsenbenutzerfreun.de@benutzerfreund

Lahme Websites – ein Konzepter-Problem

ux congress 2015Frankfurt, 19.10.2015

Lade Folie 2 von 299…

Schöne neue Technikwelt

Fortschritt

https://en.wikipedia.org/wiki/File:Evolution_(34_365).jpg

https://pixabay.com/de/lager-iphone-geschäft-mobil-624712/

Courtesy of Ray Kurzweil and Kurzweil Technologies, Inc.

https://de.wikipedia.org/wiki/Datei:PPTMooresLawai.jpg

Stillstand & Rückschritt

http://httparchive.org/interesting.php#bytesperpage?

Nov 2010

Titel

0 %

25 %

50 %

75 %

100 %

0–1 1–2 2–3 3–4

1 %4 %15 %

79 %

Seitengröße bei archive.org in MB

Titel

0 %

25 %

50 %

75 %

100 %

0–1 1–2 2–3 >3

17 %14 %

28 %41 %

Okt 2015

http://httparchive.org/interesting.php#bytesperpage?

Nov 2010

Titel

Bilder68 %

Sonstige4 %

Scripts18 %

CSS4 %

HTML6 %

Anteil der Seitenelemente an Gesamtgröße bei archive.org

Okt 2015

TitelVideo8 %

Bilder63 %

Fonts5 %

Scripts17 %

CSS4 %

HTML3 %

0,7 MB 2,0 MB

https://pixabay.com/de/floppy-disk-diskette-lagerung-23345/

Website Ladedauer(DSL) [Sek]

visuell vollständig(DSL) [Sek]

Ladedauer(3G) [Sek]

visuell vollständig(3G) [Sek]

ebay.de 6,8 3,1 27,8 10,9

amazon.de 9,9 4,8 28,5 15,9

de.wikipedia.org 1,4 1,1 4,9 5,5

faz.net 11,1 10,0 39,0 34,9

spiegel.de 8,8 5,8 26,1 19,9

paypal.com 7,9 6,9 25,7 25,7

Ladezeit Webseiten

0

5

10

15

20

Alles nicht so schlimm?

Warum Geschwindigkeit zählt

• Yahoo: 0,4 Sekunden schneller = 9% mehr Traffic

• Amazon: 0,1 Sekunden schneller = 1% mehr Umsatz

• Shopzilla: 5 Sekunden schneller = 25% mehr Seitenaufrufe, bis zu 12% mehr Umsatz

• AOL: schneller = mehr Seitenaufrufe/Besuch

• Aberdeen Group: 1 Sekunde langsamer = 11% weniger Seitenaufrufe, 7% weniger Konversion

• Google: 2% langsamer = 2% weniger Nutzung der Suche

• Ladegeschwindigkeit = Rankingfaktor

Wahrnehmungsschwelle:0,1 Sekunden

https://pixabay.com/de/steinadler-adler-vogel-greifvogel-627943/

https://pixabay.com/de/fußgängerampel-blindensignal-654125/

Wartezeit:>2 Sekunden

https://pixabay.com/de/szene-plattform-verkehr-warten-863682/

Neue Aufgabe:10 Sekunden

Was können Konzepter tun?

Abwarten?

Die Technik soll’s richten.

• Netzwerktechnologie/Endgeräte/-Anschlüsse

• Kompression

• Caching

• Content Delivery Network

• http2

Mithelfen!

1. Schritt zur Besserung: Erkenntnis

• webpagetest.org • YSlow

2. Schritt: Wissen schaffen

Lara Hogan: Designing for Performance. Weighing Aesthetics and Speed

The RAIL Performance Model Web Fundamentals, Google Developers

3. Schritt: Konzeption ändern

Erst Nachdenken.Dann Bilder & Video vorsehen.

https://pixabay.com/de/webseite-code-html-codierung-647013/

Programmierer so früh wie möglich einbinden

https://pixabay.com/de/webseite-code-html-codierung-647013/

https://pixabay.com/de/provetas-wissenschaft-museum-samen-118222/

So früh wie möglich Prototypen mit echtem Code testen

Unter Real-Bedingungen testen

4. Schritt: Performance-Budget

https://pixabay.com/de/geldbeutel-geld-kreditklemme-522622/

Twitter: @benutzerfreundBlog: www.benutzerfreun.de

Danke schön.

lahme websites - ein konzepterproblem. ux congress 2015

Internet