Co to jest Alt Text?
tekst alternatywny, znany również jako” atrybuty alt”,” opisy alt „lub technicznie niepoprawnie jako” znaczniki alt”, są używane w kodzie HTML do opisu wyglądu i funkcji obrazu na stronie.
alt text używa:
1. Dodawanie tekstu alternatywnego do zdjęć to przede wszystkim zasada dostępności stron internetowych. Użytkownicy niedowidzący korzystający z czytników ekranu zostaną odczytani z atrybutem alt, aby lepiej zrozumieć obraz na stronie.
2., Tekst alternatywny będzie wyświetlany zamiast obrazu, jeśli nie można załadować pliku obrazu.
3. Tekst alternatywny zapewnia lepszy kontekst obrazu/opisy dla robotów przeszukiwających Wyszukiwarki, pomagając im w prawidłowym indeksowaniu obrazu.
podświetlony tekst pokazuje tekst alt (atrybut alt) obrazu po lewej stronie.
przykład tekstu Alt
<img src="https://moz.com/learn/seo/pupdanceparty.gif" alt="Puppies dancing">
optymalny format tekstu Alt
najlepszy format tekstu alt jest wystarczająco opisowy, ale nie zawiera żadnych spamowych prób wypchania słów kluczowych., Jeśli możesz zamknąć oczy, poprosić kogoś o przeczytanie tekstu alternatywnego i wyobrazić sobie w miarę dokładną wersję obrazu, jesteś na dobrej drodze.
spójrzmy na kilka przykładów tekstu alternatywnego dla tego obrazu pysznie wyglądającego stosu naleśników jagodowych:
Okay:
ten tekst ALT jest tylko „w porządku”, ponieważ nie jest zbyt opisowy. Tak, to jest obraz stosu naleśników. Ale jest więcej do powiedzenia na temat tego obrazu.,
dobrze:
<img src="https://moz.com/learn/seo/pancakes.png" alt="Stack of blueberry pancakes with powdered sugar">
ten tekst alt jest lepszą alternatywą, ponieważ jest znacznie bardziej opisowy dla tego, co znajduje się na obrazku. To nie jest tylko stos” naleśników ” (jak pokazano na przykładzie pierwszego tekstu alt); to stos naleśników z jagodami z odrobiną cukru pudru!
nie zaleca się:
<img src="https://moz.com/learn/seo/pancakes.png" alt="">
lub
<img src="https://moz.com/learn/seo/pancakes.png" alt="pancake pancakes pan cake hotcakes hotcake breakfast food best breakfast top breakfasts breakfast recipes pancake recipe">
żaden z tych przykładów nie jest zalecany., Pierwsza linijka kodu w rzeczywistości nie zawiera żadnego tekstu alt (zauważ, że cudzysłowy są puste), podczas gdy drugi przykład pokazuje wypychanie słów kluczowych w tekście alt.
Dlaczego tekst Alt jest ważny?
Accessibility
Alt text jest zasadą przystępnego projektowania stron internetowych. Jego pierwotnym (i nadal podstawowym) celem jest opisywanie obrazów odwiedzającym, którzy nie są w stanie ich zobaczyć. Obejmuje to czytniki ekranu i przeglądarki blokujące obrazy, ale obejmuje również użytkowników, którzy są niedowidzący lub w inny sposób nie mogą zidentyfikować obrazu., Włączenie tekstu alternatywnego do obrazów zapewnia, że wszyscy użytkownicy, niezależnie od zdolności wizualnych, mogą docenić zawartość witryny.
Image SEO
używanie tekstu alternatywnego na obrazach może poprawić wrażenia użytkownika, ale może również pomóc w uzyskaniu zarówno jawnych, jak i ukrytych korzyści SEO. Wraz z implementacją najlepszych praktyk dotyczących tytułu obrazu i nazewnictwa plików, w tym tekstu alternatywnego, może również przyczynić się do SEO obrazu.,
podczas gdy technologia rozpoznawania obrazów w wyszukiwarkach znacznie się poprawiła na przestrzeni lat, crawlery wyszukiwania nadal nie mogą „zobaczyć” obrazów na stronie internetowej, tak jak my, więc nie jest mądre, aby pozostawić interpretację wyłącznie w ich rękach. Jeśli nie rozumieją lub źle to rozumieją, możliwe jest, że możesz dodać ranking do niezamierzonych słów kluczowych lub całkowicie przegapić ranking.
oto przykład: Google może zobaczyć poniższy obrazek i być w stanie rozszyfrować, że to mężczyzna w krawacie i okularach, siedzący przy biurku.,
Jim Halpert z biura (wersja amerykańska)
Jeśli próbujesz uzyskać pozycję w rankingu „podszywanie się Jima Halperta za Dwighta Schrute”, musisz jednak pożyczyć wyszukiwarce pomoc ręka.
w tym sensie alt text oferuje kolejną możliwość włączenia docelowego słowa kluczowego., Ponieważ użycie słów kluczowych na stronie nadal przyciąga wagę jako czynnik rankingowy w wyszukiwarkach, najlepiej jest utworzyć tekst alternatywny, który zarówno opisuje obraz, jak i, jeśli to możliwe, zawiera słowo kluczowe lub frazę kluczową, którą kierujesz.
Jak napisać dobry tekst alt?
-
opisz obraz jak najdokładniej. Alt text jest przede wszystkim zaprojektowany, aby zapewnić tekstowe wyjaśnienia obrazów dla użytkowników, którzy nie są w stanie ich zobaczyć. jeśli obraz naprawdę nie przekazuje żadnego znaczenia/wartości i jest tylko do celów projektowych, powinien żyć w CSS, a nie HTML.,
-
Zachowaj (względnie) krótko. Najpopularniejsze czytniki ekranowe odcinają tekst alternatywny przy około 125 znakach, więc zaleca się, aby zachować tę liczbę znaków lub mniej.
-
użyj słów kluczowych tekst Alt zapewnia kolejną możliwość włączenia docelowego słowa kluczowego na stronie, a tym samym kolejną możliwość zasygnalizowania wyszukiwarkom, że Twoja strona jest bardzo istotna dla konkretnego zapytania., Podczas gdy twoim pierwszym priorytetem powinno być opisanie i dostarczenie kontekstu do obrazu, jeśli ma to sens, umieść swoje słowo kluczowe w tekście alternatywnym co najmniej jednego obrazu na stronie.
-
unikaj wypychania słów kluczowych. Google nie zadokuje Ci punktów za źle napisany tekst alternatywny, ale będziesz miał kłopoty, jeśli użyjesz swojego tekstu alternatywnego jako okazji, aby wcisnąć tyle odpowiednich słów kluczowych, ile możesz wymyślić. Skoncentruj się na pisaniu opisowego tekstu alternatywnego, który zapewnia kontekst obrazu i jeśli to możliwe, zawiera docelowe słowo kluczowe, i pozostaw je na tym.
-
nie używaj obrazów jako tekstu., Jest to mniej niż najlepsza praktyka dotycząca tekstu alternatywnego, a bardziej ogólna zasada SEO-friendly web development. Ponieważ wyszukiwarki nie mogą odczytać tekstu w obrazach, należy unikać używania obrazów zamiast słów. Jeśli musisz to zrobić, wyjaśnij, co mówi zdjęcie w tekście alternatywnym.
-
nie zawierają „image of”, „picture of” itp. w Twoim tekście alt. Zakłada się już, że Twój tekst alternatywny odnosi się do obrazu, więc nie ma potrzeby go określać.
-
nie zapomnij longdesc=””. Eksploruj za pomocą tagu longdesc= „” dla bardziej złożonych obrazów, które wymagają dłuższego opisu.,
-
nie zaniedbuj przycisków formularza. Jeśli formularz w Twojej witrynie używa obrazu jako przycisku „Wyślij”, nadaj mu atrybut alt. Przyciski obrazu powinny mieć atrybut alt, który opisuje funkcję przycisku, np. „Szukaj”, „Zastosuj teraz”, „zarejestruj się” itp.
jak wygląda dobry tekst alt?,3″>
ok alt text: <img src="https://moz.com/learn/seo/kwe.png" alt="kw explorer">
lepszy alt text: <img src="https://moz.com/learn/seo/kwe.png" alt="keyword research in Keyword Explorer">
najlepszy tekst alt: <img src="https://moz.com/learn/seo/kwe.png" alt="Moz Keyword Explorer tool for SEO keyword research">
ucz się dalej
- wytyczne dotyczące publikacji obrazów Google
- czynniki rankingu stron
- opis meta
wykorzystaj swoje umiejętności do pracy
optymalizacja strony sekcja moz Pro podkreśla strony, które nie spełniają pełnego potencjału widoczności wyszukiwania (i zawiera takie rzeczy, jak Brak tekstu alternatywnego na stronie)., Spróbuj > >