Weitere ähnliche Inhalte Ähnlich wie WordCamp NL 2016 (20) Mehr von Theo van der Zee (15) Kürzlich hochgeladen (20) WordCamp NL 20168. Time spent using a smartphone
Normal users: 2.42h / day
Power users: 3.75h / day
Source: Dscout
24. Source: Marketing Science Institute
“Mobile devices’ low
conversion rate is strongly
related to the phase in
which customers use
these devices.”
Evert de Haan - Assistant
Professor, Goethe University
38. 53% abandons after 3 sec
Avg. 3G load time is 19 sec
Mobile loading times
Source: Google
39. Loading time of 5 sec vs. 19 sec
60% greater
pageviews per
visit
70% longer
average
sessions
Source: Google
40. Loading time of 5 sec vs. 19 sec
35% lower
bounce rates
25% higher
viewability
Source: Google
43. 0. Get good hosting that is
optimized for WordPress
Hinweis der Redaktion Time: 45 mins, including questions Who am I? Overview of the presentation [Hands]: shower? kiss partner? get coffee? … Check mobile? [Hands]: watch TV? kiss partner? brush teeth? … Check mobile? Obviously putting your phone against a tree, right? So, we use our mobile devices a lot, but how much exactly? Research by Dscout showing how many hours users were actively using their smartphones. Guess room is at >5h Currently the developed world has >1 subscriptions per person on average. The developing world is catching on fast. I’ll let you guess which line represents which device group. Mobile-friendly websites = must-have. From: ’What Users Want Most from Mobile Sites Today’ by Google We rely on mobile devices daily for: Navigation Taking photos Texting Listening to music Catching Pokémon Perhaps even making some phone calls But apparently not online shopping yet? Conversion rate = # of people who took desired action (buy, donate, subscribe, etc.) divided by the total. Here: 2%. Not many people converting on mobile phones yet. Tablet seems okay but still behind desktop. Closer look: There’s a lot of mobile browsing (~= desktop) on the left, but little mobile buying on the right It’s still only a research device for many. Help majority explore, facilitate buying for minority And how are we going to remove those? (based on mobile research by Google, user testing, etc.) Desktop only, performance, menus, forms, images Starting with desktop only websites [Hands] who doesn’t have a mobile-friendly version of their website (responsive, adaptive, dedicated, etc.)? Google mobile friendly test No technologies like Flash are being used No zooming required to view the text No horizontal scrolling is required No links placed too close No interstitials are being used (like Forbes) Performance Expectations of mobile users from ‘The need for mobile speed’ by Google So, 1 in 2 expect <2 sec … research also shows about 53% abandons website if it takes >3 seconds. [HANDS] How long on average over 3G? However, in reality is takes on average 19 seconds to load on 3G (and 14 sec on 4G) This disparity shows in the conversion numbers “Display ads must be on the screen for one full second to be considered viewable.” How to see your own (mobile) loading speed? Go to www.webpagetest.org How to get your website just as fast as this image? Three steps, starting at step 0 Get good hosting. Personally big fan of SiteGround. Image really worth 2 sec of loading time? WP can handle some automatically, kraken.io might help with compression Most JS in the bottom, CSS on the top. No 404 sources, async whenever possible (except for A/B testing tools) No unnecessary trackers, ads, fonts, images, social buttons, etc. Remove vigorously from themes! Menus What do these websites have in common? Hint: you can buy it at McDonalds Wait, there are more! (we basically saw the mobile website of almost every WCNL sponsor) Isn’t that much clearer? Discoverability is cut almost in half. Also, task time is longer and perceived task difficulty increases. (via: nngroup.com) Button sizes = 44x44 pixels minimum. Can you still see what you want to tap? Is it easy to tap wrong? Are any elements missing in the mobile menu? Is there a ‘view desktop version’? Why are the items not on mobile? Forms Labels in fields, when clicked, unclear what to typed (by the way: left one is Yoast, somehow logo is missing) Better solutions: either dynamic in field then above, or just static above. Next: I made some errors in the form, who can point them out? Nobody, because they were (far) outside of the viewport. Make sure errors are always within sight after submit! Better example, page immediately scrolled up after errors. Images None of the sponsors had a mobile image slider! They are distracting, lower performance, and send a mixed message. We’ve seen enough stock images. They cost bandwidth, and add little to no value to the customer experience. Especially for items in webshops like clothing, jewelry, art, etc. Low resolution just isn’t very attractive to buy Desktop only, performance, menus, forms, images Any time left? Then do some mobile live reviews (Chrome mobile emulator) Questions? Business cards are on the table.