I CSS (Cascading Style Sheets) sono diventati di fatto il modo per disegnare e strutturare i siti web. I progettisti utilizzano i fogli di stile per indicare a un browser come deve essere visualizzato un sito Web in termini di aspetto e aspetto, coprendo fattori quali colore, spaziatura, caratteri e molto altro ancora.
Gli stili CSS possono essere distribuiti in due modi:
- In linea - all'interno della codifica della pagina Web stessa, su base individuale, elemento per elemento
- In un documento CSS autonomo, a cui è collegato il sito Web
Best practice per CSS
Le "migliori pratiche" sono i metodi di progettazione e realizzazione di siti Web che si sono rivelati i più efficaci e che offrono il massimo ritorno per il lavoro svolto. Seguirli in CSS nel web design aiuta i siti web a guardare e a funzionare nel miglior modo possibile. Si sono evoluti nel corso degli anni insieme ad altri linguaggi e tecnologie web e il foglio di stile CSS standalone è diventato il metodo di utilizzo preferito.
Le seguenti best practice per i CSS possono migliorare il tuo sito nei seguenti modi:
- Separa il contenuto dal design.Uno degli obiettivi principali del CSS è rimuovere elementi di design dall'HTML e inserirli in un'altra posizione che il designer deve mantenere. Questo serve anche a separare i progettisti dagli sviluppatori in modo che ciascuno possa concentrarsi sulle proprie aree di competenza. Un designer non deve essere uno sviluppatore per mantenere l'aspetto di un sito web.
- Rende facile la manutenzione.Uno degli elementi più trascurati del web design è la manutenzione. A differenza dei materiali di stampa, un sito Web non è mai "uno e finito". Contenuto, design e funzione possono e dovrebbero evolversi nel tempo. Avere il CSS in una posizione centrale, piuttosto che sparsi nel sito Web, rende le cose molto più facili da mantenere.
- Mantiene il tuo sito accessibile.L'utilizzo degli stili CSS aiuta i motori di ricerca e le persone disabili a interagire con il tuo sito.
- Mantiene il tuo sito aggiornato più a lungo.Usando le migliori pratiche con i CSS, si aderisce agli standard che sono stati dimostrati stabili ma sufficientemente flessibili da adattarsi ai cambiamenti nell'ambiente di progettazione web.
Gli stili incorporati non sono le migliori pratiche
Gli stili incorporati, sebbene abbiano uno scopo, in genere non sono il modo migliore per mantenere il tuo sito web. Si scontrano con ognuna delle migliori pratiche:
- Gli stili incorporati non separano il contenuto dal design.Gli stili incorporati sono esattamente gli stessi del font incorporato e di altri elementi di design goffo contro i quali gli sviluppatori moderni si scontrano. Gli stili influenzano solo i singoli elementi particolari a cui vengono applicati; mentre ciò potrebbe darvi un controllo più granulare, rende anche più difficili altri aspetti della progettazione e dello sviluppo, come la coerenza.
- Gli stili in linea causano mal di testa di manutenzione.Quando lavori con i fogli di stile, capire dove viene impostato uno stile può essere difficile. Quando hai a che fare con una combinazione di stili in linea, incorporati ed esterni, hai molte posizioni da controllare. Se lavori su un team di web design o devi ridisegnare o mantenere un sito creato da qualcun altro, avrai ancora più problemi. Una volta trovato lo stile e modificato, dovrai farlo su ogni elemento in ogni pagina in cui è stato inserito. Ciò aumenta il tempo e il budget di lavoro in modo astronomico.
- Gli stili incorporati non sono così accessibili.Mentre un moderno lettore di schermo o altro dispositivo di assistenza può essere in grado di gestire in modo efficace attributi e tag in linea, alcuni dispositivi meno recenti non possono, il che può causare pagine web stranamente visualizzate. Caratteri e testo aggiuntivi possono influire sul modo in cui la tua pagina viene vista da un robot dei motori di ricerca, quindi la tua pagina non funziona anche in termini di ottimizzazione dei motori di ricerca (SEO).
- Gli stili incorporati rendono le tue pagine più grandi.Se desideri che ogni paragrafo del tuo sito appaia in un certo modo, puoi farlo una volta con sei righe o più di codice in un foglio di stile esterno. Se lo fai con gli stili in linea, tuttavia, devi aggiungere quegli stili a ogni paragrafo del tuo sito. Se hai cinque righe di CSS, queste sono cinque righe moltiplicate per ogni paragrafo del tuo sito. Quella larghezza di banda e il tempo di caricamento possono sommarsi in fretta.
L'alternativa agli stili incorporati: fogli di stile esterni
Invece di usare stili in linea, usa fogli di stile esterni. Ti offrono tutti i vantaggi delle best practice CSS e sono facili da usare. Impiegato in questo modo, tutti gli stili utilizzati sul tuo sito vivono in un documento separato che viene poi collegato a un documento Web con una singola riga di codice. I fogli di stile esterni influenzano qualsiasi documento a cui sono associati. Ciò significa che, se si dispone di un sito Web di 20 pagine in cui ogni pagina utilizza lo stesso foglio di stile (che è in genere come è fatto), è possibile apportare modifiche a ciascuna di queste pagine semplicemente modificando tali stili una volta, in un unico punto. Cambiare stile in un punto è infinitamente più comodo che cercare quella codifica su ogni pagina del tuo sito web. Ciò semplifica la gestione del sito a lungo termine.
