Czy tego chcemy, czy nie, żyjemy w cyfrowym świecie. W świecie, w którym Internet odgrywa ogromną rolę. W świecie, w którym nowe pokolenia już nie korzystają z Internetu, a w nim żyją. W świecie, w którym osoby “żyjące” w Internecie, stają się pełnoprawnymi konsumentami. Wymagającym konsumentami. Cyfrowym konsumentami.
Porady
10
wrz
Czas (ładowania) to pieniądz
Dlaczego potrzebujesz szybkiej strony internetowej i jak to osiągnąć?
Jak zdobyć cyfrowego konsumenta?
Przede wszystkim sam musisz być cyfrowy. Jeśli dzisiaj nie ma Cię w Internecie, dla wielu Twoich potencjalnych klientów nie ma Cię w ogóle. Według badań BIA/Kelsey, aż 97% konsumentów, zanim podejmie decyzję o zakupie, szuka produktu w Internecie. W związku z tym, trudno dzisiaj mówić o prowadzeniu jakiejkolwiek działalności, w oderwaniu od Internetu. Jeśli nie chcesz tracić potencjalnych klientów, posiadanie strony internetowej staje się koniecznością.
Po drugie – Twoja obecność w Internecie musi być atrakcyjna dla Twoich potencjalnych klientów. Statystyki pokazują, że sformułowanie opinii na temat Twojej strony internetowej zajmuje użytkownikowi tylko 50 milisekund (!). Dlatego przyjazny design strony www jest bardzo istotny w procesie pozyskiwania klientów. Im łatwiej użytkownik znajdzie potrzebne informacje tym większa szansa na to, że stanie się Twoim klientem. Ale to nie wszystko – istnieje czynnik, który spowoduje, że potencjalny klient zamknie nawet najładniejszą i najczytelniejszą stronę – czas ładowania.
Czas (ładowania) to pieniądz
Limity czasu dla ładowania strony i utrzymania uwagi użytkownika nie zmieniają się od dawna. W 1993 roku Jakob Nielsen opisał 3 progi dla czasu oczekiwania na przeładowanie.
Od 0 do 0.1 sekundy. To czas, który daje użytkownikowi poczucie bezpośredniej kontroli nad wszystkim co dzieje się na stronie internetowej. W odczuciu potencjalnego klienta strona reaguje natychmiastowo, dlatego jest to idealny czas reakcji strony www.
Od 0.1 do 1 sekundy. Użytkownik ma poczucie, że komputer “myśli” nad jego poleceniem, ale nie wpływa to negatywnie na jego odczucia.
Od 1 do 10 sekund. 10 sekund to maksymalny czas utrzymania uwagi użytkownika. Brak odpowiedniego feedbacku od strony internetowej spowoduje, że potencjalny klient straci zainteresowanie treścią.
Statystyki zebrane przez Skilled wskazują na kilka tendencji związanych z szybkością działania strony.
mPulse mobile wykazało, że współczynnik konwersji tej samej strony, ładującej się 5.7 sekundy i dłużej, jest ponad 3 razy niższy niż tej ładującej się 2.4 sekundy. Ponadto w przypadku 2.4 sekundowego ładowania 20% użytkowników od razu zamknęło stronę, a przy ładowaniu przez 9.9 sekundy zrobiło to aż 58% użytkowników. Przykładowo: Pewna firma ma stronę internetową, której ładowanie trwa około 10 sekund. Miesięczny ruch na stronie wynosi 10000 użytkowników, jej współczynnik konwersji wynosi 0,5%, a średnia wartość zamówienia składanego przez stronę to 100 złotych. Po wczytaniu strony zostaje na niej 4200 użytkowników, z których 50 dokonuje zakupu. W takiej sytuacji miesięczny przychód generowany przez stronę wynosi 5000 złotych. Jeśli firma skróci czas ładowania strony do 2.5 sekundy współczynnik konwersji wzrośnie do około 1.7%, a po wczytaniu zostanie na niej prawie dwukrotnie więcej użytkowników (około 8000). Po takiej zmianie, zakupu dokona 170 użytkowników, co poskutkuje ponad trzykrotnym wzrostem miesięcznego przychodu – do 170 000 złotych.
Amazon wyliczył, że spowolnienie ich strony tylko o 1 sekundę spowoduje roczny spadek sprzedaży w wysokości aż 1.6 miliarda dolarów.
Według danych AutoAnything przyspieszenie ładowania ich strony o połowę, przyniosło firmie 13% wzrost sprzedaży i 9% wzrost współczynnika konwersji.
Krótko mówiąc – krótsze ładowanie strony to lepsze wyniki firmy. Dodajmy do tego fakt, że, według Skilled, 64% użytkowników smartfonów oczekuje czasu ładowania krótszego niż 4 sekundy, a 47% klientów – krótszego niż 2 sekundy, a będziemy mogli sformułować wniosek. Jaki? Są takie firmy, którym zależy na szybkiej stronie internetowej i takie, którym będzie na tym zależeć.
Dlaczego strony internetowe działają wolno?
Skoro wiemy już, jaki wpływ na użytkownika wywiera szybkość ładowania, zajmijmy się tym, co powoduje wolne działanie strony. Najpopularniejsze przyczyny długiego czasu ładowania to przede wszystkim:
Niezoptymalizowane obrazy
Najczęstszą przyczyną wolno działającej strony jest duża liczba niezoptymalizowanych zdjęć. Obrazki w dużej rozdzielczości potrzebują czasu na załadowanie – umieszczanie zbyt dużych obrazów a następnie skalowanie ich rozmiaru jest marnowaniem zasobów i źle wpływa na czas ładowania strony. Innym aspektem jest format zdjęć – przykładowo, zdjęcia w formacie JPEG zajmują znacznie mniej miejsca, a przez to ładują się szybciej, niż PNG czy GIF.
Problemy z JavaScript’em
Rozwój JavaScript’u spowodował, że dodawanie dynamicznych elementów na stronę www jest wygodniejsze niż kiedykolwiek. Jednak im więcej takich elementów pojawia się na stronie, tym większe jest ryzyko źle zoptymalizowanego kodu, który opóźni wczytywanie strony.
Nie korzystanie z cache
Caching to zapisywanie kopii często używanych plików strony w pamięci cache, tak, aby ich wczytywanie odbywało się szybciej. Zastosowanie cachingu po stronie przeglądarki i serwera pozwala znacząco skrócić czas potrzebny do załadowania strony www.
Niewłaściwy hosting
Nieodpowiednio dobrany hosting może spowolnić nawet najlepiej zoptymalizowaną stronę internetową. Źle zoptymalizowane serwery spowodują, że strona będzie się wczytywała długo za długo i przyniesie więcej frustracji niż korzyści.
Jak zapobiegać wolnemu działaniu stron?
Realizując projekty stron internetowych w Akanzie optymalizujemy nasze strony na kilka sposobów. Przede wszystkim korzystamy z nowoczesnych technologii, które pozwalają na tworzenie stron www, które nie tylko wyglądają atrakcyjnie, ale również działają szybko i sprawnie na każdym urządzeniu: Vue.js, Angular, Django, Laravel i innych.
Nasi project managerowie ustalają, które grafiki muszą znaleźć się na stronie w najlepszej możliwej jakości, a które mogą być bardziej skompresowane. Web developerzy Akanzy dopasowują grafiki do odpowiednich rozmiarów w celu zapewnienia optymalnego ładowania strony.
W sytuacjach w których czas oczekiwania na treść przekracza przyjęte standardy – np. z powodu dużej liczby wpisów blogowych do załadowania – używamy np. szkieletu strony w celu zasygnalizowania, że treść jest wczytywana.
Ponadto nasi programiści optymalizują kod m.in. poprzez stosowanie asynchronicznego ładowania skryptów oraz dzięki dbałości o najwyższą jakość kodu – korzystamy z code review, pracujemy według metodyki Scrum, od samego początku w proces tworzenia strony zaangażowany jest tester. Jeśli aplikacja webowa tego wymaga, implementujemy caching, który znacząco przyspiesza działanie dużych stron internetowych.
Nasi specjaliści doradzą również w kwestii wyboru optymalnego hostingu dla strony – takiego, który zapewni szybkie działanie strony, a jednocześnie nie będzie stanowił przerostu formy nad treścią.
Jeśli potrzebujesz szybkiej strony internetowej, skontaktuj się z nami. Damy z siebie wszystko, żeby dostarczyć Tobie i Twoim klientom stronę internetową na jaką zasługujecie!
30
gru
Wtyczki Android Studio
Android Studio to narzędzie umożliwiające w bardzo produktywny sposób tworzenie aplikacji dla systemu Android. Posiada solidne narzędzia do edycji kodu, debugowania i profilowania wydajności. Inną przydatną funkcjonalnością jest tworzenie interfejsu użytkownika w sposób graficzny z użyciem metody drag&drop. Jednak nawet tak zaawansowane i rozbudowane narzędzie może być przystosowane do naszych potrzeb w większym stopniu, odpowiadający naszym oczekiwaniom i wspierający naszą produktywność.
Co sprawia, że jesteśmy bardziej produktywni? Każdy programista może mieć różne odpowiedzi na to pytanie. Najczęściej chodzi jednak o możliwość pisania większej liczby wierszy za pomocą kilku klawiszy czy bardziej wydajne debugowanie i profilowanie kodu. Lepsze zrozumienie IDE, w którym pracujemy, może znacząco zwiększyć produktywność. W Android Studio mamy dostęp do pokaźnej ilości wtyczek usprawniających naszą pracę.
Konfiguracja
Aby włączyć menu wtyczek, w ustawieniach Android Studio wybieramy sekcję Plugins. Mamy możliwość instalacji wtyczek z różnych źródeł, np. ze zdalnych repozytoriów czy bezpośrednio z dysku.
Sekcja Plugins ustawień Android Studio
Przykładowe narzędzia
MVP Generator
Umożliwia generowanie kodu MVP na Androida. Całość jest konfigurowalna, możemy dodać dodatkowe moduły w zależności od naszych preferencji.
Android Selectors Generator
Ta wtyczka Android Studio automatycznie generuje graficzne selektory z odpowiednio nazwanych zasobów Androida.
Material Theme UI EAP
Android studio ma dwa dostępne motywy – Domyślny i Dracula. Gdy zainstalujesz tę wtyczkę, możesz użyć motywu odpowiadającego standardom Material Design.
Android DPI Calculator
Kalkulator DPI pozwala obliczyć różne rozmiary we wszystkich dostępnych i domyślnych gęstościach pikseli na platformie Android, tj. xxxhdpi, xxhdpi, xhdpi, hdpi, mdpi, ldpi i tvdpi.
Zużycie zasobów Androida
Ta wtyczka automatycznie zlicza zużycie zasobów i pokazuje je w lewym pasku każdej linii w twoim Android Studio. Okazuje się przydatna, jeśli chcesz pozbyć się zasobów, które nie są już używane w twoim projekcie.
AndroidLocalizationer
Wtyczka pomaga ci przetłumaczyć ciągi znaków użytych w aplikacji na inne języki. Zainstaluj ją, a następnie kliknij prawym przyciskiem myszy plik zasobów ciągu, zaznacz „Konwertuj na inne języki” i wybierz języki, które chcesz.
Android Wifi ADB
Android Wifi ADB pomaga instalować, uruchamiać i debugować aplikacje dla Androida za pośrednictwem Wi-Fi. Czas pozbyć się noszenia kabla USB.
Rozbudowana lista ciekawych i użytecznych wtyczek jest dostępna tutaj.
11
lis
Push notyfikacje App Center
Push notyfikacje są funkcją aplikacji mobilnych, która w obecnych czasach znajduje się w większości aplikacji mobilnych. Mogą być wykorzystywane zarówno do informowania użytkownika o ważnych dla niego czynnościach czy wydarzeniach, jak również mogą stanowić istotną pomoc przy promowaniu i reklamowaniu naszych usług czy produktów. App Center jako kompleksowy system wspomagający tworzenie aplikacji mobilnych posiada moduł umożliwiający wysyłanie push notyfikacji. Aby z niego skorzystać, potrzebujemy projektu React Native z dodaną i skonfigurowaną biblioteką App Center (link).
Gdy mamy już taki projekt, zajmijmy się instalacją modułu, wykonując poniższe polecenie w katalogu głównym projektu:
npm install appcenter-push –save
Następnie na końcu pliku android/app/build.gradle dodajemy:
apply plugin: 'com.google.gms.google-services'
Oraz w pliku android/build.gradle:
buildscript {
repositories {
// Add google line if missing before jcenter
google()
jcenter()
}
dependencies {
// Add this line
classpath 'com.google.gms:google-services:4.0.1'
}
}
allprojects {
repositories {
// Add google line if missing before jcenter
google()
jcenter()
}
}
Konfiguracja Firebase
Kolejnym krokiem będzie stworzenie projektu w usłudze Firebase. Jest to system Google umożliwiający komunikację z aplikacją oraz dostarczający wiele ciekawych modułów do naszych aplikacji. Wchodzimy na poniższą stronę https://console.firebase.google.com i tworzymy nowy projekt.
Następnie tworzymy nową aplikację Android i pobieramy plik google-services.json, który umieszczamy w katalogu android/app.
Teraz pobierzemy klucz API usługi Firebase. W tym celu wchodzimy do konsoli Firebase > Ustawienia projektu > Komunikacja w Chmurze. Klucz serwera (API) jest dostępny w sekcji Dane logowania dla projektu.
Skopiowany klucz wklejamy w odpowiednim polu w zakładce Push Notifications w projekcie App Center.
Dostępna jest teraz opcja wysyłania notyfikacji.
Po wypełnieniu wymaganych pól możemy wysłać notyfikację na urządzenia.
Grupy odbiorców aplikacji
App Center umożliwia również tworzenie tzw. Audiences, czyli grup, do których ma zostać skierowana aplikacja na podstawie odpowiednich reguł jak: kraj, wersja aplikacji, model urządzenia, itp.
Podsumowując, App Center dostarcza całkiem dobry moduł umożliwiający wysyłanie push notyfikacji. Nie posiada jednak funkcji wysyłania tzw. Rich notifications, czyli powiadomień zawierających zdjęcia lub filmy – w takim przypadku warto użyć tutaj biblioteki OneSignal. Jednak w mało wymagających przypadkach Push Notifications z użyciem App Center jest wystarczające.
