Trójca zła

Flash, będący obecnie własnością Adobe (po przejęciu od Macromedia), ma stosunkowo bogatą historię. Stosowany jest od lat na wielu płaszczyznach. Firmy przygotowują przy jego pomocy swoje elektroniczne wizytówki i prezentują portfolio, agencje reklamowe prześcigają się w sposobach na prezentację coraz to nowych produktów na telebimach przy jego pomocy, webmasterzy tworzą bardziej lub mniej irytujące dodatki do stron internetowych bądź całe strony internetowe. Na jego korzyść przemawia jednak know-how firmy Adobe, dzięki czemu posiada on genialne algorytmy kompresji. Natomiast technologia AIR pozwala na stosowania Flasha jako aplikacje desktopowe.

Silverlight, znany także jako Windows Presentation Foundation/Everywhere (WPF/E), jest odpowiedzią Microsoftu na Flasha. Jak to jednak często bywa w przypadku tej firmy – odpowiedzią spóźnioną o wiele lat. Desperackie próby wprowadzenia technologii do powszechnego użycia kończyły się kiepskim efektem. Może ze względu na ograniczenia platformowe? Silverlight działa bowiem na Windowsie (w przeglądarkach Internet Explorer, Mozilla Firefox, Safari) oraz na Mac OS (w Safari) z wyłączeniem procesorów PowerPC. Dla Linuksa pojawiła się nieoficjalna alternatywa w postaci produktu społeczności o nazwie Moonlight.

JavaFX to najmłodsza, siostrzana technologia. Ma ona być wszędzie. W każdym komputerze, komórce, telewizorze. Wspomnieć należy, że z Javą ma ona tyle wspólnego, co JavaScript – nazwę. Jej udział w rynku jest obecnie jeszcze mniejszy, niż w przypadku jej konkurenta ze stajni Microsoftu, ale przynajmniej jest multiplatformowa dzięki temu, iż wymaga do działania Wirtualnej Maszyny Javy.

Trzy technologie, trzej producenci, jeden cel, te same antywzorce wdrożenia. Jak się przed nimi ustrzec? Kiedy nie należy stosować danej technologii? Dlaczego? Na te pytania spróbujemy sobie zaraz odpowiedzieć.

Zło wcielone?

Każdą z wyżej omówionych technologii spotyka się w wielu różnych miejscach, implementowaną na wiele różnych sposobów. Wielu internautom jednak Flash kojarzy się tylko z jednym – irytujące, wyskakujące reklamy bez krzyżyka, ale z głośnymi efektami dźwiękowymi. Pozostałe dwie technologie są raczej nieznane.

Coś chyba poszło nie tak, skoro wielu bardziej świadomych użytkowników nie instaluje w przeglądarkach stosownych wtyczek lub używa dodatków blokujących multimedia. Czy celem twórców Flasha było stworzenie narzędzia ułatwiającego przygotowywanie reklam? Nie. Celem twórców Flasha było stworzenie technologii wzbogacającej wrażenia użytkowników. Celem twórców Silverlighta i JavaFX było stworzenie technologii konkurencyjnej. Produkty, co prawda powstały, ale ich zastosowanie jest naprawdę różne. Czasami karygodne, ale to akurat świadczy o intencjach bądź wiedzy osób, które te technologie wdrażają.

Złe intencje?

Każda technologia daje konkretne możliwości. A skoro tak, to dlaczego ich nie wykorzystać? Pokażemy reklamę, co da nam mnóstwo pieniędzy, bo nasz serwis ma sporo unikalnych odwiedzin. Problem w tym, że z czasem te irytujące okienka, których nie da się zamknąć, zaczną odstraszać i użytkownicy już do nas nie wrócą. A w wielu przypadkach użytkownik nie zapozna się nawet z prezentowanym produktem.

Jak więc pokazać reklamę, aby nie odstraszała, nie przeszkadzała, a jednocześnie dawała efekt? Możliwości jest kilka i na pewno nie należy stosować ich wszystkich na raz.

Dla przykładu spójrzmy na linki sponsorowane w wyszukiwarce Google. Umieszczone są one z boku lub tuż pod oknem wyszukiwania, jednak nie więcej niż parę pozycji. Zero inwazyjności, miliardowe zyski – marketingowe arcydzieło.

Google ma jednak wysoką pozycję, więc zejdźmy nieco niżej. Wiele portali umieszcza reklamy w okolicach swojego logo w postaci banera lub z boku strony jako tzw. reklamy typu skyscraper. Baner umieszczony na topie strony nie powinien być zbyt wysoki. Jeżeli zajmie więcej niż czwartą część okna, użytkownik z pewnością instynktownie przewinie stronę, by pozbyć się widoku rozpraszającej animacji, umieszczając w centrum pola widzenia właściwe treści.

Nota bene, animacja nie powinna zbytnio rzucać się w oczy, gdyż będzie użytkownika odciągać od właściwych treści, przez co ten może poczuć się niekomfortowo i do serwisu więcej nie powróci lub reklamy zablokuje. I właśnie to jest jednym z głównych przewinień tego typu technologii – odciągają uwagę od właściwych treści strony internetowej.

Czasami spotyka się również reklamy w postaci Page in the Middle. Działa to w dość prosty sposób – zanim użytkownik zostanie dopuszczony do żądanej strony, na określony czas wyświetli mu się inna strona, zawierająca treści marketingowe. Użytkownik jest zobowiązany do kliknięcia przycisku „pomiń” lub odczekania kilku sekund. Do takich praktyk posunął się swego czasu działający w Polsce Alior Bank, który to prezentował tego typu stronę w dość nietypowym – i można by rzec – nieprzemyślanym miejscu. Reklama wyświetlała się po operacji logowania do internetowego systemu transakcyjnego, ale przed (!) przejściem do niego.

Multimedialne reklamy można więc stosować dobrze i źle. Prędzej czy później przełoży się to na wyniki finansowe.

Brak wiedzy?

Skoro więc mamy wybór, skoro widzimy, że technologie te mogą zostać wykorzystane pozytywnie, to znaczy, że twórcy aplikacji nie mają odpowiedniej wiedzy. Zakładamy tutaj oczywiście, że nie mają na celu stworzenia inwazyjnej reklamy.

Dlaczego więc stosuje się tego typu rozwiązania? Agencja reklamowa zaproponowała konkurencyjną cenę, zlecenie wykonał chłopak z liceum bez doświadczenia etc. Powodów może być wiele, ale to zleceniodawca odbiera produkt. A pamiętać należy, że nawet najlepsi popełniają błędy, ale ze względu na fakt, iż aplikacje mają mnóstwo wodotrysków, zleceniodawcy się podobają i je kupuje, po czym zastanawia się, dlaczego traci użytkowników i klientów.

Błędów, które popełnia się przy tworzenia aplikacji multimedialnych dołączanych do stron internetowych, jest całe mnóstwo. I bynajmniej nie wynikają one ze słabej znajomości języka skryptowego oraz nie chodzi o to, że przy jego pomocy tworzy się wadliwy kod, ale o fakt, jak końcowy produkt wygląda.

Gdy internauta wchodzi na naszą stronę internetową, pierwsze co z pewnością rzuci mu się w oczy, to czas, w jakim ona się wczytuje. Mówi się, że użytkownik da nam trzy sekundy. Po pięciu sekundach odejdzie najpewniej na zawsze. Komputery są coraz szybsze, łącza nieco wolniejsze, ale także przyspieszają. Nie oznacza to jednak, że można dokładać kolejne, zbędne setki kilobajtów do strony, bo nie taki jest tego cel. Przesłanie pojedynczego pliku HTML do przeglądarki w najlepszym przypadku potrwa kilkadziesiąt milisekund. Jeżeli po tym czasie przeglądarka będzie dodatkowo zobowiązania do pobrania pliku multimedialnego w postaci aplikacji Flasha czy Silverlighta, użytkownik zostanie zmuszony do dalszego oczekiwania. Jeżeli w grę wchodzi JavaFX, czas ten wydłuży się o uruchomienie Wirtualnej Maszyny Javy, co wcale krótko nie trwa. Java w zastosowaniach desktopowych jest niestety stosunkowo wolna, toteż bardziej nadaje się do rozwiązań serwerowych, gdzie konkurować może np. z .NETem.

Jeżeli strona internetowa jest tak naprawdę jedną, dużą aplikacją przygotowaną przy użyciu powyższych technologii multimedialnych, to narażamy użytkowników na kolejne nieprzyjemności. Zwykle bowiem, dołącza się preloader, który serwuje użytkownikowi jakąś animację, by ten nie nudził się podczas wczytywania i konfigurowania się naszej aplikacji.

Dodatkowo, artyści później bardzo często pokazują ile to oni potrafią zrobić i prezentują nam tzw. intro. Intro musi dać się pominąć. Jeżeli nie dodamy charakterystycznego „skip”, to jesteśmy przegrani na całej linii. Samo intro jednak nie jest dobrym pomysłem w przypadku aplikacji internetowej. Intro można pokazywać potencjalnym kontrahentom przedstawiając im swoją multimedialną wizytówkę, ale nie, gdy chcemy np. zaprezentować klientom ofertę produktów odzieżowych, które mamy do sprzedania.

Kolejną sprawą są wszelkie animacje, jak wjeżdżające z boku obrazki, albo co gorsza – teksty, płynnie znikające ekrany, powodujące opóźnienia przy przejściu do kolejnych sekcji, etc. Co za dużo, to nie zdrowo. Jeżeli użytkownik ma spędzić więcej czasu na naszej stronie internetowej, gdzie przedstawiamy np. Portfolio fotograficzne, to nie może stracić cierpliwości po oglądnięciu pierwszych trzech zdjęć ślubnych, które wykonaliśmy, bo poszuka innego fotografa.

Ważne jest także, by użytkownik w każdej chwili wiedział, gdzie jest oraz by mógł w bardzo łatwy sposób przemieszczać się w przód i w tył. Przycisk „cofnij” przeglądarki internetowej staje się nie tylko bezużyteczny, ale wręcz mylący, gdy mamy do czynienia z Multimedialną Trójcą.

Przydatne są również mapy witryny oraz tzw. ziarenka, za pomocą których prezentujemy aktualną przebytą ścieżkę, umieszczoną w widocznym miejscu, zwykle w górnej części strony. W sklepie internetowym, ziarenkami będą np. kolejne podkategorie, które użytkownik wybierał, by dotrzeć do konkretnego zbioru produktów.

Mylące mogą także być nietypowe kontrolki. Zwłaszcza te, które są niezgodne z ustandaryzowanymi, ogólnie przyjętymi normami projektowania interfejsów graficznych. Wszelkiego rodzaju paski przewijania, przyciski, listy, paski menu powinny być rozpoznawalne na pierwszy rzut oka. Typowy użytkownik stosuje proste podejście – „nie każ mi myśleć”. Nie każmy więc. Jedyne co możemy, to założyć, że użytkownik wie, jak posługiwać się standardowymi kontrolkami. Ludzie przyzwyczajeni są także do tego, że strona internetowa, to przede wszystkim podświetlane linki, po których kliknięciu można użyć przycisku „cofnij”, do stosowania funkcji powiększania i pomniejszania tekstu dostępnych w przeglądarce, stosowania funkcji wyszukiwania w tekście na stronie internetowej, stosowania narzędzi tłumaczących. Flash, Silverlight i JavaFX odbierają mu powyższe możliwości.

Kluczowa może być również dostępność dla osób niepełnosprawnych bądź z zaburzeniami motorycznymi. W tym pierwszym przypadku, głównym problemem jest tekst. Syntezatory mowy współpracują z przeglądarkami i potrafią poprawnie zinterpretować tekst wyświetlany w nich, jednak nie poradzą sobie z tekstem osadzonym w klipie multimedialnym, a wtedy osoba niewidoma bądź niedowidząca może mieć problemy z zapoznaniem się z treścią strony internetowej.

W przypadku zaburzeń motorycznych, użytkownik może nie być w stanie poprawnie operować myszką, co utrudni mu poruszanie się po stronie internetowej, gdyż nie wskaże precyzyjnie odpowiedniego hiperłącza przy pomocy tego urządzenia. Strony internetowe przygotowane w HTMLu umożliwiają nawigowanie po nich przy pomocy klawiatury, gdzie oprócz przewijania stron przy pomocy strzałek, mamy do dyspozycji także klawisz tabulacji, który ułatwia przemieszczanie się po odnośnikach. Jest to znacznie łatwiejsze, niż wskazywanie ich przy pomocy myszki, gdy użytkownik cierpi na Chorobę Parkinsona.

Multimedia przeszkadzają nie tylko użytkownikom, ale także właścicielom, którzy chcieliby wypozycjonować swoją stronę w wyszukiwarkach. Wyszukiwarki bowiem indeksują tekst. O ile w przypadku HTMLa można zaindeksować obrazki stosując w znaczniku IMG parametr ALT, to z treściami osadzonymi w aplikacjach nie ma takich możliwości. Dla wyszukiwarki taka strona będzie pusta.

Omawiane technologie stosowane są bardzo często w miejscach, gdzie strumieniuje się dźwięk i/lub obraz. Przykładem może być serwis YouTube.com, gdzie odtwarzacz przygotowano przy użyciu Flasha. Pozostałe elementy to HTML oraz JavaScript (AJAX).

Flash został użyty także w GMailu przy załączaniu plików – przy jego pomocy prezentowany jest postęp wysyłania pliku. Jeżeli jednak ktoś nie ma zainstalowanego Flash Playera, to nic złego się nie dzieje – nadal może korzystać z poczty przy pomocy dostarczonego przez Google interfejsu (dostarczono więc alternatywą wersję, co jest dopuszczalne).

Oba te przypadki pokazują, że aplikacje te stosowane są tylko w wybranych częściach większej strony internetowej, a nie jako twór, który stronę tę zastępuje.

Strona internetowa napisana w HTMLu w wersji czwartej może więc być wzbogacona o multimedia przy pomocy Flasha, Silverlighta, czy JavaFX, pod warunkiem, że wzbogaca się ją umiejętnie. Oraz pod warunkiem, że się ją wzbogaca, a nie zastępuje.

Będzie lepiej!

Wielkimi krokami nadchodzi jednak HTML 5. Ma on wielką szansę odbić część rynku obecnym technologiom, ze względu na możliwość osadzania bezpośrednio przy jego użyciu klipów audio i wideo, a także dzięki większym możliwościom obecnych kontrolek, co sprawi, że np. formularze będą znacznie lepiej wyglądać i będą łatwiejsze w walidacji. Także możliwość osadzania obiektów MathML oraz SVG przemawia na jego korzyść.

Ciekawostką jest też API dla aplikacji offline (baza danych offline), edycja dokumentów, obsługa drag&drop, programowanie przycisku „cofnij” przeglądarki (bolączka aplikacji multimedialnych i AJAXa). Dodano także obsługę błędów.

HTML 5 może być ciekawą (i jedyną słuszną) alternatywą dla dominujących obecnie w internecie technologii. Także ze względu na bezpieczeństwo, które ostro krytykował Apple, nie chcą wprowadzać w swoich urządzeniach obsługi Flasha.

Kiedy i jak stosować skrypty multimedialne?

Klipy multimedialne mogą być używane tak, by nie odstraszały użytkowników, by nie przynosiły strat. Można je wykorzystać zgodnie z intencjami twórców technologii – tak, by uatrakcyjnić stronę internetową, czy inny produkt powstały przy ich pomocy. Należy jednak wziąć pod uwagę przede wszystkim targetowaną grupę odbiorców, ich upodobania, etc. Należy pamiętać także o pewnych normach, które przyjęły się na przestrzeni ostatnich kilkunastu lat projektowania graficznych interfejsów użytkownika. Należy również wziąć pod uwagę roboty indeksujące, które wypuszczają w sieć wyszukiwarki.

Kiedy można zastosować te technologie jako jedyne przy budowie aplikacji? Gdy dostarczamy kontrahentowi swoją elektroniczną wizytówkę, prezentację, która nie jest zbyt złożona i odpowiednio łatwa w obsłudze. Wizytówka taka oczywiście może być stroną internetową, o ile nie przeszkadzają nam ograniczenia wyszukiwarek oraz o ile aplikacja nie jest zbyt zasobożerna.

Flash, Silverlight i JavaFX dają nam ogromne możliwości. Nie wciskajmy ich jednak wszędzie na siłę po to tylko, by pochwalić się umiejętnością ich implementacji, bowiem cała sztuka nie polega na przedstawieniu interfejsu z wodotryskami, ale na przedstawieniu interfejsu sprawnego i intuicyjnego.

Autor: Roger Zacharczyk

Pracuje jako programista gier komputerowych, studiuje na piątym roku informatyki na wydziale Informatyki i Zarządzania Politechniki Wrocławskiej. Zainteresowania: języki programowania, webserwisy, opensource (od 2000 roku). Kontakt z autorem: roger.zacharczyk@gmail.com