L'aspetto grafico, o "stile", di un sito Web è dettato da CSS (fogli di stile a cascata). Questo è un file che aggiungerai alla directory del tuo sito web che conterrà le varie regole CSS che creano il design visivo e il layout delle tue pagine.
Sebbene i siti possano utilizzare, e spesso lo fanno, più fogli di stile, non è necessario farlo. Puoi inserire tutte le tue regole CSS in un unico file e ci sono effettivamente dei vantaggi nel farlo, anche più velocemente tempo di caricamento e le prestazioni delle pagine poiché non è necessario recuperare più file. Sebbene a volte i siti aziendali molto grandi possano aver bisogno di fogli di stile separati, molti siti di piccole e medie dimensioni possono funzionare perfettamente con un solo file con tutte le regole necessarie per le tue pagine. Questo fa sorgere la domanda "Come dovrei chiamare questo file CSS"?"
Nozioni di base sulla convenzione di denominazione
Quando crei un foglio di stile esterno per le tue pagine web, dovresti nominare il file seguendo convenzioni di denominazione simili per i tuoi file HTML.
Non utilizzare caratteri speciali
Dovresti usare solo le lettere a-z, i numeri 0-9, il carattere di sottolineatura (_) e i trattini (-) nei nomi dei file CSS. Sebbene il tuo file system possa consentirti di creare file con altri caratteri, il sistema operativo del tuo server potrebbe avere problemi con i caratteri speciali. Sei più sicuro usando solo i caratteri menzionati qui. Dopotutto, anche se il tuo server consente caratteri speciali, potrebbe non essere così se decidi di passare a diversi provider host in futuro.
Non utilizzare alcuno spazio
Proprio come con i caratteri speciali, gli spazi possono causare problemi sul tuo server web. È una buona idea evitarli nei nomi dei file; dovresti anche fare in modo di nominare file come PDF usando queste stesse convenzioni, nel caso in cui dovessi mai aggiungerli a un sito web. Se ritieni fortemente di aver bisogno di uno spazio per rendere il nome del file più facile da leggere, opta invece per trattini o caratteri di sottolineatura. Ad esempio, invece di utilizzare "questo è il file.pdf", utilizzare "questo è il file.pdf".
Il nome del file dovrebbe iniziare con una lettera
Sebbene questo non sia un requisito assoluto, alcuni sistemi hanno problemi con i nomi di file che non iniziano con una lettera. Ad esempio, se scegli di iniziare il file con un carattere numerico, ciò può causare problemi lungo la riga.
Usa tutto minuscolo
Sebbene questo non sia richiesto per un nome di file, è una buona idea, poiché alcuni server Web fanno distinzione tra maiuscole e minuscole e se dimentichi e fai riferimento al file in un caso diverso, non verrà caricato. L'uso di caratteri minuscoli per ogni nome di file è sempre un modo intelligente di procedere. In effetti, molti nuovi web designer faticano a ricordarsi di farlo, la loro azione predefinita quando nominano un file è quella di scrivere in maiuscolo il primo carattere del nome. Evita questo e prendi l'abitudine di usare solo caratteri minuscoli.
Mantieni il nome del file il più breve possibile
Mentre c'è un limite alla dimensione del nome del file sulla maggior parte sistemi operativi, è molto più lungo di quanto sia ragionevole per un nome file CSS. Una buona regola empirica è non più di 20 caratteri per il nome del file, esclusa l'estensione. Realisticamente, qualsiasi cosa molto più lunga di quella è ingombrante con cui lavorare e comunque collegarsi.
La parte più importante del tuo nome file CSS
La parte più importante del nome file CSS non è il nome file stesso, ma l'estensione. Le estensioni non sono necessarie su Macintosh e Sistemi Linux, ma è una buona idea includerne uno comunque quando si scrive un file CSS. In questo modo saprai sempre che si tratta di un foglio di stile e non dovrai aprire il file per determinare di cosa si tratta in futuro.
Probabilmente non è una grande sorpresa, ma l'estensione del tuo file CSS dovrebbe essere:
.css
Convenzioni di denominazione dei file CSS
Se avrai solo un file CSS sul sito, puoi nominarlo come preferisci. È preferibile uno dei seguenti:
stile.css
standard.css
default.css
Se il tuo sito web utilizzerà più file CSS, assegna ai fogli di stile il nome della loro funzione in modo che sia chiaro esattamente quale sia lo scopo di ciascun file. Poiché una pagina Web può avere più fogli di stile allegati, è utile dividere i tuoi stili in fogli diversi a seconda della funzione di quel foglio e degli stili al suo interno. Per esempio:
-
Disposizione vs. design
layout.css design.css
-
Sezioni di pagina
main.css nav.css
-
Intero sito con sottosezioni
mainstyles.css sottopagina.css
Se il tuo sito web utilizza un framework di qualche tipo, probabilmente noterai che utilizza più file CSS, ciascuno dedicato a diverse porzioni delle pagine o aspetti del sito (tipografia, colore, layout, eccetera.).