Dar nu validează

Am o mânie mică pe care o voi împărți cu tine. În nopțile la care termin un nou tutorial CSS3 pentru Nettuts + - în mod obișnuit, în timp ce ascult melodiile preferate de la Biebster - apăs butonul de publicare și aștept să văd cât timp va dura înainte ca un cititor să lase un comentariu care conține fraza, Dar nu validează.


Vă mulțumim pentru intrare!

Iată chestiunea validării: este un instrument. Nimic mai mult; nimic mai putin; doar un instrument.

Deci, aici este chestiunea validării: este un instrument. Nimic mai mult; nimic mai putin; doar un instrument. La prima vedere, totuși, are sens, nu-i așa? Echizăm validarea cu cele mai bune practici, la fel ca JavaScript și JSLint. De-a lungul acestei linii de gândire, de ce nu am dori un scor perfect de 100%? Ei bine, asta e chestia: noi facem; totuși, apar probleme când scorul are prioritate față de propria noastră logică.


Validarea modelelor dvs.

Pentru a testa colile de marcaj și de stil, puteți vizita:

  • W3C CSS Validator
  • Validarea marcajului W3C

Alternativ, puteți instala aplicația Firefox add-on, Web Developer, care, printre altele, oferă link-urile "Validate HTML" și "Validate CSS" la îndemână, precum și opțiunea de validare a fișierelor locale.



În acest moment, se va genera un raport, care va afișa orice erori că validatorul se întâlnește. Dar aici se află freca.


Validarea este irelevantă?

Absolut nu. Mi-aș imagina că, mai ales pentru cei care abia au intrat în această industrie, expresia "site-urile web nu trebuie să treacă prin validare" le confundă.

"Validarea este sistemul dvs. de avertizare rapidă cu privire la introducerea de erori în paginile dvs. care se pot manifesta în moduri interesante și greu de determinat. Atunci când un browser întâlnește un cod HTML nevalid, trebuie să ia o idee educată despre ce intenționați să faceți - și browserele diferite pot să vină cu răspunsuri diferite. "
- Opera Comunitate pentru dezvoltatori

Acestea fiind spuse, scorul final este, de fapt, irelevant.

Amintiți-vă de zilele în care noi (sau cel puțin unii dintre noi) le-am lipit acele butoane de validare subsol site-urilor noastre? Ce amuzant; pentru cine erau ei? Vizitatorii site-ului? Haha; Sper ca nu! Dar aici este chestia: în acel moment, validarea nu era într-adevăr a standard. nope; de fapt, dacă ați deranjat chiar să vă valideze codul HTML și CSS, ați fost a standarde atotcuprinzatoare, taie marginea ta! Uneori, este ușor să uităm că standardele web sunt un concept relativ nou.

Validați înainte de a vă întreba

Cu ani în urmă, când am participat la forumurile CSS, nu a eșuat: de fiecare dată când un membru nou a cerut ajutor pentru o problemă ciudată, primul nostru răspuns a fost, de obicei, ceva de genul: "Ysite-ul nostru nu este validat. Remediați erorile și apoi reveniți la noi dacă există încă probleme."De multe ori, aspectele ciudate ale aspectului sunt rezultatul unor elemente neînchise, cum ar fi a div. În aceste cazuri, validarea poate fi de mare ajutor.

Deci, ce sa schimbat? Validarea nu mai este necesară? Îți permite HTML5 să scriem o marcare grozavă fără un al doilea gând? Este noul HTML5 doctype magic-infused? Deloc. Validarea este un instrument util care ne permite să evidențiem etichetele închise, semnele punctului virgulat etc. Acestea fiind spuse, nota finală este, de fapt, irelevant. Nu este un număr magic - că, la 100%, contactează Arhitectul din spatele scenei și îl instruiește să aplice puncte bonus site-ului tău. Acest scor nu are scop mai mare decât să vă ofere feedback. Nu contribuie la accesibilitate și nici nu evidențiază cele mai bune practici. De fapt, validatorul poate fi înșelător, deoarece semnalează erori care nu sunt erori, de orice întindere a imaginației. Validatorul HTML4 a devenit rapid depășit, dar, din fericire, W3C are un nou validator HTML5 (încă experimental) care este mult îmbunătățit.

Acum, țineți cont de marcarea bine formată poate sa stimularea SEO; cu toate acestea, nu există o corelație specifică între SEO și un scor de validare.

HTML5 standardizează multe dintre caracteristicile pe care le-au acceptat unele browsere de ani de zile, cum ar fi atributele personalizate (prin date- prefix) și atributele ARIA, care nu reușesc validatorul HTML4 al W3C.

Când testați modele noi, asigurați-vă că verificați experimentul Validator HTML5 opțiune. Cu această opțiune setată, puteți utiliza proprietățile CSS3 acceptate, personalizate date- atribute și multe altele.


Cât despre 75% sau mai mare?

Niciodată, vreodată, să nu compromiteți niciodată utilizarea celor mai recente tehnici și selectori CSS3 de dragul validării.

Dacă încercăm să obținem cel puțin un scor de 75%? Înțeleg gândirea, așa cum am crezut și eu într-un anumit moment; deși, din nou, este irelevant. La validare, accentul principal trebuie să fie stabilirea locului în care ați făcut greșeli. Validarea nu este un joc și, deși este posibil să fi distractiv să-ți testezi abilitățile pentru a determina cât de mare poți obține scorul tău, trebuie să ții cont mereu: nu contează. Și niciodată, vreodată, să nu compromiți vreodată utilizarea celor mai recente tehnici doctype, CSS3 și selectori de dragul validării.

Secretul murdar al browserelor este că nu efectuează niciodată validarea HTML împotriva unui DTD. Doctype-ul pe care l-ați pus în partea superioară a documentului comută parserul într-un anumit mod de operare, însă nici o operațiune nu implică descărcarea doctype-ului și verificarea potrivirii codului. Ce inseamna asta? Înseamnă că un parser de sintaxă de bază se ocupă de HTML, cu excepția specificată pentru etichetele cu auto-închidere și pentru blocul față de elementele inline (și sunt sigur că și alte situații).
- Nicholas Zakas


Ce nu se validează

În funcție de opțiunile pe care le specificați înainte de a verifica desenele (HTML4 vs. HTML5), validatorul va țipa ca un copil atunci când se întâlnește:

  • Browser hacks
  • Vendor-prefixe
  • Atribute personalizate
  • Erorile autentice, cum ar fi elementele neacoperite
  • Rolul ARIA

Ahh, hack-urile de browser ... ar trebui să le folosiți? Răspunsul la această întrebare a fost dezbătut la moarte și cu siguranță depășește sfera acestui tutorial; cu toate acestea, rețineți că, de exemplu, utilizarea IE6-underscore-hack va eșua validarea.

Din acest motiv, mulți designeri preferă să folosească non-rupere în schimb.

Asa de:

 / * Eroare de validare * / #myElement _position: relative; / * ținte numai IE6 * /

devine:

 / * Validarea trecerii * / * html #myElement position: relative; / * ținte IE6 * /

Motivul din spatele acestei linii de gândire este, dacă în viitor, spunem că Internet Explorer 10 va afișa și proprietăți prefixate cu o subliniere? În astfel de cazuri, stilul dvs. IE6 (gândit astfel) va fi, de asemenea, aplicat la IE10 și mai departe, probabil. Acum, adevărul este că acest lucru nu s-ar întâmpla niciodată, deoarece ar sparge un număr mare de site-uri web. Acestea fiind spuse, această metodă de direcționare în browser este într-adevăr o hack. Cu excepția cazurilor mai mici sau rare, este mai bine să utilizați o foaie de stil condiționată sau o formă de detectare a caracteristicilor pentru a viza anumite browsere.

Prefixele furnizorilor

În timp ce toți suntem de acord că aplicarea prefixelor multiple ale furnizorilor pentru proprietăți, toate pentru a obține, de exemplu, colțurile rotunjite, este incredibil de obositoare, trebuie să mulțumiți starilor norocoși că vânzătorii de browsere au experimentat aceste tehnologii înainte de a fi oficial recomandați.

A avut WebKit care nu au experimentat gradientele CSS și nu au îmbunătățit Mozilla după sintaxa sugerată, gradientele nu ar fi acceptate la fel de mult în actuala generație de browsere moderne așa cum sunt astăzi. Vedeți, browserele au o mână imensă în modelarea viitorului web-ului.

 .caseta background: # 666; fundal: -moz-linear-gradient (top, negru, alb); fundal: - webkit-gradient (liniar, stânga sus, fund stânga, de la (negru) la (alb)); fundal: gradient liniar (top, negru, alb); 

Cu toate acestea, utilizarea acestor prefixe de furnizori va face ca foile dvs. de stil să nu reușească validarea. Dar este în regulă; nu vă lăsați să vă îngrijorați puțin.

Aflați regulile pentru a ști cum să le distrugeți în mod corespunzător.

Din păcate, chiar și acum, mulți designeri aleg să folosească, în exemplul nostru de mai sus, imagini pentru a crea gradienți - doar pentru a-și împinge scorul de validare la 100%. Dacă intrăți în această tabără: faceți greșit.


Utilizați Validarea ...

  • Pentru a testa elementele HTML necompletate
  • Pentru a verifica greșelile
  • Pentru a vă asigura că nu ați omis nicio punct și virgulă
  • Pentru pacea mintii

  • Validarea nu este ...

    • Un joc. Nu ratați timpul obținând un scor de 100%, când știți exact ce faceți. Cu toate acestea, utilizați-l pentru a evidenția greșelile dvs..
    • O cuprinzătoare Verificator. În timp ce testează erorile, nu indică practici incorecte, probleme de accesibilitate etc..
    • A fi folosit ca o scuză pentru faptul că nu acceptă cele mai recente tehnici CSS3. Cu cât îți spui mai mult: "O să folosesc asta în câțiva ani ..." cu atât mai mult vei cădea în urmă.

    Concluzie

    Dacă luați doar un singur lucru din acest articol, amintiți-vă că validarea este pur și simplu o unealtă. De îndată ce vă compromiteți logica și tehnicile proprii pentru a calma un validator și a obține un scor fără semnificație, acesta nu mai este un instrument. Acestea fiind spuse, folosiți-o și folosiți-o adesea!

Cod