In questa pagina troverete una breve guida sulle operazioni da eseguire per aggiornare e creare pagine HTML conformi al nuovo stile grafico del sito web dell'Osservatorio di Arcetri.
Il sito web dell'Osservatorio è basato sulla tecnologia CSS (Cascading Style Sheets), standard definito dal W3C (World Wide Web Consortium) nel 1996. L'utilizzo dei CSS permette di separare la definizione dello stile grafico di un sito dal contenuto informativo delle singole pagine HTML. Gli stili possono essere definiti nell'intestazione della pagina (all'interno del tag <HEAD>) oppure in un file esterno. Per maggiori informazioni sulla tecnologia CCS rimando alla pagina ufficiale http://www.w3.org/Style/CSS.
La nuova interfaccia grafica del sito dell'Osservatorio (stile del testo, sfondo delle pagine, margini laterali) è definita nel file arcetri.css, disponibile alla URL http://www.arcetri.astro.it/arcetri.css. In questo file è stato ridefinito lo stile di visualizzazione dei principali tag utilizzati nelle pagine HTML (i tag body, p, h1, h2, h3, hr, a, li, pre).
Il primo (e più importante) passo per adeguare le vostre pagine alla nuova grafica è importare all'interno della pagina gli stili definiti nel file CSS. L'operazione è immediata: dovete semplicemente definire l'header della pagina HTML in questo modo:
<html> <head> <title> TITOLO PAGINA </title> <link rel="stylesheet" href="/arcetri.css" type="text/css"> </head> <body>
In grassetto è evidenziato il tag <link> che permette l'importazione degli stili definiti nel file /arcetri.css. Ricordatevi di eliminare i riferimenti all'immagine per il background (se presente) o ad altre impostazioni particolari dal tag body!
A questo punto l'aspetto della pagina sarà già conforme alla nuova grafica. Il browser infatti, trovando il tag <link>, leggerà le impostazioni per i vari stili definite nel file CSS che avete importato.
Cliccando sull'immagine qua sotto potete scaricare il file titolo_home.psd, in formato Adobe Photoshop; modificando quest'immagine con un programma di grafica potete creare i titoli per le vostre pagine.
Per editare i file .PSD consiglio uno dei seguenti software: Adobe Photoshop 6 (Windows, Mac), Paint Shop Pro 7 (Windows), Gimp (Linux, Windows, MacOS X, OS/2, Unix).
Come ulteriore lettura rimando alla pagina CCS Browser Support, dove è disponibile una lista completa delle compatibilità dei vari browser con i fogli di stile CSS.