àˆ una di quelle idee semplici ma allo stesso tempo efficaci quella presentata da Nathan Smith in PNG overlay. In sostanza si tratta di sfruttare una PNG trasparente che può far da cornice alle immagini, come è facilmente comprensibile dall'esempio che accompagna il post. Il tutto grazie ai posizionamenti assoluti CSS attraverso i quali una PNG semitrasparente viene disposta sopra l'immagine stessa.Due i piccoli difetti della tecnica: la necessità  di un div vuoto aggiuntivo per ottenere l'effetto e il fatto che, dato che IE fino alla versione 6 non supporta le PNG trasparenti, è necessario l'uso della soluzione proprietaria filter per estendere la compatibilità  a IE5.5 e IE6. L'esempio che accompagna l'articolo usa la dichiarazione proprietaria insieme alle altre, invalidando così il foglio di stile. Se vorrete usare una soluzione simile il mio consiglio è di accompagnarla con l'uso del commento condizionale.Concludo con un piccolo spunto: credo sia possibile, grazie ad un'immagine PNG sufficiente grande e un secondo div aggiuntivo, ottenere una soluzione che sia in grado di ottenere cornici la cui dimensione dell'immagine di base ha dimensioni a piacere. Seguiranno a breve aggiornamenti qui o su HTML.it. Stay tuned!

Continua a leggere Aggiungere una cornice alle immagini con le PNG e i CSS

Categoria: Web Design

Forse non si tratta di una tecnica rivoluzionaria, ma decisamente sfiziosa quella presentata in Logo Color Variations su Design Melt Down. L'autore ha pensato di usare un'immagine PNG dove la parte trasparente è il logo stesso: cambiando il colore e/o l'immagine di sfondo all'elemento sottostante è così possibile cambiare il colore del logo stesso senza dover intervenire sull'immagine.àˆ un caso in cui la grafica viene usata in "negativo", ovvero l'informazione visiva viene veicolata grazie alla trasparenza. Sullo stesso principio si basa Superstripes, un'ottima idea per avere linee colorate a piacere grazie a una piccola gif in parte bianca e in parte trasparente.

Continua a leggere Usare il “negativo” nella grafica

Categoria: Grafica