Ok. Fin qui nulla di che. Come avrete notato, i css non hanno nulla di trascendentale ed il loro uso è sufficientemente semplice. A questo punto potrebbero sorgerci domande quali:
- Che programma usare per scrivere il codice dei CSS?
- Come scriverli e possibilmente ottimizzarli?
- Come verificare la corretta visualizzazione su browser diversi?
Alla prima domanda non posso che dare una risposta molto soggettiva. Io personalmente utilizzo notepad++ scrivendo tutto il codice a mano, cosa che tra l’altro faccio anche con l’html ed il php, non perché sia un talebano del codice ma per una questione di velocità di scrittura e di controllo accurato dello stesso. Ovviamente sfrutto alcune caratteristiche del programma imprenscindibili: colorazione del codice, funzioni di undo e redo a più livelli, sostituzione su tutto il documento anche attraverso l’uso di espressioni regolari per dirne alcune.
Cosa consiglio? Qualunque text-editor: pico, nano, vim, dreamweaver, notepad++, quanta, phpedit e così via. Provateli, cercate quello che vi sembra più comodo, ergonomico, usabile e poi continuate ad usare solo quello. Per la visualizzazione basta un semplice F5 sul browser. Non è indispensabile che il vostro editore abbia preview integrate.
Esistono infine programmi che vi permettono di creare i css in forma visuale senza conoscere tutte le proprietà: tra i tanti a me piace SimpleCSS. Può esser comodo per chi è alle prime armi per imparare a memoria i valori e le proprietà, a condizione che una volta superata la prima fase, si passi ad un vero editore di testi.
Il tutto ovviamente IMHO, ovvero, per me, secondo me.
Anche il secondo punto sfiora le preferenze personali. Posso in generale dare alcuni consigli su come opero io. Non è detto che sia il metodo migliore, anzi.
Secondo alcune scuole di pensiero i css dovrebbero occupare il minor spazio possibile, cercando quindi di accumulare le regole per quanto possibile. Io, soprattutto per siti con CSS abbastanza impegnativi tento di solito a dividerli in più parti, scrivendone uno generale, uno solo per la stampa, se ci sono sezioni sufficientemente distanti come stile grafico, uno per sezione ed a volte uno per alcuni browser (NN4 e IE5 nello specifico) quando richiesto dal committente o dal target del sito.
Cerco poi di NON scrivere le regole selettore per selettore, una cosa tipo h1 { margin:1em 1em; font-size:1.7em; border-bottom:1px solid gray; } ma di suddiverli nel css, o se molto corposi in più css, a seconda di ciò che dichiarano: colori, bordi, box-model, testo. Può sembrare un lavoro inutile ma vi assicuro che è molto comodo quando poi torniamo a manutere il sito avere tutte le proprietà sotto mano e sott’occhio e non andare di Ctrl-F a cercarlo nel testo di un documento di 500 righe.
Infine, e ve ne accorgerete presto…, avvertirete la necessità di controllare la resa di quanto scritto su molti browser diversi, quali, ma non solo: IE5.01 e successivi, Opera 7 e successivi (se non dalla 5 🙂 ), Firefox, Netscape, Safari, Konqueror, Galeon e chi ne ha ne metta. Molto dipende dal Sistema Operativo che utlizzate: l’ideale sarebbe di avere varie postazioni con sistemi operativi diversi e più computer. Ok ok, spesso è fantascienza. Come fare allora?
Su piattaforma windows non dovreste aver problemi con Firefox, qualsiasi versione, Opera e Safari che possono coesistere anche in più versioni e più piattaforme.
Qualche problema in più ce lo da Internet Explorer che sovrascrive la precedente installazione. Fortunatamente esistono hack per avere più versioni di IE sullo stesso PC. Approfondimenti.
Per Mac, Intel in particolare, esiste Parallels che permette di avere due Windows e Mac sulla stessa sessione di lavoro. Con lo stesso principio lavora WmWare: permette di avere più macchine virtuali sullo stesso dispositivo, con la possibilità quindi, di avere windows e linux sulla stessa macchina. Per i Linari puri e duri esiste infine la possibilità di utilizzare IEs4Linux.
Infine esistono servizi web che ci danno l’anteprima su vari browser, semplicemente, indicandogli la pagina da controllare ed i browser che ci interessano; addirittura alcuni ci permettono di scegliere se mostrare il rendering con flash, javascript e java disabilitati o meno. Ottimo in tal senso è Browsershots.
Segnalo infine evolt un sito che raccoglie moltissime versioni di browser, utile ad esempio, a chi non ha sottomano NN4 e non sa dove andarlo a cercare.