Patikrinkite, ar html faile nėra klaidų. Tikrinama, ar CSS galioja naudojant CSS patvirtinimo paslaugą. Tikrinama domeno ir IP adreso informacija

Sveiki visi!

Patikrinti HTML kodo galiojimą būtina, nes paieškos robotai mato tik HTML kodą. Dėl šios priežasties patartina svetainės kodą išdėstyti visa tvarka. Tai mums padės specialios internetinės paslaugos, kurios tikrina kodą ir konkrečiai nurodo klaidas.

Viena iš šių paslaugų yra validator.w3.org, kuri tikriausiai yra geriausia. Jis yra visiškai anglų kalba, todėl kai kuriems gali kilti problemų dirbant su juo, tačiau nesijaudinkite: tikrintuvas parodys ir eilutės numerį, ir pačią klaidą.

Galiojantis kodas yra kodas, atitinkantis visus standartus.

Pamokai jums reikės šios medžiagos:

Aukščiau minėta internetinė paslauga tikrina HTML kodą internete visoje svetainėje. Jums tereikia nurodyti savo svetainės domeną ir paspausti mygtuką „Tikrinti“, kad pradėtumėte tikrinti svetainės HTML kodą.

Valdymo priemonė taip pat suteikia vieną labai įdomią funkciją – svetainės failų tikrinimą iš vietinio kompiuterio. Mano nuomone, šis įrankis bus naudingas tiems, kurie kuria individualias svetaines. Prieš pateikdami užsakymą, turite dar kartą viską patikrinti, nes norite, kad žmonės visada būtų patenkinti jūsų darbu. Failus galite patikrinti eidami į skirtuką „Patvirtinti įkeliant failą“:

Kaip ištaisyti klaidas HTML kode?

„W3c Validator“ paslauga man parodė dvi klaidas ir 8 įspėjimus. Pabandysiu juos pataisyti ir parodysiu, kaip tai daroma.

Taisome klaidą „Elemento stilius neleidžiamas kaip elemento div antrinis šiame kontekste. (Slopinant tolesnes šio pomedžio klaidas.)“. Ši klaida man nurodo, kad tai yra HTML kode, būtent žymoje

Nereikia nurodyti stilių. Todėl stiliai, kurie parašyti šiame bloke
reikia perkelti į style.css failą ir viskas.

Tikrinimo priemonė taip pat nurodo, kur tiksliai yra klaida:


Tokiu būdu galite rasti ir ištaisyti HTML kodo klaidas. Tačiau svetaines sudaro ne tik žymėjimo kodas, bet ir CSS, todėl mes taip pat patikriname žiniatinklio šaltinio pakopinius stilių lapus.

Tikrinama, ar CSS kodas galioja

Taip pat galite patikrinti CSS kodo galiojimą W3c tikrinimo priemonėje. Tai galite padaryti naudodami šią nuorodą. Veikimo principas yra tas pats: nurodote svetainės URL arba pasirenkate failą kompiuteryje ir spustelėkite mygtuką „Tikrinti“.

Skirtingai nei tas pats HTML tikrintuvas, CSS tikrintuvas yra rusų kalba.

CSS klaidos ir įspėjimai

Tikrindama CSS kodo galiojimą, paslauga pateikia daugybę klaidų ir įspėjimų. Gavau 23 klaidas ir net 281 įspėjimą. Iš pirmo žvilgsnio tai gali atrodyti daug ir netgi baisu, tačiau dauguma šių klaidų ir įspėjimų rodomos tik todėl, kad paslauga nežino tam tikrų savybių, kurios taikomos skirtingoms naršyklėms.

Mano atveju, dauguma 281 įspėjimo yra CSS ypatybės, skirtos įprastam rodymui skirtingose ​​naršyklėse:

Paslauga tokias žymas pozicionuoja kaip „nežinomas tiekėjo plėtinys“. Todėl, jei tikrindami CSS failus matote daug tokių klaidų, nesijaudinkite. Viskas gerai.

Neišvardinsiu dažniausiai pasitaikančių klaidų ir būdų, kaip jas pašalinti, nes kiekvieno sprendimai gali būti skirtingi ir norint suprasti, kas vyksta, reikia pažvelgti į patį HTML kodą.

Jei negalite išspręsti klaidos, pasidalykite problema pamokos komentaruose, galbūt kartu rasime sprendimą.

Tikiuosi, kad šią savaitę paskelbtos pamokos jums buvo naudingos ir padėjo sprendžiant tam tikras problemas.

Na, dabar atsisveikink!

Ankstesnis straipsnis
Kitas straipsnis

2016-12-29


Animuojame mygtukus ir patikriname, ar svetainėje galioja HTML ir CSS kodai

Sveiki, mielas lankytojau!

Šiandien, naudodamiesi sukurto tinklalapio pavyzdžiu, pažiūrėsime, kaip galite patikrinti svetainės galiojimą, būtent, ar ji atitinka nustatytas HTML ir CSS kalbų specifikacijas.

Be to, prieš testavimą atliksime keletą CSS stiliaus lapo modifikacijų, susijusių su šoninės juostos mygtukų „atgaivinimu“, kur statinius mygtukus paversime interaktyviais, kurie keičia savo išvaizdą priklausomai nuo būsenos – pasyvus, aktyvus ir paspaustas.

  • Padaryti mygtukus didelius
  • Interaktyvūs mygtukai
  • Ar reikalingas patvirtinimas?
  • Kaip patikrinti HTML kodo galiojimą
  • Kaip patikrinti CSS kodo galiojimą
  • Svetainės šaltinio failai

Padaryti mygtukus didelius

Ankstesniame straipsnyje pagrindinę turinio sritį sukūrėme visiškai laikydamiesi pagrindinio puslapio išdėstymo. Tuo pačiu metu šoninėje juostoje yra mygtukai, kurie yra statiški ir atrodo kaip įprastas plokščias rudas stačiakampis su užapvalintais kampais.

Žemiau yra šoninės juostos su tokiais mygtukais fragmentas.

Kad mygtukai atgytų, pirmiausia suteikiame jiems šiek tiek garsumo naudodami CSS stilius. Ir tai padarysime naudodami linijinio gradiento savybę, kuri anksčiau buvo naudojama kuriant rotatorių, paieškos ir prenumeratos blokus.

Linijinio gradiento reikšmes apibrėžiame taip:

1. Spalvų atspalvius nustatysime iš apačios į viršų, pradėdami nuo tamsesnės spalvos, palyginti su pagrindine mygtuko spalva. Norėdami nustatyti, kurią spalvą naudoti gradiento pradžioje, naudojame grafinio redaktoriaus įrankį, šiuo atveju Photoshop.

Norėdami tai padaryti, atidarę dizaino maketo dokumentą, turite pasirinkti „Spalvų parinkiklį“, užveskite pelės žymeklį ant reikiamos mygtuko srities, nustatykite pagrindinę spalvą ir naudodami „Spalvų parinkiklio“ įrankius pasirinkite tamsesnė to paties rudo atspalvio spalva. Mūsų atveju paimkime spalvą su reikšme „653939“. Žemiau esančioje ekrano kopijoje aiškiai parodyta, kaip tai galima padaryti.


2. Toliau nustatysime gradiento sustojimo padėtį, kur pradinė, tamsesnė spalva virs pagrindine. Sustojimo padėtį pastatysime maždaug per vidurį. Tuo pačiu metu, kad spalva būtų sodresnė, šiek tiek pakelkime sustojimo padėtį ir nustatykime jos vertę, tarkime, 70% aukščio.

3. Paskutinis dalykas, kurį reikia padaryti norint priskirti gradiento ypatybes, yra nustatyti šviesesnę spalvą nei pagrindinė spalva, kuri nuspalvins mygtukus viršuje. Tai atliekama taip pat, kaip ir nustatant pradinę gradiento spalvą. Šiuo atveju šios spalvos reikšmę laikysime „b88686“.

3. Pagal gautus duomenis prie anksčiau sugeneruotų mygtukų CSS savybių pridėsime tiesinį gradientą.

    įvestis: {

    aukščio :30px;

    paraštė-apačia :10px;

    pasienio spindulys :5px;

    fone :#a76d6d;

    teksto lygiavimas :centras;

    šrifto svoris :bold;

    spalva :#fff;

    plūdė :teisingai;

    fonas-vaizdas

Galima pastebėti, kad nustatant kraštutines spalvas čia nenurodomos sustojimo padėtys, nes tai nėra būtina 0% ir 100% vertėms.

Dabar atnaujinkime naršyklę ir pažiūrėkime į rezultatą.

Kaip matote, mygtukai įgavo nedidelį išsipūtimą. Dabar galite pradėti juos „gaivinti“.

Interaktyvūs mygtukai

Norėdami visapusiškai dirbti su mygtukais, padarysime juos interaktyvius, kurie vizualiai atspindės tris pagrindines jų būsenas: pasyvią (mygtukas yra pradinėje būsenoje), aktyvią (žymeklis yra virš mygtuko) ir paspaustą (kol žymeklis rodomas svyruoja, pelės mygtukas yra paspaustas ir laikomas).

Ir mes tai padarysime naudodami šešėlių ir kraštinių savybių derinį. Šios technikos esmė ta, kad keičiant šešėlio ir kraštinių spalvą iš skirtingų pusių, galima imituoti mygtukų būsenos pasikeitimą.

Pirmiausia tai padarysime pasyviajai būsenai ir bandysime pavaizduoti taip, kad mygtukai pakiltų virš paviršiaus.

Kraštinių ir šešėlių spalvas parinksime taip pat, kaip ir ankstesniais atvejais.

CSS kodas po atitinkamų priedų atrodys taip:

    įvestis: {

    aukščio :30px;

    paraštė-apačia :10px;

    pasienio spindulys :5px;

    fone :#a76d6d;

    teksto lygiavimas :centras;

    šrifto svoris :bold;

    spalva :#fff;

    plūdė :teisingai;

    fonas-vaizdas :linear-gradient(į viršų, #653939, #a76d6d 50%, #b88686);

    dėžutė-šešėlis :2px 2px 4px 0px #422a2a;

    kraštinės plotis :2px;

    ribinio stiliaus :kietas;

    kraštinė-spalva :#ddbebe #241616 #241616 #ddbebe;

Čia galima pastebėti, kad kraštinės yra vaizduojamos savybių deriniu, kuris lemia storį (ribos plotis su reikšme 2px), stilius (border-style) su verte, nurodančia vientisą kraštinę ir spalvas (kraštinės spalva) kiekvienoje iš keturių pusių.

Atnaujinkime naršyklę ir pažiūrėkime, kaip dabar atrodys mygtukai.

Kaip matote, tokioje būsenoje mygtukai atrodo pakilę.

Dabar pabandykime suteikti mygtukams paspaustos būsenos išvaizdą. Norėdami tai padaryti, pašalinkite šešėlį ir pakeiskite kraštinių spalvą. Šiuo atveju naudosime specialų pseudoklasės parinkiklį :hover, atitinkantį aktyvią būseną.

Aktyvios mygtukų būsenos CSS kodas atrodys taip.

    įvestis: užveskite pelės žymeklį {

    dėžutė-šešėlis :nė vienas;

    kraštinė-spalva :#a76d6d #a76d6d #a76d6d #a76d6d;

Tokiu atveju vėl pakeisime kraštinių spalvą ir pridėsime šešėlį, tik tokiu atveju jis bus vidinis ir be poslinkio. Pseudoklasės parinkiklis taip pat pasikeis į :active , atitinkantį paspaustą būseną.

Paspaustos būsenos CSS kodas bus toks.

    įvestis: aktyvus {

    dėžutė-šešėlis :0px 0px 7px 2px #422a2a intarpas;

    kraštinė-spalva :#777 #fff #fff #777;

Žemiau palyginimui rodomas mygtukas „Ieškoti“, kuriame aiškiai matosi, kaip jis keičia savo išvaizdą priklausomai nuo būsenos.


8 pav. Pasyvioji būsena

Tuo mes užbaigėme pagrindinio puslapio maketą ir suformavome jį į formą, atitinkančią dizaino maketą. Ir dabar turime, kaip ir anksčiau kiekviename etape, patikrinti, ar jis suderinamas su skirtingomis naršyklėmis. Tačiau prieš tai patikrinkime puslapį, ar jis patvirtinamas, nes kodo būseną tam tikru mastu gali paveikti kryžminis suderinamumas. Taigi dabar atlikime šią labai reikalingą operaciją.

Ar reikalingas patvirtinimas?

Patvirtinimas yra procesas, kurio metu tikrinama, ar kodas atitinka nustatytus standartus. Egzistuoja skirtumas tarp HTML ir CSS kodų tikrinimo teisingumo. Aišku, kad vienu atveju tikrinamas HTML kodas, kitu – CSS kodas.

Tikriausiai daugeliui žmonių bus keista paklausti, ar reikalingas patvirtinimas. Bet jei pažvelgsite į internetą, pamatysite, kad yra daug manančių, kad teisingas kodas nėra būtinas, kad tai yra laiko švaistymas, nes naršyklės gerai veikia net ir esant įvairiausioms klaidoms.

Žinoma, daugeliu atvejų svetainės gali gerai veikti net naudojant netinkamą kodą, tačiau tokiais atvejais negalima garantuoti kryžminio suderinamumo. Galų gale, yra ir pačioms programavimo kalboms taikomi standartai, tačiau, žinoma, tokio standarto nėra ir negali būti, kad naršyklės vienodai taisytų klaidas. Todėl skirtingos naršyklės gali skirtingai tvarkyti klaidas, todėl puslapiai gali būti rodomi skirtingai.

Ir apskritai neaišku, kodėl kai kurie žmonės taip atsainiai žiūri į savo darbą pagal principą „tiks“. Todėl, jei kas nors mano, kad jam nereikia tikrinti kodo galiojimo, tai yra jo teisė, ir vargu ar pavyks jį įsitikinti kitaip, ir nereikia.

Dabar pereikime prie tiesioginio kodų galiojimo patikrinimo, pirmiausia HTML, tada CSS.

Kaip patikrinti HTML kodo galiojimą

Iš esmės pats kodo patvirtinimo patikrinimas yra gana paprastas, kaip matote dabar. Tačiau klaidų pašalinimas paprastai užtrunka. Žinoma, jei kodas susideda iš kelių eilučių, sunkumų čia negali kilti. Bet jei jų yra šimtai ir tūkstančiai, čia gali tekti sunkiai dirbti, viskas priklauso nuo to, kaip gerai buvo sukompiliuotas kodas. Todėl geriau tai daryti dažniau ir kartu patikrinti kryžminį suderinamumą.

Čia mes apsvarstysime paprasčiausią ir labiausiai paplitusią galiojimo tikrinimo parinktį - tai yra W3C Consortium svetainės naudojimas, kuris, padedamas naršyklių kūrėjų, sukuria tinklalapių kodų specifikacijas.

Norėdami patikrinti HTML kodą, tiesiog spustelėkite nuorodą https://validator.w3.org/, kur atsidarys puslapis su tikrinamo puslapio adreso įvesties lauku.

51 ekrano kopija


Paspaudę mygtuką „Tikrinti“, gausime patikrinimo rezultatą.


Šiuo atveju HTML kodas galioja, tačiau rekomenduojama naudoti atributą lang su reikšme "ru", nes puslapyje naudojama rusų kalba.

Atributas lang skirtas padėti naršyklėms teisingai pateikti tam tikrus simbolius, pvz., kabutes, priklausomai nuo naudojamos kalbos. Todėl mums būtų visiškai naudinga jį įtraukti į HTML kodą. Ir mes tai padarysime html žymoje, kad šis atributas veiktų visame dokumente.

Kaip atlikti šį papildymą, parodyta šioje lentelėje.

    "ru" >

    . . .

O dabar dar kartą patikrinę pamatysime, kad kodas tapo visiškai galiojantis be jokių komentarų.


Tokiu būdu patikrinome internete paskelbtą failą. Tačiau kai puslapis dar nepaskelbtas internete, jo galiojimą galite patikrinti kitais būdais – įkeldami failą naudodami peržiūros mygtuką arba naudodami formą, kad tiesiogiai nukopijuotumėte HTML kodą.

Ekrano kopijoje parodyta paskutinė parinktis, kai tinklalapio kodas nukopijuojamas tiesiai į patvirtinimo formą.


Atlikę patikrą gauname panašų rezultatą, čia taip pat bus rodomas tikrinamas kodas. Jei randama klaidų, jos bus paryškintos, kad būtų supaprastinta paieška, o tai labai supaprastina jų pašalinimo darbą.


Kaip patikrinti CSS kodo galiojimą

Mes peržiūrėjome HTML kodo patvirtinimą. CSS kodas peržiūrimas lygiai ta pačia tvarka. Tik šiuo atveju reikia naudoti kitą tikrinimo puslapį, kuris šiuo atveju yra adresu http://jigsaw.w3.org/css-validator/.

Atidarykime jį ir, kaip ir ankstesnį kartą, įveskite tikrinamo puslapio adresą, o tada paspauskite mygtuką „Tikrinti“.

Šio patikrinimo rezultatas rodomas ekrano kopijoje.


Kaip matote, mūsų CSS kodas visiškai atitinka specifikaciją be klaidų, o tai yra geras rezultatas.

Kitų tikrinimo metodų tvarka šiuo atveju yra visiškai identiška panašiems HTML kodo patikrinimams. Todėl čia nesikartosime ir baigsime svarstyti patvirtinimo patikras.

Po to patikrinsime savo puslapio kryžminį suderinamumą ir, įsitikinę, kad jis rodomas vienodai visose naršyklėse, užbaigsime pagrindinio svetainės puslapio maketą.

O, tai padarysime iškart po Naujųjų metų atostogų.

Ir pabaigai galime visus pasveikinti su artėjančiais Naujaisiais metais! Ir linkiu sveikatos, meilės, džiaugsmo, klestėjimo ir, žinoma, didelės sėkmės kuriant savo svetainę Naujaisiais metais, kad galėtumėte sėkmingai dirbti internete!

Svetainės šaltinio failai

Svetainės šaltinio failus su atnaujinimais, kurie buvo atlikti šiame straipsnyje, galima atsisiųsti iš pridedamo papildomos medžiagos.

Viename iš ankstesnių straipsnių, apie kuriuos kalbėjau. Tačiau ne visi žino, kad be HTML patvirtinimo priemonė, Yra CSS patvirtinimo priemonė.

Reikšmė CSS galiojimas tas pats kaip HTML: beveik nesvarbu. Tas pats su HTML jei parašysi neteisingas CSS, tada problemų nebus (nebent, žinoma, yra rimtų klaidų), tačiau galiojantis kodas visada geras. Toks kodas yra aiškus ir struktūrizuotas, lengvai suprantamas, o tai taip pat svarbu, ypač jį taisant, o ypač kitų žmonių. Taip pat CSS galiojimas pagreitina apdorojimo procesą, taigi ir puslapių įkėlimo greitį.

Ir galiausiai, dėl paprastai retai stebimo galiojimo, galiojantis kodas visada kelia pagarbą, o tai svarbu, jei tai darote profesionaliai.

Į patikrinti CSS galiojimą, turite tai naudoti W3 paslauga: http://jigsaw.w3.org/css-validator/.

Iš karto pasakysiu, kad kitaip HTML, daryti CSS galioja daug paprasčiau, nes iš esmės yra tik klaidos, išskyrus , kurių geriausia vengti.

Leiskite man apibendrinti. Visai nebūtina, kad kodas būtų tinkamas, tačiau primygtinai rekomenduoju tai padaryti, nes tokią svetainę paieškos sistemoms bus lengviau indeksuoti ( HTML galiojimas), dirbti greičiau, lengviau redaguoti ir sulaukti pagarbos iš profesionalų.

Tikrinant žiniatinklio kodo galiojimą tikrinama, ar jis atitinka W3C standartus ir sertifikatus.
W3C (World Wide Web Consortium) yra techniniai žiniatinklio kūrėjai, kuriantys kodo rašymo standartus ir gaires. W3C sertifikatai ir standartai yra privalomi visiems, kurie dirba internete. Reikalingi bendri kodo rašybos standartai, kad visos tinklo programos bendrautų viena kalbos erdve standartinėmis kalbomis ir suprastų viena kitą dirbdamos su žiniatinklio dokumentais.
W3C ne tik kuria žiniatinklio standartus, bet ir aktyviai skatina jų įgyvendinimą.
W3C turi internetines paslaugas, skirtas HTML/XHTML ir CSS kodo galiojimui patikrinti.
Geriausias pasirinkimas yra patikrinti kodą, ar jis atitinka W3C standartus, naudojant W3C tikrintuvus.

Nemokamos internetinės W3C paslaugos, skirtos kodo galiojimui patikrinti.
W3C tikrintuvai turi intuityvią sąsają. Dirbti su jais lengva ir paprasta.
Paslaugos leidžia atlikti patikrinimus trimis režimais ir atitinkamai turi tik tris mygtukus:
Patikrinkite URL
(norėdami patikrinti, turite nurodyti bet kurio interneto svetainės puslapio adresą)
Patikrinkite įkeltą failą
(norėdami patikrinti, turite nurodyti kelią iki tikrinamo failo)
Patikrinkite įvestą tekstą
(norėdami patikrinti, turite nukopijuoti ir įklijuoti tikrinamą kodą į tikrinimo langą)

Paskutiniai du metodai yra ypač naudingi tikrinant žiniatinklio dokumentus ar tekstus, esančius vietiniuose kompiuteriuose. Tai gali būti tinklalapiai, jau atsisiųsti iš interneto į vietinį kompiuterį arba sukurti vietiniuose serveriuose, pvz., Denveryje, esančių variklių. Denverio atveju turite išsaugoti puslapį per naršyklę kaip failą su plėtiniu .html ir tada patikrinti jį kaip atskirą failą arba nukopijuoti tinklalapio šaltinio kodą tiesiai iš naršyklės ir patikrinti, kaip tekstas yra įvestas.

Kaip naudoti internetinius W3C tikrintuvus.
susisiekite su tikrintoju adresu:
(http://validator.w3.org/ – skirtas HTML arba XHTML patvirtinimui
http://jigsaw.w3.org/css-validator/ – CSS tikrinimui)
atsidariusiame tikrinimo priemonės lange pasirinkite vieną iš trijų patvirtinimo būdų
(svetainės puslapio URL, vietinis failas arba įvestas tekstas)
eikite į atitinkamą skirtuką
nurodyti tikrintiną objektą
(įveskite tikrinamo tinklalapio URL,
arba kelią į failą vietiniame kompiuteryje,
arba atitinkamai įveskite kodą, kurį norite patikrinti)
Spustelėkite mygtuką „Tikrinti“ ir peržiūrėkite testo rezultatą

W3C paslaugos patikrina kodo galiojimą ir nedelsdamos nurodo klaidas, jei tokių yra. Kiekviena klaida bus komentuojama. Deja, komentarai yra anglų kalba. Taigi, Google vertėjas gali padėti. Belieka, jei reikia, pataisyti kodą ir dar kartą patikrinti, ar jis atitinka.
W3C tikrintuvai yra visiškai nemokami ir automatizuoti. Todėl galite ilgai ir nebaudžiamai kalti juos savo darbu dėl klaidų. Todėl šios paslaugos buvo sukurtos.

Įprasta alternatyva W3C tikrintojams.
Be W3C internetinių serverių, skirtų žiniatinklio kodui tikrinti, „Mozilla Firefox“ naršyklės HTML Validator plėtinys duoda labai gerų rezultatų. Tokio priedo buvimas naršyklėje palengvina žiniatinklio valdytojo darbą ir dar kartą įrodo, kad „Mozilla Firefox“ yra „vairuojanti“ naršyklė.
Mozilla plėtinį galite atsisiųsti čia: http://users.skynet.be/mgueury/mozilla/

Galite įdiegti plėtinį taip:
- Paleiskite „Firefox“.
Kitas: Meniu – Įrankiai – Priedai – Plėtiniai.
Ir tiesiog nuvilkite atsisiųstą failą (xpi plėtinį) į atsidariusį langą.
Po to plėtinys bus įdiegtas automatiškai.

arba (antrasis metodas):
- Paleiskite „Firefox“.
Kitas: Meniu – Failas – Atidaryti failą – nurodykite atsisiųsto failo kelią.
Po to plėtinys vėl bus automatiškai įdiegtas.

Kai diegimas bus baigtas, turėsite iš naujo paleisti naršyklę.
Kai paleisite iš naujo, pasirodys langas, kuriame bus prašoma pasirinkti tinklalapių nuskaitymo metodą:
„HTML tvarkingas“ arba „SGML analizatorius“ arba „serijinis“
Mes pasirenkame "SGML Parser" metodą kaip patogiausią ir priimtiniausią variantą. Spustelėkite atitinkamą mygtuką Dabar naršyklės lange bus rodoma priedo nuorodos piktograma, o šalia jos yra mygtukas priedo nustatymų meniu.
Turiu jį viršuje ir dešinėje:

„Mozilla Firefox“ naršyklės HTML tikrintuvas veikia visiškai automatiškai. Jam nereikia rodyti, ką patikrinti. Jis tikrina visus dokumentus, kurie bus atidaryti „Mozilla Firefox“. Tai labai patogu. Pakanka pažvelgti į programos etiketės spalvą, kad suprastumėte, ar atidarytame dokumente nėra problemų.
Atsižvelgiant į bandymo rezultatus, piktogramos spalva gali būti žalia, geltona arba raudona, o tai rodo:
žalia - „nėra klaidų“, viskas „gerai“
geltona - „nėra klaidų, bet yra įspėjimų“
raudona - „yra klaidų“

Kai spustelėsite nuorodą, atsidarys langas, kuriame bus rodomo puslapio šaltinio kodas su paaiškinimais ir komentarais apie klaidas ir įspėjimus, jei tokių yra.
Kažkas panašaus į tai.

Sveiki atvykę į nemokamą žiniatinklio valdytojo tinklaraštį! Praėjusį kartą kalbėjau apie tai, kaip patikrinti, o šiandien siūlau tęsti tinklalapio patvirtinimo temą. Patikrinkime pakopinius stiliaus lapus (CSS) ir HTML dokumentus su stilių lentelėmis, ar jie atitinka visuotinai priimtus interneto standartus.

CSS stiliaus kalbos kūrėjas yra World Wide Web Consortium (sutrumpintai W3C) – organizacija, kurianti ir diegianti technologijų standartus internete.

CSS (iš anglų kalbos Cascading Style Sheets – pakopiniai stilių lapai) yra formali kalba, skirta dokumento išvaizdai apibūdinti naudojant žymėjimo kalbą.

W3C konsorciumas siūlo labai naudingą stilių tikrinimo paslaugą. Eikime į pagrindinį CSS patvirtinimo tarnybos puslapį ir patikrinkime CSS galiojimą.

Kaip įprasta, kaip iliustratyvų pavyzdį patikrinsiu savo tinklaraštį. Spustelėkite nuorodą ir atsidarys naujas langas, kuris atrodo taip:

Čia mūsų laukia maloni staigmena, viskas rusų kalba! Be to, galima pasirinkti bet kurią kitą kalbą iš daugiau nei 20 galimų. Puslapyje yra skirtukų, kuriuose siūloma pasirinkti patvirtinimo parinktį:

  1. Patikrinkite pagal URI – tiesiog nurodykite puslapio adresą;
  2. Patikrinkite įkeltą failą – reikia pasirinkti vietinį CSS failą;
  3. Patikrinkite įvestą tekstą – turite įvesti CSS kodą, kad patikrintumėte, ar jis teisingas.

Papildomos funkcijos leidžia nurodyti išplėstinius nuskaitymo parametrus. Pateikiame trumpą kiekvieno iš jų santrauką:

  • Profilis – pateikiamos visos konkrečios platformos funkcijos ir diegimo galimybės. Numatytasis pasirinkimas atitinka dažniausiai naudojamą trečiojo lygio standartą CSS3.
  • Įspėjimai – ataskaitų detalių nustatymas: visi arba svarbiausi įspėjimai, reguliari ataskaita be įspėjimų rodymo. Paslauga gali pateikti dviejų tipų pranešimus: klaidas ir įspėjimus. Jei testuojamas CSS neatitinka rekomendacijos, tai yra klaida. Įspėjimai skiriasi nuo klaidų tuo, kad tai nėra specifikacijos problemos.
  • Aplinka – nurodykite, kur stiliai taikomi, pvz., delniniame įrenginyje, ekrane, televizoriuje ar spausdinimo puslapyje. Rekomenduojama išbandyti visas stiliaus aplinkas.
  • Tiekėjo plėtiniai – patartina juos palikti kaip numatytuosius, galima rodyti tik klaidas arba tik įspėjimus. Naršyklės pardavėjai kartais diegia eksperimentines CSS ypatybes ir joms palaikyti naudoja šiuos priešdėlius: -moz- (skirta Firefox), -webkit- (skirta Chrome), -ms- (skirta Internet Explorer), -o- (skirta Opera) ir kiti.

Nurodau URL adresą, sukonfigūruoju papildomus patvirtinimo parametrus ir paspaudžiu mygtuką „Tikrinti“, kad pradėtumėte. Sveika! CSS patikrinimo rezultatas: klaidų nerasta!

Deja, nepavyko išvengti įspėjimų, susijusių su nežinomo tiekėjo plėtiniu. Viskas gerai, CSS tikrinimo paslauga yra nemokama, patikima ir naudinga priemonė, tačiau, kaip ir bet kuri programinė įranga, ji gali turėti trūkumų.

Svarbiausia, kad stiliuose nebūtų klaidų, o pardavėjo plėtiniai greičiausiai tiesiog neįtraukti į specifikaciją ir sukelti įspėjimus, tačiau naršyklė tinkamai apdoroja duomenis.

Atkreipkite dėmesį, kad įspėjimų sąraše rodomas eilutės numeris, kuriame buvo rasta nežinoma nuosavybė. Kai aptiksite klaidų, pamatysite lentelę su ypatybe ir problemos aprašymu. Pavyzdžiui, „Yandex“ pagrindiniame puslapyje yra šis patikrinimo rezultatas:

Žemiau pateikiama informacija apie galiojantį patvirtintą CSS. Neskubėkite jo kopijuoti ir naudoti savo svetainėje! Taip, nurodytoje teisingo CSS versijoje nėra klaidų ir savybių, kurių naudojimas sukels įspėjimus, kodas bus 100% visiškai patikrintas. Tačiau efektas pasiekiamas pašalinus šias savybes, todėl svetainėje gali kilti rodymo problemų arba lūkesčiai gali neatitikti tikrovės.

Ši paslauga yra talpinama ir prižiūrima W3C serveryje, tačiau tuo pačiu nėra oficialus CSS tikrinimo įrankis.

Jei norite, naudokite kombinuotą tikrintuvą – jis patikrina visą dokumentą, viename puslapyje sujungdamas HTML ir CSS tikrintuvų bei kitų naudingų įrankių tikrinimo rezultatus.

Kurdami svetaines, vadovaukitės naujausiomis pakopinio stiliaus lapų specifikacijomis ir nuorodomis. Rekomenduoju naudoti CSS tikrintuvą ir patikrinti savo svetainę, pasidalykite rezultatais komentaruose!



Turite klausimų?

Pranešti apie rašybos klaidą

Tekstas, kuris bus išsiųstas mūsų redaktoriams: