La pagina web perfetta

Sommario:
Questa pagina è una continuazione della guida Come creare un sito da zero

Per prima cosa, iniziando a scrivere questa guida, vorrei farvi conoscere l'incubo di tutti i webmaster e che risponde al nome di "Validatore". Cos'è il validatore? Il validatore è lui >>>> Markup Validation Service. Un servizio online per la verifica del codice html e che segue le direttive della versione più recente del codice html stesso. 
In pratica, incollando il codice di una pagina nello spazio predisposto e cliccando poi su "Check", il sistema evidenzia gli eventuali errori presenti.

Detto questo, come si può fare per ottenere questa agognata risposta dal validatore?

"Document checking completed. No errors or warnings to show."

Vediamo, insieme di costruire la "pagina perfetta", quella, cioè che rispetta tutte le regole pur contenendo tutte le funzionalità che servono. Naturalmente non ci baseremo solo sul responso del validatore, ma ci preoccuperemo anche di ottimizzare il codice per avere una buona velocità di caricamento e affichè la navigazione sia scorrevole, nonchè perchè tutto il sito sia conforme alle norme di legge.

Faremo una specie di "radiografia" di una pagina web esaminandola punto per punto, dall'alto al basso e aggiungendo spiegazioni e guide dove necessario.

NOTA: per scrivere in linguaggio html utilizzando la corretta sintassi, la cosa più semplice è utilizzare un editor di testo per sviluppatori. Il mio preferito è Froala, che potete usare sia online, sia scaricandolo sul vostro computer.

Apertura della pagina web

Premessa: notate che ogni informazione viene racchiusa tra < e >.

Tutte le pagine web sono introdotte dal:

<!DOCTYPE html>

Che significato ha? 
È la "Document Type Declaration" e serve ad indicare al browser quale versione del linguaggio HTML (HyperText Markup Language) stiamo usando. Dall'avvento di HTML5, è sufficiente scrivere, appunto, DOCTYPE html, senza necessità di aggiungere altro.
Sotto al doctype, troviamo il tag <html> che può avere alcuni attributi di cui il primo è la dichiarazione della lingua del sito:

<html lang="it">

Se utilizzate i dati strutturati, o microdati (poi vedremo cosa sono) è necessario anche aggiungere l'autorizzazione per gli stessi, così:

<html lang="it" itemtype="http://schema.org/WebPage">

La categoria "WebPage" piuttosto che un'altra, dipende dalla tipologia della pagina stessa. Ci sono innumerevoli categorie e sottocategorie che possono essere inserite. Ecco l'elenco completo: http://schema.org/docs/full.html.

Ed ecco che potete leggere la prima guida specifica:
"I dati strutturati".

Proseguiamo:

I metatag

I metatag servono per fornire informazioni ai browser e ai motori di ricerca. Ci sono molti tipi di metatag e, probabilmente, molti di essi non servono, ma alcuni di loro, invece, sono importanti e fondamentali. Vediamo quali.

NOTA: è molto importante che alle voci equivalenti corrispondano i medesimi contenuti nei diversi metatag, altrimenti potrebbero crearsi dei conflitti. Per esempio, se alla voce "title" del metatag principale del sito scrivete "Guida", dovete scrivere la stessa cosa identica anche nel metatag dei social che si riferisce al title.

I metatag importanti:

L'importanza dei metatag è stata spesso messa in discussione.
<meta charset="utf-8">  indica il set di caratteri che viene utilizzato. E` sempre consigliato usare il set utf-8, perchè semplifica la gestione dei caratteri stessi.

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/> serve a forzare Internet Explorer a mostrare la pagina nel modo, per lui, più recente possibile e a utilizzare la tecnologia di rendering di Google Chrome.

<meta name="viewport" content="width=device-width, initial-scale=1"> serve per l'ottimizzazione sui dispositivi mobili. Il metatag dice al browser di utilizzare, come larghezza della pagina, la larghezza effettiva del dispositivo.

<meta name="description" content="qui mettete la descrizione"> descrizione del contenuto della pagina che appare nei risultati di ricerca. Lunghezza consigliata circa 155 caratteri (spazi compresi).

<meta name="author" content="qui mettete il nome dell'autore"> nome dell'autore della pagina.

Altri metatag:

<meta name="robots" content="noindex">

<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate"/>
<meta http-equiv="Cache-Control" content="max-age=3600, public"/>

Il metatag noindex serve per comunicare ai motori di ricerca che non volete che una determinata pagina venga scansionata e, quindi, indicizzata.
Su pagine singole e per questo scopo, fa le veci del file robots.txt.

Il primo dei metatag Cache-Control stabilisce che una determinata pagina non deve essere archiviata nella cache browser. I comandi no-cache e no-store si equivalgono, anche se con sottili differenze, ma, dato che alcuni browser interpretano meglio uno o l'altro, si consiglia di metterli entrambi. Il comando must-revalidate indica al browser di non riutilizzare una risorsa obsoleta prima di riconvalidarla con il server.

Il secondo dei metatag Cache-Control stabilisce per quanto tempo il browser deve conservare la copia in cache della pagina dopo averla caricata. Il tempo deve essere espresso in secondi.
Esempio:

max-age=60 equivale ad 1 minuto
max-age=3600 equivale ad 1 ora
max-age=86400 equivale ad 1 giorno
max-age=604800 equivale ad 1 settimana
max-age=2628000 equivale ad 1 mese
max-age=31536000 equivale ad 1 anno
max-age=0 equivale alla non archiviazione in cache e può essere utilizzato al posto del metatag no-cache.

Il comando public indica che la risorsa può essere memorizzata da qualunque cache di qualunque browser.

Se l'impostazione della cache non è presente, tutti i browser, dopo aver caricato una pagina per la prima volta, ne salvano una copia nella propria cache. Questo ha il vantaggio di migliorare la velocità di caricamento successivo.
Il vantaggio, però è tale solo se la pagina non viene aggiornata frequentemente. In caso contrario, diventa uno svantaggio, perchè il browser del visitatore, invece di mostrare la pagina aggiornata, mostra la vecchia copia in cache.

In alternativa, è possibile usare questo metatag:

<meta http-equiv="expires" content="Sun, 03 Jan 2017 9:04:00 GMT" />

La cui funzione è quella di stabilire una data precisa a partire dalla quale la pagina deve essere ricaricata.
Per spiegare meglio: mettiamo che abbiate appena modificato una pagina. Guardate l'ora e impostate il metatag con scadenza dopo 5 minuti, giusto per avere un margine. Cosa succede? Succede che i browser dei visitatori, che avevano già in cache la versione precedente di quella pagina, leggeranno la data e ricaricheranno la pagina con la nuova versione. La nuova versione sostituirà la vecchia nella cache.
Attenzione: solo i browser che hanno in cache una versione della pagina precedente alla data stabilita la ricaricheranno. Se un browser ha caricato la pagina dopo quella data e ha, quindi, la nuova versione già in cache, la manterrà fino al giorno in cui voi cambierete nuovamente la data. Qual'è il vantaggio? Che non escludete completamente l'archiviazione in cache, che ha un suo perchè, però i visitatori vedranno sempre la versione aggiornata delle pagine.
La data deve essere scritta esattamente come vedete sopra. Di seguito le abbreviazioni dei giorni della settimana e dei mesi in lingua inglese:

Giorni:

Monday = Mon (lunedì)
Tuesday = Tue (martedì)
Wednesday = Wed (mercoledì)
Thursday = Thu (giovedì)
Friday = Fri (venerdì)
Saturday = Sat (sabato)
Sunday = Sun (domenica)

Mesi:

January = Jan
February = Feb
March = Mar
April = Apr
May = May
June = Jun
July = Jul
August = Aug
September = Sep
October = Oct
November = Nov
December = Dec

NOTA: il metatag expires, per il controllo della cache, è deprecato in HTML5, ma non si trova, al momento, un'alternativa valida.

AGGIORNAMENTO (al 11.04.2018): il browser Chrome non supporta, al momento, i metatag per il controllo della cache e imposta sempre le regole di default date dal server.
La soluzione del problema sta nell'utilizzare gli "http headers", cioè messaggi scambiati tra browser e server. Gli "http headers" sono regole particolari scritte nel file ".htaccess".
In particolare, per il controllo della cache, vengono implementate come in  questo esempio:

<IfModule mod_headers.c>

<FilesMatch "\.(html)$">
Header set Cache-Control "max-age=0, no-cache, no-store, public"
Header set Pragma "no-cache"
Header set Expires 0
</FilesMatch>

<FilesMatch "\.(jpg|jpeg|png|gif|js|css)$">
Header set Cache-Control "max-age=86400, public"
</FilesMatch>

</IfModule>

Come vedete, la prima regola imposta a zero la durata della cache per i file html. Ci sono diversi tipi di scrittura per rendere la regola valida per tutti i browser.
La seconda regola imposta ad un giorno la durata della cache per altre estensioni di file.
Potete aggiungere, togliere, o modificare le regole secondo le vostre esigenze, come pure le estensioni dei file.

La compilazione di un file .htaccess richiede competenza. Raccomando, quindi, di consultare l'assistenza tecnica del servizio di hosting per avere supporto.

NOTA: configurando la gestione della cache per il file.css, dovete considerare che le eventuali modifiche apportate alle regole non verranno visualizzate fino alla scadenza del tempo impostato. Trovate una soluzione all'inconveniente nella guida: Il foglio di stile


Insieme a questi metatag troviamo anche il tag "title", che contiene il titolo della pagina. 

<title>Titolo pagina</title>

Dato che ci troviamo nella zona head, che è la zona del codice non visibile nel browser, si può immaginare che questo non sia il titolo della pagina che appare insieme al contenuto, ma bensì il titolo che appare, in alto, nella scheda aperta dal browser ed è anche il titolo che viene letto e indicizzato dai motori di ricerca.

Sempre qui, troviamo anche il collegamento per la favicon.

<link rel="icon" href="img/favicon.ico"/>

La favicon è la piccolissima icona che si vede di fianco al titolo della pagina nella scheda del browser. Per come creare la favicon, vi rimando alla guida "Come creare una favicon per il sito".

I metatag per i social network:

L'importanza dei social network non è da sottovalutare se volete far conoscere il vostro sito web e aumentare le visite.
È possibile fornire indicazioni ai social affinchè la condivisione degli articoli avvenga con il trasferimento dei dati corretti.
Ci sono diversi tipi di metatag che possono essere implementati a questo scopo, con sintassi differente. Io vi indicherò i principali:
<meta property="og:type" content="article" />
<meta property="og:title" content="titolo della pagina" />
<meta property="og:description" content="breve descrizione del contenuto" />
<meta property="og:url" content="indirizzo della pagina" />
<meta property="og:image" content="indirizzo dell'immagine da visualizzare nei post" />

Questi metatag vengono letti e interpretati dai principali social.
Il primo metatag "og:type" indica il tipo di contenuto della pagina. Nell'esempio ho messo "article", che è quello maggiormente utilizzato, ma, se volete essere più specifici, esiste un elenco di voci supportate.
Alcuni esempi tra quelli più popolari:
  • website
  • article
  • blog
  • book
  • game
  • movie
  • food
  • city
  • country
  • actor
  • author
  • politician
  • company
  • hotel
  • restaurant
NOTA: Per la home page, dovete mettere "website".

In aggiunta, si possono inserire dei metatag specifici per Twitter:
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="titolo della pagina">
<meta name="twitter:description" content="breve descrizione del contenuto">
<meta name="twitter:image:src" content="indirizzo dell'immagine da visualizzare nel tweet">

NOTA: I dati relativi a title e description, inseriti per i social, devono corrispondere a quelli inseriti per i motori di ricerca. Le immagini indicate nei relativi metatag, per i link da condividere, devono avere dimensioni minime di 600 x 315 px (consigliato 1200 x 627 px). Queste sono le misure richieste da Facebook, che è il più esigente, ma dovrebbero accontentare tutti, anche se ogni social ha le sue regole personali e specifiche.
È possibile effettuare la verifica dei metadati, dopo la pubblicazione, tramite questi strumenti:


https://developers.facebook.com/tools/debug
https://cards-dev.twitter.com/validator
https://developers.pinterest.com/tools/url-debugger/
https://www.linkedin.com/post-inspector/inspect

NOTA: Dopo la prima validazione in FB, per aggiornare i dati bisogna cliccare su "Esegui lo scraping di nuovo". Pinterest e Twitter richiedono espressamente la validazione per abilitare la funzionalità dei metatag. Il validatore di Pinterest non valida la home page del sito.

Pagine in più lingue:

Se create versioni in due o più lingue di una stessa pagina, è bene segnalare a Google che tali versioni si riferiscono alla stessa pagina tradotta. Questo offrirà una migliore esperienza di navigazione agli utenti e favorirà il posizionamento della pagina nella ricerca.
Ora, mettiamo che abbiate una pagina del vostro sito, in italiano, che chiameremo genericamente "pagina" e poi abbiate la stessa pagina tradotta in inglese che chiameremo genericamente "page". La segnalazione si effettua inserendo i collegamenti reciproci in entrambe le pagine.

Nella pagina in italiano metterete:

<link rel="alternate" hreflang="it" href="https://www.nomesito.com/pagina" />
<link rel="alternate" hreflang="en" href="https://www.nomesito.com/page" />

Nella pagina in inglese metterete:

<link rel="alternate" hreflang="en" href="https://www.nomesito.com/page" />
<link rel="alternate" hreflang="it" href="https://www.nomesito.com/pagina" />

Per approfondimento: https://support.google.com/webmasters/answer/189077?hl=it

Il tag <noscript>:

Può capitare che nel browser di un visitatore sia stato disabilitato javascript. In questo caso, molte funzionalità del sito potrebbero non risultare disponibili, l'aspetto grafico potrebbe essere alterato, o, addirittura, la navigazione stessa diventare impossibile. Se il vostro sito dipende in maniera stretta da javascript, potete utilizzare il tag <noscript> per informare i visitatori, o per inserire regole di stile particolari, o, ancora, per sostituire dei contenuti. Per esempio, nel caso di uno slideshow basato su javascript, potreste sostituirlo con un'immagine statica. Ciò che viene inserito tra questi tag, sarà attivato solo ed esclusivamente nel caso in cui il browser dell'utente abbia javascript disabilitato.

L'esempio che segue mostra un messaggio di avviso:
<noscript><div style="text-align:center">Attenzione! JavaScript &egrave; disabilitato nel tuo browser.<br>Per poter navigare su questo sito lo devi attivare. Grazie</div></noscript>

Il tag può essere posizionato sia nella zona <head> che nella zona <body> del codice della pagina. Se lo mettete nella zona <head>, apparirà sopra a tutti i contenuti. Se lo mettete nella zona <body> apparirà esattamente dove si trova.
È supportato da tutti i browser.

Il collegamento al foglio di stile

È ora di inserire il collegamento al foglio di stile del sito (css) che, come avete già appreso, contiene tutte le impostazioni che determinano l'aspetto grafico.
Dato che contiene tutte le informazioni necessarie per definire l'aspetto del sito, il suo ruolo è fondamentale e indispensabile.
Vediamo la seconda guida specifica:
"Il foglio di stile"
.
I fogli di stile possono essere anche più di uno. Se servono per il layout del sito, devono essere messi in alto, per primi, dopo i metatag, affinchè vengano letti e caricati immediatamente dal browser.
Altri fogli di stile, invece, che non devono necessariamente essere caricati subito, possono essere posti in basso, prima della chiusura di body, in modo da non rallentare il caricamento della pagina. Il foglio di stile si carica con la stringa:

<link rel="stylesheet" type="text/css" href="file.css" />

dove al posto di "file" metterete il nome del file e il percorso nel caso si trovasse in una sottocartella.
Tra i fogli di stile è importante mettere anche quello riguardante il banner per il consenso dei cookie per essere in regola con la Cookie Law europea. Anche questo deve essere posto in alto.

E siamo alla terza guida specifica:
"Come adeguare il sito alla Cookie law"
.

Il collegamento ai file javascript:

Ora che avete implementato i fogli di stile, dovete implementare i file js (javascript). I file js possono essere richiamati nella zona head, oppure nella zona body. A questo scopo bisogna distinguere due categorie:
  1. Script che servono alla corretta visualizzazione del sito e alle funzionalità immediate.
  2. Script secondari che servono per differenti funzionalità.
La prima categoria di script deve necessariamente essere richiamata nella zona head per poter essere caricata e letta subito dal browser.
Il richiamo della seconda categoria, invece, verrà messo subito prima della chiusura del tag body, in modo da non rallentare inutilmente il caricamento della pagina.
Ecco, quindi, che nella zona alta metteremo, per esempio, il richiamo dello script per il consenso dei cookie.
Tutti i file esterni js vengono richiamati con una stringa come questa:

<script src="file.js"></script>

Dove al posto di "file" metterete il nome del file e il percorso nel caso si trovasse in una sottocartella.
Oltre agli script specifici per il funzionamento del sito web ci sono alcuni script utili per risolvere determinati problemi di visualizzazione che potrebbero verificarsi con browser minori, o con browser datati, o non aggiornati. Nella maggior parte dei casi ci si riferisce a Internet Explorer 9 e precedenti.
Vediamo per esempio:

html5shiv.js che serve a permettere il riconoscimento degli elementi di html5 nelle vecchie versioni di IE.
respond.js  per le vecchie versioni di IE che non supportano le "media queries" (di cui parlo nella guida specifica per il foglio di stile).

Questi, per svolgere la loro funzione, devono essere richiamati nella pagina come gli altri script, ma per fare in modo che il browser li carichi solo se necessario, vengono implementati in questo modo:

<!--[if lt IE 9] >
<script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv-printshiv.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->

Gli indicatori <!--   --> racchiudono normalmente i commenti, vale a dire parti di testo che non devono essere lette dal browser, ma che servono unicamente per dare indicazioni allo sviluppatore, o a separare parti di codice. In questo caso, invece e con questa particolare sintassi, servono, appunto per comunicare al browser di leggere il contenuto solo in presenza delle condizioni indicate [if It IE 9], cioè versioni di IE precedenti alla 9.

NOTA: I file js e css esterni costituiti da librerie (lunghe stringhe di codici preconfezionati) possono essere materialmente scaricati come file e messi nel sito, oppure, cosa più semplice, possono essere richiamati da servizi esterni CDN (Content Delivery Network - Rete per la consegna di contenuti). L'uso dei CDN è consigliato per una maggiore velocità di caricamento e anche per una questione di sicurezza. Le librerie, infatti, oltre d essere pesanti, a causa della loro complessità, sono spesso bersaglio di attacchi da parte di hacker che trovano un campo ideale in cui nascondere e confondere spyware, malware e virus.
Potete cercare i file in CDN che vi servono tramite questo motore di ricerca: https://cdnjs.com/
In alternativa, anche Google offre alcune librerie in CDN: https://developers.google.com/speed/libraries/
Oppure, semplicemente, digitate il nome della libreria nella barra di ricerca del browser, seguito da CDN e guardate i risultati.
Da segnalare che il collegamento in CDN con file "Prefix Free" può causare problemi a chi utilizza gli strumenti per sviluppatori del browser.



La zona dei contenuti visibili, il "body":

E siamo così arrivati alla sezione "body" del sito web. Quella, cioè che ospita tutti i contenuti visibili.

Una delle prime cose da inserire, se le volete implementare, sono le "breadcrumbs", di cui parlo nella guida relativa ai "Dati strutturati".
Seguiranno tutti i contenuti che desiderate. La cosa a cui dovete fare attenzione è la chiusura di tutti i contenitori che aprite, che siano div, oppure span, oppure paragrafi, titoli ed altro. Se non chiudete i contenitori, le impostazioni specifiche date si rifletteranno su tutto il contenuto a seguire creando errori visibili.

Fa parte del contenuto visibile anche il "footer" (piè di pagina). Il footer è spesso riservato ai contenuti che si ripetono in tutte le pagine, come i link ai documenti, i bottoni di condivisione (se non diversamente implementati), il copyright ecc..
Il footer è racchiuso tra i suoi tag <footer></footer>.

Eccoci, infine, in fondo alla nostra pagina web. Prima di chiudere il body, come già detto, potete inserire il richiamo per tutti quei file js che non sono indispensabili per l'aspetto del sito e che, quindi, possono essere caricati per ultimi. Tra questi ci può essere la libreria JQuery
Prima di tutto, nella terminologia informatica, per libreria si intende un file che contiene una grande quantità di regole "preconfezionate" e utili al funzionamento di diverse applicazioni.
La libreria JQuery è senz'altro la più conosciuta e utilizzata. Dato che contiene moltissime informazioni, è, però, puttosto pesante e per questo motivo è saggio richiamarla in fondo al codice della pagina.
Anche la libreria JQuery può essere scaricata materialmente, o richiamata con CDN. Potete trovare tutte le versioni andando sul sito ufficiale "https://code.jquery.com/jquery/".
Dopo aver scelto la versione che volete implementare, vi verrà fornito il codice di implementazione, simile a questo:

<script   src="https://code.jquery.com/jquery-3.2.1.min.js"   integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="   crossorigin="anonymous"></script>

....contenente anche gli attributi di integrità.

Se decidete di utilizzare la libreria JQuery, il consiglio è quello di continuare a scegliere, in futuro, applicazioni basate su questa libreria, che si tratti di slideshow, o di altro. Questo per evitare di caricare ulteriori script sul sito se questo può essere evitato.

La velocità di caricamento

Argomento molto dibattuto e di non facile interpretazione. Prima di tutto bisogna sottolineare che il risultato dei test di velocità è suscettibile di sensibili differenze a seconda del tool utilizzato per effettuarlo. Detto questo, la velocità di caricamento delle pagine è sicuramente importante, ma il mio consiglio è di non perderci il sonno per recuperare pochi centesimi di secondo, perchè i fattori che possono influenzare la velocità sono davvero infiniti e spesso impossibili da gestire, dato che alcune cose sono necessarie e imprescindibili per il funzionamento della pagina stessa.
I contenuti delle pagine e anche la gerarchia possono influire sul risultato. A parità di caratteristiche, una sottopagina può avere una valutazione inferiore rispetto ad una pagina principale.
Se avete fatto tutte le cose per bene e, dai risultati dei test, la velocità di caricamento non supera i 3 secondi, state sereni.

Importante è, sempre e per tutti gli aspetti, l'ottimizzazione delle pagine. Google ci fornisce uno strumento molto sofisticato che, oltre a fornire una valutazione, indica tutti gli errori evitabili e i relativi rimedi applicabili:

https://developers.google.com/speed/pagespeed/insights/?hl=it

Un altro tool online affidabile e molto utilizzato per questo tipo di analisi è questo:

https://tools.pingdom.com

Detto questo, le cose che ancora potete e dovete fare, per ottimizzare la performance delle pagine sono queste....

Comprimere le immagini:

È già stato detto nel corso della guida, ma lo ripeto: comprimere le immagini è non solo consigliato, ma indispensabile. Tenete, quindi, a portata di mano i programmi precedentemente consigliati (es: https://compress-or-die.com) e abituatevi a comprimere ogni immagine, anche la più piccola, prima di caricarla.

Minimizzare i codici:

Se provate ad eseguire un test per misurare la velocità di caricamento di una pagina, vedrete che, tra i vari consigli per migliorare le prestazioni, vi verrà dato anche quello di minimizzare i codici (CSS, JS, HTML). Cosa significa? Significa che i codici possono essere compressi, vale a dire scritti su una stessa riga eliminando spazi inutili. Naturalmente esistono dei tools online per ottenere questo risultato.
È una pratica senz'altro consigliata per quanto riguarda i codici JS. Per quanto riguarda, invece, HTML e CSS, bisogna valutare anche i contro.
Se siete soliti effettuare modiche della grafica, tenete in conto che sarà impossibile effettuarle direttamente su un codice CSS minimizzato e dovrete, quindi, sempre effettuarle sul file non minimizzato, per poi comprimerlo nuovamente e ricaricarlo sul server.
Stesso discorso vale per il codice HTML delle pagine.

Conclusione:

Per avere una pagina perfetta e che restituisca l'agognato responso da parte del validatore, dovete ricordare queste cose:
  1. Ogni elemento contenitore deve avere il suo tag di chiusura.
  2. Ogni immagine deve avere il tag ALT (leggi anche I contenuti del sito).
  3. Il linguaggio di markup utilizzato deve rispettare le direttive stabilte dal W3C (World Wide Web Consortium).
Le cose che il validatore non dice e che sono comunque fondamentali per un buon risultato e una buona indicizzazione sono:
  1. Il codice deve essere pulito, semplice e ordinato.
  2. Gli script devono essere limitati a quelli essenziali per non appesantire la pagina.
  3. Ogni elemento della pagina deve essere posizionato nel modo migliore.






Fammi sapere se questo argomento ti è stato utile.
Se non ti è stato utile, potrai inviare le tue osservazioni. Grazie
Ti è stato utile questo argomento?
Si
No



Continua con: Pubblicizzare e ottimizzare il sito con buonsenso

Elenco argomenti di questa guida:
Torna alla pagina principale:Creare un sito da zero ->>


E molto altro ancora se leggi:
Tutti gli argomenti