Atrybut Alt jest to element kodu HTML dostarczający informację dla wyszukiwarek internetowych oraz Czytników Ekranowych o zawartości zamieszczonej na stronie grafiki.
Atrybut alt to „alternatywna” wersja tekstowa obrazu wyświetlana na stronie internetowej, gdy obraz nie jest dostępny lub gdy użytkownik chce alternatywy tekstowej. Poniżej pogrubione jest to, jak wygląda atrybut alt w HTML:
<img src="book.gif" alt="opened leather journal" />
Atrybuty Alt korzystają z trzech podstawowych grup:
- osoby niedowidzące
- Wyszukiwarki
- marketerzy
Alt i osoby niedowidzące
Atrybuty Alt zapewniają osobom niedowidzącym alternatywę dla obrazów. Dzięki temu odwiedzający mogą korzystać z programów, które czytają tekst na głos, aby zrozumieć, jakie obrazy dodają do treści.
Na przykład osoby niedowidzące są w niekorzystnej sytuacji podczas przeglądania strony internetowej, która używa obrazów do nawigacji, ponieważ nie mają możliwości poznania głównych kategorii witryny. Ale jeśli obrazy mają atrybuty alt, istnieje sposób na określenie celu tych obrazów.
Alt i wyszukiwarki internetowe
Atrybut alt pomaga wyszukiwarkom odszyfrować temat obrazu, dzięki czemu wiedzą, kiedy zawrzeć obraz w odpowiednich wynikach wyszukiwania. Dzięki temu obrazy z atrybutami alt są bardziej prawdopodobne.
Alt i marketing internetowy
Najlepszą praktyką jest używanie atrybutów alt z odpowiednimi obrazami, ponieważ atrybuty alt są bardziej prawdopodobne, że zajmą wyższą pozycję w wynikach wyszukiwania. Wyszukiwarka grafiki Google uzyskuje ponad 1 miliard odsłon dziennie . Optymalizacja obrazów może przynieść większą część tego ruchu.
Więcej oczu na zdjęciach może zwiększyć świadomość marki, jeśli Twoje zdjęcia pokazują Twoją markę. Ponadto im wyższe są Twoje zdjęcia w wyszukiwaniu obrazów, tym większe prawdopodobieństwo, że ludzie klikną wyniki obrazków i odwiedzą Twoje strony. Tak więc optymalizacja obrazów może spowodować większy ruch na Twojej stronie.
Techniczne aspekty Alt
Atrybut alt jest używany w tagu obrazu w HTML.
HTML to język formatowania. Jego główną rolą jest wyjaśnianie programom takim jak Chrome, jak rozmieszczać elementy projektu, takie jak obrazy i tekst na stronie internetowej. HTML składa się z różnych tagów, które wyjaśniają, co powinno być wyświetlane i jak.
Jeśli chcesz zobaczyć, jak wygląda HTML, edytuj wpis w blogu WordPress i kliknij zakładkę Tekst, aby wyświetlić wersję HTML posta na blogu. Jeden wspólny tag HTML, który prawdopodobnie zobaczysz, to tag obrazu. To wygląda tak:
<img ... />
Atrybuty w tagu określają, co jest wyświetlane i jak wygląda. W obrębie znacznika obrazu atrybut src (skrót od źródła) wyjaśnia, który obraz ma zostać wyświetlony. Znacznik obrazu poniżej ma atrybut src, który określa, że obraz book.gif powinien być wyświetlany.
<img src="book.gif" />
Istnieje wiele innych atrybutów obrazu. Na przykład można określić wysokość i szerokość obrazu z atrybutami.
<img src="book.gif" height="200" width="100" />
Atrybut alt jest w szczególności tekstową alternatywą obrazu. Zazwyczaj atrybuty alt wyjaśniają, czym jest obraz. Oto przykład tagu obrazu wykorzystującego atrybut alt.
<img src="book.gif"height="200" width="100" alt="opened leather journal with writing in it" />
Terminologia techniczna
Alt Text
Ludzie często błędnie używają zamiennie terminów „atrybut alt” i „alt text”. Alt text to wartość określona przez atrybut alt. Twarz Smily jest tekstem alt określonym w atrybucie alt alt = „Twarz Smily” .
Alt Tag
Termin „alt tag” oznacza nieprawidłowe użycie i połączenie dwóch oddzielnych terminów. Atrybut altjest typem atrybutu używane w tagu obrazu. Technicznie rzecz biorąc, „tagi alt” nie istnieją, mimo że są używane do zwykłego odwoływania się do atrybutów alt i / lub tekstu alt.