Jos haluat tulla webmasteriksi ja oppia miten luoda verkkosivusto, saatat kokea, että HTML-koodin hallinta on melko pelottavaa.

Tätä ei kuitenkaan voida välttää, koska suurin osa vierailemistasi verkkosivustojen aloitussivuista on kirjoitettu ja jäsennelty HTML-elementeillä. Itse asiassa HTML on nyt käyttää yli 74 % kaikista tunnetuista verkkosivustoista, mutta tämä kieli auttaa myös parantamaan kaikkea sivustosi suunnittelusta sen sisällön laatuun.

Tässä oppaassa tutkimme HTML:n perusperiaatteita ja sen mahdollisia sovelluksia, ennen kuin tarkastelemme esimerkkejä yksittäisistä elementeistä, joita käytät verkkosivustosi koodauksessa.

Mikä on HTML?

Yksinkertaisesti sanottuna, HTML edustaa tavallista sivunkuvauskieltä web-sivujen luomiseen verkossa. Se on lyhenne sanoista Hyper Text Markup Language, ja sen tärkein tehtävä on määrittää yksittäisten aloitussivujen rakenne, asettelu ja esitystapa. Vaikka verkkoselaimet eivät näytä suoraan HTML-kieltä, sillä on keskeinen rooli näkyvän, saavutettavan ja helppokäyttöisen sivuston luomisessa.

HTML-koodia tukevat myös useat yksittäiset elementit, jotka vähitellen rakentavat verkkosivuja, jäsentävät sisällön esitystapaa ja tuovat sivustosi eloon. Nämä elementit luodaan ja sisältyvät "tunnisteisiin", jotka määrittelevät vaihtoehtoisia sisältöjä, kuten otsikoita, kappaleita ja vastaavia esimerkkejä.

Tutkimme näitä elementtejä ja niiden rakennetta yksityiskohtaisemmin alla ja tarkastelemme myös, kuinka ne voidaan mukauttaa värien, linkkien ja muuttuvan typografian lisäämiseksi verkkosivustollesi.

Missä HTML:ää käytetään?

Kuten näemme, yleisin HTML-sovellus on verkkosivustosi muodostavien yksittäisten aloitussivujen suunnittelu. Tämä ei ole suositun koodaustyökalun ainoa sovellus, mutta sen lisäkäytön ymmärtäminen auttaa sinua saamaan kaiken irti kielestä uutena verkkovastaavana. Joten tässä on joitain muita tapoja, joilla HTML:ää voidaan käyttää:

• Luo muokattavia elementtejä olemassa olevalle sivulle. Jos aiot sallia blogitekstien kommentteja tai käyttäjien luoman sisällön julkaiseminen verkkosivustollasi, voit ottaa tämän käyttöön HTML-koodinpätkien avulla. Näiden elementtien avulla käyttäjät voivat korostaa avainsanoja, upottaa linkkejä ja muotoilla kommentteja moderaattorina asettami rajoitusten mukaan.
• Luo lisäsisältöä sähköpostiin. Sähköposti käyttää myös HTML-kielenä RTF-viestejä, joissa on linkkejä, tekstiä ja monia muita elementtejä, joita ei voida esittää pelkkänä tekstinä. Joten jos haluat jakaa verkkosivustoosi liittyvän e-kirjan sähköpostitse, voit optimoida viestisi vaikutuksen HTML:n avulla.
• Ymmärrä tietokoneellesi asennetut offline-ohjeasiakirjat. Mielenkiintoista on, että HTML-muotoa käytetään tietokonepohjaisissa ohjeasiakirjoissa, jotka ovat käytettävissä offline-tilassa. HTML:n perustiedot voivat siksi auttaa sinua ymmärtämään laitteisto-ongelmia ja ratkaisemaan ne nopeammin, mikä puolestaan ​​voi varmistaa, että pystyt palauttamaan verkkosivustosi nopeammin tapauksissa, joissa se on mennyt offline-tilaan.

HTML-sivun rakenne

Ennen kuin voit rakentaa HTML-sivun, sinun on oltava perusasiat paikoillaan.

Tyypillisesti sivu koostuu kolmesta rakenneelementistä:

1. header: Otsikko sisältää sisältöä, joka liittyy kaikkiin sivustosi sivuihin, kuten logo tai verkkosivuston nimi ja navigointijärjestelmä. Otsikko näkyy jokaisella sivulla.
2. Pääosa: Tämä vie suurimman alueen verkkosivulla. Se sisältää tarkasteltavalle sivulle ominaista sisältöä.
3. Alatunniste: Alatunnisteen sisältö sisältää yleensä yhteystiedot, toimitusosoitteen tai oikeudellisia huomautuksia. Kuten ylätunniste, alatunniste näkyy jokaisella sivulla, mutta se on sijoitettu alareunaan.

Tältä nämä perusrakenneosat näyttävät, kun ne yhdistyvät:

Tässä on toinen esimerkki otsikkotunnisteiden ja kappaletunnisteiden käyttämisestä sisällön esteettiseen jäsentämiseen. Lisäksi olemme lisänneet alatunnisteen sisällölle sivun päätekstin alle:

HTML-tunnisteet

Kaikkien HTML-koodien lähtökohtana ovat yksittäiset tagit, joiden avulla voidaan luoda kaikki olennaiset elementit ja auttaa jäsentämään verkkosivujasi.

Alla tarkastellaan yleisimpiä tunnisteita, ennen kuin tutkimme, kuinka niitä voidaan hyödyntää tiettyjen sivulla olevien elementtien luomiseen:

Otsikkotagit

Kaikki verkkoasiakirjat, mukaan lukien verkkosivut, alkavat otsikolla. Ne on rakennettu HTML-tunnisteiden avulla, ja tällä hetkellä käytössä oleva kieli sallii jopa kuusi vaihtelevan kokoista elementtiä, joiden avulla voit myös jäsentää sisältöäsi lisäotsikoilla, tekstityksillä ja korostetuilla lihavoituilla riveillä. Aloita otsikko liittämällä asiaankuuluvan tekstin eteen , , , , tai -merkki halutun koon mukaan.

Tämän jälkeen sinun on lisättävä otsikon loppuun päättävä tagi tekstin kapseloimiseksi, ja se näytetään seuraavasti HTML-muodossa:

Kun tämä on vahvistettu, sivustosi aloitussivulla on seuraava estetiikka:

Tässä muuttujien otsikoiden eri koot ovat selvästi nähtävissä, samoin kuin se, että selain lisää rivin otsikon eteen ja jälkeen. Huomaat myös, että otsikkotekstin lopussa olevalla lopputunnisteella on hieman erilainen estetiikka, mutta se kattaa tämän seuraavassa luvussa, kun pyrimme käyttämään tunnisteita tiettyjen elementtien määrittelemiseen.

Kappaleen tunnisteet

Samanlaista periaatetta sovelletaan aloituskappaleen tunnisteisiin, joita kuvaa . Tämän avulla voit jäsentää sisältösi ja jakaa sen osuviin kappaleisiin, mikä puolestaan ​​​​merkitsee helpompaa ja saumattomampaa lukukokemusta. Jälleen kerran, -tunniste tulee sijoittaa asiaankuuluvan tekstin alkuun, ennen kuin vaihtoehtoinen sulkeva tagi lisätään loppuun tehosteen viimeistelemiseksi. Toisin kuin otsikkotunnisteet, ei kuitenkaan ole olemassa numeerisia lukuja, jotka voivat muuttaa kappaleessa näkyvän tekstin kokoa.

HTML-muodon ulkopuolella tämä jakaa tekstin valmiilla verkkosivullasi seuraavasti:

Rivinvaihtotunnisteet

Ensimmäiset esimerkit edustavat yksinkertaisimpia HTML-tageja, mutta on myös muita, jotka käyttävät eri muotoa ja vaihtoehtoisia sulkemismenetelmiä. Ota esimerkiksi rivinvaihdot, jotka erottavat tekstin rivit katkeavat ja jatkuvat seuraavalla rivillä. Rivinvaihtojen ja kappaleiden välillä on keskeinen ero HTML-kentässä, sillä kun jälkimmäiset ovat tavallisia tekstiä sisältäviä lohkoelementtejä, edellinen luo erottelun olemassa olevaan tekstiin. elementti.

Tästä johtuen rivinvaihdot edustavat tyhjää elementtiä HTML:ssä, joten niitä ei määritellä avaus- tai sulkemistunnisteilla. Sen sijaan ne on kuvattu tunniste, joka voidaan lisätä olemassa olevaan elementtejä hajottaaksesi tekstiä ja mahdollisesti korostaaksesi tärkeitä tietoja. Yksittäinen välilyönti hahmojen välillä ja kenoviiva on tärkeä, koska muuten tunnistetta ei voi tunnistaa HTML-muodossa.

Kun tämä on otettu käyttöön, teksti hajoaa seuraavasti:

Kuten näet, voit käyttää rivinvaihtoja niin usein kuin haluat olemassa olevassa kappaleelementissä, kunhan ne lisäävät arvoa ja helpottavat tietojen sulattamista. Näet myös, että aloitus- ja lopetuskappaleet pysyvät muuttumattomina, ja rivinvaihtotunnisteita käytetään muuttamaan tekstin asettelua.

Tämä on yksi esimerkeistä siitä, kuinka HTML-tageja voidaan käyttää olemassa olevien elementtien muuttamiseen, mikä on avainasemassa verkkosivujesi ja sisällön visuaalisen asettelun määrittelyssä.

Vaakaviivat

Samoin on olemassa muita tunnisteita, joita voidaan käyttää sisällä elementtiä tai erillisiä tekstiosia Web-sivullasi. Yksi laajimmin käytetyistä on -tunniste, joka auttaa luomaan tyhjän elementin, joka piirtää visuaalisen vaakaviivan online-asiakirjan vaihtoehtoisten osien väliin. Voit halutessasi sijoittaa rivin kahden tekstiosan väliin esimerkiksi tarkentaaksesi lukijaa tai yksinkertaisesti lisätäksesi uuden visuaalisen elementin. Näin luot tällaisen tauon HTML:ään:

Tässä hr-merkkien ja vinoviivan välinen katkaisu korostaa tyhjän elementin rakentamista, kun taaskaan tehosteen loppuun saattamiseksi ei tarvita sulkevaa tagia. Tämä luo seuraavan visuaalisen kuvan:

Kuvatunnisteet

Kuvatunnisteet edustavat myös tyhjiä elementtejä HTML:ssä, mikä taas tarkoittaa, että niissä ei ole sulkevaa tunnistetta. Koska ne sisältävät vain attribuutteja, jotka liittyvät sivustolle upotettavan kuvan URL-osoitteeseen, ne määritellään yksinkertaisesti tagi elementin alussa. Ne voidaan sijoittaa mihin tahansa sivustoosi, vaikka on epätavallista sisällyttää niitä olemassa oleviin elementteihin, kuten kappaleisiin tai otsikoihin. Tässä on, miten tyypillinen HTML-kuvatunniste esittää itsensä:

Sinun tulee myös tarjota kuvallesi vaihtoehtoista tekstiä, joka auttaa ihmisiä näkemään sen, jos latausajat ovat hitaita tai jos käytetään näytönlukuohjelmaa. Tällä tavalla, jos selain ei löydä kuvaa, se näyttää katsojille vaihtoehtoisen attribuutin arvon. Tämä käyttää jälleen kuvatunnistetta, mutta sisältää erilaiset attribuutit:

HTML-elementit

Aiemmin tarkastelimme, kuinka yksinkertaisia ​​HTML-tageja käytetään määrittämään sivun elementtejä, ja samalla tutkimme, kuinka niitä voidaan mukauttaa edelleen käyttämällä tyhjiä elementtejä, jotka sisältävät kuva- ja rivinvaihtotunnisteita. Tämä auttaa meitä ymmärtämään tunnisteiden ja elementtien välisen suhteen ja kuinka niitä voidaan käyttää määrittämään erilaisia verkkosivustosi sisältötyyppejä.

Vaikka kaikki HTML-kielen osa-alueet esitetään esimerkiksi tunnisteella, määritellyllä elementillä, joka sisältää sisältöä, on oltava sekä aloitus- että lopputunniste. Otsikot ja kappaleet ovat siis HTML-elementtejä, koska ne käyttävät aloitus- ja lopetustageja koteloimaan ja täydentämään asiaankuuluvaa tekstiä. Sitä vastoin tyhjät elementit sisältävät joko attribuutteja tai eivät ollenkaan sisältöä, jolloin niitä voidaan käyttää olemassa olevissa elementeissä ilman sulkevaa tunnistetta.

HTML-elementtien määrittely

Kun käytät esimerkkejä, kuten otsikoita ja kappaleita, aloitus- ja sulkemistunnisteiden oikea käyttö on ratkaisevan tärkeää. Se on aloitustunniste (esim tai ), joka määrittää esimerkiksi kyseisen elementin, kun taas sulkeva tagi varmistaa, että tätä elementtiä ei jatketa ​​verkkosivun loppuosassa. Jos et käytä sulkemista tagi halutun kappaleen lopussa, esimerkiksi teksti näkyy yhtenä lohkona, joka on ruma ja erittäin vaikea lukea.

Kaikki lopputunnisteet ovat identtisiä alkutunnisteiden kanssa lukuun ottamatta sitä tosiasiaa, että edellisissä on vinoviiva ennen asiaankuuluvia merkkejä. Joten tapauksessa an otsikkoa, sulkeva tagi on , kun taas kappaleissa käytät aina määrittääksesi tekstin tauon. Tämä vaatii huomiota yksityiskohtiin koodattaessa, ja on tärkeää huomata otsikoita ohjelmoitaessa, että käyttämääsi numeroa (kuten h1 tai h1) käytetään sekä aloitus- että lopputunnisteissa.

Sisäkkäisten HTML-elementtien käyttö

Tässä vaiheessa on selvää, että HTML-dokumentit ja web-sivut muodostuvat eri elementtien puusta, jotka toimivat rakennuspalikkaina joukolle omaisuutta. Olemme myös tarkastelleet, kuinka näitä elementtejä voidaan muodostaa ja käyttää verkkosisällön jäsentämiseen, ja jatkamme tätä nyt tarkastelemalla sisäkkäisiä HTML-elementtejä.

Aivan kuten tyhjät elementit ja erilliset tunnisteet (esim voidaan sisällyttää määriteltyihin HTML-elementteihin, niin sanottuja sisäkkäisiä elementtejä voidaan myös sijoittaa sisältöön, kuten otsikoihin ja kappaleisiin. Näitä ovat esimerkkejä, kuten lihavoitu ja kursivoitu kirjain ja alleviivattu teksti, ja niitä voidaan käyttää lisäämään sisältöösi persoonallisuutta ja kiinnittämään lukijan katseet tiettyihin kiinnostaviin kohteisiin.

Lihavoitu, kursivoitu ja yliviivattu teksti HTML:ssä

Oletetaan, että haluat korostaa sanan olemassa olevassa kappaleelementissä. Voit saavuttaa tämän lihavoitumalla käyttämällä standardin sisällä olevia yksinkertaisia ​​tageja elementti. HTML:n avulla ohjelmoit tämän seuraavasti:

Tässä sisäkkäisellä elementillä on sekä aloitus- että lopetustunniste, joista jokainen noudattaa samanlaista muotoa kuin otsikoihin ja kappaleisiin liittyvät. Niitä voidaan käyttää saumattomasti olemassa olevien elementtien sisällä, ja tässä tapauksessa se tuottaa seuraavat tulokset:

Oletetaan nyt, että haluat myös muuttaa tämän sanan typografiaa niin, että se on myös kursivoitu. Tämä voidaan saavuttaa yksinkertaisesti lisäämällä toinen sisäkkäinen elementti, joka tulisi koodata seuraavasti:

Kuten näet, kursiivilla aloitus- ja lopputunnisteet on yksinkertaisesti sisällytetty elementti. Tämä muuttaa nyt elementin sisällön siten, että se näyttää seuraavalta:  

Voit tietysti päättää, että haluat korostaa tätä sanaa eri tavalla. Voit siksi käyttää vaihtoehtoista sisäkkäistä elementtiä, kuten yliviivausta (jota edustavat ja -tunnisteet. Näitä tunnisteita voidaan käyttää samalla tavalla elementti, joka näkyy HTML:ssä seuraavasti:

Tässä tapauksessa teksti näkyy asiakirjassasi tai aloitussivullasi seuraavasti:  

Tämä tarjoaa käsityksen elementeistä, jotka voidaan muodostaa tunnisteilla, mikä puolestaan ​​määrittää verkkosivujesi rakenteen ja niiden sisällön. Tämän lisäksi tyhjiä ja sisäkkäisiä elementtejä voidaan käyttää myös sisällön määrittelyyn.

HTML-määritteet

Jos tunnisteet ovat elementtejä rakentavia ja määritteleviä rakennuspalikoita, HTML-attribuutteja voidaan käyttää niiden ominaisuuksien (kuten tyylin, värin ja kielen) mukauttamiseen. Kaikilla HTML-elementeillä on ydinattribuutit, jotka tarjoavat ydintiedot ja jotka on aina määritelty stat-tunnisteessa. . Ne ​​tulevat yleensä pareittain, joten ne näkyvät usein seuraavassa muodossa: nimi=”arvo.“

Yksinkertaisesti sanottuna nimi edustaa ominaisuutta, jonka haluat asettaa, kun taas arvo liittyy tiettyihin kriteereihin, jotka haluat sisällyttää.

HTML-elementteihisi voidaan soveltaa monia attribuutteja, mutta aloitteleville verkkovastaaville tärkeimmät attribuutit ovat:

"lang"-attribuutti

Yksittäisin perusattribuutti määrittää asiakirjan ja sen elementtien kielen. Se ilmoitetaan käyttämällä "lang"-attribuuttia, ja vaikka se jää helposti huomiotta, sen etuna on, että sisältö on helpommin näytönlukijoiden ja hakukoneiden saatavilla. Se esitetään yleensä asiakirjan alussa seuraavassa muodossa:

Lang-attribuutin jälkeen kaksi ensimmäistä kirjainta määrittävät kielen (tässä tapauksessa englanti). Tavuviivan jälkeen kaksi seuraavaa kirjainta muodostavat murteen, vaikka tämä ei ole läsnä kaikilla kielillä. On tärkeää, että ymmärrät tämän ominaisuuden oikein, jos aiot tavoittaa yleisösi onnistuneesti.

Tasaa-attribuutti

Olemme jo käsitelleet HTML-attribuuttien muotoa (name=”value”), ja paras suoritusmuoto tästä ilmenee, kun yrität kohdistaa sisältöä elementtien sisällä. Voit esimerkiksi keskittää kaikki kappaleet tietylle sivulle siten, että tasaus on ominaisuus, jonka haluat määrittää. Myöhemmin 'keski' on attribuutin arvo, vaikka voit valita, tasaatko tekstisi vasemmalle tai oikealle.

Tämä kohdistaa sinun elementit sivun keskelle ja luo yhtenäinen asettelu, joka sopii verkkosivustosi luonteeseen (katso alla):

Attribuutti "href".

Jos aiot rakentaa näkyvän verkkosivuston, on tärkeää, että sisällytät sekä saapuvia että lähteviä linkkejä. Linkkiportfolion rakentaminen, joka sisältää käänteisiä linkkejä sisäisille aloitussivuille, on myös toteuttamiskelpoinen strategia, joten sinun on opittava koodaamaan nämä HTML-muodossa.

HTML-linkit määritellään tagilla, joka sisältää kohdelinkin sekä sidoksissa olevan ankkuritekstin, joka sisältää URL-osoitteen. Se on "href"-attribuutti, joka määrittää sivuston osoitteen, mutta se sisältyy aloitustunnisteeseen. Se on koodattu HTML:llä seuraavasti:

Tämä korostaa selvästi eroa aloitus- ja lopputunnisteen välillä, ja se käännetään aloitussivullasi seuraavasti:

Attribuutti "väri".

Tämä on toinen tärkeä ominaisuus, sillä värien käyttö voi puhaltaa eloa verkkosivustollesi ja auttaa samalla luomaan tärkeitä kontrasteja ja vahvaa suunnittelun estetiikkaa. HTML:ssä väri voidaan määrittää käyttämällä sen nimeä, vaikka tämän tavoitteen saavuttamiseksi on myös mahdollista käyttää RGB- tai HEX-arvoa. Edellinen vaihtoehto on kuitenkin helpoin seurata, mutta sitä voidaan soveltaa myös otsikoihin, kappaleisiin ja muihin sivusi elementteihin.

Tämä on tyylimäärite, jonka valitsemasi väri edustaa arvoa, jonka haluat asettaa. Kun esimerkiksi käytät punaista väriä pääotsikkoon, se näyttää tältä:

Kun tämä elementti on otettu käyttöön, se näkyy verkkosivustollasi seuraavasti:

Jälleen kerran on selvä ero alku- ja lopputunnisteiden välillä, jotka määrittävät elementin, vaikka tämä on yksi helpoimpia määritteitä HTML:ssä. Se myös korostaa entisestään HTML-attribuuttien name=”value-muotoa, mikä helpottaa oppimisprosessia ja niiden soveltamista verkkosivustollasi.

Testaa itse

Kun sinulla on perusymmärrys HTML:stä ja sen yksittäisistä elementeistä, seuraava askel on toteuttaa joitain yksinkertaisia ​​projekteja ja soveltaa teoreettista tietämystäsi käytännön haasteiden ratkaisemiseen.  

Alla kuvatussa harjoituksessa olemme esittäneet tekstiä paitsi ja pyytäneet muotoilemaan eri näkökohtia HTML:n avulla. Käytä opasta ja kaikkea tähän mennessä oppimaasi haasteen suorittamiseen valmistautuessasi koodaamaan omaa verkkosivustoasi.

kysymykset:

1. Täydennä otsikkoelementti oikealla lopputunnisteella.
2. Lihavoi otsikko.
3. Lisää vaakasuora viiva otsikon alle.
4. Käytä värimääritettä ja sävyä "Kiitos vierailustasi" vihreänä
5. Lisää tämä hyperlinkki (https://www.w3schools.com/html/) ankkuritekstiin "Lisätietoja".
6. Käytä sivun yläreunassa muotoa name=”value” tasataksesi kappaleet vasemmalle

HTML-kielen tilastot ja faktat

1. HTML-, head- ja body-elementit ovat olleet osa HTML-spesifikaatiota 1990-luvun puolivälistä lähtien, ja vielä muutama vuosi sitten ne olivat ensisijaisia ​​elementtejä, joilla HTML-dokumentteja rakennettiin. Tilanne on kuitenkin muuttunut dramaattisesti muutaman viime vuoden aikana, kun HTML5 on lisännyt joukon uusia tunnisteita, joiden avulla voidaan lisätä rikas semanttinen merkitys HTML-dokumentin rakenteeseen.
2. HTML-dokumentit vaaditaan alkamaan asiakirjatyypin ilmoituksella (epävirallisesti "doctype"). Selaimessa doctype auttaa määrittämään renderöintitilan. HTML5 ei määrittele DTD:tä; siksi HTML5:ssä doctype-ilmoitus on yksinkertaisempi ja lyhyempi.
3. Mobiiliselaimet ovat ottaneet täysin käyttöön HTML5:n, joten mobiilivalmiiden projektien luominen on yhtä helppoa kuin pienempien kosketusnäyttöjen suunnittelu ja rakentaminen – tästä johtuu Responsive Designin suosio. On olemassa hienoja sisällönkuvauskenttiä, joiden avulla voit myös optimoida mobiililaitteille.  
4. Sisällönkehittäjistä 78 % on samaa mieltä siitä, että rakenne sopii mobiilisovellusten luomiseen, ja 68 % sanoo, että se soveltuu minkä tahansa ja kaikenlaisten sovellusten suunnitteluun.
5. HTML5 sisältää myös joukon mahtavia sovellusliittymiä, joiden avulla voit rakentaa paremman käyttökokemuksen ja tehokkaamman, dynaamisemman verkkosovelluksen – tässä on nopea luettelo alkuperäisistä API:sta:
   • Vedä ja pudota (DnD)
   • Offline-tallennustietokanta
   • Selaimen historian hallinta
   • Asiakirjan muokkaus
   • Ajastettu median toisto
6. HTML5 ei ole yhden yrityksen hallinnassa. Yksi sen parhaista ominaisuuksista on se, että se on avoin standardi. Kehittäjillä on vapaus antaa luovuutensa virrata ja lisätä niin paljon toimintoja ja ominaisuuksia kuin mahdollista.
7. Muihin selaimiin verrattuna jokainen Google Chrome -päivitys sisältää tuen HTML5:lle. Lisäksi YouTuben oletussoitin on nyt HTML5, ja Googlen Flash-mainokset muunnetaan nyt HTML5:ksi.
8. HTML5:n käyttö kehittäjien toimesta (alueittain):
   • Pohjois- ja Latinalainen Amerikka – 70 %
   • Etelä-Amerikka – 61 %
   • ASPAC – 60 %
   • Australia - 60%
   • Eurooppa – 59 %
   • Afrikka - 50 %

Yhteenveto

Vaikka HTML luotiin vasta vuonna 1991 (ensimmäinen koodauskielen versio julkaistiin myöhemmin vuonna 1995), siitä on nopeasti tullut tärkeä työkalu toimivien ja visuaalisesti houkuttelevien verkkosivustojen suunnittelussa. Myös HTML:n vaikutusaste kehittyy jatkuvasti, ja uusin iteraatio (HTML5) on otettu käyttöön yhä useammalla verkkosivustolla ympäri maailmaa.

Tässä suhteessa HTML:n peruselementtien ja niiden soveltamisen oppiminen on tärkein yksittäinen askel, jonka otat onnistuneen, näkyvän ja viime kädessä kilpailukykyisen verkkosivuston luomisessa.