Nessun risultato. Prova con un altro termine.
Guide
Notizie
Software
Tutorial
  • Lezione 16 di 41
  • livello principiante
Indice lezioni

Layout a due e tre colonne: introduzione

Tecniche di base, codifica, accessibilità.
Tecniche di base, codifica, accessibilità.
Link copiato negli appunti

Ci sono due modi per realizzare layout a due o più colonne:

  • L'uso del posizionamento
  • L'uso della proprietà float

In quanto alla scelta della tecnica da usare, c'è da dire che:

  • la tendenza attualmente più diffusa è quella che poggia sulla proprietà
    float (consente una maggiore flessibilità e facilità di codifica);
  • l'uso del posizionamento assoluto permette un maggior controllo sulla disposizione
    e separazione dei contenuti.
  • Di ogni layout vedremo le due versioni e molte varianti, e affronteremo pro
    e contro delle due tecniche nello specifico della tipologia.

    La disposizione delle sezioni in ordine di codice html

    È importante tenere presente, come vedremo in seguito, che l'uso dei
    float e dei posizionamenti assoluti per layout a due o tre colonne condiziona
    a monte la codifica del codice HTML. Un buon webdesigner dovrebbe sempre
    considerare l'accessibilità di un sito e codificarlo di modo che risulti
    favorito nell'indicizzazione dai motori di ricerca.

    Sulla questione dell'accessibilità, ho chiesto un parere a Michele Diodati,
    mentre ho preso spunto dall'articolo "Progettare
    un sito gradito ai motori di ricerca" di Francesco de Francesco per quanto
    riguarda i motori di ricerca. La mia curiosità: Quanto influisce l'ordine
    del codice HTML in cui è prevista la navigazione dopo i contenuti?

    Michele Diodati, del sito Diodati.org
    e autore della guida "Costruire
    siti ad elevata accessibilità" mi ha risposto:

    ...Se sono favorevole oppure no a soluzioni di impaginazione in cui
    tramite CSS si faccia apparire il menu di navigazione in un posto
    qualsiasi della pagina, mentre nel codice HTML si trova dopo il testo
    principale?

    Se questa è la tua domanda, la mia idea è che tale soluzione vada adottata con
    estrema attenzione, perché fa uso quasi inevitabilmente di posizionamenti assoluti,
    che non si prestano bene ai ridimensionamenti. Un'impaginazione accessibile deve
    tenere sempre conto, infatti, della possibilità che l'utente ingrandisca il testo
    e, quando ciò avviene, nei limiti del possibile non devono avvenire sovrapposizioni
    di contenuti.
    Quanto al fatto di mettere i contenuti prima del menu, questa è una
    richiesta pressante dei non vedenti, che sono veramente infastiditi da
    pagine fatte da chilometrici elenchi di link, da percorrere prima di
    arrivare ai contenuti veri e propri. Nè sono aiutati dai link di
    salto, che odiano visceralmente. Per loro i link di salto sono appunto
    salti nel buio: non sanno cosa c'è tra il link e il contenuto.

    In effetti non siamo ancora riusciti a trovare un sistema veramente valido
    che metta d'accordo le abitudini dei vedenti (menu di navigazione a nord,
    contenuti a sud),con le esigenze dei non vedenti (i contenuti prima di tutto).

    Francesco de Francesco, nel suo recente articolo apparso nella sezione
    PRO di HTML.it afferma:

    In considerazione del fatto che tutti i motori danno significato alla posizione del testo nell'ambito del file della pagina e alla posizione delle parole nell'ambito del testo, è evidente che differenti impaginazioni, anche per testi uguali, producono risultati diversi in termini di posizione sui risultati.

    Vari motori evidenziano come descrizione del sito trovato le prime parti incontrate nel body. Avere il menù nella parte alta, se necessario per l'usabilità del sito, è spesso fattore negativo per il posizionamento.

    Un buon schema d'impaginazione può consentire decisi miglioramenti del posizionamento. Le tecniche di sviluppo, inoltre, permettono spesso di superare i vincoli di posizione.

    Un'altro problema da affrontare preliminarmente è quello concernente la lunghezza e la larghezza delle colonne. È l'argomento della prossima lezione.

Ti consigliamo anche