Strategie SEO per applicazioni JavaScript

Quando sviluppiamo un sito web utilizziamo spesso JavaScript in quanto è l'ideale per creare siti web innovativi con più funzionalità lato client. Una delle tecnologie più utilizzate è AJAX.
Attraverso quadri Che cosa Jquery, prototipo, Mootools e altri, che consentono di effettuare richieste al server, ricevere il risultato e attivare il caricamento di determinati contenuti sulla pagina senza aggiornare il web e in modo completamente trasparente per l'utente.
Attualmente la maggior parte delle pagine Web mostra una forte dipendenza da JavaScript per creare effetti e funzionalità lato client, questo comporta rischi noti in termini di SEO, problemi di collegamento o incompatibilità, guasti tecnici, velocità di download, ecc.
Vedremo in questo tutorial alcuni strategie per lo sviluppo di siti Web e applicazioni AJAX evitando di avere problemi nel ramo SEO.

Vantaggi e svantaggi dell'utilizzo di AJAX


I vantaggi in termini di user experience sono evidenti: pagine veloci, minor overhead per il server che elabora solo l'ordine e restituisce il contenuto che è necessario per l'utente. Molte funzionalità web di nuova generazione non sono facilmente eseguibili senza l'uso di JavaScript o Jquery poiché prevede la necessità per l'utente di fare clic su un elemento del web e per il browser di non aggiornare l'intera pagina ma solo un blocco di contenuto e persino visualizzare informazioni diverse per utenti diversi.
Lo svantaggio è che il contenuto restituito potrebbe non essere visibile ai motori di ricerca e il bot spesso non analizzerà il codice Jquery o Ajax. Un problema è che il contenuto di una pagina è visibile solo al browser, ma non sul server, il modo di tracciamento dei robot può far sì che non vedano alcuni contenuti o che alcuni collegamenti falliscano poiché il robot non può capire JavaScript che sono molto complessi .
Google ha continuamente evoluto le capacità di scansione Ajax e Javascript dei suoi robot, mentre Bing e Yahoo non si sono evoluti molto.
Anche i motori di ricerca non possono rappresentare con precisione il contenuto più pertinente per una query di ricerca, quindi un uso eccessivo di questa tecnologia può portare a un posizionamento scadente nei risultati di ricerca.

Esempi di elementi e blocchi html che migliorano la SEO


Se dobbiamo creare un blocco, applichiamo alle classi dei nomi semantici, cioè con un senso che ne descriva il contenuto:
Esempio un blocco che mostra alcuni contenuti
Sarebbe meglio dare un senso più semantico a ogni blocco di codice html in modo che i robot possano capire che contenuto mostreranno:
La struttura è chiara da tracciare anche se il contenuto non è stato generato nell'HTML. Poiché il markup semantico contiene parole chiave, è importante utilizzare tag HTML appropriati per il contenuto, in caso di dubbio possiamo consultare il manuale Html di W3school.
Come gli elenchi ordinati o non ordinati, uno scopo degli elenchi di definizione è visualizzare l'elenco dei contenuti mirati, come nel caso precedente, potrebbe essere una notizia o un elenco di prodotti. Ciò consente una maggiore densità di parole chiave, meno confusione nel codice.
Uno degli aspetti più importanti è che il contenuto che Javascript genera per l'utente è lo stesso contenuto esattamente lo stesso di quello mostrato ai motori di ricerca o ai robot di ricerca.
Google indica come possibile soluzione che se il nostro sito Web include tecnologie a cui i motori di ricerca non possono accedere o non possono interpretare, come JavaScript o Ajax, allora dobbiamo utilizzare testo descrittivo o segnalibri in modo che questi elementi possano mostrare quale contenuto corrisponderebbe. migliorare così l'accessibilità del sito. Molti utenti utilizzano dispositivi mobili, browser non standard, software obsoleti e connessioni lente, quindi potrebbero avere problemi durante la visualizzazione di contenuti o l'utilizzo di alcune funzionalità.

Collegamenti e parametri per URL


Google preferisce usare il hashbang come parametro in un URL, perché in questo modo sarà più facile interpretare i tuoi collegamenti quando passiamo un hastabang al sito come parametro.
Un esempio ampiamente utilizzato è sul sito web di Twitter. Google lo utilizza per conservare e richiedere il contenuto di quella pagina statica. Per mostrare cosa contengono gli URL riscritti, ecco alcuni esempi:
Questo URL generato da alcune query è SEO migliore e più semantico
www.miweb.com/#!madrid/productos
Questi due URL sono più difficili da capire per i robot, ma senza dubbio l'ultimo migliora un po' la semantica.
www, miweb, com /? tmp = madrid / prodotti
www.miweb.com/?ciudad=madrid&seccion=productos
Finché possiamo fare SEO semantico per i contenuti generati e mostrare lo stesso contenuto che un utente vedrebbe nei motori di ricerca, questo non è un grosso problema.

Barre di navigazione e schede a scorrimento


Nel caso in cui il contenuto sia distribuito in schede, dove il contenuto cambia utilizzando jquery o un altro framework a seconda della scheda in cui ci posizioniamo, deve esserci un url indipendente per ogni scheda, quando l'utente fa clic su una scheda una richiesta può essere fatto anche al server per generare contenuti completamente nuovi. La struttura di ciascun collegamento potrebbe essere qualcosa del tipo:
www.miweb.com?tab= vendite
www.miwebe.com/?tab=clientes
www.miweb.com/?tab=productos
Il trucco con le schede è prodotto con CSS e Javascript, il server restituisce il contenuto di tutte le schede con la richiesta della prima pagina. Quando l'utente clicca su una scheda, le classi definite in CSS fanno sì che il browser nasconda il contenuto associato a una scheda e mostri solo il contenuto relativo alla scheda cliccata, mentre le altre sono nascoste, ma sono nel codice questo è consentito , quindi è bene dare un senso semantico alla struttura.
È anche molto importante non consentire la scansione di file Javascript o CSS in robots.txt del nostro sito Web in quanto può danneggiare il posizionamento e l'indicizzazione dei tuoi contenuti e può comportare il fallimento delle statistiche di scansione.
Una delle linee guida di webmaster di Google Dice specificamente di non consentire il tracciamento di questi file ma nemmeno di bloccarli o nasconderli dai bot.

Strumenti per i Webmaster di Google per verificare e analizzare la scansione


Strumenti per i Webmaster di Google ci dà l'opportunità di informare google, verificando la proprietà del nostro sito web. Accedi con il tuo account Google o Gmail e poi potremo verificare il nostro sito web.

Una volta verificata la proprietà, il sitemap.xml per avviare la scansione del sito, quindi Google inizierà a indicizzare i tuoi URL.
Il robot impiega circa due settimane affinché i link vengano visualizzati correttamente in Ricerca Google.
Non esiste un modo semplice per assicurarsi che tutto funzioni, ma ci sono alcuni strumenti per aiutarti a vedere cosa sta succedendo. La cosa migliore è utilizzare lo strumento Esplora come Googlebot, che ci mostra esattamente cosa vede Google durante la scansione del sito web. Puoi accedere a Strumenti per i Webmaster di Google in Diagnostica.
Utilizzando gli strumenti di Google per Webmasters Tools possiamo controllare i link indicizzati e correggere o eliminare questi link in modo che il tuo sito web sia ottimizzato per i motori di ricerca e abbia link senza pericolo di essere penalizzato che ti aiutino a migliorare il tuo SEO, tra le altre funzionalità.Ti è piaciuto e hai aiutato questo Tutorial?Puoi premiare l'autore premendo questo pulsante per dargli un punto positivo

Aiuterete lo sviluppo del sito, condividere la pagina con i tuoi amici

wave wave wave wave wave