ZapewniamyEnergie.pl

Kolejny rok się kończy, czasy podsumowań itd. itp. Otóż stwierdziłem, że WebKrytyk również powinien jakoś ten rok podsumować. A chyba najlepszym sposobem na to jest… opisanie najgorszej strony tego roku!

Mocne stwierdzenie, nadaje się wręcz na tytuł do Faktu i nie przystoi porządnemu krytykowi, takiemu jak ja… ale ja na szczęście nie jestem porządnym krytykiem (a przynajmniej się za takiego nie uważam). Dlatego mogę tak nazwać tę stronę i teraz krótko (serio krótko) wytłumaczę czemu!

  • Wpisuję adres, pacam Enter i… zwiecha. Auć. Ok, odwiesiło się, ale za to strona ścina równo.
  • Na urządzeniach mobilnych jest jeszcze gorzej. Na telefonie nawet nie ma sensu tego otwierać. Zostajemy przekierowani na wersję „mobilną”, która polega na scrollowaniu pustej, ciemnej strony. Szlag mnie za chwilę trafi. Czy naprawdę tak trudno zrozumieć, że machanie palcem na malutkim ekranie jest po prostu wkurzające? Ja bym zrozumiał, gdyby na tej stronie coś było, ale jest tylko tekst w losowych miejscach, naskrobany malutką czcionką, której nawet nie widać. I nie, nie ma nawet normalnego scrollowania, bo webmaster stwierdził, że przecież lepiej dorobić beznadziejny skrypt od tego i dać całej stronie blokadę scrollowania. Serio? Jeśli ktoś chciał usera zirytować, to mu się to udało wyśmienicie. Natomiast na tablecie uruchamia się desktopowa wersja strony, która jest równie daremna, chociaż ciut mniej wkurzająca (za to rżnie procek i zżera baterię).
  • Ok, żal mi baterii, to stestuję na lapku… Jak znajdę myszkę, bo ktoś stwierdził, że nie potrzeba mi myszki i ukrył kursor. Za to mam świetlika, który laguje i nie ma nic wspólnego z faktyczną pozycją myszki. Pomijam fakt, że jakoś trzeba zamknąć komunikat o cookies, co jest skrajnie irytujące i frustrujące, gdy miota się myszką, szukając jakiegokolwiek znaku gdzie jest kursor. Dobrze, że przynajmniej na linkach pojawia się łapka.
  • Co do komunikatu: przy każdym odświeżeniu strony on uparcie powraca. Trochę żałosne jest wstawianie komunikatu o cookies, jeśli nie wie się jak z nich korzystać.
  • Udało mi się znaleźć myszkę i kliknąłem przycisk Rozpocznij. Lektor zaczyna mi gadać coś o jakiejś podróży, w której mają mi pomóc… świetliki innych użytkowników. Co? Mam najechać na górę ekranu… Najeżdżam i rozpoczyna się… film? Ale taki pseudointeraktywny. Pomijam fakt, że inne świetliki wkurzają i jedynie bardziej lagują (powodzenia w generowaniu kilkuset takich świetlików przy użyciu i tak niezoptymalizowanego skryptu rysującego na canvas). Ok, pierwszy przystanek – mapa Polski. Pyta się mnie „Skąd jestem?”. No to próbuję kliknąć na mapie – nic… Ba, nagle po prostu jedziemy dalej i słucham o elektrowni w Bełchatowie. Po co wchodzi się ze mną w interakcję, skoro ma się w tyłku moją reakcję i gaworzy się o czymś innym? Później każe mi się najechać na komin jakiejś elektrowni, po czym coś o niej słyszę. Później mam najechać na wiatraki, żeby zaczęły się kręcić i najechać na scenę, żeby usłyszeć brawa… Po co? Nic z tego nie mam… Jedyną nagrodą jest dalsze słuchanie smędzenia lektora.
  • Na sam koniec pojawia się… link do FB oraz menu. I dlatego musiałem wczytać 2MB inicjalnych danych, przejść przez lagującą animację, żeby na końcu zobaczyć link do oferty i… spotu reklamowego? Skoro istnieje spot, to czemu tworzy się pseudointeraktywny, niezoptymalizowany spot, który nie ma żadnego większego sensu? Gdyby zrobiono z tego filmik, byłoby o wiele wydajniej i nie tak wkurzająco. No i czemu nie mogę od razu zobaczyć menu, tylko za każdym razem muszę znosić tę chorą animację?
  • A teraz najlepsze – strona bez JS jest bardziej użyteczna. Czemu? Bo animacja się nie ładuje i po prostu nie ma nic (przepraszam, jest komunikat o cookies, którego nie da się zamknąć). Przykre, acz prawdziwe.
  • O kodzie za dużo powiedzieć się nie da – treści nie ma żadnej, wszystko jest generowane dynamicznie przez JS. Widać klasę .no-js, z tym, że… nie jest wykorzystywana. Nawet w wypadku braku JS. Mamy świetny mechanizm do pokazania menu tym, którzy nie mają JS, ale zamiast tego… ktoś o tym zapomniał. Resztki dostępności spuszczono w sedesie.
  • Jak się sprawdza czy przeglądarka da sobie radę? Bezsensownym browser sniffingiem. W tym wypadku lepiej byłoby zdać się na feature detection. A wyłączenie całej strony dla użytkowników Safari 5 i niepokazanie menu (jedynej sensownej i potrzebnej userowi rzeczy) jest po prostu szczytem chamstwa.
  • Menu jest ukryte przez display: none. Oczywiście o PE nie ma mowy.
  • Jak działa przycisk powtarzający animację? Odświeża stronę. Jak działa potwierdzenie zaakceptowania ciasteczek? Wyłącza komunikat. Cóż, skomplikowana logika aplikacji. Jeśli to ma być landing page, to jest to najdziwniejszy, najbardziej wkurzający i najbardziej lagujący, jaki widziałem od lat.
  • setTimeout("ga('send', 'event', 'nonbounce', '10 s.')", 10000);

    Rozumiem, że jak w 11 sekundzie zamknę stronę, bez odpalenia animacji, to już jestem „bounced”? Nie sądzę.

  • Ciekawostka: ostatnia sekwencja animacji to… filmik. Skoro to jest filmikiem, to czemu cała reszta nim nie jest? Inna rzecz, że dźwięk to już wgl całkowicie odrębna sprawa i jest ładowany do dynamicznie tworzonych elementów audio. Przekombinowane równo.
  • Kolejna ciekawostka: Data URI jako sourceMappingURL… w wersji mobilnej. Nie ma to jak oszczędzać transfer userów.

Ta strona swoją nieużywalnością przebija nawet osławioną Emp@tię (a przynajmniej się z nią równa) – to naprawdę wielka sztuka. Jak widać, nie aż tak trudna.

Jeden komentarz do “ZapewniamyEnergie.pl”

  1. Z ciekawości zobaczyłem co sie dzieję na tej stronie. Oczekiwałem interakcji a tak jak wyżej – to wyssane z palca.
    Wytrwałem do końca 🙂 Przynajmniej tak mi się wydaje bo mi przeglądarka zrobiła crasha. A chodziło płynnie!

Dodaj komentarz

Twój adres e-mail nie zostanie opublikowany. Wymagane pola są oznaczone *

Witryna wykorzystuje Akismet, aby ograniczyć spam. Dowiedz się więcej jak przetwarzane są dane komentarzy.