Snelle tip Vergeet niet om uw ALT-tekst op te maken

Het alt-attribuut binnen een tag biedt alternatieve inhoud voor gebruikers die geen afbeeldingen kunnen downloaden of die afbeeldingen helemaal hebben uitgeschakeld. We gebruiken dit kenmerk de hele tijd om onze inhoud toegankelijker te maken, maar heb je er wel eens over nagedacht hoe het er eigenlijk uitziet?

We gebruiken de e-mailsjabloon die we in een eerdere tutorial hebben gebouwd als een voorbeeld, maar de principes zijn net zo goed van toepassing op browsergebaseerd webontwerp.

Als we ons bestand bekijken met afbeeldingen die zijn uitgeschakeld, ziet het er zo uit:

Het is duidelijk dat de ALT-tekst onaantrekkelijk is, vooral de links. We kunnen een paar dingen doen om het op te vrolijken.

Voor de hoofdtekst gaan we de tekst veel groter maken en deze in ons donkerblauwe in plaats van zwart veranderen. We doen dit door stijlen toe te voegen aan het bovenliggende element (in dit geval een cel). Deze stijlen worden vervolgens toegepast op de alt-tags in die cel.

Dit is onze cel:

We voegen wat tekstopmaak toe, zodat het er zo uitziet:

En we stylen onze links naar sociale media zodat ze wit worden:

Simpel als dat! Nu kunnen we erop vertrouwen dat onze e-mail goed wordt weergegeven, zelfs als de afbeeldingen zijn uitgeschakeld.