` žymes, kad sukurtumėte atskirus puslapio elementus. Sukursime seriją `

` elementų, kuriuose bus vaizdai. ### Vaizdai Viena HTML žymė, kuriai nereikia uždarymo žymės, yra `` žymė, nes ji turi `src` elementą, kuriame yra visa informacija, reikalinga puslapiui atvaizduoti elementą. Sukurkite savo programoje aplanką pavadinimu `images` ir jame pridėkite visus vaizdus iš [šaltinio kodo aplanko](../../../../3-terrarium/solution/images); (yra 14 augalų vaizdų). ### Užduotis Pridėkite tuos augalų vaizdus į du stulpelius tarp `` žymių: ```html

``` > Pastaba: Span ir Div skirtumai. Div yra laikomi „blokų“ elementais, o Span – „eilutės“. Kas nutiktų, jei šiuos div pakeistumėte į span? Naudodami šį žymėjimą, augalai dabar rodomi ekrane. Tai atrodo gana prastai, nes jie dar nėra stilizuoti naudojant CSS, tačiau tai padarysime kitoje pamokoje. Kiekvienas vaizdas turi alternatyvų tekstą, kuris pasirodys, net jei negalite matyti ar atvaizduoti vaizdo. Tai svarbus atributas, kurį reikia įtraukti dėl prieinamumo. Sužinokite daugiau apie prieinamumą būsimose pamokose; kol kas prisiminkite, kad alt atributas pateikia alternatyvią informaciją apie vaizdą, jei vartotojas dėl kokių nors priežasčių negali jo matyti (dėl lėto ryšio, klaidos src atribute arba jei vartotojas naudoja ekrano skaitytuvą). ✅ Ar pastebėjote, kad kiekvienas vaizdas turi tą patį alt tekstą? Ar tai gera praktika? Kodėl taip arba kodėl ne? Ar galite patobulinti šį kodą? --- ## Semantinis žymėjimas Apskritai, rašant HTML, geriau naudoti prasmingą „semantiką“. Ką tai reiškia? Tai reiškia, kad naudojate HTML žymes, kurios atspindi duomenų tipą arba sąveiką, kuriai jos buvo sukurtos. Pavyzdžiui, pagrindinis puslapio pavadinimo tekstas turėtų naudoti `

` žymę. Pridėkite šią eilutę iškart po `` atidarymo žymės: ```html

My Terrarium

``` Naudojant semantinį žymėjimą, pvz., antraštėms naudoti `

` ir nesutvarkytoms sąrašams naudoti `
`, padedama ekrano skaitytuvams naršyti puslapyje. Apskritai, mygtukai turėtų būti rašomi kaip `

` žymės: ```html

``` ✅ Nors pridėjote šį žymėjimą ekrane, nieko nesimato. Kodėl? --- ## 🚀Iššūkis HTML yra keletas senų „laukinės“ išvaizdos žymių, kurios vis dar smagios naudoti, nors neturėtumėte naudoti pasenusių žymių, tokių kaip [šios žymės](https://developer.mozilla.org/docs/Web/HTML/Element#Obsolete_and_deprecated_elements), savo žymėjime. Vis dėlto, ar galite naudoti seną `` žymę, kad h1 pavadinimas slinktų horizontaliai? (jei taip padarysite, nepamirškite jos pašalinti vėliau) ## Klausimynas po paskaitos [Klausimynas po paskaitos](https://ff-quizzes.netlify.app/web/quiz/16) ## Apžvalga ir savarankiškas mokymasis HTML yra „patikrinta ir patikima“ statybinių blokų sistema, padėjusi sukurti internetą tokį, koks jis yra šiandien. Sužinokite šiek tiek apie jo istoriją, išnagrinėdami senas ir naujas žymes. Ar galite suprasti, kodėl kai kurios žymės buvo pasenusios, o kitos pridėtos? Kokios žymės galėtų būti pristatytos ateityje? Sužinokite daugiau apie svetainių kūrimą žiniatinkliui ir mobiliesiems įrenginiams [Microsoft Learn](https://docs.microsoft.com/learn/modules/build-simple-website/?WT.mc_id=academic-77807-sagibbon). ## Užduotis [Praktikuokite HTML: Sukurkite tinklaraščio maketą](assignment.md) --- **Atsakomybės apribojimas**: Šis dokumentas buvo išverstas naudojant AI vertimo paslaugą [Co-op Translator](https://github.com/Azure/co-op-translator). Nors siekiame tikslumo, prašome atkreipti dėmesį, kad automatiniai vertimai gali turėti klaidų ar netikslumų. Originalus dokumentas jo gimtąja kalba turėtų būti laikomas autoritetingu šaltiniu. Kritinei informacijai rekomenduojama naudoti profesionalų žmogaus vertimą. Mes neprisiimame atsakomybės už nesusipratimus ar klaidingus interpretavimus, atsiradusius dėl šio vertimo naudojimo.