GOOGLERANK / ITA / COVER / Google-Flash.html

GOOGLE E MACROMEDIA™ SHOCKWAVE FLASH

GOOGLE INDICIZZA I FILE REALIZZATI CON FLASH, OSSIA GLI SWF. COME LI INDICIZZA, LIMITI TECNICI E PRATICI E CONSIGLI PER I WEBMASTER.

UPDATE: SWFOBJECT 1.4

UPDATE:IL PROBLEMA DEGLI SWF "ORFANI" NELLE SERP E SOLUZIONE

Qualche anno fa, con l'uscita di Flash 4, i web designer di tutto il mondo acclamarono questo software come il futuro e definitivo sostituto dell' "obsoleto" HTML. E in effetti, viste le potenzialità, l'assunzione di Flash come standard nello sviluppo web era ben più che un'ipotesi. Nei successivi update, Macromedia concentrò i suoi sforzi per integrare anche l'abilità di estrapolare contenuti da database nelle animazioni shockwave.
Il parsing XML, il Flash Communication Server, integrabilità con ColdFusion: con l'ultima release (8.0) del software, Flash è in grado di sostituire in tutto e per tutto qualsiasi progetto in HTML / PHP / ASP realizzato tradizionalmente.

TUTTAVIA...

...i motori di ricerca (con l'unica, storica, eccezione di FAST) IGNORANO spudoratamente le animazioni Shockwave Flash (*.SWF).

Googlebot, che tra gli spider può considerarsi tra i più evoluti, limita l'analisi degli SWF ai LINK in essi contenuti e (recentemente) ai TESTI.

Negli ultimi due anni quindi, con la corsa ai motori di ricerca -e alla mole di promozione e visibilità gratuita che garantiscono-, il clamore suscitato da Flash si è drasticamente ridimensionato. Rimane un software che permette di realizzare animazioni multimediali strepitose e rimane una tecnologia da cui un certo tipo di progetto non può prescindere: siti di immagine, votati interamente al design, che beneficiano di mezzi di promozione al di fuori dei motori di ricerca (ad esempio siti internet di cantanti e attrici); oppure ancora siti portfolio di web agency che necessitano di esibire al pubblico le proprie capacità.

Se il tuo sito è realizzato in Flash, o contiene parti rilevanti in Flash, realizza una MAPPA DEL SITO IN HTML. Inoltre, sarà utile realizzare una versione alternativa del tuo sito, in una forma più leggera e in html statico, indicizzabile dai motori di ricerca.
Non aprire il tuo sito direttamente presentando la versione Flash. Crea una 'splash page', ovvero una pagina introduttiva in cui l'utente (e Googlebot) possa scegliere se visitare la versione interattiva-multimediale-musicale oppure quella classica html.

Evita di:

1. Redirigere automaticamente il browser in base alla presenza o meno del plugin di Flash. Attualmente pressochè ogni tipo di redirect è nella lista nera di Google.
2. Utilizzare la pagina iniziale (la splash di cui sopra) come 'DOORWAY PAGE'. Non cadere nella tentazione di riempire questo spazio neutro con infinite parole chiave, link e testi nascosti.

Da quando Google sembra aver implementato MACROMEDIA FLASH PLAYER DEVELOPER SDK riesce ad indicizzare i file SWF, estrapolandone LINK e TESTI.
Pur riconoscendo in questa una grande ed utile innovazione, chi lavora in Flash sa che ciò potrebbe voler dire tutto e niente.
Esaminerò ora nel dettaglio queste due abilità, e i limiti ad esse associate.

COME E' FATTO UN SWF

Innanzitutto bisogna precisare gli elementi che compongono un file SWF. I file in questo formato sono l'output di una compilazione di file sorgenti .FLA (file di progetto).
Quando viene esportato il file in formato SWF, Flash comprime i contenuti usando un algoritmo di compressione proprietario. Il Flash player che tutti hanno installato nel proprio browser in sostanza DECOMPRIME le informazioni e ne permette la VISUALIZZAZIONE.

L'algoritmo di compressione, prevede la suddivisione dei contenuti del file in RISORSE ben definite e distinte: le AZIONI (la programmazione in Actionscript e i collegamenti ipertestuali), i TESTI, i FILMATI, le BITMAP, i SUONI e così via.
NB: Lo sviluppatore non deve fare nulla di particolare. La suddivisione in risorse è fatta automaticamente da Flash al momento dell'esportazione in formato SWF.

L'SDK permette di estrapolare tutte le informazioni testuali relative ad un swf. Collegamenti ipertestuali e testi, appunto.

LINK
I collegamenti ipertestuali vengono inseriti nei file SWF tramite una ACTION apposita ossia:

{
getURL("http://www.dominio.it", "_blank");
}

Google, fondamentalmente ricerca tra le risorse di un SWF la voce ACTION, e isola tutti i getURL presenti. In questo modo indicizza i link e li segue.

TESTI
I testi che si utilizzano per la creazione di un file SWF vengono salvati in una sezione delle risorse apposita ("TESTI")

L'informazione relativa ad un testo si compone di varie parti: una dichiarazione del tipo di informazione (text), un identificativo numerico, dati relativi al posizionamento nel movie, e una stringa che contiene il testo effettivo

text string = "Questo è il testo che vede l'utente"


Google, presumibilmente, apre l'swf e cerca la risorsa "TESTI" e ne estrapola le stringhe contenute. Niente di più semplice, visto che anche per le persone normali sono disponibili in Rete svariati decompilatori SWF tramite cui visualizzare le risorse contenute.

Affinchè un testo possa essere reperito come stringa, è necessario che in fase di sviluppo venga inserito come campo testo (statico o dinamico) e non venga convertito in immagine o tracciato (tramite la funzione 'Break Apart'). Nell'ultimo caso sarà inserito nelle Risorse "BITMAP", e non sarà più indicizzato come testo.

LIMITI TECNOLOGICI E PRATICI

Il commento spontaneo è: Google è in ritardo di almeno 3 anni.
Con l'avvento delle connessioni Broadband, le animazioni in Flash nella maggior parte dei casi non sono più semplici sequenze frame by frame di testi volanti e foto fluttuanti. In molti casi i file Swf che vede l'utente sono composti da più filmati caricati separatamente e inglobati nel filmato principale utilizzando Actionscripting apposito ( loadMovie(); ). Non solo. I filmati Flash a volte non richiamano solamente altri filmati al loro interno, ma anche file testuali dinamici: Google non li legge. Così come non legge le informazioni relative ad altri tipi di dati dinamici.

NON CORRISPONDE A VERITA' che affinchè Google possa indicizzare un Swf, il file non deve essere protetto da importazione (opzione "Protect From Import") .

Inoltre, siccome la release più aggiornata del MACROMEDIA FLASH PLAYER DEVELOPER SDK risale a qualche mese fa, gli Swf creati con Flash 8 (e molti realizzati con MX2004), potrebbero non essere indicizzati correttamente.

Il principale limite pratico riguarda i link: nei file Swf i link vengono associati ad un BOTTONE, o ad un FRAME. Comunque sia, come già detto prima, le AZIONI risiedono in una porzione separata del file compresso. In Flash non esiste l'ALT TAG , per intenderci: un link sarà un link che Google seguirà, privato del valore aggiunto che un link testuale o un alternate text di un'immagine può dare. Parallelamente il REL="NOFOLLOW" non è supportato.
Sia in positivo che in negativo, i link presenti negli SWF, seppur indicizzati e seguiti, non hanno lo stesso valore "semantico" che possono avere in una pagina HTML.

Un altro limite, molto simile alle pagine contenute nei FRAMES (quelli html, s'intende), è che Google indicizza e mette nelle Serp il file SWF, senza alcun riferimento alla pagine html che lo contiene. Questo significa: l'animazione si aprirà necessariamente a tutta pagina (con tutte le conseguenze del caso), e sarà slegata dalla pagina Html che la contiene. Una situazione simile appunto alle pagine orfane dei frame e degli Iframe.
Effetto collaterale di questo fenomeno, è che i file SWF avranno un PAGERANK proprio. Una corretta indicizzazione partirà anche e soprattutto da link diretti al file di Flash, oltre al richiamo onpage tramite tag <Object>.

CONSIGLI PER UNA MIGLIORE INDICIZZAZIONE

Fermo restando il consiglio di produrre SEMPRE una versione alternativa del sito in HTML, e di conseguenza una MAPPA DEL SITO:

1. Nella mappa del sito inserire anche l'URL di eventuali file Swf richiamati dal filmato principale e non richiamati da nessuna pagina HTML. Diversamente, Google non troverà quei filmati e non li indicizzerà.

2. Finchè Macromedia non rilascerà una versione più aggiornata dell'SDK, sarà buona norma esportare i progetti in Flash in una versione precedente alla 8. La versione 6.0 è la migliore ai fini di una corretta indicizzazione.

4. Per una corretta indicizzazione dei testi, inserirli sempre in campi testo statici o dinamici - non trasformare i testi in immagini. Per quanto possibile non dividere testi di senso compiuto in più campi testo distribuiti in diversi layer. Google potrebbe non indicizzarli nell'ordine corretto.

5. Google indicizza TUTTI i testi presenti nel filmato. Anche quelli presenti FUORI dallo stage (ossia la porzione visibile all'utente).

6. Google indicizza i link tramite ricerca dei comandi getUrl. Attenzione però che NON seguirà gli indirizzi derivanti da actionscripting, come ad esempio nel caso l'Url da seguire sia generato dinamicamente. Idem vale per i TESTI.

Prima di chiudere la lista dei consigli, farò una prova utilizzando l'SDK di Macromedia, analizzando il file SWF riportato qui sotto e verificando se è possibile trarre qualche informazione supplementare e usarla strategicamente nella produzione di un SWF indicizzabile da Google.

Dettaglio elementi numerati: 1. Testo statico; 2. testo convertito in tracciato; 3. Testo statico inserito come testo dinamico; 4. Link assegnato a bottone classico; 5. Link assegnato a un bottone solo testuale; 6. Link assegnato ad un'istanza di testo.

Il file è stato creato con FLASH 8, ma esportato in versione 6 (MX) per non rischiare errori nella decompilazione. Ogni elemento del file è stato posto su DIVERSI LAYER (fattore determinante, lo vedremo dopo).

UTILIZZO DI MACROMEDIA SEARCH ENGINE SDK

L'SDK è una suite gratuita scaricabile da Macromedia, previa registrazione e sottoscrizione della licenza d'uso.
Scompattato l'archivio flash_search_sdk.zip, apro la cartella Windows e trovo un eseguibile swf2html.exe.L'output di questa operazione sarà in grado di mostrare ciò che vede uno spider quando indicizza un file di Flash, convertendo tutti gli elementi visualizzabili in testi e tag html.

Lancio quindi da DOS l'applicazione e mi compare presentazione e la descrizione dei comandi.

swf2html: Convert SWF to HTML [build 11] Copyright (c) 2002 Macromedia, Inc. All rights reserved.
usage: swf2html [-l][-t][-o outputFile][-p prefixes][-s suffixes]

inputFile -l dumps links only -t dumps text only -o to specify a filename for the output -p to specify a prefixes filter string in the form "pre1|pre2" -s to specify a suffixes filter string in the form "suf1|suf2" use - for inputFile if using stdin for the swf buffer

Indico quindi che voglio creare un file googleflash.html partendo dal file test-google-flash.swf

C:\SDK\windows>swf2html -o googleflash.html test-google-flash.swf

Ecco il file GOOGLEFLASH.HTML , altrimenti detto: "Ecco cosa probabilmente vedrà Google quando indicizzerà il mio swf"

Osservazioni:
a. Il testo convertito in tracciato (2) e il bottone classico (4) sono stati ignorati.
b. l'indicizzazione è stata fatta partendo dal layer più in basso, e finendo con il layer più in alto.
c. Ci sono due informazioni testuali "Googlerank". Questo perchè al bottone testuale (5) sono state assegnati due variazioni di stato (normale e quando ci passa sopra il mouse)
d. I collegamenti a www.googlerank.com, assegnati al bottone (4) e al bottone (5) sono stati separati, e sono scollegati dai bottoni di riferimento.
e. Il testo nel campo statico ha mantenuto le line break del file originario.
f. il testo nel campo dinamico invece non ha line break.
g. In testa alla pagina abbiamo un LINK TESTUALE. Corrispondente al (6): link assegnato ad un'istanza di testo dinamico.

Ritengo sia molto importante soffermarsi sull'osservazione g. Finora si è detto che i link vengono considerati separatamente dai bottoni o dalle istanze cui sono legati. Il che è giusto. Ora però troviamo un link testuale indicizzato dal nostro pseudo motore di ricerca. Spiegherò quindi come è stato realizzato:

CREAZIONE DI UN LINK IN FLASH CHE SIA INDICIZZATO COME LINK TESTUALE DA GOOGLE

Sullo stage, inserire un testo, o una scritta.

nota che questo testo deve essere DINAMICO. Per far ciò, nella finestra delle proprietà seleziona Dynamic text. Sempre utilizzando la finestra delle Proprietà del testo, andremo ad inserire il collegamento ipertestuale:

Chiudo quindi l'elenco dei consigli aggiungendo:

7. Questo è attualmente l'unico tipo di collegamento che Googlebot riesce ad associare ad un TESTO. Ai fini dell'ottimizzazione di un file di Flash ai fini di corretta indicizzazione, è preferibile inserire link di questo tipo.

Puoi scaricare i file sorgenti che ho utilizzato nell'esempio CLICCANDO QUI - E' necessario avere Flash 8

Validazione W3C delle pagine che contengono animazioni Flash

Pochi sanno che il codice che solitamente si usa per incorporare animazioni Flash nelle pagine web comporta la NON VALIDABILITA' del documento secondo le specifiche XHTML 1.0 Transictional. La validazione W3C NON E' NECESSARIA ai fini dell'ottimizzazione e del posizionamento di un sito, ritengo utile suggerire in questo paragrafo dedicato a Flash una soluzione a questo problema.
Invece di usare il solito doppio recall con <OBJECT> ed <EMBED> (per la compatibilità Explorer e Mozilla/Firefox), utilizza questo codice, che è il richiamo standard di un controllo Active-X:

<object type="application/x-shockwave-flash" data="file.swf" width="340" height="200">
<param name="movie" value="file.swf" />
<img src="file.gif" width="340" height="200" alt="descrizione dell'immagine" />
</object>

Ho evidenziato in bold l'IMG SRC che si presenta prima della chiusura del tag OBJECT. Sarà l'immagine che verrà visualizzata se il browser non ha il plugin di Flash installato o ha disattivato gli Active-X. Questo codice funziona con tutti i browser, ad eccezione di quelli testuali (es: Lynx): Explorer, Mozilla, Firefox ecc. E soprattutto è pienamente conforme alle specifiche XHTML 1.0 W3C.
Per vedere un esempio funzionante, visita l'home page INGLESE di GOOGLERANK.COM.

Contenuto Alternativo per utenti che non dispongono del Plugin Flash oppure non possono eseguire comandi Active-X

Per ovviare alla storica incompatibilità Flash / Motori di ricerca E fornire ad utenti privi di Flash dei contenuti leggibili tradizionalmente si usa il tag NOEMBED, posto prima della chiusura del tag EMBED (</embed>).

<noembed>
<h1>Contenuto alternativo</h1>
</noembed>

Tuttavia, il tag NOEMBED E' DEPRECATO nelle specifiche XHTML 1.0 Transitional di W3C e, seppur non sia necessaria validazione e Google indicizzi tranquillamente il contenuto del tag noembed, è consigliabile inserire il contenuto alternativo all'interno del tag object, come suggerito sopra.

AVVERTENZA

Dall'osservazione degli snippet di testo che vengono visualizzati nelle pagine dei risultati, quando tra i risultati c'è un file SWF, e dall'osservazione dell'output HTML generato da Macromedia Search Engine SDK si può ragionevolmente pensare che Google abbia implementato proprio l'SDK all'interno degli algoritmi dei suoi robot.
Non c'è stata comunque mai una dichiarazione ufficiale e non è quindi da escludere che gli ingegneri di Mountain View abbiano sviluppato un decompilatore proprio.
Il quale, proprio a causa dei limiti tecnologici della compressione SWF, non sarebbe comunque in grado di ricavare più informazioni testuali di quante già non ne ricavi l'SDK.

SWFOBJECT 1.4

Precedentemente conosciuto con il nome di Flashobject e rilasciato sotto licenza MIT , è un metodo di embedding in Javascript per oggetti e animazioni realizzate con Macromedia Flash, in maniera semplice e validabile Html/Xhtml 1.0. Il fatto che sia anche search engine friendly rende questo metodo la scelta raccomandata al momento.

Sulle nuove versioni di Internet Explorer questo script permette inoltre la visione di animazioni shockwave Flash senza la preventiva autorizzazione all'esecuzione da parte dell'utente

Il metodo consiste nel richiamare un file -swfobject.js- all'interno della pagina web e incorporare il movie swf usando un semplice scripting javascript.

Sezione HEAD del documento:

Nel BODY del documento:

<div id="flashcontent">
Testo alternativo al movie SWF. Può contenere link, testo formattato, immagini. Questo DIV è sostituito dall'animazione SWF, se scaricata e visualizzata dall'utente
</div>

Per incorporare l'SWF:

<script type="text/javascript"> var so = new SWFObject("movie.swf", "mymovie", "200", "100", "7", "#336699"); so.write("flashcontent"); </script>

dove 200 = larghezza filmato ; 100 = altezza filmato ; 7 = versione Flash utilizzata ; #336699 = colore di sfondo dell'animazione -- i parametri ovviamente vanno modificati a seconda delle caratteristiche del proprio movie

E' possibile inserire ulteriori parametri di controllo del proprio movie, come ad esempio il wmode=transparent.

Di seguito un esempio di embed con qualche parametro in più:

<script type="text/javascript"> var so = new SWFObject("movie.swf", "mymovie", "200", "100%", "7", "#336699");
so.addParam("quality", "low");
so.addParam("wmode", "transparent");
so.addParam("salign", "t");
so.write("flashcontent");
</script>

Passare variabili al movie:

<script type="text/javascript"> var so = new SWFObject("movie.swf", "mymovie", "200", "100", "7", "#336699");
so.addVariable("variable1", "value1");
so.addVariable("variable2", "value2");
so.addVariable("variable3", "value3");
so.write("flashcontent"); </script>

SWFObject 1.4 possiede anche una funzione che permette al movie di caricare variabili partendo da un url dinamico. Tale funzione si chiama getQueryParamValue()
Ad esempio abbiamo un Url di questo tipo:
http://www.example.com/page.html?variable1=value1&variable2=value2

Tramite SWFObject sarà possibile permettere al movie di estrapolare le variabili contenute nell'url usando questo scripting:

<script type="text/javascript"> var so = new SWFObject("movie.swf", "mymovie", "200", "100", "7", "#336699");
so.addVariable("variable1", getQueryParamValue("variable1"));
so.addVariable("variable2", getQueryParamValue("variable2"));
so.write("flashcontent");
</script>

Express Install:

SWFObject supporta la funzione Express Install di Macromedia. Per abilitare il download (aggiornamento) del player adatto al movie che vogliamo incorporare sarà necessario inserire un actionscript all'interno del movie (1° frame)

#include "expressinstall.as"

var ExpressInstall = new ExpressInstall();

if (ExpressInstall.needsUpdate) {

var upgradeMsg = attachMovie("upgradeMsg_src", "upgradeMsg", 1);
upgradeMsg._x = Stage.width / 2;
upgradeMsg._y = Stage.height / 2;

upgradeMsg.upgradeBtn.onRelease = function() {

update ExpressInstall.init(); }

stop(); }

Il metodo di embed tramite SWFObject è molto più semplice di quanto sembri. Fondamentalmente richiede un minimo di pratica e abitudine. A fronte di un javascript che può apparire complesso, i parametri che richiedono un editing manuale sono gli stessi che si modificherebbero utilizzando il metodo classico.
Tutti i file che ti servono per iniziare, inclusi i file di esempio possono essere scaricati direttamente da questa pagina:

SCARICA SWFOBJECT 1.4 ZIP

SWF ORFANI NELLE PAGINE DEI RISULTATI

Il trattamento che Google riserva ai file di Flash è da documenti veri e propri. Come file html, Pdf o Doc, insomma. Indicizzandone testi e collegamenti ipertestuali, gli SWF rientrano a pieno diritto nella lista di filetypes che possono essere suggeriti agli utenti dei motori di ricerca.

Tuttavia nella maggior parte dei casi i file swf sono contenuti in pagine html, che ne regolano dimensioni, menu contestuali, background, eventuali behaviour e interazioni con il browser. Richiamati direttamente i file di Flash si aprono a tutta pagina e perdono gran parte del loro fascino. Privati inoltre della loro pagina di supporto spesso sono useless, per l'utente e per il webmaster.

Ecco quindi che, al pari di FRAMES e IFRAMES orfani, si presenta anche il problema degli Swf orfani. Una soluzione a mio parere efficace è stata trovata 10PEOPLE.NET che con un minimo actionscripting è riuscito a creare un behaviour simile al javascript che ricostruisce il framset originario quando un frame viene direttamente richiamato.

Citando dal blog:

[...] La soluzione utilizza elementi che sono presenti nella pagina HTML ma non quando il flash è visualizzato da solo (ossia quando nell’url compare un file .swf).
Si utilizza il parametro flashvars dell’elemento OBJECT, si imposta una variabile che ho chiamato onpage a true.
Da flash si legge la variabile. Se esiste allora non c’è nessun problema, se invece la variabile risulta undefined allora vuol dire che il flash non ha “l’HTML intorno”. Si fa un redirect in questo caso alla pagina giusta. [...]

Il resto dell'articolo, file di esempio e sorgenti del codice utilizzato sono disponibili qui:
FLASH SWF NEI RISULTATI DI GOOGLE [10People.Net]

RISORSE ESTERNE - REFERENCE

MACROMEDIA FLASH PLAYER DEVELOPER SDK FAQ