CSS Vadnica

Zunanji CSS (External CSS) je najbolj priporočljiva in profesionalna metoda za oblikovanje spletnih strani. Pri tej metodi so vsi stili zapisani v ločeni datoteki z razširitvijo .css, ki jo HTML dokument poveže s pomočjo oznake <link> v glavi strani.

PRIMER

                        <!DOCTYPE html>
<html lang="sl">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>vgrajeni CSS</title>
    <link rel="stylesheet" href="slog.css">
</head>
<body>
    <h1>Primer uporabe zunanjega CSS</h1>
    <div class="box">
        <p>Ta odstavek je oblikovan s pomočjo stila, ki je zapisan v ločeni datoteki slog.css.</p>
        <p>Če želite spremeniti videz te strani, odprite datoteko slog.css in spremenite kodo tam. Sprememba bo veljala 
        za vse strani, ki uporabljajo to datoteko.</p>
    </div>
</body>
</html>
                    

REZULTAT

Kako deluje?

Predstavljajte si, da imate veliko hišo z 10 sobami (spletnimi stranmi). Namesto da bi pravila za oblikovanje pisali na steno vsake sobe posebej (notranji CSS) ali pa na vsak kos pohištva (vgrajeni CSS), napišete eno knjigo pravil (CSS datoteko) in jo postavite v hodnik. Vse sobe (strani) se referencirajo na to knjigo. Če želite spremeniti barvo sten v vseh sobah, samo enkrat spremenite knjigo in sprememba velja za celotno hišo.

Zakaj je to najboljša metoda?

Ponovna uporaba kode: Ena CSS datoteka lahko oblikuje 100 različnih strani. Če spremenite eno vrstico v CSS datoteki, se sprememba takoj odraža na vseh straneh.
Hitrost nalaganja (Cache): Brskalnik enkrat naloži CSS datoteko in jo shrani v pomnilnik (cache). Ko uporabnik obišče drugo stran na vaši spletni lokaciji, brskalnik ne naloži CSS-a znova, kar pospeši delovanje.
Čista koda: HTML datoteke so čiste in berljive, saj ne vsebujejo dolgih stilskih definicij. Ločitev vsebine (HTML) in videza (CSS) je temelj modernega spletnega razvoja.
Lažje vzdrževanje: Ko želite spremeniti dizajn celotne strani, odprete samo eno datoteko, ne pa 50 HTML datotek.

Kdaj uporabiti?

Zunanji CSS je obvezen za:

Vse večje spletne strani in spletne trgovine.
Spletne strani z več kot 3-5 podstranmi.
Projekte, kjer več ljudi sodeluje pri razvoju.
Spletne strani, ki želijo visoko hitrost in dobro SEO uvrstitev.

Zaključek: Če želite ustvariti profesionalno, hitro in enostavno vzdrževano spletno stran, je Zunanji CSS edina prava izbira. Vgrajeni in notranji CSS uporabljajte le za hitre teste ali zelo majhne projekte.