Questo corso è stato creato sia per gli sviluppatori web principianti che per quelli avanzati, trattando di tutto, dalle nozioni di base su come garantire che le origini delle immagini vengano richieste e visualizzate in modo efficiente ai dettagli di come i formati delle immagini più comuni vengono comunicati da server a client. Con questo corso imparerai a ottenere le dimensioni di trasferimento più ridotte possibili per le tue immagini senza comprometterne la qualità, almeno in modo che nessuno possa essere visto.
Puoi esaminare la serie dall'inizio alla fine per una comprensione olistica di come funzionano le immagini sul web moderno oppure utilizzarla come riferimento per i concetti e i modelli di markup specifici che utilizzerai nel tuo lavoro quotidiano.
Se sei alle prime armi con lo sviluppo web, puoi dare un'occhiata ai corsi Impara HTML per le nozioni di base sull'utilizzo del markup, ai corsi Impara CSS per le nozioni di base sugli stili e ai corsi Impara il Adaptive Design per capire come le immagini verranno visualizzate nei layout adattabili.
Ecco cosa imparerai:
Una breve cronologia delle immagini sul web
Una cronologia di immagini sul web, a partire dall'elemento immagine nel 1993
Principali problemi di prestazioni
Scopri come assicurarti che le tue richieste di immagini abbiano il minor rendimento possibile.
Immagini vettoriali
Scopri di più su SVG, il formato di immagini vettoriali utilizzato sul web.
Immagini raster
Scopri immagini raster, come JPEG, GIF, PNG e WebP.
Formati immagine: GIF
Comprendi il formato delle immagini GIF e spiega come funziona la codifica delle immagini.
Formati immagine: PNG
Scopri quando PNG è il formato immagine migliore da scegliere.
Formati immagine: JPEG
Scopri di più sul formato delle immagini più comune sul web.
Formati immagine: WebP
Scopri di più su WebP e comprendi la differenza tra questo formato e gli altri.
Formati immagine: AVIF
Il formato AV1 Image File Format (AVIF) è una codifica basata sul codec video AV1 open source.
Immagini adattabili
Approfondimento sulle immagini adattabili.
Sintassi descrittive
Utilizzo di srcset e dimensioni per fornire al browser informazioni sulle origini delle immagini e su come verranno utilizzate.
Sintassi prescrittive
Scopri di più sull'elemento immagine.
Automatizzare la compressione e la codifica
Fai in modo che la generazione di origini di immagini ad alte prestazioni sia una parte semplice del tuo processo di sviluppo.
Generatore di siti, framework e CMS
Scopri in che modo CMS come WordPress e altri generatori di siti possono semplificare l'utilizzo delle immagini adattabili.
Reti CDN (Content Delivery Network) di immagini
Scopri come le CDN di immagini sono in grado di trasformare e ottimizzare i contenuti di un'immagine.
Conclusione
Alcune risorse aggiuntive.
Allora, vuoi iniziare a imparare le immagini?