Photoshop Tutorial – jQuery Script – CSS Snippets

Vediamo oggi alcune eccellenti risorse provenienti dalla rete riguardanti il vasto mondo CSS. Per velocità e comodità personale, elencherò le stesse in lingua inglese e sotto forma di paragrafi; scorretele, leggetele e mettetele tra i vostri preferiti; da ora in poi non avrete più dubbi su come realizzare, ottimizzare e magari iniziare i vostri progetti Web.

CSS Online Tools

PSD2CSS Online
A free online service that generates Web pages from Photoshop designs. By following the guidelines and naming conventions, you can precisely choose how the transformation from PSD to (X)HTML and CSS is done.

MoreCSS
MoreCSS is a design-oriented JavaScript library that allows you to write code for applying automatic hyphenation and creating pop-ups, tool tips, tab menus, zebra tables, advanced list styling and cross-browser opacity style. But the really special thing is that you can do these things as you would with regular CSS.

Continua a leggere »

Malo is a very small CSS framework (0,25 kb compressed) for creating a structural base for small or medium web sites. It is derived from Emastic CSS Framework created by the same author.

It covers most of the grid scenarios & very ideal for anyone that doesn’t want to use a complete framework but get some essentials, specially grids, which are problematic in general.

Malo has two parts: basic reset rules, and grid system layout.

Malo has tested on IE:5.01,5.5,6,7,8(beta), Firefox:1.5,2,3, Opera:8.53, 9.23, Safari:2.0 – 4.0 , Chrome 0.3, Konqueror: 3.5, 4.0, camino-1.6.5, kazehakase-0.5.2, galeon-2.0.4, seamonkey: 1.1.12, 2.0

Sembra un incubo, ma ancora spesso dobbiamo ricorrere a piccoli espedienti per far girare i nostri siti su vari Browser; in questo Blog scrissi tempo fa due articoli “Scrivere CSS specifici per Internet Explorer” e “Conditional-CSS” in cui mostravo alcune tecniche per differenziare e duanque servire regole specifiche CSS a seconda del Browser. Oggi completo, diciamo così questa lunga parentesi con un articolo di Neal Grosskopf in cui viene mostrata in una sola lista una serie di hack CSS con cui è possibile scrivere regole specifiche per ciascuno dei principali browser. La famiglia presa in questione riguarda Firefox, Opera, Safari & Internet Explorer e, dopo la spiegazione del problema vengono sviscerate le tecniche più comuni ed efficaci.

Rimane comunque da dire che la costruzione di un Markup strict e l’applicazione delle regole fondamentali di Accessibilità e Usabilità nel codice possono ridurre di molto l’utilizzo di questi espedienti. Consiglio comunque la lettura dell’articolo.

Typechart lets you flip through, preview and compare web typography while retrieving the CSS.

You can view different typefaces with different font sizes and emphases. One of the handy features is that you can compare Windows rendering with Apple font rendering.

You can also download the CSS code for a specific typographic style, cach style corresponds with a style ID, which allows you to annotate prototypes and retrieve the css while coding as well.

Assolutamente da procare e salvare nei preferiti; ora non avete più scuse se non potete provare un template su diverse piattaforme.