Värien lisääminen verkkosivustosi suunnitteluun on helppoa HTML-värikoodien avulla.
Avaa Web-turvallinen HTML-värikooditaulukko ja tutki saatavilla olevia värejä. Vaikka useimmat tietokoneet voivat näyttää mitä tahansa värejä, vain verkkoturvalliset värit ovat helpommin käytettävissä. Lisäksi valittavana on monia värejä. Valitse projektiisi värit, jotka sopivat verkkosivustosi teemaan ja muotoiluun. Hyvä nyrkkisääntö on valita kaksi täydentävää väriä ja yksi korostusväri. Neutraali, kuten musta, valkoinen, harmaa tai tan, on toinen hyvä valinta.
Kopioi 6-merkkiset HTML-värikoodit väreille, joita haluat käyttää verkkosivustollasi. Ne koostuvat numeroista 0, 3, 6 ja 9 sekä kirjaimista C ja F erilaisissa yhdistelmissä. Näitä 6-merkkisiä koodeja käytetään HTML-verkkosivustosi koodissa aina, kun haluat luoda värikkään aksentin.
Valitse yksi väri verkkosivustosi taustaksi. Jos haluat muuttaa taustan tämän värin, käytä HTML-koodia "
" ja korvaa 6-merkkinen koodi haluamallasi värikoodilla. Koska tämä on koko verkkosivun tekstin taustan väri, tämä HTML-koodinpätkä korvaa normaalin ""tagi.Muuta minkä tahansa tekstin, otsikoiden tai linkkien väriä verkkosivustollasi lisäämällä värikoodeja ja oikea HTML-koodi verkkosivustosi koodisivulle. Mitä tahansa tekstiä voidaan värittää lisäämällä HTML-attribuutti "Otsikko
" verkkosivustosi koodiin.
Muuta verkkosivustosi kaikkien otsikoiden väriä käyttämällä sen sijaan CSS-tyylisivuja. Käytä koodia "h1 {color:#336699;}" -merkkien välissä
" ja "" -tageja verkkosivustosi koodissa. Joka kerta kun koodaat "" Web-sivustossasi se on tuo väri. CSS on tavallinen tapa muotoilla verkkosivustoja. Sen avulla on myös helpompi mennä sisään ja tehdä muutoksia, jos haluat suunnitella uudelleen.
Muuta fonttien, linkkien ja muiden asioiden väriä CSS: ssä. Käytä CSS-koodinpätkää "p {color:#336699;}" fonteille. Kunkin tekstilohkon HTML-koodin on rajattava "
" ja "
"tunnisteet. Linkin värejä voidaan muuttaa käyttämällä "{color:#336699;}" ja "" -tagia HTML-verkkosivustosi koodissa. Muita HTML-tageja, kuten kuvan reunuksia, vaakasuuntaisia sääntöjä ja taulukon soluja, voidaan myös muuttaa käyttämällä perus-CSS-koodinpätkää "{color:#336699;}".