Menu serwera

WordPress + HTML5 wideo

Moja nienawiść do Flasha w ogólności a użytego do odtwarzania mediów w szczególności jest wielka. Od czasu zanabycia zaś netbooka – wprost potężna. Nie cierpię tej technologii za skuteczne zabijanie całej tej skromnej ale mimo wszystko wystarczającej do pracy z Lightroomem 3 „mocy” mojego netbooka, który przy próbie odtworzenia głupiego filmiku z YouTube w jakiejś minimalnej jakości po prostu zatyka się na amen. Flash się do streamingu mediów nie nadaje i basta.

W międzyczasie powstały nowe standardy, znacznie chyba sympatyczniejsze i pozwalające na uniezależnienie się od Flasha. Właśnie testuję wordpressową wtyczkę, której zadanie jest jasne i klarowne: podawać wideo HTML5 style. I zdaje się, że to działa. Testowałem wtyczkę na różnych przeglądarkach i zdaje się, że jakichś większych błędów nie ma. Wtyczka nazywa się Degradable HTML5 audio and video Plugin, ma nieskomplikowaną składnię do użycia we wpisie i zadowoli wyznawców zarówno kodeka h.264 jak i Theory. Poniższy trailerek (zresztą całkiem nieźle zapowiadającego się thrillerka z tego co widzę) podawany jest w zależności od przeglądarki albo jako plik m4v, albo jako ogg, albo jako stream via flashowa wtyczka. Rzecz jest i wygląda bardzo podstawowo ale mnie to w zupełności wystarczy. Prosiłbym bardzo o podrzucanie uwag o działaniu/niedziałaniu wtyczki – zbiorę to jakoś do kupy i wyślę autorowi plugina by miał nad czym pracować. A facet działa szybko i błędy poprawia z dnia na dzień, co się ogólnie chwali. No to co, mały seansik?

http://dl.dropbox.com/u/1944692/Trailery-filmy/2010.02.04-The_Crazies-Trailer

Powinno zadziałać. Niestety WPtouch jeszcze tego plugina nie obsługuje i strona wyświetlana za pomocą WPtouch na iPhonie pokaże spory obrazek (a bo można sobie posterki jak najbardziej definiować i przed rozpoczęciem odtwarzania powinny robić za wypełnienie miejsca dla filmiku), który nieco wygląd rozwali. Zaraz będę klepał do twórców WPtouch o obsługę tej wtyczki i skalowanie obrazków przez nią podawanych. Nie powinno być chyba jakichś większych problemów z tym ale jeśli ktoś jeszcze requesta podeśle, to może chłopaki szybciej się tym zajmą.

Anyway, potestowałem sobie i szczerze mówiąc podoba mi się to hateemelopięciowe rozwiązanie bardzo. Prosto, jasno i przejrzyście można podać filmik (i dźwięk bo wtyka obsługuje także audio) applofilowi, linuksofilowi i windowsofilowi. Mam nadzieję, że sieć pójdzie w tym kierunku i bezflashowe podawanie wideo tam, gdzie flasha się nie obsługuje lub nie chce, stanie się standardem.

Z góry dzięki za feedback i testy! Jeśli coś nie działa proszę o info o systemie operacyjnym, używanej przeglądarce i jej wersji. To powinno pomóc przy usuwaniu ewentualnych błędów. Szczególnie o wsparcie proszę użytkowników IE – na moim wirtualnym Windowsie IE coś pluje o błędach choć w sumie wszystko działa jak trzeba…

, , ,

23 Responses to WordPress + HTML5 wideo

  1. matipl 4 lutego, 2010 at 13:44 #

    Nie sądziłem, że pojawi się do tego plugin…
    Wtyczka pierwsza klasa.
    W przeglądarkach które już obsługują video-tag śmiga aż miło (Firefox, Safari).
    A w IE i Operze wstawia flash. Mała uwaga w IE pasek postępu filmu posiada żółtą obwódkę.

    • CoSTa 4 lutego, 2010 at 13:53 #

      O, dzięki za info. Jednak co Windows, to inne reakcje :) – na moim wirtualnym XP z ostatnim IE nie mam żółtej obwódki. Sprawdzę jeszcze na domowym netbooku z XP.

      • matipl 4 lutego, 2010 at 13:57 #

        dokładnie to XP SP3 + IE8

        Po kilku krotnym odświeżeniu strony obwódki nie ma, a Twój lifestream wygląda okej (wcześniej całe tło w twitterowym t).
        Może CSS zmieniałeś….

        • matipl 4 lutego, 2010 at 13:57 #

          Jest obwódka…
          Otwieram stronę, uruchamiam jest super… Robię alt+tab do Opery, robię alt+tab do IE..i obwódka się pojawia :/ dziwne

        • CoSTa 4 lutego, 2010 at 14:06 #

          Cholera, tajemnicza sprawa z tą obwódką :). No nic, sprawdzę jeszcze na swoich XPekach i zobaczym co to może być.

          Przy okazji – jakiś viściarz lub siódemkowiec może istnienie problemu potwierdzić?

  2. SpeX 4 lutego, 2010 at 13:48 #

    XP+FF3.5.7
    Filmik idzie bez dzwięku.

    Chromium 4.0.260.0 (33251)
    Wszystko działa poprawnie.

    Jak większym kłopotem video w html5 jest ogólnie dostępnego hosting video, który by serwował bezpośrednio linki do plików. W porównaniu z tym jak łatwo można coś wrzucić na YouTuba.

    A jak sobie playe radzi jak mu zapodamu flashowski filmik np link do YouTube?

    • matipl 4 lutego, 2010 at 13:50 #

      pamiętajmy, ze YouTube testuje HTML5 (youtube.com/html5)

    • CoSTa 4 lutego, 2010 at 14:00 #

      Spex, ten brak dźwięku to raczej kwestia kodeka (braku lub zbyt starego). W FF 3.6 pod OSX i Win problemów nie mam żadnych – uaktualnij przeglądarkę :)

      Co do hostingu – Można zawsze wydać te kilka złotych i po prostu sobie nieco miejsca na np. Dropboxie kupić. Albo po prostu wrzucać na YouTube (lub Vimeo), które ostatnio obsługę elementu video wprowadziło, za co im chwała. Ja wolę jednak trzymać swoje jajka przy sobie :)

      • SpeX 4 lutego, 2010 at 14:13 #

        Może to wina tego iż mam otwarte trochę zakładek :/ Jak coś się zwolni to przetestuję jeszcze raz.

  3. Nazgul 4 lutego, 2010 at 15:01 #

    No wtyczka wygląda ciekawie.

    Ale ja czekam na to: http://jilion.com/sublime/video to dopiero będzie „nowa jakość w oglądaniu filmów ze stron ;)

    • CoSTa 4 lutego, 2010 at 15:46 #

      Ładny playerek :). Niech od razu zrobią z tego plugina do WP to wezmę z pocałowaniem ręki.

    • byte 4 lutego, 2010 at 17:52 #

      Wow! Świetne.

  4. ;) 4 lutego, 2010 at 15:38 #

    niezly lol

    Obrabiasz rawy /bo do tego sluzy lightroom/ oraz tworzysz ich zbiory na netbooku i narzekasz na flasha?

    Na normalnym laptopie import kilkudziesieciu plikow do lightrooma i pozniejsza ich obrobka to niezly stres dla calego systemu, wlaczenie gry czy filmiku w przegladarce jest przy tym pikusiem.

    Tak wiec jestes dla mnie mistrzem optymalizacji
    powinienes czym predzej wydac almanach jak ustawic ligtrooma by komfortowo obrabiac cyfrowe negatywy na netbookach – sam kupie za 100 nawet.

    • CoSTa 4 lutego, 2010 at 15:48 #

      Ależ żaden problem, kilka zaawansowanych tipsów w temacie jak sobie umilić pracę z LR podrzucę. Zaraz po przelewie na moje konto 1200 złociszy naszych polskich. Na tyle sobie moje tipsy wyceniam.

      I tak, wyobraź sobie, narzekam na Flasha.

  5. zx 4 lutego, 2010 at 23:59 #

    Na najnowszej Operze bez problemów.

  6. PeterCub 5 lutego, 2010 at 17:16 #

    IE8 WinXP Pro ze wszystkimi wtyczkami aktualizacjami itp, błąd: „Wiadomość: 'J.parentNode’ jest pusty lub nie jest obiektem
    Wiersz: 5
    Znak: 1913
    Kod: 0
    Identyfikator URI: https://costa.info.pl/wp-includes/js/swfobject.js?ver=2.1

  7. szuman 7 lutego, 2010 at 00:18 #

    widać, w swoim podejściu do flasha nie jestem osamotniony. Ale wątpię, by tag video wyparł flasha – przynajmniej w najbliższym czasie.

  8. CoSTa 10 lutego, 2010 at 18:11 #

    OK, dzięki kochani za feedback – nieco nam się z Pavlem w ostatnim czasie maile rozgrzały i w międzyczasie wtyczka doczekała się dwóch poprawek. Na WPtouch trzeba będzie jeszcze nieco poczekać ale też powinno się dać to jakoś zrobić. Anyway, kolejne poprawki w drodze a Pavel klnie jak szewc na obsługę taga video przez przeglądarki. Póki co najlepiej robi to zdecydowanie Firefox, reszta to jakaś wypadkowa dziwnego przestrzegania standardów :)

  9. SpeX 12 kwietnia, 2010 at 07:55 #

    Ta wtyczka nie ma żadnych ustawień? Ani nie dodaje swoich przycisków do edycji postów?

    • CoSTa 12 kwietnia, 2010 at 09:25 #

      Wtyczka nie ma żadnych ustawień w panelu administracyjnym. Niestety, wtyczka nie dodaje swoich przycisków do edycji postu.

      • SpeX 12 kwietnia, 2010 at 12:06 #

        Czyli trzeba strzelać kodami z pamięci :/

        A tak z innej beczki, jak przeglądarka nie obsługuje html5, to w czym jest wyświetlany film/audio?

        Oraz szkoda iż wtyczka sama nie wyciąga linku do materiału z popularnych serwisów wideo jak YT czy Video.

        • CoSTa 13 kwietnia, 2010 at 06:09 #

          Ano niestety trzeba strzelać z pamięci.

          Gdy przeglądarka nie obsługuje tagu video, wtyczka robi fallback do playera flashowego i materiał jest odtwarzany via Flash.

          Co do obsługi YT czy Vimeo – napisz autorowi wtyczki sugestię. Koleś jest pracowity, więc może z czasem wszystko co trzeba się we wtyczce pojawi.

Trackbacks/Pingbacks

  1. Już rozumiem, o co chodzi niektórym z tym Flashem. « TransBlog - 23 kwietnia, 2010

    […] w taki sposób zrozumiałem, czemu niektórzy tak oczekują tagu Video w HTML5. Choć nie rozumiem, po co ta wojna formatów (H.264 vs Theora) między przeglądarkami. Czemu po […]

Dodaj komentarz