Obszar na mapie klikalnych obszarów

Za utworzenie klikalnego obszaru na mapie klikalnych obszarów odpowiada element area.

Aby na mapie klikalnych obszarów reprezentowanej przez element map mógł pojawić się klikalny obszar, do zawartości interesującego nas elementu map należy dodać element area.

Przykład:

<map name="mapa-1">
  <area>
</map>

<img src="https://webkod.pl/files/html/obrazek-01.png" usemap="#mapa-1" alt="mapa klikalnych obszarów">

Aby element area mógł prowadzić do interesującego nas zasobu internetowego, adres interesującego nas zasobu internetowego należy podać jako wartość atrybutu href wspomnianego elementu area.

Przykład:

<map name="mapa-1">
  <area href="https://webkod.pl/kurs-html/tagi/sekcje/element-section">
</map>

<img src="https://webkod.pl/files/html/obrazek-01.png" usemap="#mapa-1" alt="mapa klikalnych obszarów">

Ponadto element area powinien posiadać atrybut alt, którego wartość powinna stanowić dodatkową informację dla przeglądarki internetowej o temacie treści, którą reprezentuje zasób internetowy, do którego prowadzi dany element area.

Przykład:

<map name="mapa-1">
  <area href="https://webkod.pl/kurs-html/tagi/sekcje/element-section" alt="opis elementu - section">
</map>

<img src="https://webkod.pl/files/html/obrazek-01.png" usemap="#mapa-1" alt="mapa klikalnych obszarów">

Rezultat:

Aby móc kliknąć na obszar reprezentowany przez nasz przykładowy element area na mapie klikalnych obszarów powiązanej z elementem img oraz reprezentowanej przez element map, wspomniany klikalny obszar musi posiadać swój kształt, dlatego tym zagadnieniem zajmiemy się w następnym kroku.