Terug Gelijk uw website aanmelden

Wat is de invloed van deze alt tag voor afbeeldingen ? Optimaliseren van foto's - de Alt tag bij afbeeldingen

 

Zodra je op een webpagina afbeeldingen gaat plaatsen moet je rekening houden met de zoekmachines. Technisch gezien bestaat een afbeelding of een foto uit een paar elementen:

  1. naam van de afbeelding
  2. naam van de map waar de afbeelding in staat
  3. de alt tag van een afbeelding
  4. eventueel een title tag

 

De naam van een afbeelding

 

In dit voorbeeld gaan we er vanuit dat je op je site een verhaal wilt schrijven over James Bond films. En om de pagina leuk aan te kleden plaats je een rechten-vrije foto. Die foto heb je gevonden en heet jb_dieanother_small_1234.jpeg

Daar begint je eerste stap in het optimaliseren van afbeeldingen voor de zoekmachines. De naam is te niets-zeggend. Als eerste gaan we de afbeelding hernoemen: die_another_day.jpg  Iedere afbeelding moet dus een logische naam krijgen. Ook bij het optimaliseren van een webshop moet je gelijk alle afbeeldingen van alle artikelen de naam geven waar mensen op gaan zoeken. Gebruik geen tekens zoals $ % of #. Maak het leesbaar, dan snapt een zoekmachine het ook!

Omdat zoekmachines afbeeldingen indexeren plaats je dit bestand op je webserver in de map /images of /afbeeldingen . Het hele pad ziet er dan ook zo uit:

http://www.denaamvanjewebsite.nl/images/die_another_day.jpg  of 
/afbeeldingen/die_another_day.jpg 

Plaats je deze afbeelding "kaal" in de broncode dan ziet dit er zo uit:

HTML Voorbeeld:

 <img width="290" height="232" src="/images/die_another_day.jpg">

Zichtbaar resultaat:

( ga met je muis over de foto en je blijft het pijltje houden )

 

Afbeelding met de juiste alt tag

 

Dan volgt de volgende stap, het toevoegen van de Alt-tag. In de HTML broncode van je website komt dan het volgende:

HTML Voorbeeld:

<img width="290" height="232" alt="James Bond 007 Die another day 2002" src="/images/die_another_day.jpg" />

Zichtbaar resultaat:

James Bond 007 Die another day 2002

 ( ga met je muis over de foto en je blijft het pijltje houden bij Firefox
  Explorer toont nu de alt tag)

 

Afbeelding met alt tag en title tag

 

Dan volgt de volgende stap, het toevoegen van de title-tag. In de HTML broncode van je website komt dan het volgende:

HTML Voorbeeld:

<img width="290" height="232" src="/images/die_another_day.jpg" alt="James Bond 007 Die another day 2002" title="Die another day met Pierce Brosnan en Halle Berry" />

Zichtbaar resultaat:

James Bond 007 Die another day 2002

 ( ga met je muis over de foto en je ziet de inhoud van de title tag bij zowel
   Firefox alsook Explorer)

Alt of title tag - welke moet je nu gebruiken ?

 

Zowel de alt tag als ook de title tag bij een afbeelding vallen in de categorie attributen. Een attribuut geeft een waarde aan een afbeelding mee die wordt gezien door een webbrowser maar ook door de zoekmachines. De definitie van de alt tag volgens het W3C is een attribuut voor user agents die afbeeldingen niet kunnen zien.

google afbeeldingen zoekerIn het begin van internet (jaren 90) surfden mensen over het internet met een tekst browser. Plaatjes stonden nog niet op alle pagina's. Toen later Netscape kwam met een browser die opgemaakte pagina's kon weergeven bleven veel mensen met de optie "afbeeldingen laden UIT" over het internet surfen. Plaatjes en foto's deden er gewoonweg te lang over om geladen te worden en inbellen met een 14k4 modem en een telefoonlijn hielp ook niet echt. altavista afbeeldings zoekaktieWe kunnen ons dit nu bijna niet meer voorstellen met ADSL, kabel en snel draadloos internet. Een alt-attribuut werd dan ook gebruikt als een user agent, bijvoorbeeld een internet tekst browser, een afbeelding niet kon laten zien. In plaats daarvan wordt dan de alternatieve tekst getoond.

Anno nu blijkt dat zoekmachines die Alt en title tag nog steeds uitlezen. Zoekmachines zoals Google en Altavista (tegenwoordig Yahoo)hebben aparte indexeringen voor afbeeldingen en plaatjes. Andere zoekmachines zullen de tekst in de Alt Tags indexeren als additionele content van een webpagina. Als je de Alt Tags niet gebruikt laat je een ideale kans lopen om relevante trefwoorden nogmaals onder de aandacht te brengen. Het is dus belangrijk dat een zoekmachine snapt wat er staat.

En soms kan je een bezoeker ook wat duidelijk maken door de title tag te gebruiken als hint of advies. Vaak zie je dit terugkomen in een webshop waar een bestel-knop als title meekrijgt: "klik hier om te bestellen"

Bestel direct

 ( ga met je muis over de knop en je de inhoud van de title tag )

 

Een compleet voorbeeld

 

Als je al het bovenstaande toepast zal je merken dat er bezoekers op jouw site terechtkomen omdat ze op zoek waren naar een afbeelding. Dus zorg ervoor dat ook dat stuk van je website op orde is! Hieronder een compleet voorbeeld waarin we alles proberen toe te passen: 

HTML Voorbeeld

<a href="http://en.wikipedia.org/wiki/Daniel_Craig" target="_blank"><img width="250" height="183" border="0" src="/images/Daniel-Craig-as-James-Bond.jpg" alt="Daniel Craig in de rol van secret agent James Bond" id="007, gezicht, foto" title="Link naar Daniel Craig Wiki pagina" longdesc="Daniel Wroughton Craig - born 2 March 1968 - is an English actor and film producer"></a>

 

Zichtbaar resultaat:

Daniel Craig in de rol van secret agent James Bond

 ( ga met je muis over de foto en je de inhoud van de title tag die
   aangeeft wat je kan verwachten als je de foto aanklikt )

Afbeeldingen optimaliseren -  de belangrijkste zaken samengevat

       
Samengevat kun je dus stellen dat de naam van de foto al moet beschrijven wat er te zien is. De alt tag geeft voor de zoekmachines een korte beschrijving van wat er te zien is en de title tag kunnen we gebruiken om de bezoeker van een webpagina aan te zetten tot een actie, bijvoorbeeld een link aanklikken.
  1. Lees verder waarom meta-tags belangrijk zijn en wat zoekmachines er mee doen.
  2. Gebruik de meta-tags generator om juiste meta-tags te maken.
  3. Laat gratis uw website analyseren en krijg professioneel advies van onze experts.
  4. Zorg voor een goede aanmelding bij de zoekmachines en kies 1 van onze pakketten.
       
gratis uitproberen aanmelden zoekmachines BE pakket voor 49 euro aanmelden zoekmachines EU pakket voor 79 euro aanmelden zoekmachines Wereld pakket voor 99,= euro aanmelden zoekmachines
gratis uitproberen België pakket Europa pakket Wereld Pakket
       
alt, tag, title, foto, afbeelding, plaatje, optimaliseren, seo Tags: alt, tag, title, foto, afbeelding, plaatje, optimaliseren, seo
© 2017 - Onderdeel van The MetaTags Company BV - Laatste bewerking: 25-06-2017