ISCRIVITI AI FEED RSS
Vi ripropongo un articolo di Merlinox che presenta una situazione in cui mi sono ritrovata di recente per ovviare a ottimizzazioni seo, che però andavano in contrasto con semantica ed accessibilità. Personalmente mi sono trovata sia a dover invertire la posizione di div verticalmente, mi è capitato di farlo anche in senso orizzontale e solo con l’uso di puro css (vedi siti con menu a sinistra che è usabile ma poco seo).
Secondo alcune teorie SEO, assolutamente testate, pare che la posizione dei contenuti all’interno del HTML sia piuttosto rilevante. Cambiando però punto di vista secondo le teorie dell’usabilità sarebbe buona cosa che il menù di navigazione apparisse prima di tutto. Tali teorie sono riportate anche nel documento di accessibilità della legge Stanca.
Ma sono due cose in contrasto, come fare? Dal punto di vista del codice putroppo non ci sono soluzioni, chi è sopra è sopra, chi è sotto e sotto! Dal punto di vista visuale però possiamo fare qualcosa.
Italianwebdesign© - Da un'idea di Laura Gargiulo - mail:
18 Commenti
Va bene tutto però.. secondo me non va bene, tutto sto casino per invertire 3 elementi?
Ovviamente poi dipende dal sito, ma generalmente abbiamo
h1: logo
ul: nav
h2: header
p: testo
quindi insomma, non mi sembra granchè conveniente. Sicuramente ci sono tanti modi per posizionare un sito comunque a prescindere da questo.
sì parla proprio di invertire dei div, non singoli elementi.
secondo me si può fare tranquillamente solo con i css, senza javascript
anche troiani nella sua guida spiega come invertire l’ordine delle colonne rispetto al flusso dell’html.
Mh, no, non credo serva davvero, tanto più che il nostro seo non mi ha mai chiesto di fare ste cose, quando per esempio mi ha vietato di usare il text-indent:-9999 per i loghi.
Inoltre io ormai nei siti ci piazzo bello bello come prima cosa nel codice (display:none nel css):
<div id="ghost"><a title="vai direttamente al contenuto della pagina" href="#contenuto">vai al contenuto della pagina</a></div>
no, forse non hai capito il senso marco.
per la seo, se la prima cosa che legge è il contenuto (che è cioè la cosa più importante per essa) ci va a nozze.
metti però un layout come quello di questa pagina: a parte che prima di tutto ci sono testata e navigazione (e su questo non ci piove) ma prima del contenuto esce fuori il secondo menu a sinistra. per la seo questo non è buono. ecco che allora ipoteticamente in questo caso io dovrei invertire nel flusso html i due div (facendo comparire quindi prima il div contenuti) e poi riportare alla posizione originaria (che è quella che vedi ora) i due div, tramite i css.
mi sono spiegata?
è appurata questa cosa, abbiamo testato anche con kiwiage: prima vengono i contenuti meglio è per l’indicizzazione. io non l’ho fatta volutamente perchè già è complicato il mio portale, ma se noti in homepage ho volutamente lasciato un layout diverso, dove compare prima il contenuto a sinistra e anche graficamente però, stavolta, ho tenuto i contenuti a sinistra
non so se mi sono spiegata
in quel caso invece di un “salta ai contenuti” sarebbe più utile un “vai al menu”
No a capire ho capito, è che sono uscito un pò fuori
Io son d’accordo che i contenuti hanno la priorità su un layout, che sia 2-3-4 colonne, con i float te la gestisci in modo che il contenuto venga mostrato prima del resto, indipendentemente dalla sua posizione.
Ma da questo, a usare posizionamenti assoluti per invertire elementi, oppure mettere l’header sotto il footer (l’ho vista sul serio sta cosa), mi sembra un pò un estremismo.
sì concordo, se dovessimo fare tutti i siti in funzione del seo a seconda di tutte le sperimentazioni possibili ci sarebbe da impazzire.
sappiate che se vi chiedono una cosa del genere però purtroppo è testata e ve tocca (dare una testata aahhaha)
Nel capitolo sui layout del libro di Troiani ho trovato spiegazioni dettagliate su come invertire l’ordine degli elementi in css sia per layout a 2 che a 3 colonne. Sinceramente non ne capivo il motivo, cioè perchè non metterle direttamente nell’ordine in cui devono apparire già nell’html? Forse una delle situazioni in cui è necessario è proprio questa. Per il layout a 2 colonne non mi sembrava poi neanche tanto complicato, ecco la bellezza dei css!
Sulla fattibilità concordo che che sia fattibile solo con css, sinceramente non parliamo posizione ma di ordine, come sappiamo il float gestisce il flusso della pagina quindi credo sarebbe abbastanza semplice tramite css, senza dover ricorrere a al javascript. Sul farlo non lo so, comprendo l’osservazione sull’ordine degli elementi dal punto di viasta del seo però mi sembra eccessivo intervenire in un sito in esistente in questo modo. Piuttosto credo sia utile pensarci nel momento della progettazione se si vuol tenere conto di questo aspetto.
sì mauro, il punto è che a volte proprio per i problemi visti sopra la cosa è da fare proprio dall’inizio, solo che il flusso deve avere un ordine, l’aspetto un altro, ed ecco che nascono i problemi.
invertire su un sito esistente significa invertire sia flusso sia immagine, e non è il nostro caso infatti.
Ok a tutto, io stesso insegno ai corsi (c’era proprio merlinox) che il contenuto testuale deve arrivare prima possibile, però non scordiamoci che questo era importante una decina di anni fa ed oggi conta, ma non è sicuramente la cosa più importante.
Se si può fare si fa, ma non stravolgerei un sito per questo e onestamente il CSS è più importante per altri aspetti. Inoltre, presto il CSS sarà interpretato (se già non lo è), quindi anche quel sistema andrà a pallino.
Poi, diciamocela tutta, a che serve ottimizzare se poi il visitatore scappa? Lo dice un vecchio SEO, ricordiamo che la cosa più importante non è far arrivare il visitatore… ma vendergli qualcosa (in senso lato). Alcuni siti sono così ottimizzati, che sarebbe meglio sparissero dal Web :p
sottoscrivo, e se lo dici tu che hai tenuto corsi in proposito mi sento molto sollevata. grazie del contributo.
ps ho preso nota dei corsi che tenete, sono aperti a tutti?
Concordo con tutti. Io volevo focalizzare più sulla problematica tecnica che sulla problematica SEO.
Capisco che l’influenza di questa cosa può essere minima (vorrei risentire anche Piersante cosa ne pensa) sul SEO, ma dal punto di vista HTMLlistico, ancora non sono riuscito a trovare una soluzione senza JS. Una piccola sfida, no?
io sono riuscita a portare sopra un div con dimensioni fisse tramite il posizionamento assoluto.
in sostanza nell’html hai un div fluido verticale e sotto un div di dimensioni fisse. con il position absolute riesci a spostarlo sopra molto facilmente così:
position: absolute;
top: 0;
margin: 0 160px 0 -444px;
width: 728px;
height: 90px;
left: 50%;
entrambi i div sono centrati, il secondo è un div contenitore dell’intero sito e ha un semplice:
margin: 0 0 0 -475px;
width: 950px;
border: 0;
padding: 0;
position: absolute;
top: 100px;
left: 50%;
overflow: auto;
utile?
@Merlinox, invito subito Piersante su questo tema. L’esperto dell’ottimizzazione on-site è sicuramente lui (io sono bravo soprattutto sull’off-site), quindi ci rimettiamo al suo parere sull’importanza del parametro in sé.
Ovviamente ai fini dell’esplorazione delle possibilità sono d’accordo con te. Sempre meglio sapere che non sapere.
@Lauryn
Sì, i corsi sono aperti a tutti
Ciao all, e scusate il ritardo.
Allora, posto che gli utenti sono _sempre_ più importanti degli spider e che questi ultimi non hanno la carta di credito, non si relazionano con voi e non cliccano sugli adsense, va detto che la prominenza dei contenuti nel codice ha un certo qual peso, ma inferiore a quello che giustificherebbe una revisione del codice in un sito esistente.
Il fatto è che lo spider, oltre ad avere una fretta fottuta, in determinate circostanze non assorbe sempre tutta la pagina, ma ne prende un pezzetto, tipo 3k. In fase di progettazione è salutare far stare in questi 3k sia i menu navigazionali alle principali categorie che (almeno) un pezzo del testo unico… in modo da comunicare _sempre_ eventuali variazioni al motore, anche se dovesse solo assaggiare la pagina.
Lo stesso risultato si ottiene esternalizzando i js, evitando di lasciare codice commentato oppure compattando il codice come si faceva una volta, togliendo tutti gli spazi vuoti (AAaaarghhh, direte voi pensando all’output… eppure si faceva).
Siccome i sitelink in serp hanno la loro importanza, eviterei di mettere a livello di codice il testo sopra il menu principale.
Cosi’ come, potendo, eviterei di mettere tutti i menu di navigazione con centinaia di link prima del testo…. insomma un po’ di buon senso.
In ogni caso non perderei mai tempo a riscrivere il codice di un sito solo per questa ragione.. diverso è se lo sto progettando ex-novo.
Per tagliare la testa al toro, tra usabilità e seo imho vince sempre l’usabilità con, se possibile, qualche piccola malizia seo. Se non è possibile, per ottenere gli stessi risultati spesso basta un link in più.
My two cents, a presto.
Piersante
grande piersante!!
Sapendo quanto sia preso Piersante, a vedere quanto ha scritto c’è sicuramente da fargli una mezza statua
Trackback
Lascia un commento