CSS e webdesign

Il classico problema del webdesigner è mantenere la coerenza del proprio design sulla moltitudine di browser in circolazione: il rendering della pagina viene più che altro influenzato dalle impostazioni di default del programma, per questo è nata l’esigenza della tecnica denominata CSS Reset.

Solitamente basta inserire questa riga al nostro CSS in primissima posizione per risolvere la maggior parte dei problemi:

basta questa riga per dire al browser di azzerare i valori di margine esterno e interno di tutti gli elementi HTML.
Questa semplice soluzione ha comunque qualche effetto collaterale che può infastidire come un discreto peso sull’engine del browser e l’eliminazione di ogni stile di default.
Per cui eccovi altre 2 soluzioni più complete ed elaborate.

(more…)

Ritieni questo post utile o interessante?
Condividi

La noia più grande per un webdesigner patito di CSS è il solito imperituro problema di compatibilità tra i vari browser, cosa che ci costringe a lavorare con ALMENO 2 finestre di anteprima aperte: Firefox e Internet Explorer 7.
Nel mondo dei browser per PC Mozilla si sta facendo strada e supera il browser predefinito di Windows non solo sulle macchine degli sviluppatori ma anche su quelle dei clienti nemmeno troppo smaliziati: la cosa non può che renderci felici data la maggior adesione del programma alle regole di interpretazione standard dettate dal World Wide Web Consortium (W3C).
Con la venuta di IE7 abbiamo comunque tirato un bel sospiro di sollievo nel constatare una certa somiglianza col buon vecchio Firefox nel riconoscere le proprietà del foglio di stile, nonchè per la maggiore sicurezza e stabilità.
Purtroppo però il popolo internauta che ancora usa la vecchia versione 6 di Explorer è dura a morire e la percentuale risulta ancora così alta che un webdesigner non può permettersi di trascurarla.
Com fare quindi per testare le nostre pagine su diverse versioni dello stesso browser made in Microsoft?

(more…)

Ritieni questo post utile o interessante?
Condividi

Non troppo tempo fa, la grafica di una pagina HTML era costituita da uno sfondo che veniva ritagliato con un programma di grafica in segmenti più piccoli, detti slice, i quali venivano usati come background di celle di una grande tabella per formare il template del sito.
Questa tecnica era comoda per i grafici meno esperti che in un attimo trasformavano la loro opera in una pagina HTML ma complicava decisamente la vita a chi doveva poi inserirvi il codice limitandolo ai bordi delle celle predefinite.
Un migliore utilizzo del CSS ha risolto questo problema dando la possibilità di inserire queste immagini grafiche come sfondo degli elementi HTML, rendendo il codice della pagina più leggero e semplice da leggere ai motori di ricerca, semplificando quindi anche il lavoro dell’esperto di SEO, e liberando lo sviluppatore dai confini delle celle della tabella grafica.
I CSS Sprite rappresentano un’evoluzione naturale di questo concetto, migliorando ulteriormente la leggibilità del codice, una sua eventuale modifica e velocizzando anche il lavoro del webdesigner.
(more…)

Ritieni questo post utile o interessante?
Condividi

La più grande noia per un webdesigner che ricorrre al CSS per disegnare i propri layout è la diversità con cui ogni browser gestisce le proprietà assegnate nel foglio di stile: inutile nascondere che i più grandi problemi si sono sempre creati con i browser made in Microsoft.
Negli ultimi tempi questo problema è stato in parte risolto dalla nuova versione di Internet Explorer, la 7, ma la versione precedente del navigatore è ancora una percentuale molto alta che non può essere trascurata.

In questo tutorial vi presento la soluzione (ma sarebbe meglio parlare di un hack) al problema della trasparenza delle PNG in IE6 che come sapete non viene affatto gestita.

(more…)

Ritieni questo post utile o interessante?
Condividi

Per chi ancora usa Javascript per inserire bottoni in rollover all’interno delle proprie web application illustro questo metodo semplice ma molto funzionale.
I vantaggi rispetto all’uso del Javascript sono il funzionamento sui browser con Javascript disabilitato, implementazione velocissima, migliore leggibilità del testo da parte del browser e dei motori di ricerca e notevole risparmio di tempo nel caso vogliate cambiare o eliminare l’effetto in seguito.

(more…)

Ritieni questo post utile o interessante?
Condividi

Avete le idee e la creatività ma non sapete metterle in pratica?
Conoscete alla perfezione le tecniche del CSS ma non sapete cosa inventarvi?

Ecco una lista esauriente di CSS gallery, siti che espongono opere di giovani artisti del web, in erba e non, siti in produzione o semplici layout di esempio da cui ispirarsi “liberamente”.
Sicuramente molti di voi già conosceranno il famoso CSS Zen Garden, tanti si sono letteralmente innamorati del Cascading Style Sheet dopo la sua scoperta e hanno riscoperto la gioia di creare e colorare il web (io sono uno di quelli :) ) , se non siete tra questi date un’occhiata ai link in basso, potreste rimanere stregati, e se siete tra questi…non si finisce mai di imparare, no?

Clicca sul link del menù CSS Gallery: tornate spesso a visitare questa pagina, la selezione per le migliori gallery è appena iniziata!

Ritieni questo post utile o interessante?
Condividi