Jednym z największych wyzwań przy tworzeniu treści multimedialnych jest stwierdzenie, która z dostępnych technologii najlepiej nadaje się do osiągnięcia założonego celu i wybranie takiej drogi jego realizacji, aby wszyscy byli zadowoleni. W tym rozdziale tym właśnie się zajmiemy. Jak już wiesz, Dreamweaver i Flash użyte razem, pozwalają na stworzenie bogatej multimedialnie zawartości. Teraz czas, abyś dowiedział się czegoś o aplikacjach Shockwave, QuickTime, RealSystem, Java i innych, które rozszerzają możliwości przeglądarek ponad HTML.
Kluczowe tematy podejmowane w tym rozdziale to:
q Obsługa zawartości multimedialnej przez przeglądarki
q Narzędzia programu Dreamweaver do obsługi modułów dodatkowych Netscape i kontrolek ActiveX
q Najpopularniejsze formaty plików multimedialnych, obsługiwane przez moduły dodatkowe, takie jak na przykład Shockwave.
q Aplety Javy i ich integracja ze stronami WWW
q Dźwięk na stronach WWW
q Detekcja modułu dodatkowego
Przeglądarki to przede wszystkim interpretery kodu HTML. Ich działanie polega na tłumaczeniu instrukcji zawartych w znacznikach i zapisanych w pliku HTML na postać ekranową, użyteczną dla użytkownika. Dołączenie do kodu HTML skryptów JavaScript pozwala na wprowadzenie na strony WWW interaktywności. Jako takie przeglądarki jednak nie są w stanie obsługiwać takiej różnorodności plików multimedialnych, jaką chętnie widziałbyś na swoich stronach. Nie mogą wyświetlić sekwencji wideo, nie potrafią obsługiwać i prezentować dźwięku, nie umieją wyświetlić zawartości w formacie PDF, ani też obsłużyć skomplikowanej interaktywności i animacji, bez których nie obejdą się dziś żadne gry.
Całe szczęście przeglądarki są rozszerzalne. O wykonanie tego, czego same nie potrafią, mogą zwrócić się do oprogramowania zewnętrznego. I tak się często dzieje w czasie Twojego surfowania po Internecie, choć nie zawsze masz tego świadomość.
Ilekroć przeglądarka napotyka na plik, musi określić jego rodzaj i wybrać sposób obsługi. Odbywa się to poprzez analizę typu MIME (Multipurpose Internet Mail Extension). Typ MIME to informacja, jaką serwer sieciowy wysyła wraz z plikiem przy pobieraniu strony na komputer użytkownika. Informacja ta zawiera opis kategorii pliku i instrukcje pozwalające przeglądarce wybrać sposób potraktowania pliku.
W celu zabezpieczenia, na wypadek gdyby serwer sieciowy nie przesłał ze ściąganym plikiem danych MIME, przeglądarka analizuje także sufiks lub inaczej rozszerzenie nazwy pliku. Niektóre standardowe typy MIME i stowarzyszone z nimi rozszerzenia nazwy zostały zaprezentowane na rysunku 20.1.
Rys. 20.1.
Popularne typy MIME i stowarzyszone z nimi rozszerzenia nazwy
Jeśli typ MIME lub rozszerzenie nazwy wskazują, że przeglądarka nie będzie w stanie obsłużyć pliku, sięga ona po pomoc zewnętrzną – a stanowi ją aplikacja pomocnicza lub moduł dodatkowy.
Aplikacja pomocnicza to program, który obsługuje dany typ plików. Może nią być dowolny program na Twoim komputerze. Stuffit Expander i WinZip to przykłady aplikacji pomocniczych. Ilekroć przeglądarka natrafi na plik o rozszerzeniu nazwy .zip lub typ MIME application/zip, najpewniej odszuka i uruchomi jeden z tych programów. Każdy z tych programów może być także uruchamiany przez przeglądarkę niezależnie.
Moduł dodatkowy (ang. plug-in), tak jak aplikacja pomocnicza, dysponuje możliwościami, których brak przeglądarce, lecz nie jest samodzielną aplikacją. Moduły nie mogą być uruchamiane i nie mogą działać samodzielnie. W zamian rozbudowują możliwości przeglądarki. Moduły muszą rezydować w folderze Plug-Ins, który jest folderem podrzędnym foldera zawierającego oprogramowanie przeglądarki. Przykładem tego typu wsparcia jest moduł dodatkowy Flash, o którym wspominaliśmy w rozdziale 18., „Animacje Flash”. Jeśli przeglądarka znajdzie plik o rozszerzeniu nazwy .swf lub o typie MIME application/x-shockwave-flash, przystąpi prawdopodobnie do szukania i uruchamiania tego modułu (terminu „moduł dodatkowy” używamy tu dla określenia wbudowanego rozszerzenia przeglądarki. Implementacjami tej technologii w przypadku dwóch najpopularniejszych przeglądarek, Netscape Navigator i Microsoft Internet Explorer, są moduły dodatkowe Netscape oraz kontrolki ActiveX. Obie omawiane są w dalszej części rozdziału).
Dlaczego twierdzimy, że przeglądarka prawdopodobnie zareaguje w określony sposób na dany typ MIME? Ponieważ każda przeglądarka musi najpierw zostać skonfigurowana, aby potrafiła zinterpretować pewne typy MIME, a dowolne dwie przeglądarki, nawet tej samej wersji i działające w takim samym środowisku, mogą byś skonfigurowane odmiennie. Przeglądarka jest skonfigurowana natychmiast po instalacji, lecz w zależności od źródła, z którego pochodzi (promocyjne lub pełne oprogramowanie z dysku CD, instalacja przy zakupie komputera, pobranie z witryn Microsoft lub Netscape, itp.), konfiguracje poszczególnych kopii tej samej wersji oprogramowania mogą się różnić. Ponadto, co oczywiste, także sami użytkownicy mogą zmienić ustawienia przeglądarki, dostosowując ją do własnych potrzeb.
Aby przejrzeć ustawienia przeglądarki Netscape Navigator 4 lub zmienić je, uruchom przeglądarkę i wybierz z menu Edit pozycję Preferences. Następnie w oknie dialogowym Preferences rozwiń kategorię Navigator i wybierz pozycję Applications. Ustawienia, które się pojawią, będą wyglądały mniej więcej tak jak na rysunku 20.2.
Rys. 20.2.
Okno dialogowe Preferences dla przeglądarki Netscape Navigator 4. Każdemu typowi MIME przyporządkowano aplikację pomocniczą, moduł dodatkowy lub działanie, które ma zostać podjęte, jeśli przeglądarka natrafi na ten typ
Aby dostosować do własnych potrzeb konfigurację przeglądarki Internet Explorer 5, uruchom przeglądarkę, wybierz w menu Tools pozycję Internet Options; jednak przejrzenie skojarzeń typów plików i typów MIME (lecz nie ich modyfikacja) jest możliwe tylko za pośrednictwem standardowych narzędzi systemu Windows – przypis tłum. W wersji tej przeglądarki dla systemu Macintosh ustawienia można modyfikować w oknie dialogowym Preferences (wybierz pozycję Preferences w menu Edit i kliknij kategorię Download Options lub File Helpers) (patrz rysunek 20.3).
Rys. 20.3.
Internet Explorer dla systemu Macintosh – okno dialogowe Preferences oraz okno dialogowe edycji typu pliku. Internet Explorer nie pozwala na zmianę tych ustawień
Autorzy stron WWW nie mogą kontrolować sposobu obsługi różnych typów plików przez przeglądarki. Starają się jedynie przewidzieć sposób skonfigurowania przeglądarek użytkowników i przygotowują strony tak, aby radziły sobie w sposób elegancki z ewentualnym niepowodzeniem w tym względzie (strategiami tego rodzaju zajmiemy się w dalszej części rozdziału).
q Niedostępne moduły dodatkowe lub aplikacje pomocnicze – jeśli nawet w ustawieniach przeglądarki typ MIME jest prawidłowo skojarzony z aplikacją pomocniczą lub modułem dodatkowym, nie oznacza to, że na komputerze użytkownika aplikacja ta lub moduł są dostępne. Jest to najczęstszy problem prześladujący projektantów, którzy chcieliby poszerzać zawartość multimedialną swoich stron WWW.
q Nieznane typy MIME – jeśli ściągnięty plik nie jest rozpoznawany przez przeglądarkę (nie rozpoznaje ona ani jego typu MIME, ani rozszerzenia nazwy), kwestia potraktowania pliku zostanie przekazana w ręce użytkownika.
q Nieoczekiwane lub niewłaściwe polecenie – przypisanie lub działanie wyspecyfikowane w konfiguracji domyślnej mogą odbiegać od wskazań autora; wskazania autora mogą też nie być najlepszym wyborem, biorąc pod uwagę konfigurację systemu użytkownika.
Wiele lat temu, aby umożliwić twórcom umieszczanie na stronach HTML zawartości multimedialnej, Netscape wprowadził technologię modułów dodatkowych rozbudowujących możliwości jego własnej przeglądarki. Firma wprowadziła także znacznik <EMBED>, którego zadaniem jest wskazanie przeglądarce modułu obsługującego dany typ zawartości multimedialnej. Chociaż znacznik ten nigdy nie został uwzględniony w oficjalnej specyfikacji języka HTML tworzonej przez W3C, cieszył się dużym wzięciem u użytkowników. Internet Explorer zaadoptował znacznik <EMBED> i system modułów dodatkowych, i jest on obecnie uważany za bezpieczny i pewny sposób umieszczania zawartości multimedialnej na stronach WWW. Chociaż mędrcy nadal mówią o modułach dodatkowych Netscape, nie jest to już technologia typowa dla Netscape.
W międzyczasie Microsoft rozwijał własny zestaw technologii wspomagających współużytkowanie informacji i kooperację różnych typów aplikacji. Technologia łączenia i osadzania obiektów (OLE; Object Linking and Embedding) i technologia COM (Component Object Model) określająca zasady komunikacji między obiektami znajdującymi się na tym samym komputerze, rozwinęły się ostatecznie w technologię ActiveX. Na potrzeby zastosowań sieciowych Microsoft przystosował swoją przeglądarkę do obsługi mini-programów zwanych kontrolkami ActiveX, które kontrolują umieszczone na stronie WWW obiekty ActiveX i pośredniczą w przekazywaniu do nich informacji za pośrednictwem znacznika <OBJECT>. Kontrolkę ActiveX można zaprojektować pod kątem współpracy z dowolną aplikacją, w tym także z Internet Explorerem. Komunikacja między kontrolką ActiveX a przeglądarką może odbywać się w języku skryptowym VBScript, stworzonym przez Microsoft, a sam system komunikacji przypomina komunikację między przeglądarką a modułami dodatkowymi Netscape, w której stosowany jest JavaScript, język skryptowy rozwinięty przez Netscape.
W rezultacie dostępne są dwa sposoby umieszczania zawartości multimedialnej w oknie przeglądarki: jako obiekty wspierane przez moduły dodatkowe oraz jako obiekty ActiveX. O ile obie przeglądarki obsługują moduły dodatkowe, to technologię ActiveX jedynie Internet Explorer. Sieć powiązań technologii ActiveX z innymi technologiami firmy Microsoft, ogranicza zakres jej działania tylko do platformy Windows. Ponieważ Internet Explorer bazuje przede wszystkim na ActiveX, obsługa obiektów wymagających modułów dodatkowych jest gorsza niż w przypadku Navigatora Netscape. W przeglądarce Netscape komunikacja z obiektami wspieranymi przez moduły dodatkowe odbywa się za pośrednictwem języka JavaScript. Internet Explorer nie zezwala na dostęp do obiektów korzystających z modułów i ActiveX przy użyciu tego języka; języka VBScript można z kolei użyć wyłącznie do komunikacji z obiektami ActiveX, lecz już nie do komunikacji z obiektami korzystających z modułów. Internet Explorer dla systemu Macintosh także nie obsługuje ActiveX, a wszystko to razem znacznie ogranicza zakres Twojej kontroli nad obsługą zawartości multimedialnej w różnych przeglądarkach i na różnych platformach.
Poza tym, chociaż większość najważniejszych producentów modułów dodatkowych tworzy także kontrolki ActiveX i moduły Netscape, to jednak nie czynią tak wszyscy. Na przykład Apple nie wypuścił wersji ActiveX popularnego modułu QuickTime, choć QuickTime jest przypuszczalnie technologią wieloplatformową.
Jako twórcy stron WWW codziennie musimy stąpać po tym polu minowym. Dreamweaver oferuje pomoc, wspierając obie technologie i troszcząc się pieczołowicie o szczegóły, aby strony były dostępne jak najszerszej szerzy odbiorców. (Jeśli stosujesz moduły dodatkowe, nawet Dreamweaver nie jest w stanie zapewnić pełnej kompatybilności między różnymi przeglądarkami i platformami sprzętowymi. Staraj się więc oszczędnie korzystać z zawartości multimedialnej i starannie testować swoje strony w wielu przeglądarkach i na różnych platformach. Pomyśl także o tym, aby zaprojektować strony tak, że nawet w przypadku braku obsługi multimediów, zachowana zostanie ich funkcjonalność.)
Aby wstawić w dokumencie programu Dreamweaver zawartość multimedialną korzystając ze znacznika <EMBED>, klikasz na palecie obiektów ikonę Insert Plugin. W wersji 4 programu znajdziesz ją w kategorii Special (w poprzedniej wersji należała ona do kategorii Common). Wstawiony obiekt jest obiektem typu ogólnego i może być stosowany do wstawiania treści o różnych typach MIME, obsługiwanych przez różne moduły dodatkowe. Rysunek 20.4 prezentuje obiekt na palecie obiektów oraz jego właściwości w inspektorze Property.
Rys. 20.4.
Ikona Insert Plugin z kategorii Special palety obiektów oraz inspektor Property prezentujący właściwości obiektu Plugin i okno parametrów obiektu
W inspektorze Property pojawiają się ogólne właściwości elementów utworzonych za pomocą narzędzia Insert Plugin, które można stosować z dowolnymi treściami multimedialnymi:
q Src – określa adres URL źródła pliku multimedialnego. Wypełnienie tego pola jest konieczne.
q Plg URL – określa wartość atrybutu pluginspage. Jest nią pełny adres URL witryny, z której można ściągnąć moduł dodatkowy. Jeśli przeglądarka użytkownika nie dysponuje odpowiednim modułem, który umożliwia obsługę pliku źródłowego, lecz w znaczniku <EMBED> umieszczono atrybut pluginspage określający adres URL, użytkownik uzyska możliwość udania się pod ten adres i pobrania modułu (poprzez ikonę braku modułu). Jest to opcjonalne rozwiązanie, lecz zalecane.
q Name – tak jak elementy HTML, tak i treści multimedialne muszą mieć swoją nazwę, aby można było odwoływać się do nich w skryptach. Ta właściwość jest opcjonalna.
q W i H – w tych polach określane są w pikselach wymiary obszaru przydzielonego obiektowi na stronie. Domyślnie przydzielany jest obszar o wymiarach 32x32 pikseli, ponieważ Dreamweaver nie jest w stanie określić rzeczywistych wymagań. Większość modułów wymaga zdefiniowania tych wartości.
q V Space i H Space – w tych polach można wprowadzić dodatkowy wolny obszar wokół obiektu. Są to ustawienia opcjonalne
q Align – to ustawienie określa sposób wyrównania obiektu na stronie. Jest opcjonalne.
q Border – określa szerokość obramowania wokół obiektu. Jest opcjonalne.
Dodatkowe parametry stowarzyszone z danym modułem dodatkowym można umieścić w znaczniku <EMBED>, klikając w inspektorze Property przycisk Parameters. Otworzy się wówczas okno dialogowe Parameters (patrz rysunek 20.4). Aby tą drogą dodać parametry, musisz znać ich nazwy i wartości.
W oknie dokumentu Dreamweaver nie wyświetli automatycznie osadzonej w dokumencie treści multimedialnej, lecz pokaże jedynie obszar jej przydzielony. Aby ją zobaczyć i usłyszeć, naciśnij w inspektorze Property przycisk Play. Dopóki którakolwiek z przeglądarek działających na Twoim komputerze będzie wyposażona w odpowiednie moduły, Dreamweaver poradzi sobie z wyświetleniem zawartości.
Aby wstawić w dokumencie programu Dreamweaver zawartość multimedialną korzystając ze znacznika <OBJECT>, klikasz na palecie obiektów ikonę Insert ActiveX. Znajdziesz ją w kategorii Special. Rysunek 20.5 prezentuje obiekt na palecie obiektów oraz jego właściwości w inspektorze Property. Podobnie jak w przypadku obiektu Plugin, jest to obiekt typu ogólnego i można go stosować z różnymi kontrolkami ActiveX.
Rys. 20.5.
Ikona Insert ActiveX z kategorii Special palety obiektów oraz inspektor Property prezentujący właściwości obiektu ActiveX i okno parametrów obiektu
W inspektorze Property dostępne są ustawienia takie jak dla obiektu Plugin oraz dodatkowe. Oto one:
q Class ID – jest to nazwa kontrolki ActiveX, która ma wspomóc obsługę treści multimedialnych. Kontrolki Shockwave, Flash i RealMedia są dostępne na rozwijanej liście; pozostałe musisz wpisać ręcznie. Ręcznie wprowadzona nazwa kontrolki jest dodawana do listy rozwijanej i na niej pozostaje tak długo, dopóki jej nie usuniesz (aby ją usunąć z listy, kliknij przycisk ze znakiem minus (-), który znajdziesz obok).
q ID – definiuje opcjonalny parametr ID kontrolki ActiveX. Najczęściej jest on stosowany w odwołaniach do obiektu umieszczanych w skryptach.
q Base – określa adres URL witryny, z której można ściągnąć żądaną kontrolkę ActiveX. Jeśli przeglądarka użytkownika nie dysponuje odpowiednią kontrolką ActiveX, która umożliwia obsługę pliku źródłowego, lecz w znaczniku <OBJECT> znajdzie się atrybut base, którego wartością jest adres URL, o ile to będzie możliwe, kontrolka zostanie automatycznie ściągnięta. Jest to parametr opcjonalny, lecz zalecany.
q Data – określa adres URL pliku z danymi. Wiele kontrolek ActiveX (w tym Flash, Shockwave i RealPlayer) nie korzysta z tego parametru.
q Alt Img – tu podajesz ulokowanie obrazu, który zostanie wyświetlony, jeśli przeglądarka nie obsługuje znacznika <OBJECT>.
q Embed – jeśli zaznaczysz to pole wyboru, Dreamweaver doda znacznik <EMBED> w obrębie znacznika <OBJECT>, aby umożliwić obsługę przeglądarki Netscape na wszystkich platformach, a przeglądarki Internet Explorer na platformach działających pod kontrolą innych systemów niż Windows.
Tak jak w przypadku obiektu plugin, naciśnij w inspektorze Property przycisk Play.
Początek ramki
Uwaga
Zamiast korzystać ze znaczników <EMBED> lub <OBJECT> możesz po prostu zdefiniować połączenie prowadzące do żądanego pliku multimedialnego. W tym celu utwórz na stronie połączenie tekstowe lub graficzne (używając obrazu), a następnie w polu Link inspektora Property podaj ulokowanie pliku multimedialnego lub skorzystaj z przycisku Browse i znajdź plik. Jest to dość prymitywna metoda udostępniania multimediów w witrynie, ponieważ nie daje ona żadnej kontroli nad parametrami i skryptami.
Koniec ramki
W tej części rozdziału przyjrzymy się najpopularniejszym modułom dodatkowym, takim jak Shockwave, QuickTime i RealMedia. Dowiesz się dla jakiego typu multimediów są one przeznaczone, czym różnią się kontrolki ActiveX od modułów Netsape oraz jaką masz możliwość kontroli nad każdym z nich.
Shockwave jest modułem dodatkowym i pokrewnym formatem plików, który umożliwia wyświetlenie w przeglądarce pliku utworzonego w programie Macromedia Director. Przez długie lata Director stanowił standard przemysłowy oprogramowania do produkcji profesjonalnych prezentacji na płytach CD-ROM. Director umożliwia łączenie grafiki, animacji, tekstów, dźwięku oraz obrazów wideo w spójną całość. Jego wewnętrzny język skryptowy, Lingo, pozwala na uzyskiwanie bardzo rozbudowanej interaktywności. Stosując oprogramowanie Director Multiuser Server sekwencje wideo Directora można wykorzystać przy tworzeniu gier sieciowych, pogawędek sieciowych i innych aplikacji sieciowych. Przeznaczone dla programu Director rozszerzenia (tworzone przez Integration Media) umożliwiają połączenie sekwencji wideo tego programu z bazami danych i plikami PDF (V12 i PDF Xtras).
Przy tworzeniu prezentacji umieszczanych na płytach CD, sekwencje wideo Directora zapisuje się jako samodzielne aplikacje. Natomiast prezentacje sieciowe zawierają sekwencje wideo zapisane w specjalnym formacie o rozszerzeniu nazwy .dcr i typie MIME application/x-director. Aby zobaczyć tego typu zawartość w oknie przeglądarki, użytkownicy muszą mieć moduł dodatkowy Shockwave, który jest dostępny pod adresem www.macromedia.com.
Director, a tym samym i Shockwave, korzysta z technologii duszków (ang. Sprite Technology), co oznacza, że poszczególne elementy prezentacji, takie jak obrazy, dźwięki i tekst muszą być ładowane do pamięci tylko raz, po czym, w trakcie odtwarzania sekwencji wideo, mogą być wielokrotnie wykorzystywane. Skrypty opisujące ich zachowanie pozwalają osiągnąć wysoką efektywność animacji. Technologia ta efektywnie wykorzystuje zasoby pamięci i pozwala tworzyć względnie niewielkie pliki, które nie obciążają bardzo sieci.
Shockwave to także technologia pozwalająca na strumieniowy przesył danych, co w praktyce oznacza, że sekwencja wideo jest odtwarzana już w trakcie ściągania. Dzięki temu nawet długie i skomplikowane prezentacje mogą być przesyłane przez sieć, bez ryzyka długiego oczekiwania na ich odtworzenie. Podobnie jak w przypadku programu Flash, w programie Shockwave strumieniowy przesył informacji jest realizowany po stronie klienta, co oznacza, że nie jest wymagana specjalna konfiguracja serwera. Aby dowiedzieć się nieco więcej na temat Shockwave, odwiedź stronę www.macromedia.com/shockzone.
Swego czasu Flash był uważany za element technologii Shockwave. Rozszerzenie nazwy .swf oznaczało „Shockwave Flash”. Obecnie jednak Macromedia wprowadza Flash na rynek jako samodzielną całość, oddzieloną od Shockwave, a rozszerzenie .swf oznacza oficjalnie „small Web files” (małe pliki sieciowe).
Moduł dodatkowy Shockwave jest zgodny z wieloma przeglądarkami i platformami. Dostępny jest jako moduł dodatkowy Netscape i kontrolka ActiveX. Wiele poważnych witryn korzysta z zawartości Shockwave, aby umożliwić zabawę, dostarczyć informacji i zaprezentować treści interaktywne, a wszystko to w celu zwabienia użytkownika na strony witryny. Zgodnie z danymi udostępnionymi przez Macromedia, ponad 167 milionów użytkowników ma na swoich komputerach zainstalowany moduł Shockwave.
W programie Dreamweaver wstawienie obiektu Shockwave umożliwia ikona Insert Shockwave palety obiektów (patrz rysunek 20.6). Jest ona umieszczona w kategorii Common i umożliwia wstawienie zawartości Shockwave za pomocą znacznika <OBJECT> zawierającego znacznik <EMBED>.
Rys. 20.6.
Paleta obiektów, na której zaznaczono ikonę Insert Shockwave
Poprzednie wersje Dreamweavera umożliwiały autorom stron WWW wybranie, czy przy wstawianiu zawartości Shockwave stosowane mają być oba znaczniki, <OBJECT> i <EMBED>, czy też tylko któryś z nich. W wersji 4 nie ma takiej możliwości.
Inspektor Property...
paradoks24h