Html:n oppiminen tyhjästä. HTML-perusteet aloittelijoille. Käytännön harjoitustehtävä HTML-asettelusta

Päätin kiinnittää enemmän huomiota aloittelijoihin, jotka haluavat hankkia tietoa verkkosivustojen rakentamisesta. Opettajani pakotti minut tähän, koska hän teki paljon virheitä laboratoriotyön käsikirjoissa. Katson mielelläni resurssia, josta koulutustieto on otettu, ja jätän sinne muutaman rivin mielipiteeni. Mutta siitä ei nyt ole kyse. Ensimmäisellä luennollani puhun

Mikä on HTML-dokumentin rakenne?

Tunniste osoittaa, että html-dokumentin rakenne alkaa ja päättyy. Suurin osa selaimen ja hakukoneiden tiedoista on tallennettu tunnisteiden väliin. Tagit sisältävät sivumme otsikon. Tunniste ilmaisee, että lisätiedot on tarkoitettu käyttäjälle, ja luonnollisesti ilmaisee, että käyttäjän tiedot loppuvat.

Selitän nyt hieman. Kaikki tunnisteet ( tag - hypertekstin merkintäkielen elementti) on jaettu kahteen tyyppiin: "yksittäinen" ja "sulkeva". Lisäksi tunnisteet on suljettu seuraaviin merkkeihin< и >, ne erottavat tunnisteen tavallisesta html-tekstistä. Katsotaanpa muutamia yksinkertaisimpia "yksittäisiä" tunnisteita:


— tunniste, joka vastaa uudelle riville siirtymisestä paikassa, johon tämä tunniste on asennettu. Katsotaanpa koodia käyttämällä tätä tagia.

Ensimmäinen nettisivuni Hei kaikille!
Ja tämä on ensimmäinen sivustoni.

Tulos on katsottavissa.

— tunniste, joka piirtää vaakasuuntaisen viivan. Tämä tagi koskee lohkoelementtejä, rivi alkaa aina uudelta riviltä. Siinä on 5 attribuuttia:

  • tasaa — Määrittää viivan kohdistuksen. Voi ottaa arvon vasemmalle, keskelle, oikealle.
  • väri — Asettaa viivan värin.
  • noshade - Piirtää viivan ilman 3D-tehosteita.
  • koko — Asettaa viivan paksuuden.
  • leveys — Asettaa viivan leveyden.

Koodi käyttämällä tagia:

Ensimmäinen sivustoni Hei kaikille Tämä on ensimmäinen sivustoni.

Visuaalinen esimerkki löytyy täältä.

Toinen "yksittäinen" tunniste on . Tätä tunnistetta käytetään selaimille ja hakukoneille tarkoitettujen tietojen tallentamiseen. Hakukoneet etsivät sisällönkuvauskenttiä saadakseen sivustojen kuvaukset, avainsanat ja muut tiedot. Voit käyttää rajoittamattoman määrän sisällönkuvauskenttiä, kaikkien niiden on oltava välillä ja . Minkä tahansa sisällönkuvauskentän parametrit ovat muotoa "name=arvo", joka määräytyy avainsanoilla content , name tai http-equiv . Koska metatagit on tarkoitettu koneille, ne eivät tee mitään visuaalisia muutoksia, joten annan vain lähdekoodin:

Tämä rivi osoittaa, että sivun luoja uskoo, että sivu käyttää UTF-8-koodausta. HTML5:ssä kaikesta on tullut yksinkertaisempaa, jotta voit määrittää koodauksen, tarvitset vain seuraavan rivin:

On olemassa muita yksittäisiä tunnisteita (, ,
, , , , , , , , , , , , , ), mutta esittelen ne hieman myöhemmin.

Puhutaanpa nyt "sulkevista" tunnisteista. Jo nimi "sulkeva tagi" osoittaa, että tagi vaatii pakollisen sulkemisen. Tämä tehdään, jotta voidaan selvästi rajoittaa sitä tekstin osaa, johon tunniste vaikuttaa.

Tarkastellaan selkeää esimerkkiä tagista, jota käytetään tekstin korostamiseen. Se asettaa fontin lihavoiduksi. Tunnisteet ovat rajoja, jotka määrittävät tekstin valintaalueen. Tässä on koodi, jossa he unohtivat sulkea tagin viimeisellä rivillä:

Ensimmäinen nettisivuni Hei kaikille! Ja tämä on ensimmäinen sivustoni.
Hei kaikki! Ja tämä on ensimmäinen sivustoni.

Kuten näette, siinä ei ole mitään monimutkaista, nyt voit luoda useita toisiinsa linkitettyjä sivuja.

Tunnisteet tekstin korostamiseen

On olemassa useita tapoja korostaa sivulla olevaa tekstiä. Tämä voidaan tehdä käyttämällä tyylejä tai voit käyttää tunnisteita. Olemme (toistaiseksi) kiinnostuneita toisesta vaihtoehdosta.

— asettaa fontin lihavoiduksi.

— määrittää kursivoitun kirjasintyylin.

- lisää tekstiin alleviivauksen.

— Tarkoituksena on korostaa tekstiä. Selaimet näyttävät tämän tekstin kursiivilla.

- ylittää tekstin. Tämä tagi on poistettu HTML5:stä, sen sijaan on suositeltavaa käyttää sitä

— näyttää tekstin yksivälisenä tekstinä. Poistettu HTML5:stä.

— näyttää fontin yläindeksinä. Fontti näkyy tekstin perusviivan yläpuolella ja pienennettynä.

— näyttää fontin alaindeksinä. Teksti sijoitetaan rivin muiden merkkien perusviivan alapuolelle ja pienennetään kokoa.

— Tarkoituksena on korostaa tekstiä. Selaimet näyttävät tämän tekstin lihavoituna.

— pienentää kirjasinkokoa yhdellä verrattuna tavalliseen tekstiin. HTML:ssä fonttikokoa mitataan tavanomaisissa yksiköissä 1-7, keskimääräinen tekstin oletuskoko on 3. Tunniste pienentää tekstiä yhdellä tavanomaisella yksiköllä. Sisäkkäiset tagit ovat sallittuja, ja kirjasinkoko on 1 pienempi jokaisella sisäkkäisellä tasolla, mutta se ei voi olla pienempi kuin 1.

— suurentaa kirjasinkokoa yhdellä verrattuna tavalliseen tekstiin. HTML:ssä fonttikokoa mitataan yksiköissä 1-7, keskimääräinen tekstin oletuskoko on 3. Eli tagin lisääminen lisää tekstiä yhdellä yksiköllä. Sisäkkäiset tagit ovat sallittuja, ja kirjasinkoko kasvaa jokaisella tasolla.

- käytetään korostamaan lainauksia tekstissä. Säilön sisältö näytetään automaattisesti selaimessa lainausmerkeissä.

— suunniteltu korostamaan pitkiä lainauksia asiakirjassa. Tällä tunnisteella merkitty teksti näytetään perinteisesti kohdistettuna lohkona, jonka vasemmalla ja oikealla puolella on täyte (noin 40 pikseliä) sekä täyttö ylä- ja alareunassa.

— määrittää valmiiksi muotoillun tekstin lohkon. Tällainen teksti näytetään yleensä yksivälisellä fontilla ja kaikki välilyönnit sanojen välillä. Oletusarvoisesti mikä tahansa määrä välilyöntejä koodissa rivissä näkyy yhtenä verkkosivulla. Tunniste Voit ohittaa tämän ominaisuuden ja näyttää tekstiä kehittäjän vaatimalla tavalla.

— määrittää tekstikappaleen. Tag

Se on lohkoelementti, alkaa aina uudelta riviltä, ​​toisiaan seuraavat tekstin kappaleet erotetaan täytteillä. Pehmusteen määrää voidaan säätää tyyleillä. Jos lopputunnistetta ei ole, kappaleen lopun katsotaan osuvan yhteen seuraavan lohkoelementin alun kanssa.

.... - HTML tarjoaa kuusi otsikkoa eri tasoilla, jotka osoittavat otsikon jälkeisen osion suhteellisen tärkeyden. Siten tunniste edustaa ensimmäisen tason tärkeintä otsikkoa ja tunniste ilmaisee kuudennen tason otsikkoa ja on vähiten tärkeä. Oletusarvoisesti ensimmäisen tason otsikko näytetään suurimmalla lihavoitulla fontilla, ja seuraavat tason otsikot ovat kooltaan pienempiä. Tunnisteet ,..., viittaavat lohkoelementteihin, ne alkavat aina uudelta riviltä ja niiden jälkeen seuraavalla rivillä näytetään muut elementit. Lisäksi otsikon eteen ja jälkeen lisätään välilyönti. Tunnisteella on align-attribuutti, joka määrittää otsikon tasauksen, sillä se voi saada seuraavat arvot: vasemmalle - vasemmalle tasattu otsikko, keskelle - tasattu keskelle, oikealle - tasattu oikealle, tasattu - tasattu (sekä oikealle että vasemmalle); -linjattu). Tämä arvo toimii vain otsikoille, jotka ovat pidempiä kuin yksi rivi.

— on säiliö fontin ominaisuuksien, kuten koon, värin ja kirjasintyypin, muuttamiseen. Vaikka kaikki selaimet tukevat edelleen tätä tunnistetta, sitä pidetään vanhentuneena ja sen käytöstä suositellaan luopumista tyylien hyväksi. Tunnisteella on 3 attribuuttia: color — määrittää tekstin värin, face — määrittää fontin kirjasintyylin, koko — asettaa fontin koon tavanomaisina yksikköinä.

— merkitsee tekstin lainaukseksi tai alaviitteeksi muuhun materiaaliin. Tämä korostus on hyödyllinen tekstin tyylin muuttamisessa CSS:n kautta, ja sitä käytetään myös HTML-koodin erottamiseen rakenneelementeiksi. Selaimet asettavat yleensä säilön sisällä olevan tekstin kursivoituksi.

— osoittaa, että merkkijono on lyhenne. Otsikko-attribuutin avulla lyhenne puretaan, jolloin ihmiset, jotka eivät tunne sitä, voivat ymmärtää lyhenteen. Lisäksi hakukoneet indeksoivat lyhenteen kokotekstiversion, jonka avulla voidaan parantaa asiakirjan sijoitusta.

Säilön sisällä oleva teksti on oletusarvoisesti alleviivattu katkoviivalla.

Alla on koodi, jossa käytin kaikkia näitä tageja:

Ensimmäinen sivustoni

HTML ja CSS ovat kaksi Web-sivujen rakentamisen ydinteknologiaa. HTML tarjoaa sivun rakenteen ja CSS (visuaalisen ja auralisen) asettelun useille laitteille. Grafiikan ja komentosarjojen ohella HTML ja CSS ovat Web-sivujen ja verkkosovellusten rakentamisen perusta. Lisätietoja alla:

Mikä on HTML?

HTML on kieli Web-sivujen rakenteen kuvaamiseen. HTML antaa kirjoittajille keinot:

Julkaise verkkodokumentteja, joissa on otsikoita, tekstiä, taulukoita, luetteloita, valokuvia jne.
Hae online-tiedot hypertekstilinkkien kautta napin painalluksella.
Suunnittele lomakkeet etäpalveluiden asiointiin, käytettäväksi tiedonhaussa, varausten tekemisessä, tuotteiden tilaamisessa jne.
Sisällytä laskentataulukoita, videoleikkeitä, äänileikkeitä ja muita sovelluksia suoraan asiakirjoihin.
HTML:ssä kirjoittajat kuvaavat sivujen rakennetta merkintöjen avulla. Kielen elementit merkitsevät sisältöä, kuten "kappale", "luettelo", "taulukko" ja niin edelleen. Mikä on XHTML?

XHTML on a HTML-versio joka käyttää XML:n syntaksia, Extensible Markup Language. XHTML sisältää kaikki samat elementit (kappaleille jne.) kuin HTML-muunnelmassa, mutta syntaksi on hieman erilainen. Koska XHTML on XML-sovellus, voit käyttää sen kanssa muita XML-työkaluja (kuten XSLT:tä, XML-sisällön muuntamiseen tarkoitettua kieltä).

Mikä on CSS?

CSS on kieli, jolla kuvataan Web-sivujen esitystapaa, mukaan lukien värit, asettelu ja fontit. Se mahdollistaa esityksen mukauttamisen erityyppisiin laitteisiin, kuten suuriin näyttöihin, pieniin näyttöihin tai tulostimiin. CSS on HTML:stä riippumaton ja sitä voidaan käyttää minkä tahansa XML-pohjaisen merkintäkielen kanssa. HTML:n erottaminen CSS:stä helpottaa sivustojen ylläpitoa, tyylisivujen jakamista sivuille ja sivujen räätälöimistä eri ympäristöihin. Tätä kutsutaan rakenteen (tai: sisällön) erottamiseksi esityksestä.

Mikä on WebFonts? WebFonts on tekniikka, jonka avulla ihmiset voivat käyttää fontteja tarpeen mukaan Webissä ilman asennusta käyttöjärjestelmään. W3C:llä on kokemusta ladattavista fonteista HTML:n, CSS2:n ja SVG:n kautta. Viime aikoihin asti ladattavat kirjasimet eivät ole olleet yleisiä Webissä yhteentoimivan kirjasinmuodon puuttumisen vuoksi. WebFonts pyrkii ratkaisemaan tämän luomalla alan tukeman avoimen kirjasinmuodon Webille (nimeltään "WOFF").

Luento on päättynyt, toivottavasti hankituista tiedoista on sinulle hyötyä! Seuraavalla luennolla kerron mitä tagi tallentaa, opimme tekemään kaikenlaisia ​​manipulaatioita kuvilla ja tutustumme tauluihin.

Tätä artikkelia kirjoitettaessa joidenkin tunnisteiden kuvaus on otettu täältä

Tällä sarjalla haluan avata HTML:lle omistetun oppituntisarjan. Tein tämän päätöksen, koska haluaisin yrittää opettaa käyttäjille, kuinka luoda verkkosivustoja tyhjästä. Tämä ajatus on pyörinyt päässäni jo pitkään. Ainoa kysymys, joka heräsi, oli mistä aloittaa, HTML-koodilla vai edetä suoraan moottorin asentamiseen ja konfigurointiin.

Mutta jos aloitat opettelemalla moottorin, jotkut käyttäjät, jotka eivät tunne HTML:ää, jäävät ulkopuolelle. Niinpä päätin aloittaa perusasioista ja tehdä sen niin, että kuka tahansa aloittelijakin voisi keksiä mitä ja miten.

Joten mikä on HTML?

Itse lyhenne tarkoittaa Hypertext Markup Language (Hypertext Markup Language).

Yksinkertaisesti sanottuna HTML on erityinen merkintäkieli, joka kertoo selaimelle, kuinka tietty Web-sivu näytetään. Eli millä fontilla teksti tulee esittää, missä järjestyksessä elementit tulee järjestää, mitkä elementit näytetään alleviivattuina jne. Ja riippuen siitä, minkä elementin selain kohtaa, selaimen itsensä määrittelemien sääntöjen mukaisesti , tämä elementti näkyy tällä tavalla. Näitä sääntöjä voidaan kuitenkin muuttaa, mutta puhun tästä seuraavilla oppitunneillani, jotka on omistettu CSS:lle.

Aloitan tarkastelemalla esimerkkiä yksinkertaisimmasta web-sivusta, joka voi olla. Nyt sinun ei pitäisi keskittyä siihen, mitä tietyt tunnisteet tarkoittavat. Kaikella on aikansa, aluksi, kiinnitä vain huomiota siihen, missä kaikki on koodissa ja miten se kaikki liittyy selaimessa näkyvään. Harkitse esimerkkiä HTML-dokumentista:

Sivun otsikko Yksi päivä elämässäni Valmistaudun konserttiin

Tänään heräsin aikaisin, koska minulla oli vaikea päivä edessä. Joudunhan tänään esiintymään konsertissa sadan katsojan edessä. Ja varmistaakseni, että kaikki menee hyvin, minun on toistettava harjoitusohjelma

Harjoitus

Kaikki sujui ongelmitta. Kukaan tiimistämme ei menettänyt rytmiä, ja kuten kävi ilmi, kaikki huolestuivat turhaan.

Konsertti

Kaikki esiintyivät hyvin, vaikka uskon, että oli hetki, jolloin rumpalimme menetti temponsa. Mutta taitavasti selvisimme tilanteesta.

Ensin sinun on kirjoitettava tämä teksti johonkin tekstieditoriin (minusta kätevin on Notepad ++) ja tallentaa tiedosto nimellä index .html jonnekin levyllesi. Kun kaksoisnapsautat tallennettua tiedostoa, näet sivun, joka näyttää suunnilleen tältä.

Huomaa, että itse tunnisteita ei näytetä, mutta itse niiden välissä oleva sisältö näytetään. Ja tästä voit päätellä, että tagit toimivat suunnitteluelementteinä HTML:ssä.

Katso lähdekoodi. Kuten olet ehkä jo huomannut, sanan "yksi" edessä on pieni sisennys. Selain ei kuitenkaan ottanut sitä huomioon, se vain nielaisi sen hiljaa, ikään kuin sitä ei olisi koskaan ollut olemassa. Lisäksi, jos yrität laittaa sanojen väliin monta välilyöntiä, selain havaitsee ne kaikki yhtenä välilyöntinä - HTML:ssä on tämä ominaisuus.

Ja tässä on toinen neuvo: kun kirjoitat HTML-koodia, harjoittele itsesi sisentämään ne tunnisteet, jotka ovat sisäkkäin muiden sisällä. Esimerkiksi otsikko- ja body-tunnisteet on sijoitettu html-tunnisteen sisälle. Tämä tarkoittaa, että kun kirjoitat näitä tunnisteita, älä unohda sisentää niitä vastaavasti. Yleensä ne tehdään käyttämällä kahta välilyöntiä tai välilehteä - tämä on makuasia. Miksi tämä on välttämätöntä? Nyt siinä pienessä asiakirjassa, jonka annoin yllä esimerkkinä, ei ole paljon tietoa, joten on melko ongelmallista hämmentää siellä. Jos sivulla on kuitenkin monia sisäkkäisiä elementtejä, mikään ei ole helpompaa kuin eksyä tähän valtavaan koodiin ja sinun on vaikea selvittää, missä asiakirjan osassa olet nyt. Joten on parempi tottua heti hyvään tyyliin, niin ymmärrät sen itse ja se palvelee sinua hyvin jatkossa.

On myös syytä ilmoittaa HTML-dokumentissa olevien tunnisteiden vähimmäismäärä. Puhun tästä osasta:

Mutta vaikka tämä osa puuttuisikin, useimmat selaimet sulkevat silmänsä tälle ja näyttävät silti sivusi. Tällainen kevytmielinen koodaustyyli, jossa henkilö ohittaa suuren määrän tageja, on kuitenkin huono kirjoitusmuoto, joten on suositeltavaa, että kaikki nämä elementit ovat sivullasi joka tapauksessa. Muuten tämä voi aiheuttaa yhteensopivuusongelmia muiden selainten kanssa, mikä voi viime kädessä vaikuttaa sivustosi ulkonäköön ja sen seurauksena liikenteeseen.

Lisäksi voit kirjoittaa kommentteja HTML-dokumenttiin - nämä ovat puhtaasti palvelutietoja, jotka on tarkoitettu yksinomaan sinulle. Yleensä nämä ovat tärkeitä huomautuksia, jotka toimivat sinulle muistutuksena tai vain huomion arvoisena asiana. Selain ei käsittele kommentteja, mikä tarkoittaa, että käyttäjä ei näe niitä. Yleensä ne kirjoitetaan näin:

Yritetään nyt selvittää itse, mikä yllä olevassa esimerkissämme oleva tunniste on vastuussa mistä.

html-tunniste tarkoittaa, että html-koodin tulostus alkaa.

head – huoltotiedot. Mukana on muun muassa otsikko , joka vastaa selainikkunan otsikossa olevasta tekstistä. Tätä osiota voidaan myös käsitellä tietona, jonka haluamme kertoa selaimelle tästä sivusta.

body – asiakirjan pääosa alkaa.

h 1 – otsikko.

h 2 – tekstitys.

p – kappale.

Siinä varmaan kaikki! Jos tämä oli ensimmäinen HTML-dokumenttisi, onnittelut! Kyllä, hän ei näytä niin hyvältä kuin haluaisimme. Mutta siitä huolimatta meillä on materiaalia, jota voimme jo työstää. Ja seuraavilla tunneilla kaikki on vielä mielenkiintoisempaa, ja kosketamme hitaasti työskentelyä CSS:n (Cascading style sheets) kanssa.

  • < Назад

Kommentoidaksesi sinun tulee rekisteröityä.

Hei kaikki!!! Olen erittäin iloinen, että päätit valloittaa HTML:n perusteiden korkeudet ja tämä on oikea valinta. Loppujen lopuksi, ennen kuin luot ensimmäisen verkkosivustosi, sinun on tiedettävä HTML:n perusteet. Lisäksi joudut käsittelemään HTML-koodausta verkkosivustolla useammin kuin kerran. Suosittelen lämpimästi tutustumaan blogissani oleviin HTML-opetusohjelmiin aloittelijoille, ja takaan, että tämän kurssin suorittamisen jälkeen pystyt helposti luomaan web-sivun tai jopa verkkosivuston itse.

Aloitetaan! Otetaan ensin selvää
HTML – (englanniksi. H ypert ext M arkup L kieli) on hypertekstikuvauskieli. Sen kehitti ensimmäisen kerran brittiläinen tiedemies Tim Berners-Lee vuosina 1991-1992. HTML oli tarkoitettu vain tekstin, kuvien ja taulukoiden merkitsemiseen verkkosivuille. Nyt ohjelmointikieliä, kuten JavaScript ja VBScript, voidaan myös lisätä HTML-dokumenttiin.

HTML ei ole ohjelmointikieli, se on tarkoitettu vain tekstidokumenttien merkitsemiseen.

HTML:n oppimiseen tarvitset vain selaimen ja tavallisen muistion tai .
Avaa Standard Notepad tietokoneellasi seuraavasti: "Käynnistä" => "Ohjelmat" => "Lisävarusteet" => "Muistilehtiö" .

Jos olet kuullut ohjelmista, jotka yksinkertaistavat HTML-koodin kirjoittamista (Microsoft FrontPage, Adobe Dreamweaver), en suosittele niiden käyttöä tässä koulutusvaiheessa. Harjoittele taitojasi tavallisessa muistikirjassa tai Notepad++ -tekstieditorissa, ja tämän kurssin suoritettuasi voit nopeuttaa asioita ohjelmien avulla. Tilaa blogipäivitykseni ja lue kuinka käytät Microsoft FrontPagea ja Adobe Dreamweaveria.

Paremman ymmärtämisen vuoksi olen valmistellut esimerkin. Katso tarkkaan kuvaa:

Selitys.

1). Mikä tahansa HTML-dokumentti alkaa tällä rivillä:

Tällä rivillä kerromme selaimelle, että HTML-dokumenttimme on kansainvälisen spesifikaatioversion 4.01 mukainen. Tämän rivin ansiosta sivusi näyttää samalta.
Tätä riviä ei tarvitse muistaa, HTML-dokumentti toimii ilman sitä. Tämä on vain siksi, että olet tietoinen siitä, mitä se on.

2). ja on asiakirjan alku ja loppu.

3). ja - asiakirjan otsikko. Muita palvelutunnisteita lisätään usein tähän; Opit muista palvelutunnisteista tässä koulutusvaiheessa, tämä tieto riittää.

4).
ja - asiakirjan otsikko.

Tämä otsikko näytetään selaimessa:

haussa olen hakemistossa tai Googlessa.
5).

ja - asiakirjan runko.

Tässä on asiakirjan sisältö, esimerkiksi tekstiä, kuvia, taulukoita, musiikkia, elokuvia jne. Saat lisätietoja musiikin, tekstin ja kuvien lisäämisestä dokumentin runkoon seuraavilla oppitunnilla.
Huomautus:< >Tulet usein lukemaan ja kuulemaan sanan "tagi". , , , ,
,

Tunniste on kaikki, mikä on suluissa
. Esimerkiksi:

jne. - kaikki nämä ovat tunnisteita.

Tunnisteet eivät näy sivua katseltaessa selaimessa, mutta kaikki mikä ei ole suluissa näkyy selaimessa katseltaessa.
Tunnisteita on monia ja niillä on eri tarkoitus.


On tunnisteita, jotka on suljettava. Esimerkiksi,

avaa tunniste
.

ja muista sulkea tagi

Ja siellä on yksittäisiä tunnisteita, esimerkiksi tämä

...

Tunniste on eräänlainen säilö, joka voi sisältää tekstiä, kuvia ja muita tunnisteita...

○ Kiinnitä huomiota avaus- ja sulkemistunnisteiden oikeaan järjestykseen:

...

Tagi, jonka avasimme ensimmäisenä, suljetaan viimeisenä, toinen on toiseksi viimeinen jne.
○ Tässä on esimerkki virheellisestä avaus- ja sulkemistunnisteiden sarjasta. Tämän tilauksen yhteydessä verkkosivulla voi olla virheitä:

Virhe oli ja.
Ole varovainen kirjoittaessasi koodia.

Valmis koodi.

Tältä näyttää verkkosivun valmis standardi HTML-koodi.

Sivun otsikko Sivun teksti, taulukot, kuvat, musiikki ja video.

Älä lannistu, jos ymmärrät vain vähän tai tuskin mitään kaikesta yllä kirjoitetusta. Toisella oppitunnilla on enemmän harjoittelua, ja voit kirjoittaa kaiken manuaalisesti itse ja nähdä kuinka HTML toimii.

Jatka seuraavaan oppituntiin
  • Hiekkalaatikko
  • Leonid Yakubovich 26. toukokuuta 2015 klo 11.18 Koulutus HTML/CSS/JS
  • CSS
HTML,
  • www.youtube.com/user/agragregra- erittäin mielenkiintoinen kanava, joka auttaa sinua luomaan entistä paremmin monimutkaisia ​​verkkosivustoja tyhjästä;
  • www.youtube.com/user/ArtSorax- paljon hyödyllistä materiaalia aloittelijoille Painopiste on CSS:ssä ja JS:ssä.
  • www.youtube.com/user/WebMagistersRu- Itse aloin tutustumaan verkkokehitysympäristöön tästä kanavasta. Kaikki kerrotaan helposti ymmärrettävällä kielellä, niin sanotusti perusasiat.
  • www.youtube.com/user/loftblog- LoftBlog-tiimi haastattelee aloittelevia ja vakiintuneita IT-asiantuntijoita ja -kehittäjiä sekä järjestää videokoulutusta;
  • www.youtube.com/user/TheSWAT727- videokanava sisältää tietoa ja koulutusmateriaaleja web-kehityksestä yleensä, sisältäen Front-endin, Back-endin, tekstieditorien arvostelut ja muuta hyödyllistä tietoa aloitteleville kehittäjille ja suunnittelijoille.
Internet-resurssit
  • htmlbook.ru on pyhäkkö aloitteleville asiantuntijoille. Tämä resurssi sisältää valtavan määrän tietoa saatavilla olevassa ja ymmärrettävässä muodossa + foorumi. Tästä suosittelen tutustumaan HTML/CSS:ään;
  • webdesign-master.ru - koulutussivusto syvempään tutustumiseen web-suunnitteluun ja ulkoasuun;
  • learning.javascript.ru - sivuston nimi puhuu puolestaan. Suosittelen, että aloitat oppimisen tutustuttuasi HTML5/CSS3:n perusteisiin.
Palvelut
  • www.codecademy.com on englanninkielinen palvelu, jossa voit testata tietosi käytännössä. Kaikki on intuitiivista, syvällistä englannin kielen osaamista ei vaadita;
  • htmlacademy.ru on venäjänkielinen palvelu, jossa painopiste on käytännössä + vähän teoriaa. Erittäin mielenkiintoinen resurssi, kurssit ja tehtävät;
  • jsfiddle.net on niin sanotusti "hiekkalaatikko" web-kehittäjille. Täällä voit koodata verkossa ja nähdä heti tuloksen. Palvelu auttaa sinua osoittamaan virheet;
  • validator.w3.org - täällä voit tarkistaa koodisi kelvollisuuden korjataksesi HTML-koodin virheet tai puutteet;
  • jigsaw.w3.org/css-validator - samanlainen palvelu, joka on suunniteltu tarkistamaan CSS-koodin kelvollisuus.

Bottom line
Internetissä on paljon hyödyllistä, oikeaa ja tarpeellista tietoa, mutta ei enää hyödyllistä. Opi, harjoittele, kirjoita koodia.

Tunnisteet: Koulutus, materiaali, verkkosivustot, verkkosivustojen kehittäminen

Kaikki käyttävät Internetiä ja jokainen selaa eri sivustoja, ja luultavasti jokainen haluaisi sijoittaa verkkosivustonsa Internetiin, mutta se ei ole helppoa, siihen on monia syitä. Kuitenkin, jotta voit isännöidä laadukasta verkkosivustoa, sinun tarvitsee vain tietää perusasiat " WEB-ohjelmointi", joka on HTML-kieli. Tässä artikkelissa tarkastellaan pääelementtejä, tunnisteita, attribuutteja ja jopa kirjoitetaan ensimmäinen verkkosivu.

Hyper Text Markup Language - "HTML" ( hypertekstin merkintäkieli) monet eivät ole pitkään pitäneet sitä vain ohjelmointikielenä. Koska HTML-käsite sisältää erilaisia ​​​​menetelmiä hypertekstidokumenttien suunnitteluun, suunnitteluun, hypertekstieditoreihin, selaimiin ja paljon muuta. Tämän kielen hallitseva käyttäjä saa kyvyn tehdä vakavia asioita yksinkertaisilla menetelmillä ja mikä tärkeintä, nopeasti, mitä pidetään erittäin hyvänä nykymaailmassa!

HTML-kielellä voit luoda omia multimediatuotteita ja jakaa niitä CD-levyillä, ja kaikki nämä tuotteet, jotka on valmistettu HTML-sivusarjoina, eivät vaadi erikoisohjelmistojen kehittämistä, koska kaikki tarvittava tietojen kanssa työskentelyyn ( Web-selaimet) on tullut osaksi useimpien henkilökohtaisten tietokoneiden vakioohjelmistoa.

  • Elementti ( elementti) on HTML-kielen rakennelma. Tämä on objekti, joka sisältää dataa ja mahdollistaa sen muotoilun tietyllä tavalla. Mikä tahansa Web-sivu on joukko elementtejä. Yksi hypertekstin pääideoista on elementtien sisäkkäisyyden mahdollisuus.
  • Tag ( tag) ovat elementin alku- tai loppumerkit. Tunnisteet määrittelevät elementtien toiminnan rajat ja erottavat elementit toisistaan. Web-sivun tekstissä tunnisteet on suljettu kulmasuluissa, ja lopputunnisteen perässä on aina kauttaviiva.
  • Attribuutti - elementin parametri tai ominaisuus. Toisin sanoen tämä on muuttuja, jolla on vakionimi ja sille voidaan määrittää tietty arvojoukko: vakio tai mielivaltainen. Merkkimääritteiden arvojen odotetaan olevan suorien lainausmerkkien sisällä, mutta joissakin selaimissa lainausmerkit voidaan jättää pois. Tämä johtuu siitä, että määritteen tyyppi on aina tiedossa etukäteen. Attribuutit sijaitsevat aloitustunnisteen sisällä ja erotetaan toisistaan ​​välilyönnillä.
  • Hyperlinkki on tekstikappale, joka on osoitin toiseen tiedostoon tai objektiin. Hyperlinkit ovat välttämättömiä asiakirjasta toiseen siirtymiseen.
  • Kehys ( kehys) - tällä termillä on kaksi merkitystä. Ensimmäinen on asiakirja-alue, jossa on omat vierityspalkit. Toinen arvo on yksi kuva kompleksissa ( animoitu) grafiikkatiedosto (samanlainen kuin elokuvan still). On myös mahdollista, että erikoiskirjallisuudessa ja lokalisoiduissa ohjelmistotuotteissa termin "frame" sijaan löydät termin "frame" tai "frame".
  • HTML-tiedosto tai HTML-sivu on HTML-kieleen perustuva hypertekstimuotoinen dokumentti. Tällaisten tiedostojen tunniste on htm tai html.
  • Sovelma ( sovelma) on ohjelma, joka siirretään asiakkaan tietokoneelle erillisenä tiedostona ja käynnistetään Web-sivua katseltaessa.
  • Käsikirjoitus tai käsikirjoitus ( käsikirjoitus) on Web-sivulle lisätty ohjelma, joka laajentaa sen ominaisuuksia.
  • Laajennus ( laajennus) on elementti, joka ei sisälly kielimääritykseen, mutta jota käytetään tarjoamaan mahdollisuus luoda uusi ja mielenkiintoinen muotoilutehoste.
  • CGI ( Yhteinen yhdyskäytäväliitäntä) on yleinen nimi ohjelmille, joiden avulla voit laajentaa Web-sivujen ominaisuuksia palvelimella. Esimerkiksi ilman tällaisia ​​ohjelmia on mahdotonta luoda interaktiivisia sivuja.
  • HTML-koodi on hypertekstidokumentti alkuperäisessä muodossaan, jossa kaikki elementit ja attribuutit ovat näkyvissä.
  • Web-sivu on asiakirja (tiedosto), joka on laadittu hypertekstimuodossa ja julkaistu World Wide Webissä.
  • Verkkosivusto ( sivusto) - joukko Web-sivuja, jotka sijaitsevat yhdessä paikassa ja ovat yhteydessä toisiinsa.
  • Selain ( selain) on Web-sivujen katseluohjelma.
  • () - tiedostojen kopioiminen palvelimelta asiakastietokoneelle.
  • URL( Uniform Resource Locator) tai yhtenäinen resurssipaikannus, jonkin Internetin kohteen osoite, ts. Tyypillinen WWW-osoite näyttää tältä: http://www.nimi.verkkotunnus/tiedostonimi.

Kaikki kielen elementit voidaan jakaa kolmeen ryhmään. Ensimmäinen sisältää elementtejä, jotka luovat hypertekstiasiakirjan rakenteen. Tällaisten elementtien käyttö on välttämätön muodollisuus, jota ei voida jättää huomiotta. Toinen ryhmä sisältää elementtejä, jotka luovat muotoilutehosteita. Niiden käytön sanelevat asiakirjalle asetetut erityisvaatimukset, kehittäjän mielikuvitus ja osaaminen. Kolmas ryhmä sisältää elementtejä, joiden avulla voit hallita asiakastietokoneeseen asennettuja ja käynnissä olevia ohjelmistoja. Usein tällaiset elementit luodaan automaattisesti, kun kehittäjä käyttää hypertekstieditoria tai vastaavaa ohjelmaa lisätäkseen objektin dokumenttiin.

Vaikka HTML-määritys on standardi, kieleen lisätään uusia elementtejä ( laajennuksia). Siksi joitain Web-sivuja on helpompi katsella tietyillä selaimilla. Laajennuksia tekevät vain tunnetut WWW-ohjelmistoa kehittävät yritykset, ja tavalliset käyttäjät voivat parantaa verkkosivujaan ohjelmoinnin avulla. Applettien avulla voit poistaa HTML:n rajoitukset ja antaa tilaa kehittäjän mielikuvitukselle.

HTML-versiot

Tim BenersLee kehitti ensimmäisen HTML-version 90-luvun alussa yhdelle aiemmin suosituista Mosaic-selaimista. Mutta tuolloin selain tai HTML eivät olleet vielä löytäneet hyvää käyttöä. HTML+ ilmestyi vuonna 1993, ja tämä versio jäi myös käytännössä huomaamatta. Mutta HTML-kieli yleistyi kesäkuussa 1994 ilmestyneen version 2.0 ansiosta. Ja siitä hetkestä lähtien WWW:n suosio on kasvanut ympäri maailmaa. Versioon 2 sisältyvät standardit ovat vakiintuneet niin vakiintuneiksi, että niitä käytetään edelleen.

Noin vuotta myöhemmin ilmestynyt HTML-versio 3.0 esitteli mahdollisuuden piirtää matemaattisia symboleja ( integraalimerkit, äärettömyys, murtoluvut, sulut jne.) käyttämällä kielielementtejä. Mutta tämän hankkeen kehitys hidastui eikä levinnyt enempää.

Vuonna 1996 ilmestyi HTML-versio 3.2. Tämä oli loistava ratkaisu, riittää, kun mainitaan, että kielimäärittelyyn lisättiin kehyksiä, joista on tullut erittäin suosittuja verkkosivustojen kehittäjien keskuudessa. Tähän päivään asti kaikki selaimet tukevat tätä HTML-versiota.

Virallinen HTML 4 -määritys ( Dynaaminen HTML) kehitettiin vuonna 1997. Jo silloin oli selvää, että hypertekstin jatkokehitys toteutetaan web-ohjelmoinnin kautta. Tämä osoittautui paljon tehokkaammaksi kuin uusien elementtien tuominen kieleen.

Web-sivun rakenne

Alla on Web-sivun koodi, joka on tehty HTML-kielellä, ja käyttämällä tätä sivua esimerkkinä analysoimme sen rakenteen, mutta ensin kopioi kaikki koodi tavalliseen tekstimuistioon ja napsauta "Tallenna nimellä" ja tallenna tiedosto html-tunnisteella, eli . nimen write.html jälkeen

Verkkodokumentin rakenne Siirry asiakirjan loppuun Otsikko 1 Otsikko 2 Otsikko 3 Otsikko 4 Otsikko 5 Otsikko 6 Ensimmäinen linkki sijaitsee täällä Pitäisi sijaita täällä
verkkosivun pääteksti.
Ja minä esimerkiksi lisään tähän
useita siirtoja,
jotta voit
tarkkailla selvästi
miten se toimii sinulle
linkit asiakirjassa,
muuten, jos sinulla on suuri resoluutio,
Et vain huomaa, että linkkejä seurataan

HTML-dokumentin merkintä. Yksi kielen periaatteista on elementtien monitasoinen sisäkkäisyys. Tämä elementti on uloin, koska koko Web-sivun on sijaittava sen aloitus- ja lopputunnisteiden välissä. Teoriassa tätä elementtiä voidaan pitää muodollisuutena. Siinä on versio-, lang- ja dir-attribuutit, joita käytetään harvoin tässä tapauksessa, ja se mahdollistaa HEAD-, BODY FRAMESET- ja muiden Web-sivun yleisen rakenteen määrittävien elementtien sisäkkäisyyden. Luonnollisesti kaikki tällaiset asiakirjat päättyvät lopputunnisteeseen.

< head >

Web-sivun otsikkoalue. Toisin sanoen sen ensimmäinen osa. Kuten edellinen elementti, HEAD toimii vain asiakirjan yleisen rakenteen muodostamisessa. Tällä elementillä voi olla lang- ja dir-attribuutteja.

< title >

Elementti Web-sivun otsikon sijoittamiseen. Tämän elementin sisällä olevaa tekstiriviä ei näytetä asiakirjassa, vaan selainikkunan otsikkorivillä. Tämä elementti vaikuttaa suuresti edistämiseen hakukoneessa, koska hakukoneet kiinnittävät erityistä huomiota TITLE-tunnisteeseen. Minun neuvoni: älä koskaan kirjoita kovin pitkää tekstiä tähän tunnisteeseen ( 65 merkkiä riittää).

Tämä elementti sisältää palvelutietoja, jotka eivät näy Web-sivua katseltaessa. Sen sisällä ei ole tekstiä tavallisessa merkityksessä, joten lopputunnistetta ei ole. Jokainen META-elementti sisältää kaksi päämääritettä, joista ensimmäinen määrittää tietotyypin ja toinen sisällön.

< body >

Tämä elementti yhdistää hypertekstin, joka määrittelee itse Web-sivun. Tämä on asiakirjan näkyvä osa, jonka automaattinen sivu on kehittänyt ja jonka selain näyttää. Tämän mukaisesti tämän elementin lopputunnisteen tulisi löytyä Web-sivun lopusta. BODY-elementin sisällä voit käyttää kaikkia web-sivujen suunnitteluun tarkoitettuja elementtejä. BODY-elementin aloitustunnisteeseen voit sijoittaa monia määritteitä, jotka määrittävät koko sivun. Katsotaanpa niitä järjestyksessä.

Yksi tämän tagin hyödyllisimmistä ominaisuuksista, jolla on vaikutusta sivun suunnitteluun, on

background="polku taustatiedostoon"

Yksinkertaisempi taustasuunnittelu perustuu sen värin asettamiseen

bgcolor=”#FFFFFF”

Taustaväri määritellään kolmella kaksinumeroisella heksadesimaaliluvulla, jotka määrittävät punaisen, vihreän ja sinisen värien voimakkuuden (rbg).

Koska voit muuttaa sivun taustaa, voit muuttaa myös tekstin väriä. Tätä tarkoitusta varten on olemassa seuraava attribuutti

text="#RRGGBB"

Voit määrittää hyperlinkkien tekstin värin käyttämällä seuraavaa määritettä

link=”#RRGGBB”

Voit myös määrittää värinmuutoksen käyttäjän viimeksi valitulle hyperlinkille

Otsikkoelementti. Otsikoita on kuusi tasoa, jotka on nimetty seuraavasti.
Otsikko
Otsikko
Otsikko
Otsikko
Otsikko
Otsikko

Tason 1 otsikko on suurin, ja taso 6 tarjoaa pienimmän otsikon. Otsikoissa voit käyttää attribuuttia, joka määrittää tasauksen vasemmalle, keskelle tai oikealle:

align=”vasen” align=”keskellä” align=”oikea”

Luo uusi kappale käyttämällä tunnistetta

Ja siirtyä uudelle riville luomatta kappaletta - tag
eli siirto tapahtuu. Näitä tunnisteita ei tarvitse sulkea. Tietenkin, jos et käytä tagissa

ALIGN-elementti, joka voi asettaa kappaleen tasauksen:

Vasen

Keskitetty

Oikein

Näiden elementtien välinen teksti on tasattu leveyssuunnassa

Vaakaviiva ( vaakasuuntainen sääntö) on hyvin yleinen elementti. Ensinnäkin siksi, että sen avulla on erittäin helppoa ja kätevää jakaa sivu osiin. Toiseksi, koska sivun kirjoittajalla on hyvin pieni valikoima tällaisia ​​sisustuselementtejä. Elementillä ei ole lopputunnistetta, mutta siinä on useita attribuutteja vasemmalle, keskelle, oikealle ja tasaukselle:

  • align="left"
  • align="center"
  • align = "oikea"
  • align=”justify”

HTML-dokumentti voi olla erittäin hankala, eikä kovin kätevä käyttäjälle, jonka on nopeasti siirryttävä haluttuun asiakirjan osaan. Voit tehdä tämän käyttämällä hyperlinkkimekanismia. Voit tehdä tämän sijoittamalla asianmukaiset merkit oikeisiin paikkoihin tekstissä.

Ilmainen teksti

Tässä tapauksessa asiakirjan tietylle riville annetaan nimi, ja siksi asiakirjan toiseen osaan tai jopa toiseen asiakirjaan voidaan luoda hyperlinkki, joka johtaa kyseiseen tarraan.

Kuvien lisääminen ( Kuvia) HTML-dokumentissa käytetään seuraavaa tunnistetta ( tarjoaa täydellisen kuvauksen tämän tunnisteen ominaisuuksista):

Luettelot

(lista) kehitettiin HTML-kielellä, epäilemättä tekstieditorien menestyksen vaikutuksesta. Lista eroaa tavallisesta tekstistä ensinnäkin siinä, että käyttäjän ei tarvitse miettiä sen kohteiden numerointia: HTML ottaa tämän tehtävän. Jos luetteloa täydennetään uusilla tai lyhennetään, numerointi jatkuu automaattisesti. Numeroimattomissa luetteloissa HTML edeltää jokaista kohdetta merkillä: ympyrät, suorakulmiot, vinoneliöt ja muut kuvat. Lopulta lista saa kunnollisen muodon. Tällaisia ​​tunnisteita on kaksi ryhmää: jotkut määrittelevät luettelon yleisen ulkoasun ( ja voit määrittää attribuutteja), kun taas toiset määrittelevät sen sisäisen rakenteen. Voit käyttää luetteloissa vakiomääritteitä. Listoja on useita.

Yleisin on numeroimaton lista ( järjestämätön lista). Se esitetään alla:

  • Luettelon kohta 1
  • Luettelon kohta 2
  • Luettelon kohta 3

ul-elementti on eräänlainen luettelon korostus. Sen avulla voit erottaa yhden luettelon toisesta. Li-elementti edustaa jokaista kohdetta.

Taulukot

Ne ovat yksi tarpeellisimmista tavoista muotoilla tietoja Web-sivulla. Tärkein mukavuus on, että selain huolehtii koko taulukon piirtämisestä. Kehyksen kokoa voidaan säätää automaattisesti selainikkunan koon ja tietysti taulukon solujen teksti- ja kuvarivien koon mukaan. Kaiken muun lisäksi taulukoiden avulla voit ratkaista monia suunnitteluongelmia: kohdistaa sivun osia suhteessa toisiinsa, sijoittaa kuvia ja tekstiä vierekkäin, hallita värisuunnittelua ja niin edelleen. Taulukoita luotaessa noudatetaan sisäkkäisyyden periaatetta: päätaulukkoelementin (TABLE) sisään luodaan joukko elementtejä, jotka määrittävät rivit (TR), ja näiden sisällä on elementtejä, jotka kuvaavat rivin jokaista solua (TD, TH).

Olemassa olevan taulukon rakenteen ymmärtämiseksi tai uuden taulukon kehittämiseksi on olemassa yksi sääntö, jonka mukaan elementtien järjestys kuvaa taulukkoa ylhäältä alas ja oikealta vasemmalle. Jos esimerkiksi TABLE-elementtiä seuraa TR-elementti, tämä osoittaa, että uutta taulukon riviä määritellään. Kaikki tämän elementin takana oleva sijoitetaan yhdelle riville (oikealta vasemmalle). Tämä voi olla sarja TD-elementtejä ( soluja), toinen pöytä ja niin edelleen. Kun uusi TR-elementti tulee näkyviin, seuraavan rivin kuvaus alkaa ja niin edelleen taulukon loppuun (tunniste).
Taulukko voidaan tasata vaakasuunnassa käyttämällä align-attribuuttia:

  • align="left" - vasen;
  • align="center" - keskellä;
  • align="right" - oikealle.

Taulukon leveys voidaan asettaa tarkalleen pikseleinä tai prosentteina sivun leveydestä selainikkunassa. Esimerkki: leveys=400 tai leveys=50 %

Kahta attribuuttia käytetään ohjaamaan kehyksen ulkoasua. Tosiasia on, että selain luo kehyksestä kuvan, joka simuloi sen kolmiulotteisuutta ( kupera) käyttämällä kasvojen valaistuksen eroja

Skenaariot

Melkein kaikki webmasterit haluavat verkkosivujensa olevan modernin ulkoasu, monikäyttöisiä, kauniita ja dynaamisia. Tämä ei ole mahdollista tavallisilla HTML-työkaluilla, joten käytetään erilaisia ​​työkaluja: sovelmia, objekteja, peräkkäisiä tyylisivuja ja niin edelleen. Mutta suosituin ja yleisin tyyppi ( vastaanotto) on skriptien käyttö.

Komentosarja on ohjelmakoodi, joka sisältyy sivun lähdetekstinä ja jonka selain suorittaa, kun sivua tarkastellaan. Skripti voidaan kirjoittaa JavaScriptillä, Netscapen kehittämä tai Visual Basic Script ( VBScript), jonka on kehittänyt Microsoft.

Tämän tunnisteen avulla voit erottaa komentosarjaohjelman tekstin muista sivutiedoista. SCRIPT-tunnisteen tulee sisältää kieliattribuutti, joka määrittää kielen ja voi saada seuraavat arvot:

  • javascript - koodi JavaScriptissä;
  • vbscript - koodi VBScript-kielellä.

Type-attribuutti voi myös osoittaa kielityypin, vaikka sen käyttöä ei vaadita. Jotta et riko kaikkia sääntöjä, voit sijoittaa seuraavan määritelmän elementin sisään:

type="text/javascript"

Yksi skriptien hienoimmista ominaisuuksista on kyky muuttaa sivun sisältöä ohjelman suorittamisen seurauksena. Mutta tämä on vain ominaisuus, ei sääntö. Defer-attribuutilla (joka ei hyväksy arvoja) voit "kertoa" selaimelle, että tällaisia ​​muutoksia ei tehdä. Joissakin tapauksissa tämä mahdollistaa sivun latautumisen nopeammin.

Vakiomääritteistä voit käyttää charset-attribuuttia.

SCRIPT-tunniste ( tai useita tällaisia ​​elementtejä) voi sijaita joko HEAD-elementin tai BODY-elementin sisällä. Jos komentosarja on BODY-elementin sisällä, on myös mahdollista, että jokin selain, joka ei tue SCRIPT-elementtiä, havaitsee ohjelmakoodin pelkkänä tekstinä ja näyttää sen näytöllä. Tämän estämiseksi komentosarjakoodi kirjoitetaan kommentiksi:



Kaikki nykyaikaiset selaimet tunnistavat tämän tekniikan ja jättävät huomiotta kommenttimerkit. Jos komentosarjan tekstiin on syötettävä kommentti, tähän käytetään erilaista merkintää: rivin alkuun syötetään kaksi kauttaviivaa //.
Skriptikoodi suoritetaan, kun sivu ladataan, ts. kun sen sisältö on vielä näkyvissä näytöllä. Alla on esimerkki yksinkertaisimmasta skenaariosta ( näyttää viestin ikkunassa).




- Vain käsikirjoitus

- Alert ("Olet kirjoittanut ensimmäisen käsikirjoituksesi!")



Se on yksinkertainen sivu, mutta se sisältää yksirivisen skriptin. Varoitusmenetelmää käytettäessä viesti tulee näkyviin ennen lataamista. Ja se roikkuu, kunnes käyttäjä napsauttaa OK-painiketta, lataus ei jatku.
On mahdollista, että sivua tarkastellaan selaimessa, joka ei tue komentosarjaa. Nykyaikaiset katseluohjelmat jättävät huomioimatta sen sisällön. Tätä elementtiä voidaan käyttää useilla tavoilla. Aluksi voit näyttää sen sisällä seuraavan mainoksen: " Selaimesi ei voi suorittaa komentosarjaa, joka tarvitaan tämän verkkosivun katseluun!"Toiseksi elementin sisällä voit kehittää sivusta yksinkertaistetun version ilman skriptejä. Kolmanneksi voit luoda linkin toiseen HTML-dokumenttiin. NOSCRIPT-elementillä on oltava lopputunniste.

Joten tarkastelimme sellaisen WEB-ohjelmointikielen, kuten HTML:n, perusteita. Jopa tämän lyhyen artikkelin lukemisen jälkeen sinulla on jo idea ja jopa kyky ohjelmoida tällä kielellä. Onnea!