indir.com Mobil Etkinlik 2015'te Bilal Çınarlı tarafından yapılan Mobil'de Web isimli sunum

1. Mobil’de Web
Mobil Uyumlu Web Arayüzleri ve Web Uygulamaları

2. Bilal Çınarlı
Front-end Architect
Senior UX Developer@Turkcell
@bcinarli
github.com/bcinarli
bcinarli.com

4. Mobil’de Nereye Gidiyoruz?

5. Dünya’da Farklı Platformlardan Web Erişimi
0
25
50
75
100
2010 2011 2012 2013 2014 2015
2,94
6,09
10,74
16,24
27,14
31,42
97,06
93,91
87,96
79,18
66,57
62,41
Desktop Mobil Tablet
http://gs.statcounter.com/#desktop+mobile+tablet-comparison-ww-yearly-2009-2015

6. Türkiye’de Farklı Platformlardan Web Erişimi
0
25
50
75
100
2010 2011 2012 2013 2014 2015
0,68 1,75
5,1
9,9
24,29
35,01
99,32 98,25
94,49
88,14
72,47
61,35
Desktop Mobil Tablet
http://gs.statcounter.com/#desktop+mobile+tablet-comparison-TR-yearly-2009-2015

7. • Mobil erişim oranları her geçen gün artıyor
• Kullanıcıların mobil olma zamanları her geçen gün artıyor

8. Mobil’den İçerik Araması Yapma

9. http://www.clickz.com/clickz/column/2388915/why-mobile-web-still-matters-in-2015

11. Mobil’den Alışveriş Yapma

12. http://www.clickz.com/clickz/column/2388915/why-mobile-web-still-matters-in-2015

14. Mobil’den Haber Okuma

15. http://www.clickz.com/clickz/column/2388915/why-mobile-web-still-matters-in-2015

17. • 21 Nisan’da Google Mobile-friendly güncellemesi
• Mobil Web ile kullanıcılarla sürekli etkileşim içinde sistemler arttı
Mobilleşmenin Etkisi

18. Mobil Web Tercihi

19. Kullanıma Göre Tercihler
Alışveriş
Arama
Eğlence / Video
Mail / Takvim
Mesajlaşma
Harita
Sosyal Medya
0 25 50 75 100
Mobil Web Mobil Uygulama

20. • Özelleştirilebilir, kendilerine ait platformlar için uygulamayı
• İçerik görüntüleme için Websitesini tercih ediyor
Kullanıma Göre Tercihler

21. Mobil Web Geliştirme

22. • Cihaz bağımsız
• Bir defa geliştir, farklı ortamlarda kullan
• Hızlı geliştirme
• Kolay güncelleme
• Arama motoru avantajı

23. Geliştirici Yaklaşımları

24. Responsive

25. • Ekran çözünürlüğüne göre
elastik tasarım
• Aynı tema ve stillerin
genişliğe göre yönetimi
• Kolay geliştirme
• Büyük dosya boyutları

26. Adaptive

27. • Önceden belirlenen
genişliklere çalışma
• Farklı genişlik için farklı tema
ve stil yönetimi
• Kısmen uzun geliştirme süreci
• Küçük dosya boyutu

28. Desktop First

29. • İçeriği yoğun siteler
• Kurumsal siteler, (belki) e-ticaret
• Mobil önceliği az olan

30. Mobile First

31. • Sürekli etkileşim beklentisi
• Çoğunlukla okunacak içeriği olan
• Blog, liste, haber siteleri

32. Uygulamanın Avantajlı Olduğu Durumlar

33. • Karmaşık etkileşim ve oyun
• Kişiye göre özelleştirme
• Karmaşık hesaplamalar ve raporlama
• Cihazın fiziksel özelliklerine yoğun erişim
• Offline

34. Sorularınız?
Merak ettikleriniz, detaylandırmak istedikleriniz…

35. Teşekkürler
Bilal Çınarlı
@bcinarli