The document discusses improving mobile website experiences, noting that while apps dominate time spent on mobile, websites capture the majority of commercial transactions, and that slow loading and non-functional mobile sites represent lost opportunities; it then provides examples from companies like Tiki and VNExpress that optimized their mobile sites, reducing load times and improving the user experience, which led to increases in conversion rates, time on site, and other metrics.

1. & slide templates
Vietnam Mobile Day
HCMC, March 17th 2017

2. Melissa Nguyen
Vietnam Country Head
Google Marketing Solutions
2

3. 3
Opening Remarks:
Why Vietnam Mobile Day

4. Ghislain Le Chatelier
Regional Director Southeast Asia
Google Marketing Solutions
4

5. 5
Keynote speech:
Why Mobile Website
Experience Matters

6. HOW DO PEOPLE EXPERIENCE
SHOPPING ON MOBILE TODAY?

7. Confidential + Proprietary
On mobile, entertaining apps dominate time,
but sites capture the bulk of transactions
Sources: Time spent stats:http://yahoodevelopers.tumblr.com/post/127636051988/seven-years-into-the-mobile-revolution-content-is;
Commercial task stats: Google/Ipsos Multiscreen Industry Study of 29k smartphone users across 9 industries (to be published).
66%
SITES
6%
APPS
28%
SITES &
APPS
PRIMARY CHANNEL FOR
COMMERCIAL TASKS
INDUSTRY SNAPSHOT
75% OF AUTOS USERS
60% OF FINANCE USERS
70% OF TRAVEL USERS
71% OF RETAIL & TECH USERS
64% OF LOCAL SERVICES USERS
... USE SITES MORE OFTEN FOR
COMMERCIAL TASKS
90%
10%
TIME
SPENT
ON SITES
TIME
SPENT
ON APPS
10%
35%
GAMING
& ENT.
34%
OTHER
31%
SOCIAL
USER TIME SPENT
ON MOBILE DEVICES

8. NOT FUNCTIONAL
Find it hard to
compare prices
and options
Can’t see level of
details or info
Small screen
makes it hard
to type
SLOW
Take too long
to load

9. THAT’S A
BIG PROBLEM
(aka OPPORTUNITY)

10. Content
Performance &
Speed
Design &
Functionality
1 2 3
What makes a good mobile user experience?

11. “Don’t make me think” rule
Each source of frustration during the navigation lower this resource
A visitor comes to your site with a Goodwill resource
When the resource is depleted, the customer leaves the site

12. Homepage & Site Navigation
Site Search
Commerce & Conversions
Form Entry
Usability & Form Factor
The common thread in all sections
is that mobile users tend to be
very goal-oriented - they expect
to be able to get what they need
from a mobile site easily,
immediately, and on their own
terms.
25 Design Principles

13. Proprietary + Confidential
of consumers will
abandon a site if it takes
longer than 3 seconds to load.53%
DoubleClick study using Google Analytics data; n=3.7K mSites, 2016.

14. Proprietary + Confidential
How fast do Websites in Vietnam load?
Google Research, Webpagetest.org, Global, sample of more than 900,000 mWeb sites across Fortune 1000 and Small Medium Businesses. Testing was performed using Chrome and
emulating a Nexus 5 device on a globally representative 3G connection. 1.6Mbps download speed, 300ms Round-Trip Time (RTT). Tested on EC2 on m3.medium instances, similar in
performance to high-end smartphones, Feb 2017.
Speed: avg speed index by vertical
Recommend speed index

15. Proprietary + Confidential
Page speed = $$$

16. Proprietary + Confidential
2.2s
Source: “A Beginner’s Guide to Website Speed Optimization”
The Numbers Don’t Lie!
When Mozilla increased page speed by
2.2 seconds, Firefox download figures
rose by 15.4 percent, or 10 million per
year!
Walmart saw 2 percent increase in
conversion rates for every 1 second
improvement in page load times.

17. HOW GOOGLE ENSURES
FAST MSITE EXPERIENCE?

18. Proprietary + ConfidentialSource: "Using site speed in ranking"
PageSpeed is a
ranking signal
for Google’s
search results

19. What is AMP?
Mobile friendlyEasy to
implement
Fast Various
monetization
opportunities
Embrace the
open web

20. 20
This is AMP on
Google Search

21. Accelerated Mobile Pages
4x 10x
faster less data
0.7 seconds
median load time

22. BEYOND MOBILE SITE

23. What is PWA?
Stay engaged with app like experiences on the web including
Local caching Add to
homescreen
Push
Notifications
Available
offline

24. Confidential + Proprietary
Engage users with home screen icon, fullscreen mode

25. Proprietary + Confidential
Mobile friendly website
Based on 25 msite design
principles
Fast loading mobile site
Based on WPT/Lighthouse on 3G
Speed Index of 5000ms
Today’s goals
1 2

26. 26
Thank you

27. Nguyễn Hoàng Việt
CTO
Tiki
27
Tiki - Câu chuyện thành công 1

28. 1.2% (+70%)
Mobile Web Ecommerce
Conversion Rate
-32.36%
Bounce rate
5x (+25%)
Users on 3 devices spend 5x more
than users on 1 device

29. But, before that

30. Tiki ❤ mobile app

31. What we think it looks like
Research
(google.com, marketing
channels)
Tiki.vn Purchase

32. > 3%
Mobile app ecommerce conversion rate

35. What it really looks like
Research
(google.com, marketing
channels)
Tiki.vn Purchase
60%
40%
30%

36. Users acquired from Mobile App are most likely to make 2nd order, making it the
most valuable platform for re-engage return customers

37. Users acquired from Mobile Web are most likely to make a purchase, but on other
platforms. They tend to research on Mobile Web, but then come to other platforms
to Add to Cart again & make purchase.

38. What we need to do ?
● Page loading time as a very important feature
● UX: ensure smooth cross device experience for users
● Acquire new Mobile users aggressively

39. Before

40. 40
After

41. Cable

42. 2G & 3G

43. 1.2% (+70%)
Mobile Web Ecommerce Conversion Rate

44. How we achieved it

45. How we achieved it
● Using HTTP/2 & HTML Import
● Using web-component + shadow dom
● Pre-cache using Service Worker
● Lazy-load other resources only on demand
● Activating Push Notifications in the web app

46. What’s next ?

47. Completely new UX

48. Faster

49. X2
Hypothesis Conversion Rate

50. 50
Thank you

51. Nguyễn Văn Tình
Deputy CTO
VNExpress
51
VNExpress - Câu chuyện thành
công 2

52. Giới thiệu
▪ VnExpress ra mắt vào ngày 26/02/2001
▪ Là tờ báo điện tử đầu tiên, và là báo
tiếng Việt có nhiều người đọc nhất hiện
nay.
▪ Hơn 40 triệu lượt xem / ngày
▪ Hơn 8 triệu độc giả thường xuyên /
ngày
▪ Đạt 15.8 tỷ lượt xem trong năm 2016

53. Lộ trình phát triển
2001 2007 2013 2017
PC PC PC + Mobile Multi screen

54. 2012 - Thời điểm bắt đầu
▪ Bắt đầu chuyển đổi nền tảng
công nghệ từ .NET sang Open
Source
▪ Tồn tại 2 phiên bản website
desktop và mobile riêng lẽ
▪ Mobile chỉ là một phiên bản
lượt rút gọn của desktop

55. 2013 - Bước chuyển mình
▪ Dịch chuyển các dịch vụ sang
giao diện tùy ứng (Web
Responsive)
▪ Đầu 2013, tỷ lệ người dùng
mobile của VnExpress ~25%,
trong đó khoảng 6.5% là tablet
▪ Bounce rate 70%, time on site
trung bình 2 phút, số trang đọc
trung bình 3 / session.

56. 2014 - 2017 Không ngừng tối ưu hoá
▪ Phân tách tất cả tài nguyên tĩnh (css, js, images)
của mobile riêng
▪ Dung lượng hình ảnh được nén ở mức tối thiểu
▪ Giảm số lượng các box không cần thiết, lượt text,
hình ảnh, hiệu ứng không cần thiết
▪ Tuân thủ các qui tắc tối ưu theo đề nghị từ
PageSpeed của Google: Above the fold, xử lý các
render blocking resource, cấu trúc trang html...

57. Cơ cấu người dùng

58. Người dùng đọc trang nhiều
gấp 2 lần
-40%
Tỷ lệ thoát
Thời gian đọc trung bình
tăng 2.3 lần
Kết quả đạt được
4sthời gian load trang

59. 59
Thank you

60. Panel Discussion
60

61. take a break