HTML on kieli, joka antaa jokaiselle verkkosivulle rakenteen. Opi, mitä HTML on, miten se toimii ja mitä se tarkoittaa sivustollesi yrittäjänä.
Jokaisen sivuston takana on kieli, joka tekee kaiken mahdolliseksi. Ei ohjelmointikieli, jota vain kehittäjät ymmärtävät, vaan yksinkertainen, luettava kieli, joka on ollut internetin selkäranka alusta asti. Jokainen sivu, jonka olet koskaan ladannut, jokainen verkossa lukemasi artikkeli ja jokainen selaamasi tuotesivu: kaikki alkaa tästä yhdestä kielestä.
Tuo kieli on HTML. Jokainen näkemäsi verkkosivu on rakennettu sillä. Ylhäällä oleva otsikko, sen alla oleva tekstikappale, sivussa oleva kuva ja alhaalla oleva painike: kaikki on HTML:ää. Se on lähtökohta jokaiselle internetin sivustolle, ja kun ymmärrät, mitä se tekee, saat paljon selkeämmän kuvan siitä, miten sivustosi toimii.
Sinun ei tarvitse kirjoittaa HTML:ää, jotta sinulla voi olla sivusto. Nykyaikaiset sivustonrakentajat hoitavat sen kaiken puolestasi. Kun kuitenkin tiedät, mitä HTML on ja mikä sen rooli on, teet parempia päätöksiä sivustostasi ja osaat kommunikoida selkeämmin suunnittelijoiden tai kehittäjien kanssa.
Mitä HTML tarkoittaa?
HTML tulee sanoista HyperText Markup Language. Jokainen nimen osa kertoo jotain siitä, mitä se tekee.
HyperText viittaa tekstiin, joka linkittyy muuhun sisältöön. Sivujen väliset linkit tekevät verkosta verkon: voit hypätä sivulta toiselle, koska HTML tukee hyperlinkkejä. Markup tarkoittaa, että kieli käyttää tageja merkitsemään eli nimeämään sisällön osia, jotta selain tietää, mitä niille tehdään. Language tarkoittaa, että se noudattaa yhtenäistä sääntöjen ja syntaksin kokonaisuutta.
Mihin HTML:ää käytetään?
HTML:llä määritellään verkkosivun rakenne. Se kertoo selaimelle, mitä kukin sisältö on. Onko tämä otsikko? Onko se kappale? Onko se luettelo? Onko se kuva? Onko se linkki? HTML vastaa kaikkiin näihin kysymyksiin tagien avulla.
Tagi on nimike, joka on kirjoitettu kulmasulkeiden sisään. Otsikko voisi näyttää HTML:ssä tältä: sanat "Meistä" otsikkotagin sisällä. Selain lukee tagin, ymmärtää sen olevan otsikko ja näyttää sen sen mukaisesti. Sama pätee jokaiseen sivun elementtiin. HTML ei määritä, miltä asiat näyttävät, vaan sen, mitä ne ovat.
Mitä HTML ei tee
HTML antaa verkkosivulle rakenteen, mutta se ei määritä, miltä sivu näyttää tai miten se käyttäytyy. Siinä kohtaa tulevat mukaan kaksi muuta kieltä.
CSS määrittää visuaalisen ilmeen: värit, fontit, välit, asettelun ja koot. Ilman CSS:ää HTML-sivu olisi pelkkää tekstiä ilman tyylittelyä. JavaScript määrittää käyttäytymisen: mitä tapahtuu, kun klikkaat painiketta, miten lomake tarkistaa syötteet ja miten sisältö latautuu ilman sivun päivitystä. Yhdessä HTML, CSS ja JavaScript muodostavat kolme kerrosta, joille jokainen verkkosivu rakentuu. HTML on perusta. Lue lisää siitä, mitä CSS tekee ja mitä JavaScript tekee, seuraavista luvuista.
Miten selain käyttää HTML:ää?
Kun vierailet sivustolla, selain lataa kyseisen sivun HTML-tiedoston. Se lukee tiedoston ylhäältä alas ja rakentaa niin sanotun DOM:in, mallin kaikista sivun elementeistä ja siitä, miten ne liittyvät toisiinsa. Sitten se soveltaa CSS:ää elementtien tyylittelyyn ja suorittaa JavaScriptin lisätäkseen vuorovaikutteisuutta. Se, mitä näet ruudulla, on näiden kaikkien kolmen yhteistyön tulos.
HTML on se, minkä selain lukee ensin. Jos HTML on siistiä ja hyvin jäsenneltyä, selain voi käsitellä sen nopeammin ja näyttää sivun tehokkaammin. Tämä liittyy suoraan sivuston nopeuteen. Turhan raskas tai huonosti kirjoitettu HTML lisää painoa jokaiselle sivulle ja hidastaa sitä, kuinka nopeasti kävijät näkevät sisältösi.
Mitä tämä tarkoittaa sivustollesi yrittäjänä?
Jos käytät sivustonrakentajaa, et kirjoita HTML:ää itse. Alusta tuottaa sen puolestasi, kun lisäät sisältöä ja järjestät asettelun. Sinulle tärkeää on, että sen tuottama HTML on siistiä, semanttista ja optimoitua.
Siisti HTML latautuu nopeammin. Semanttinen HTML eli HTML, joka nimeää oikein, mitä kukin sisältö on, auttaa hakukoneita ymmärtämään sivusi. Otsikoksi merkitty otsikko painaa hakutuloksissa enemmän kuin otsikko, joka on vain tyylitelty näyttämään isolta. Nämä yksityiskohdat hoituvat automaattisesti, kun rakennat hyvällä alustalla. WEMASY-sivustonrakentaja tuottaa taustalla hyvin jäsenneltyä HTML:ää, joten sivusi on rakennettu sekä nopeutta että hakua varten alusta asti.
Usein kysytyt kysymykset
Pitääkö minun opetella HTML:ää rakentaakseni sivuston?
Ei. Sivustonrakentajilla voit luoda ja hallita sivustoa visuaalisella editorilla kirjoittamatta HTML:ää. Alusta hoitaa koodin puolestasi. HTML:n perusteiden oppiminen on hyödyllistä, jos haluat ymmärtää, miten sivustosi toimii, mutta se ei ole vaatimus sivuston rakentamiselle tai pyörittämiselle. WEMASY-sivustonrakentajalla työskentelet visuaalisella editorilla, ja HTML syntyy automaattisesti.
Mitä eroa on HTML:llä ja sivustolla?
HTML on yksi sivuston rakennuspalikoista. Sivusto koostuu useista tiedostoista, joihin kuuluvat HTML rakenteelle, CSS tyylittelylle, JavaScript käyttäytymiselle, kuvat ja usein tietokanta, joka tallentaa sisällön. HTML on se, minkä selain lukee ymmärtääkseen, mitä sivulla on, mutta koko sivustokokemus syntyy siitä, että kaikki nämä kerrokset toimivat yhdessä.
Vaikuttaako HTML SEO:hon?
Kyllä, suoraan. Hakukoneet lukevat HTML:äsi ymmärtääkseen, mistä sivusi kertoo. Oikeiden tagien käyttö otsikoille, kappaleille, kuville ja linkeille kertoo hakukoneille, mitä kukin sisältö on ja kuinka tärkeää se on. Sivu, jolla on selkeä, semanttinen HTML, on hakukoneille helpompi indeksoida oikein kuin sivu, jonka koodi on epäjärjestyksessä tai turhan raskasta. Siksi sillä, että rakennat alustalle, joka tuottaa siistiä HTML:ää, on merkitystä sijoituksillesi.
Mitä on semanttinen HTML?
Semanttinen HTML tarkoittaa tagien käyttöä siten, että ne kuvaavat tarkasti sisältönsä tyypin. Otsikossa pitää käyttää otsikkotagia, ei kappaletagia, joka on tyylitelty näyttämään isolta. Luettelossa pitää käyttää luettelotagia, ei sarjaa rivinvaihtoja. Semanttinen HTML helpottaa sivusi ymmärtämistä selaimille, hakukoneille ja ruudunlukijoille. Se on hyvä käytäntö, joka vaikuttaa sekä saavutettavuuteen että SEO:hon ilman, että se vaatii mitään ylimääräistä näkyvää sisältöä.
Voiko huono HTML rikkoa sivustoni?
Huonosti kirjoitettu HTML voi aiheuttaa näyttöongelmia, hitaita latausaikoja ja ongelmia siinä, miten hakukoneet lukevat sivujasi. Selaimet ovat melko armollisia ja yrittävät näyttää sivun, vaikka HTML:ssä olisi virheitä, mutta tulos ei välttämättä näytä oikealta. Siksi alustan koodin laadulla on väliä. Luotettavan sivustonrakentajan tuottama hyvin jäsennelty HTML poistaa tämän riskin kokonaan.
Onko HTML samanlaista kaikilla sivustoilla?
HTML noudattaa World Wide Web Consortiumin määrittelemiä vakiosääntöjä, mikä tarkoittaa, että ydinkieli on kaikkialla sama. Se, miten HTML on kirjoitettu ja jäsennelty, vaihtelee kuitenkin paljon sivustojen välillä. Joillakin sivustoilla HTML on siistiä ja minimalistista. Toisilla on kerroksittain turhaa koodia. Ero näkyy nopeudessa, hakukonenäkyvyydessä ja siinä, kuinka hyvin sivu toimii eri selaimilla ja laitteilla.