Element <img> w HTML

Słownik kwalifikacji INF.03 - Tworzenie i administrowanie stronami i aplikacjami internetowymi oraz bazami danych

Element <img> w HTML

Element <img> służy do wstawiania obrazu na stronę internetową. Jest to element pusty, czyli nie ma znacznika zamykającego z treścią między tagami.

Podstawowa składnia

<img src="kotek.jpg" alt="obrazek kotka">

Najważniejsze atrybuty elementu <img> to:

  • src — wskazuje ścieżkę do pliku graficznego,
  • alt — zawiera tekst alternatywny opisujący obraz,
  • title — opcjonalny tekst podpowiedzi, często wyświetlany po najechaniu kursorem.

Rola atrybutu src

Atrybut src jest obowiązkowy, ponieważ informuje przeglądarkę, jaki plik graficzny ma zostać wyświetlony. Bez niego obraz nie zostanie poprawnie załadowany.

Przykład:

<img src="/grafika/logo.png" alt="Logo firmy">

Rola atrybutu alt

Atrybut alt jest bardzo ważny dla dostępności strony. Jego treść jest odczytywana przez czytniki ekranu oraz wyświetlana, gdy obraz nie może zostać załadowany.

Poprawny przykład:

<img src="/kotek.jpg" alt="obrazek kotka">

Częsty błąd egzaminacyjny

Do obrazów nie używa się atrybutu href. Atrybut href stosuje się głównie w odnośnikach, np. w elemencie <a>. Dla grafiki należy użyć src, a dla tekstu alternatywnego — alt.