Sommige Dingen Over de `alt` – Tekst

0
83

Ik ben er zeker van dat u weet over de alt-tekst. Het is het kenmerk van de image-tag dat heeft de belangrijke taak om te beschrijven wat dat beeld is voor iemand die niet kan zien om welke reden dan ook. Gebruik ze.

Ik wil niet dimish het gebruik van hen bericht, maar een aantal interessante alt-tekst-gerelateerde dingen zijn gekomen in mijn dag-tot-dag van de laatste tijd die gerelateerd zijn.

Wanneer u niet

Hidde de Vries schreef, Je hoeft het niet altijd nodig hebben alternatieve tekst kort:

Maar als een pictogram is een woord ernaast, bijvoorbeeld ‘Log uit’, het icoon zelf is decoratief en is het niet nodig een alternatieve tekst:

<button type=”button”><img src=”sluiten.svg” alt=”” /> Sluiten</button>

In dit geval kunnen we verlaten het alt attribuut leeg, want anders van een screenreader zou aankondigen ‘knop sluiten sluit’.

Ik zou denken dat in een perfecte wereld, omdat dat het icoon is geheel decoratieve dat de toepassing van de via CSS zou ideaal zijn, maar het punt staat: als u een afbeelding gebruikt, de alt-tekst doet meer pijn dan dat het helpt hier.

We kunnen het gratis krijgen?

Computers zijn pretttttty slimme deze dagen. Misschien kunnen ze kijken naar onze foto ‘ s en beschrijvingen zonder ons handmatig in te typen.

🔥 Ik denk dat ik gebruikte machine leren om aardig te zijn voor mensen! In deze proof of concept, ik ben het maken van dynamische alt-tekst voor schermleesprogramma ‘ s met Azure de Computer Vision API. 💫https://t.co/Y21AHbRT4Y pic..com/KDfPZ4Sue0

— Sarah Drasner (@sarah_edo) 13 November 2017

Sarah ‘ s demo maakt gebruik van een Computer Vision API om dat te doen.

Wat over figcaption?

Ik haat om het te zeggen, maar ik ben niet zo goed in het schrijven van de alt-tekst beschrijvingen voor afbeeldingen in blogposts hier op CSS-Tricks. Het is een probleem dat we moeten oplossen met veranderingen in het proces. We doen vaak gebruik <figcaption> hoewel het om tekst toe te voegen die is gerelateerd aan een afbeelding. De manier waarop tekst wordt vaak gemaakt voelt als alt-tekst tot mij. Het beschrijft wat er gaande is in de afbeelding.

Ik vroeg rond over deze en Zell Liew vertelde me dat hij hetzelfde doet:

Ik heb eigenlijk dezelfde vraag. De meeste van mijn figcaptions zijn gebruikt voor het beschrijven van het beeld, zodat de lezers begrijpen wat het beeld is over.

In mijn gedachten, ik dacht dat het nog erger zou zijn om de exacte kopie van de figcaption in de alt-tekst, als iemand die aan het lezen was alt-tekst zou dan wezen lees de beschrijving tweemaal.

Ik heb ook gesproken met Eric Bailey, die had een interessant idee.

<afbeelding>
<img src=”screenshot.png” alt=”Screenshot van Chrome het weergeven van een split view. Aan de linkerkant is een pagina vol met miniaturen de vergelijking van de pre-en post-optimalisatie bestandsgrootte. Aan de rechterkant is Chrome developer tools tonen verf rasteren duur voor de foto ‘ s. Met een 6x CPU-vertraging, de langste Verf Raster nam 0.27 ms, AKA 0.00027 seconden.”>
<figcaption aria-hidden=”true”>
Met een 6x CPU-vertraging, de langste Verf Raster nam 0.27 ms, AKA 0.00027 seconden.
</figcaption>
</figure>

Deze:

  • Behoudt figuur styling
  • Vermijdt nulling alt, die problematisch kunnen zijn voor sommige schermlezers
  • Houdt de beschrijving sluit aan op de inhoud en communiceert wijs SR gebruikers
  • Communiceert belangrijke meenemen visuele lezers zonder dat het lezen voor SR gebruikers
  • Gebruikt een aria hotel is ontworpen om te worden gebruikt buiten vormen

Ik wil benadrukken, dat hij beschouwde deze slechts een idee dat het niet zwaar is goedgekeurd door de grotere toegankelijkheid van de gemeenschap. Als er een van jullie te lezen, wat denk je?

Eric ‘ s demo gebruikt een meer uitgebreide alt-tekst dan de figcaption, maar het lijkt alsof het patroon is goed, zelfs als ze identiek waren.

Kleine herinnering: heeft alt-tekst

Maar je moet de functie in te schakelen.