Con gli iFrame in HTML puoi incorporare contenuti di altri siti nella tua pagina. Questo può portare dei vantaggi, ma in ottica SEO è utile usarli con moderazione.
Immagina d’inserire in un’immagine grande un’immagine più piccola: proprio in questo modo funzionano gli iFrame in HTML. Il termine iFrame è il diminutivo di “Inlineframe” e indica la possibilità di integrare il contenuto di un alto sito nel tuo.
Come funzionano gli iFrame in HTML
Gli iFrame vengono usati soprattutto per inserire immagini, video o banner pubblicitari da siti esterni nel proprio sito.
Appaiono per esempio nel modo seguente:
<iframe width="560" height="315" src="https://www.youtube.com/watch?v=qu-nR1jj9yk" frameborder="0" allowfullscreen></iframe>Il contenuto si può adattare con variabili come “height” e “width“. Dall’introduzione di HTML5 inoltre è disponibile anche l’attributo “allowfullscreen” che puoi vedere nel nostro esempio: esso ti permette di adattare i video incorporati alle dimensioni dello schermo. Nell’insieme però, le possibilità di adattamento sono limitate.
Fin qui, tutto bene. Ma a cosa sono effettivamente utili gli iFrame?
Pro e contro degli iFrame
Gli iFrame hanno i seguenti vantaggi:
- Siccome si tratta di contenuti esterni, non richiedono uno spazio di archiviazione nel tuo sito, cioè non influiscono sul caricamento delle pagine;
- Incorporare contenuti in questo modo è facile e richiede poco sforzo;
- Gli utenti non devono passare ad un’altra pagina per vedere un video.
Tuttavia, gli iFrame in HTML hanno anche degli svantaggi:
- Non hai alcun controllo sui contenuti esterni e sulle loro funzionalità. Troppi iFrame ad esempio limitano di molto l’adattabilità delle pagine;
- Nel peggiore dei casi, gli iFrame in HTML rappresentano un rischio per la sicurezza. I contenuti infatti potrebbero essere oggetto di phishing senza che tu te ne accorga. A ciò si aggiungono le preoccupazioni per la protezione dei dati (ad esempio, i plug-in dei social media raccolgono in parte i dati degli utenti);
- Non puoi inserire Bookmark o link ai contenuti;
- Gli iFrame vengono rappresentati in modo diverso dai vari browser.
Gli iFrame in HTML e la SEO
Chi usa gli iFrame in HTML dovrebbe essere consapevole degli effetti che questi hanno sulla SEO.
Il problema è che gli effetti non possono essere previsti.
Si pensa che Google non attribuisca il contenuto degli iFrame al sito web circostante. Tuttavia, Martin Splitt ha spiegato in un hangout per webmaster sul tema JavaScript che questo può comunque succedere, ad esempio nel caso di un frame di grandi dimensioni. Non è chiaro però che cosa ciò significhi per l’indicizzazione e i ranking.
Teoricamente c’è persino il rischio che Google preferisca la pagina con l’iFrame per il contenuto in questione rispetto all’originale.
A questo si aggiunge un altro svantaggio, cioè che molti iFrame possono compromettere l’usabilità del sito.
Consiglio: per testare se Google associa il contenuto iFrame alla pagina circostante, puoi usare il Mobile Friendly Test Tool. Se il contenuto appare nella versione renderizzata, può essere che il motore di ricerca preferisca la pagina iFrame all’originale.
Usare gli iFrame con moderazione
L’uso degli iFrame è allettante, ma da gustare con parsimonia. In alcune circostanze infatti può portare a dei problemi lato SEO e ad una peggiore usabilità, senza contare i rischi per la sicurezza e la protezione dei dati. Tutti questi svantaggi hanno già fatto perdere popolarità agli iFrame.
A proposito: se vuoi evitare che il tuo contenuto appaia in un iFrame, puoi utilizzare le opzioni X-Frame nell’header della risposta HTTP. In questo modo prevenirai lo scenario peggiore, cioè che Google preferisca una pagina sconosciuta ai tuoi contenuti.
