CSS: differenze tra le versioni

Versione delle 22:26, 13 giu 2006

Versione delle 12:18, 15 giu 2006

Riga 14:

Questi tag proprietari di formattazione erano l'unico modo per gli autori di definire la formattazione e così il loro uso è diventato massiccio. Tuttavia questi tag presentano '''tre problemi''':

#Il primo problema è costituito dalla lunghezza di questi tag. Se confrontata con una pagina che adotta il linguaggio CSS, una pagina che non lo adotta è in genere più pesante (in termini di [[Bit_Bit (informatica)#Il_Il .27.27bit.27.27_come_cifra_binaria27 come cifra binaria|bit]]) in un rapporto che spesso raggiunge il ''200%''. Inoltre le istruzioni CSS possono essere raccolte in un [[file]] esterno che rimane memorizzato nella [[cache]] del browser, riducendo ulteriormente la quantità di dati che i [[server]] devono trasmettere.

#Il secondo problema risiede nella mancanza di logica del codice (X)HTML. Un codice non aderente agli standard, ridondante e confuso comporta infatti molto lavoro aggiuntivo per i browser, che devono cercare di correggere ed interpretare (quando possibile) direttive arbitrarie.

#Il terzo problema comincia a diventare sempre più rilevante ed è la mancanza di compatibilità con i nuovi '''[[Computer_palmareComputer palmare|computer palmari]]''' e gli [[smartphone]]. Queste pagine infatti sono progettate per schermi con risoluzione minima ''800x600 pixel''. I palmari, che hanno una risoluzione inferiore ed una forma dello schermo ben diversa dal rapporto 4:3 dei monitor per computer, si trovano quindi impossibilitati a visualizzare correttamente la pagina e l'utente dovrà tentare di "decodificarla", operazione spesso molto scomoda.

Si tende ad evidenziare anche un ulteriore questione, nelle pagine web non standard, ovvero l'uso del tag <code>&lt;table></code> (le '''tabelle''') per realizzare l'impaginazione delle pagine web. Questo viene considerato dai puristi come inaccettabile in quanto le tabelle sono pensate per impaginare dati tabulari e non layout web. In realtà l'unico svantaggio serio di questo sistema è l'incredibile peso delle pagine, come già indicato al problema 1.

Riga 34:

Per includere nuove funzionalità e rendere i CSS un linguaggio ben supportato, nel [[1998]] il W3C emanò le specifiche CSS 2 e nel [[2004]] le specifiche CSS 2.1. I CSS 2 sono la naturale evoluzione dei CSS 1 ed offrono potenti soluzioni per risolvere soprattutto il problema tre, con la possibilità di creare fogli di stile separati per i dispositivi portatili. Anche il problema due è ormai pienamente risolvibile, scrivendo una pagina (X)HTML esclusivamente indirizzata alla struttura e ai contenuti e manovrandola poi esclusivamente con i CSS per impaginarla.

Con la comparsa di [[Internet_ExplorerInternet Explorer|Internet Explorer 5]], di [[Mozilla Firefox|Firefox]] e di [[Opera_Opera (browser)|Opera 7]], i CSS 2 hanno potuto avvalersi di browser in grado di interpretarli e sono quindi entrati a far parte del codice di molti siti web.

=== CSS 3 ===

Riga 96:

==== Identificatori ====

Gli identificatori (comunemente '''ID'''): applicano la regola a quell'elemento della pagina che presenta la proprietà <code>id="nome_identificatore"</code>. Solo un elemento in tutta la pagina può corrispondere ad un identificatore. La sintassi CSS è la seguente:

#nome_identificatore {

[...]

Riga 175:

* ''border''. Definisce il bordo di un elemento. È la somma delle proprietà più specifiche ''border-color, border-style e border-width''.

* ''color''. Definisce il colore del testo di un elemento. Per definire lo sfondo si utilizza la proprietà ''background''.

* ''float''. Questa proprietà definisce un blocco ''[[Flottante_Flottante (informatica)|flottante]]'', ovvero che permette la disposizione di altri elementi ai suoi lati.

* ''font''. Definisce le proprietà del carattere. È la somma di proprietà più specifiche tra cui ''font-family, font-size e font-weight''.

* ''margin'' e ''padding''. Definiscono lo spazio circostante gli elementi. La prima lo spazio esterno ai bordi, la seconda quello interno.

Riga 221:

Il supporto completo e corretto delle specifiche CSS non è offerto da nessun browser attuale. Tuttavia esistono browser che si avvicinano molto a questo risulatato ed altri che invece ne sono molto lontani. La lista che segue è di [[motore di rendering|motori di rendering]] perché a loro è assegnato il compito di formattare la pagina secondo le istruzioni CSS.

*Trident ([[Internet Explorer]] e AOL Browser): Internet Explorer è attualmente il browser più diffuso e il suo supporto molto scarso dei CSS è probabilmente il maggior freno al loro sviluppo. Explorer presenta infatti molti [[Bug_Bug (informatica)|bachi]] nella formattazione delle pagine, che le rendono diverse da quelle ottenute con altri browser. In aggiunta ai bachi, Explorer non supporta assolutamente alcune porzioni delle specifiche CSS 2. Le mancanze più gravi sono l'assenza di supporto per i '''contenuti generati''' e per il '''selettore di attributo'''. Gli unici strumenti a disposizione dei [[web designer]] sono i ''commenti condizionali'', una particolare funzionalità di Explorer che consente di inviare istruzioni solo a questo browser. La sintassi dei commenti condizionali è la seguente:

&lt;!--'''[if IE]>'''

''codice esclusivamente per Internet Explorer''

Riga 230:

&lt;![endif]-->

*[[Gecko]] ([[Mozilla Firefox|Firefox]] e [[Netscape_NavigatorNetscape Navigator|Netscape]]): Gecko ha un ottimo supporto dei CSS 1 e 2 ed è per questo spesso utilizzato nella verifica della resa delle pagine web.

*[[Presto_Presto (motore_di_renderingmotore di rendering)|Presto]] ([[Opera]]): anche Presto offre un ottimo supporto dei CSS 1 e 2. Opera offre inoltre un'opzione che permette all'utente di disattivare i fogli di stile o usarne di propri.

*[[KHTML]] ([[Safari_Safari (browser)|Safari]] e [[Konqueror]]): KHTML è attualmente il motore che offre il maggior supporto ai CSS, offrendo una parziale interpretazione anche dei CSS 3.

Riga 245:

Il codice precedente associa il foglio di stile solo (in teoria) ai browser standard per computer desktop e portatili. I valori dell'attributo media sono i seguenti:

*screen ([[Desktop_Desktop (computer)|desktop]] e [[laptop]])

*handheld ([[PDA]] e [[smartphone]])

*print ([[Stampante|stampanti]])

Riga 271:

== Voci correlate ==

*[[Accessibilità_Accessibilità (informatica)|Accessibilità]]

*[[Browser]]

*[[Pagina web]]