framedesignlab.com

Per creare una pagina Web pulita, ben organizzata e di facile lettura, attenersi alle basi. HTML 5 e CSS 3 possono ottenere tutta la stampa, ma elementi HTML di base come intestazioni, paragrafi e alcune tabelle ben posizionate possono dividere efficacemente una pagina per comunicare il tuo messaggio. Di seguito sono riportati alcuni tag semplici e utili per aiutare a organizzare un sito.

Intestazioni

I titoli, in una varietà di dimensioni, catturano l'attenzione e indirizzano i lettori verso le informazioni che vogliono leggere. Inizia con un titolo principale usando

o

tag:

Benvenuto nel mio sito

Usa intestazioni di livello inferiore per dividere il sito verticalmente in sezioni. Limita le intestazioni a due o tre dimensioni, che vanno da

per

e non più di tre o quattro sezioni.

Paragrafi

Usa il paragrafo

tag per dividere il testo in sezioni come segue:

Testo del primo paragrafo ...

Testo del secondo paragrafo ...

Mantieni i paragrafi piccoli e concisi. I lettori Web tipici scansionano rapidamente i contenuti, quindi vai al punto nella prima o due frasi prima che si annoino e fai clic su un altro collegamento.

immagini

Alcune immagini ben posizionate aiutano anche a dividere la pagina in sezioni logiche. Variare l'orientamento a sinistra ea destra per suddividere la pagina. Se possibile, converti i titoli in immagini per aggiungere stile e varietà. Le immagini funzionano bene anche per sostituire link e pulsanti.

Tabelle

Usa semplici tabelle per dividere la pagina orizzontalmente. Una singola tabella, posta dopo il titolo, dividerà effettivamente la pagina in due o tre sezioni. Usa il seguente codice HTML:

La tabella riempie la pagina con una colonna di sinistra che occupa il 20% della pagina, una colonna di destra che occupa un altro 20% e la colonna centrale in mezzo. Assicurati di ricordare l'attributo valign in modo che ogni colonna inizi in alto e scorra verso il basso. Dimentica questo attributo e il contenuto sarà allineato verticalmente al centro della pagina. Aggiungi il contenuto e quindi regola le larghezze delle colonne finché la presentazione non sembra corretta.

Linee e bordi

Una riga orizzontale, codificata come "" senza virgolette o un bordo attorno a una tabella può enfatizzare un'interruzione di sezione o attirare l'attenzione su un blocco di testo. Usali con parsimonia e mantieni le larghezze delle linee a due o tre punti al massimo. Sperimenta con questi elementi per vedere se aggiungono o sminuiscono la presentazione.

Spazio bianco

Righe e colonne vuote spesso dividono una pagina meglio di tutte le altre formattazioni. Interruzioni di riga, codificate come "

"senza virgolette, paragrafi vuoti, codificati come tag a chiusura automatica come"

"senza virgolette e le colonne vuote della tabella separano il testo e rendono il layout più piacevole per il lettore. Lo spazio vuoto occupa poca larghezza di banda ed è davvero il modo più semplice per dividere una pagina.