Namų darbas — validatorius ir klaviatūra
Namų darbas — priversk puslapį įrodyti, kad jis semantiškas: ir mašinai, ir klaviatūrai.
- Orientyrai ir tikri valdikliai. Perskaityk savo paties
<body>. Kiekviena struktūrinė dalis turi būti tas elementas, kurį ji reiškia:<nav>nuorodoms, vienas<main>turiniui,<article>kiekvienam paveikslėliui, tikras<button>kiekvienam „mėgstamų" valdikliui. Jei koks valdiklis yra<div>, papuoštas CSS, pakeisk jį. - Vienas
<h1>. Puslapyje yra lygiai vienas<h1>— hero antraštė. Kiekvienos kortelės pavadinimas yra<h2>. Įsitikink, kad nepasirinkai antraštės lygio pagal tai, koks jis didelis atrodo. - Paleisk validatorių. Atverk validator.w3.org, pasirink Validate by Direct Input ir įklijuok visą savo
index.html. Taisyk viską, ką jis praneša, kol grįš be klaidų. Validatorius pagauna klaidas, pro kurias praslysta akys — neuždarytą žymenį, atributą ne toje vietoje. - Išbandyk tik klaviatūra. Spragtelėk adreso juostą, tada spausk Tab. Pirmas dalykas, kuris pasiima fokusą, turi būti „praleidimo" nuoroda. Paspausk Enter — fokusas turi šoktelėti į turinį. Spausk Tab toliau: turi pasiekti kiekvieną navigacijos nuorodą ir kiekvienos kortelės „mėgstamų" mygtuką, ir aiškiai matyti, kur yra fokusas.
Bandyk pats: naršyklės įrankiuose išjunk style.css ir perskaityk pliką puslapį nuo viršaus iki apačios. Jis vis tiek turi turėti prasmę kaip dokumentas — navigacija, antraštė, įžanga, paveikslėlių sąrašas, kiekvienas su pavadinimu. Jei kokia dalis virsta bevardžiu gumulu, ta dalis vis dar yra „div košė"; duok jai tinkamą elementą.
Privalomas rezultatas: puslapis validuojasi be klaidų ir yra visiškai valdomas vien klaviatūra — „praleidimo" nuoroda pirma, kiekvienas valdiklis pasiekiamas.
Atsiskaitymui: ekrano nuotrauka, kur validatorius rodo nulį klaidų, ir vienas sakinys, įvardijantis pirmą elementą, kurį pasiekia klaviatūra.
Toliau. Tavo puslapis semantiškas ir apiformintas — bet visos nuorodos atrodo vienodai, o paveikslėliai tiesiog įmesti, negalvojant, kaip jie kraunasi ar kas nutinka, kai vieno trūksta. Kita pamoka: nuorodos, paveikslėliai ir spalva — smulkmenos, nulemiančios, ar puslapiu malonu, ar skausminga naudotis.