Multimedia w HTML5 Statyczne witryny internetowe 2TIa Marek Kwiatkowski.

Slides:



Advertisements
Podobne prezentacje
Tworzenie stron internetowych
Advertisements

Zasady tworzenia prezentacji multimedialnej
Konfiguracja napędów CD/DVD
HTML.
Podstawowe wiadomości
Multimedia, prezentacje, wideo, dokumenty elektroniczne
Systemy operacyjne Bibliografia:
1 Osadzanie dźwięku Interaktywne dokumenty WWW Adam Czarnecki.
Tworzenie stron w języku WML jest zbliżone do tworzenia stron w HTML. W obydwu przypadkach używa się do tego celu znaczników (tagów). Zadaniem znaczników.
(ang. Hypertext Markup Language) - język znaczników hipertekstowych.
Andrzej Pędzich HTML ramki, menu, odnośniki.
WINDOWS 95 WYCINEK AUTOSTART TWORZENIE POWIĄZAŃ PLIKÓW Z APLIKACJAMI
Narzędzia internetowe Paweł Rajba ttp://pawel.ii.uni.wroc.pl/
Panel sterowania.
Tworzenie stron internetowych www World Wide Web
Projektor i sposób jego podłączenia
PODSTAWY <HTML>
System webowy do tworzenia kolektywnych prototypów aplikacji sieciowych i mobilnych Łukasz Przywarty
Projektowanie Stron WWW
Wstęp do JavaScriptu Marek Magiera Październik 2003r.
Grafika i multimedia na stronach WWW.
Otwieranie elementów w różnych ramkach
Projekt jest współfinansowany ze środków Unii Europejskiej w ramach Europejskiego Funduszu Społecznego.
Damian Zawada
Tworzenie stron internetowych
Podstawy tworzenia stron WWW
Autor: Justyna Radomska
Lokalizacja i Globalizacja na witrynie w Visual Web Developer 2008 (ASP.Net) Daniel Literski.
Konfiguracja systemu Windows
Podsystem graficzny i audio
Temat 8: Listy.
Temat 2: Edytory HTML.
Formatowanie treści oraz grafika w kodzie HTML. Nagłówki.
Wprowadzenie do HTML Informatyka Cele lekcji: Wiadomości:
Projektowanie stron www
Podręczna karta informacyjna dotycząca © 2012 Microsoft Corporation. Wszelkie prawa zastrzeżone. aplikacji Lync Web App Dołączanie do spotkania programu.
Temat 13: Ramki.
Podstawy HTML RAMKi. Ramki Za ich pomocą możesz swobodnie podzielić okno przeglądarki na kilka części i w nich niezależnie przeglądać dokumenty. Ramki.
Aplikacje internetowe
W W W Łukasz Stochniał.
Elementy multimedialne na stronie
Aplikacje internetowe Grafika na stronach WWW ciąg dalszy Atrybuty znacznika body.
Aplikacje internetowe
Smart Portal – podstawy użytkowania. W celu uruchomienia aplikacji Smart Portal, należy: -uruchomić nowe okno przeglądarki internetowej, -wpisać w pole.
LISTY HTML. Listy s ą definiowane za pomoc ą znacznika podstawowego innego dla ka ż dego rodzaju list Specyfikacja XHTML, zawiera specjalne znaczniki.
HTML (ang. HyperText Markup Language ) – język do tworzenia stron internetowych opierający się na znacznikach, czy inaczej je nazywając – tagach. Język.
Informatyka – szkoła gimnazjalna – Scholaris - © DC Edukacja Formatowanie treści oraz grafika w kodzie HTML Informatyka.
Treści multimedialne - kodowanie, przetwarzanie, prezentacja Odtwarzanie treści multimedialnych Andrzej Majkowski 1 informatyka +
Temat 9: Obrazy i multimedia
prezentacja multimedialna
Temat 1: CSS Dołączanie stylów do dokumentu
Temat 5: Instrukcje: print(), echo()
Damian Urbańczyk xHTML Elementy graficzne.
PHP. PHP obiektowy, skryptowy język programowania zaprojektowany do generowania stron internetowych w czasie rzeczywistym.
Umieszczanie multimediów na stronie WWW. Co to jest multimadialność?  Multimedialność w dziedzinie komputerów jest najczęściej rozumiana jako możliwość.
 Multimedia jest to ogólne określenie środków komunikacji wykorzystujących różne formy przekazu w celu dostarczenia odbiorcom rozrywki. Multimedia są.
I TY ZOSTAŃ WEBMASTEREM! CZĘŚĆ 2 – „STRUKTURA STRONY” STWORZYŁ GABRIEL ŚLAWSKI.
Dodawanie klipów i tekstu do projektu Ścieżka video i obrazów Ścieżka dźwięku – muzyka, efekty Tryb wyświetlania.
Informatyka – szkoła gimnazjalna – Scholaris - © DC Edukacja Tworzenie stron WWW w programie Microsoft FrontPage Informatyka.
Aplikacje internetowe Posługiwanie się ramkami. Zastosowanie ramek Wprowadzenie obsługi ramek w przeglądarce Netscape 2.0 otworzyło nową erę dla twórców.
Temat nr 5 Struktura strony www _________________________________________________________________________________________________________________ [ Przedmiot:
InformatykaZakresrozszerzony Zebrał i opracował : Maciej Belcarz Obraz i edycja filmów.
Microsoft® Office Word
 1. Logujemy się do YouTube i przesyłamy film na serwer (klikamy na Prześlij film ). W czasie przetwarzania pliku możemy uzupełnić informacje o wideo.
ASP.NET Tworzenie i zarządzanie wyglądem aplikacji, tworzenie mapy witryny. Kontrolki nawigacyjne.
TECHNOLOGIE MULTIMEDIALNE
VIDEO WSTAW PLIK VIDEO Z ROZSZERZENIEM AVI 3GPP MP4 WEBM Sposób rozpoczęcia odtwarzania :
Tworzenie stron WWW w programie Microsoft FrontPage
Platforma LearningApps
Zapis prezentacji:

Multimedia w HTML5 Statyczne witryny internetowe 2TIa Marek Kwiatkowski

Cele lekcji: Poznanie zasady umieszczania plików multimedialnych w HTML5 Zrozumienie istoty stosowania nowych znaczników w HTML5 ułatwiających załączanie plików multimedialnych takich jak dźwięk i obraz wideo Umiejętność użycia znaczników i na stronie www Umiejętność używania atrybutów znaczników i, by w sposób precyzyjny zarządzać dodatkowymi funkcjami pliku jak np. możliwość jego powtarzania, głośność, wielkość obszaru itp.

Różnice między HTML 4 a HTML 5 W języku HTML 5 usunięto przestarzałe instrukcje:,,,,,,. W miejsce usuniętych dyrektyw wprowadzono nowe instrukcje:,,,,,,,,,,,,. Wersja 5 upraszcza zapis znaczników językowych (obecnie wystarczy zapis:, wcześniejszy zapis wyglądał następująco: ) Wprowadzono moduł API i kompleksową obsługę multimediów. Rozbudowano formularze. Zniesiono zasadę obowiązkowego zamykania znaczników (pomocne dla zapominalskich webmasterów) i pustych komend.

Zasada umieszczania plików multimedialnych w HTML 5 Aby zamieścić na stronie www plik video, należy użyć znacznika natomiast żeby zamieścić plik dźwiękowy wystarczy użyć znacznika. Nie są wówczas potrzebne żadne dodatkowe wtyczki, bowiem wyżej wymienione znaczniki dostarczają również odtwarzacze tych plików. Oczywiście, bardziej zaawansowane/skomplikowane projekty nadal wymagają użycia dodatkowych narzędzi.

Zasada umieszczania plików multimedialnych w HTML 5 Plik wideo Aby zamieścić na stronie www plik video, należy użyć znacznika a w atrybucie src, czyli źródło, podać ścieżkę pliku z filmem oraz jednocześnie ustalić wysokość i szerokość wyświetlanego odtwarzacza.

Zasada umieszczania plików multimedialnych w HTML 5 Plik wideo Za pomocą właściwości poster można określić ścieżkę do obrazka (w formie okładki) do danego pliku video, który chcemy zamieścić na stronie internetowej. Okładka taka wyświetla się w czasie ładowania filmu do przeglądarki.

Zasada umieszczania plików multimedialnych w HTML 5 Plik wideo Należy w wymiarach okładki uwzględnić rozdzielczość filmu, ponieważ właśnie ten plik graficzny zostanie dopasowany do obszaru, którego rozmiar wpiszemy w kodzie znacznika. PRZYKŁAD W NOTEPAD++

Zasada umieszczania plików multimedialnych w HTML 5 Plik wideo Zastosowanie atrybutów. autoplay – automatyczne odtwarzanie controls – wyświetlenie panelu sterowania video loop – zapętlanie się odtwarzacza wideo autobuffer – automatyczne buforowanie wideo preload – wczytanie wideo wraz z załadowaniem strony

Zasada umieszczania plików multimedialnych w HTML 5 Plik wideo Przykłady

Zasada umieszczania plików multimedialnych w HTML 5 Plik audio W przypadku pliku dźwiękowego używamy znacznika. Podobnie jak w przypadku znacznika musimy podać jego źródło w znaczniku. Pamiętaj o dopisaniu atrybutu controls po audio! Inaczej nam się plik nie wyświetli Przykład

Zasada umieszczania plików multimedialnych w HTML 5 Plik audio Podobnie jak w przypadku pliku video stosujemy atrybuty controls, autoplay, loop, muted W przypadku plików dźwiękowych, możemy wybrać jeden z trzech typów plików audio WAVE, MP3, OGG. Możemy nawet połączyć wszystkie te trzy typy na stronie. Przeglądarka wówczas wybierze ten, który obsługuje.

Zasada umieszczania plików multimedialnych w HTML 5 Plik audio Spójrz na przykłady.

Zasada umieszczania plików multimedialnych w HTML 5 Znacznik Znacznik ten służy do tworzenia grafiki rastrowej na stronach www. Dzięki niemu możemy rysować grafikę w czasie rzeczywistym. Definiowany jest prostokąt na ekranie, tzw. „płótno” w którym tworzony jest rysunek. Zobacz przykład.

Zasada umieszczania plików multimedialnych w HTML 5 Zadanie domowe Czy na stronie internetowej, zastosowanie autostartu w plikach dźwiękowych, muzycznych jest dobrym rozwiązaniem ze strony webmastera, czy niekoniecznie? Uzasadnij swoją odpowiedź, podaj przykłady.