Elementi strutturali di una pagina web - Po-Net

Transcript

Elementi strutturali di una pagina web - Po-Net
Elementi costitutivi di una pagina web
1) Titolo della pagina (h1)
Il titolo h1 è il titolo univoco e significativo che identifica una pagina del nostro sito.
Non dobbiamo creare pagine diverse con lo stesso titolo h1.
Usare sempre titoli sintetici e chiari: sul web deve essere sempre chiaro dove sto andando
per evitare di scaricare un'intera pagina e poi scoprire che non mi serviva. Il titolo della
pagina deve riferirsi esattamente al contenuto.
2) Percorso a briciole di pane
Il percorso di breadcrumbs o “briciole di pane” è il riepilogo dei passi che l’utente dovrebbe
fare per raggiungere la pagina. Semplicemente, rappresenta la posizione della pagina
rispetto alla struttura dei contenuti del sito.
Esempio
Percorso della pagina:
Pratomigranti Æ Vivere in città Æ Famiglia Æ Matrimonio
Pagina 1 di 4
3) Titoli delle sottosezioni di pagina (H2)
Non scrivere mai lunghi blocchi di testo: meglio dividerlo in tanti blocchetti, ognuno con il
suo titolo.
Aumenta la leggibilità, il lettore può “scorrere” la pagina e individuare l’informazione che
cercava.
Dà anche l’idea di un testo scritto bene, i blocchi di testo sembrano i testi di word copiati e
incollati da chissà quali documenti, senza un minimo di rielaborazione.
NO
Il fenomeno dell’immigrazione a Prato
SI
Il fenomeno dell’immigrazione a Prato
Il fenomeno ha avuto origine quando bla bla
bla. Il caso di Prato è originale perché bla
bla bla. Le buone pratiche per l’integrazione
sono bla bla bla bla.
Storia
Il fenomeno ha avuto origine quando bla bla bla.
Il caso pratese
Il caso di Prato è originale perché bla bla bla.
Favorire l’integrazione
Le buone pratiche per l’integrazione sono bla bla bla bla.
Per sapere di cosa parla
questo testo, dobbiamo
fermarci e leggere.
4) Indice dei contenuti della pagina
Per le pagine con molto testo, è meglio
mettere l’indice dei paragrafi con un
link diretto al paragrafo.
L’indice delle sezioni serve a dare una
visione generale dei contenuti della
pagina, guidando l’utente tra le varie
risorse.
In questo esempio, possiamo vedere:
- le 3 sezioni della pagina (storia, caso
pratese, buone pratiche)
- c’è un approfondimento in formato pdf
- c’è un link esterno al sito Pratomigranti.
Per sapere di cosa parla
questo testo, basta scorrerlo!
Il fenomeno dell’immigrazione a Prato
Ì
Ì
Ì
Ì
Ì
Storia
Il caso pratese
Buone pratiche di integrazione
Allegati e documenti
Link utili
Storia
Il fenomeno ha avuto origine quando bla bla bla.
Il caso pratese
Il caso di Prato è originale perché bla bla bla.
Buone pratiche di integrazione
Le buone pratiche per l’integrazione sono bla bla bla bla.
Allegati e documenti
Ricerca sull’immigrazione pratese dal 1900 ad oggi in
formato .pdf 150 kb
Link utili
Pratomigranti.it: portale dedicato ai migranti a Prato
Pagina 2 di 4
5) Title della pagina
Il title è il titolo che compare nella barra in alto di ogni finestra del browser.
Il title è di fondamentale importanza perchè appare agli utenti quando vogliono mettere la
pagina tra i preferiti ed è anche catturato e mostrato nei risultati di alcuni motori di ricerca.
è utile anche per orientarsi tra le tante finestre del browser aperte contemporaneamente.
Il title deve essere molto specifico e riferirsi al contenuto preciso della pagina.
Deve andare dal particolare al generale, esempio: "Salute - Pratomigranti".
Lo stesso testo ci aiuta anche ad orientarci tra le finestre del browser aperte contemporaneamente… Se
tutte le pagine avessero lo stesso title, dovremmo riguardarle tutte per trovare quella che ci interessa!
Pagina 3 di 4
6) Metadata
6.a) Description
La description spiega in breve che cosa contiene la pagina, è un vero e proprio invito alla
lettura. Viene utilizzato dalla maggior parte dei motori di ricerca come abstract del sito.
Se un utente trova questa pagina in un motore di ricerca, perché dovrebbe entrarci?
Proviamo a spiegarlo in massimo 200 parole, evitando di ripetere il titolo della pagina
(alcuni motori prendono fino a 200 caratteri, quindi inutile dilungarsi).
6.b) Keywords / parole chiave
Sono una serie di parole separate da virgola, singole o abbinate, che potrebbero essere
digitate nei motori di ricerca da un potenziale utente.
Evitare doppioni, mettere anche i sinonimi.
Mettere le parole da quelle più caratterizzanti e distintive a quelle più generali.
Vanno pensate bene perché una volta “catturate" dai motori, rimangono invariate per diversi
mesi.
<meta name="description" content="I documenti, le scadenze da rispettare per
sposarsi" />
<meta name="keywords" content="moglie, marito,sposi, pubblicazioni, nulla osta,
rito civile, rito religioso, matrimonio, sposarsi, legalizzazione" />
Pagina 4 di 4