-
+7
.Un nuovo layout
Layout ≠ Skin
La prima domanda che a questo punto potresti farti è la seguente: cos'è un layout? Qual è la differenza tra skin e layout? Che cosa cambia nel Colori e Stili?
La risposta è: tutto e niente. Il Colori e Stili rimane invariato, le istruzioni che stanno alla base sono sempre le stesse. Ma ciò che preme farti sapere è la differenza tra skin e layout.- La skin è la pelle. Viene realizzata tramite codice CSS ed è fondamentale per rivestire la base, lo scheletro stesso della pagina. È il famoso contenuto del Colori e Stili;
- Il layout è l'ossatura. Viene realizzato tramite codice HTML ed è fondamentale per creare la base su cui rivestire. Nel circuito abbiamo campi piuttosto limitati di HTML, questo perché il circuito e il suo staff preferisce mantenere una base uguale per tutti.
Da questo puoi dedurre che il codice HTML nasce per descrivere la struttura di una pagina, mentre il codice CSS nasce per determinarne l'aspetto. L'HTML da solo sarebbe come un uomo senza pelle, statico, privo di un rivestimento. Il CSS da solo sarebbe come un uomo senza ossa, flaccido, privo di un sostegno. Per questo è fondamentale che i due codici uniscano le proprie forze per formare un tutt'uno chiamato sito (forum in tal caso).Tabelle? Siamo nel ventunesimo secolo!
Chiarito ciò, la domanda diventa un'altra: perché un nuovo layout?
La risposta è: per evolversi. Per adeguarsi agli standard del giorno d'oggi. Per stare al passo coi tempi. Il vecchio layout - che sarà sempre disponibile - presenta una struttura ormai obsoleta. Realizzata anni fa per basi css2 e html meno elaborato. È quindi chiaro che il circuito cerchi di soddisfare le esigenze dell'utente e dello skinner, offrendogli qualcosa di nuovo.
Appunto per questo si è passati da una struttura tabellare, che sfrutta il tag table, ad una struttura ad elenchi, che sfrutta il tag ul insieme al tag div, il division block per eccellenza.
Per fare un esempio pratico. Questa è una riga sezione con struttura tabellare (vecchio layout):HTML<table>
<tr id="fID"><td class="aa"><div class="icona_on"></div></td><td class="bb"><div><h2 class="web"></h2><div class="desc"></div></div></td><td class="xx"></td><td class="yy"></td><td class="zz"></td></tr>
</table>
Mentre questa è una sezione ad elenchi (nuovo layout):HTML<ul>
<li id="fID" class="off"><div class="aa"></div><div class="bb"><h3 class="web"></h3><h4 class="desc"></h4></div><div class="yy"><div class="topics"></div><div class="replies"></div></div><div class="zz"><div class="when"></div><div class="where"></div><div class="who"></div></div></li>
</ul>
come anche potrai notare sono state aggiunte nuove classi.Div... agare
In un rapido excursus intendo anche darvi alcune delle caratteristiche più importanti del tag div e del tag ul.- Il tag div è un tag Division Block, a dimostrazione del fatto che tutto ciò che lo segue va direttamente a capo. Il vantaggio sta di fatto nel contenuto, che appartiene ad un unico blocco, diversamente dal tag table che seziona il blocco e ne divide il contenuto in parti uguali. Può essere posizionato ovunque, perché sarà il codice CSS a definirne le caratteristiche, evitando quindi l'inserimento di ulteriori tag;
- Il tag ul è importante perché garantisce un sistema ordinato e funzionale come table, con il vantaggio di fornire una duttilità di gran lunga superiore rispetto alla controparte in celle.
Responso
Il responso è senza dubbio positivo. Un sistema strutturale migliore e più curato, una maggiore libertà di agire, nuove classi e un concept improntato al moderno. Come per ogni cosa nuova, però, bisogna imparare e farci l'abitudine.« Lezione Precedente - Lezione Successiva »
Edited by .|Ye|. - 7/2/2012, 17:06
.
Lezione 0Introduzione |
