HTML: Linki i multimedia

LINKI
W języku html do zapisywania linków używamy elementu <a> (anchor – kotwica). Pomiędzy znacznikami wpisujemy tekst odsyłacza, tzn. tekst który zostanie wyświetlony na ekranie. Jeśli byśmy chcieli, aby tekst linka wskazywał na kurs html zapis ten wyglądałby następująco:
<a>kurs html</a>

Linki możemy podzielić na wewnętrzne oraz zewnętrzne. Linki wewnętrzne mają również dwojaki podział, na linki prowadzące do:
- sekcji na tej samej stronie
- innych podstron w ramach tej samej domeny

Wyróżniamy linki względne, wewnątrz tej samej witryny:
<a href="/about">O nas</a>
<a href="../contact>Kontakt (katalog wyżej)</a>
<a href="products/laptops.html>Laptopy (podkatalog</a>

Linki zewnętrzne zaś, prowadzą na strony tzw. zewnętrzne, tzn. znajdujące się na innych domenach. W tym przypadku podajemy pełne adresy URL. Atrybut href (hypertext reference) wskazuje cel linku:
<a href="https://www.google.com">Wyszukiwarka Google</a>
<a href="https://example.com">Link do zewnętrznej strony</a>

MULTIMEDIA
Aby zapisać multimedia w HTML, używa się odpowiednich znaczników: <video> dla filmów, <audio> dla dźwięku, a <source> wewnątrz nich do określenia plików w różnych formatach. Obrazy dodaje się za pomocą znacznika <img> wewnątrz znacznika <a>, jeśli mają być klikalnym linkiem, np. <a href="podstrona.html"><img src="obrazek.jpg" alt="Przejdź do podstrony"></a>. Do czego służą konkretne znaczniki

• <video>: Używany do osadzania materiałów wideo.
• <audio>: Używany do osadzania materiałów audio, takich jak muzyka czy podcasty.
• <source>: Umieszczany wewnątrz video lub audio, pozwala na podanie kilku źródeł pliku w różnych formatach. Przeglądarka wybierze ten, który obsługuje.
• <img>: Używany do wstawiania obrazków.
• <a>: Służy do tworzenia linków, a umieszczenie w nim znacznika <img> sprawi, że obraz będzie klikalny.

Przykłady zastosowaniaWideo:html

<video controls>
  <source src="film.mp4" type="video/mp4">
  <source src="film.webm" type="video/webm">
  Twoja przeglądarka nie obsługuje elementu video.
</video>

• Dodatek controls dodaje przyciski odtwarzania i pauzy. 

Dźwięk:html

<audio controls>
  <source src="dzwiek.ogg" type="audio/ogg">
  <source src="dzwiek.mp3" type="audio/mpeg">
  Twoja przeglądarka nie obsługuje elementu audio.
</audio>

Obraz jako link:html

<a href="https://www.google.pl/">
  <img src="logo.png" alt="Przejdź do Google">
</a>