Html, immagini, come fare una didascalia semantica seo friendly e come farla responsive.

In questo video è possibile vedere come inserire il tag più aggiornato per l'HTML e più efficace in termini semantici quindi p...

In questo video è possibile vedere come inserire il tag più aggiornato per l'HTML e più efficace in termini semantici quindi per migliorare e ottimizzare la SEO relativa alle immagini

Esempio Tag figcaption

<figure> <img src="urlimmagine.jpg" alt="immagine di esempio"> <figcaption> Esempio didascalia </figcaption> </figure>

Esempio didascalia immagine

Tag picture: come avere immagini Responsive

In quest'altro video è possibile vedere come inserire immagini responsive in in html, l'esempio fatto non è graficamente dei migliori, quello che è importante da capire è che le immagini per i cellulari conviene crearle e impaginarle in verticale, mentre le immagini per il desktop conviene crearle in orizzontale. Questo vuol dire che nel caso di immagini e campagne pubblicitarie, potremmo aver bisogno di immagini impaginate in modo differente in base al device.

Tag picture: esempio.

<picture> <source media="(max-width:400px)" srcset="urlimg-x-cell.jpg" alt="immagine di esempio"> <source media="(max-width:800px)" srcset="urlimg-x-tablet.jpg" alt="immagine di esempio"> <source media="(max-width:1920px)" srcset="urlimg-x-desktop.jpg" alt="immagine di esempio"> </picture>