Serviciu de validare. De ce este necesar un cod valid și cum să eliminați erorile de validare. Verificarea structurii paginii web
Verificarea validității codului web înseamnă verificarea conformității acestuia cu standardele și certificatele W3C.
W3C (World Wide Web Consortium) sunt creatorii tehnici ai Web-ului care dezvoltă standarde și linii directoare pentru scrierea codului. Certificatele și standardele W3C sunt obligatorii pentru toți cei care lucrează pe Web. Sunt necesare standarde comune de ortografie a codului, astfel încât toate aplicațiile de rețea să comunice într-un singur spațiu de limbă, în limbi standard, și să se înțeleagă reciproc atunci când lucrați cu documente web.
W3C nu numai că creează standarde web, ci și promovează în mod activ implementarea acestora.
W3C are servicii online pentru verificarea validității codului HTML/XHTML și CSS.
Verificarea codului pentru conformitate cu standardele W3C folosind validatoare W3C este cea mai bună modalitate.
Servicii online gratuite de la W3C pentru verificarea valabilității codului.
Validatorii de la W3C au o interfață intuitivă. Lucrul cu ei este ușor și simplu.
Serviciile fac posibilă efectuarea de verificări în trei moduri și, în consecință, au doar trei butoane:
Verificați adresa URL
(pentru a verifica trebuie să indicați adresa oricărei pagini a site-ului disponibilă pe Internet)
Verificați fișierul încărcat
(pentru a verifica, trebuie să specificați calea către fișierul care este verificat)
Verificați textul tastat
(pentru a verifica, trebuie să copiați și să lipiți codul verificat în fereastra validatorului)
Ultimele două metode sunt utile în special atunci când verificați documente web sau texte aflate pe computerele locale. Acestea pot fi pagini web, fie deja descărcate de pe Internet pe computerul local, fie generate de motoarele situate pe servere locale, cum ar fi Denver. În cazul Denver, trebuie să salvați pagina printr-un browser ca fișier cu extensia .html și apoi să o verificați ca fișier separat sau să copiați codul sursă al paginii web direct din browser și să verificați cum este textul. este tastat.
Cum să utilizați validatoarele online de la W3C.
contactați validatorul la:
(http://validator.w3.org/ - pentru validarea HTML sau XHTML
http://jigsaw.w3.org/css-validator/ - pentru verificarea CSS)
în fereastra de validare care se deschide, selectați una dintre cele trei metode de verificare
(URL-ul paginii site-ului, fișierul local sau textul introdus)
accesați fila corespunzătoare
indica obiectul care trebuie verificat
(introduceți adresa URL a paginii web pe care o verificați,
sau calea către fișierul de pe computerul local,
sau introduceți codul de verificat, respectiv)
Faceți clic pe butonul „Verificare” și priviți rezultatul testului
Serviciile de la W3C verifică valabilitatea codului și subliniază imediat erorile dacă există. Fiecare eroare va fi comentată. Comentariile, din păcate, sunt în engleză. Deci, Google Translator vă poate ajuta Tot ce rămâne este să corectați codul, dacă este necesar, și să îl verificați din nou pentru conformitate.
Validatorii de la W3C sunt complet gratuiti și automatizați. Prin urmare, le puteți bate cu ciocanul cu munca dvs. asupra greșelilor pentru o lungă perioadă de timp și cu impunitate. De aceea au fost create aceste servicii.
O alternativă normală la validatorii W3C.
Pe lângă serverele online W3C pentru verificarea codului web, extensia HTML Validator pentru browserul Mozilla Firefox dă rezultate foarte bune. Prezența unui astfel de add-on în browser ușurează munca webmasterului și demonstrează încă o dată că Mozilla Firefox este un browser „de direcție”.
Puteți descărca extensia pentru mozilla aici: http://users.skynet.be/mgueury/mozilla/
Puteți instala extensia astfel:
- Lansați Firefox.
Următorul: Meniu - Instrumente - Suplimente - Extensii.
Și, pur și simplu trageți și plasați fișierul descărcat (extensia xpi) în fereastra care se deschide.
După aceasta, extensia va fi instalată automat.
sau (a doua metodă):
- Lansați Firefox.
Următorul: Meniu - Fișier - Deschide fișier - specificați calea către fișierul descărcat.
După aceasta, extensia va fi instalată din nou automat.
După finalizarea instalării, va trebui să reporniți browserul.
Când reporniți, va apărea o fereastră care vă va cere să selectați o metodă de scanare a paginilor web:
„HTML Tidy” sau „SGML Parser” sau „Serial”
Alegem metoda „SGML Parser” ca fiind cea mai convenabilă și acceptabilă opțiune. Faceți clic pe butonul corespunzător. Acum, în fereastra browserului, va fi afișată o pictogramă de comandă rapidă pentru supliment, iar lângă acesta este un buton pentru meniul de setări pentru supliment.
Il am sus si dreapta:
Validatorul HTML pentru browserul Mozilla Firefox funcționează complet automat. Nu trebuie să i se arate ce să verifice. Verifică toate documentele care vor fi deschise în Mozilla Firefox. Este foarte convenabil. Este suficient să te uiți la culoarea etichetei programului pentru a înțelege dacă există sau nu probleme în documentul deschis.
În funcție de rezultatele testului, culoarea pictogramei poate fi verde, galben sau roșu, ceea ce indică următoarele:
verde - „fără erori”, totul este „OK”
galben - „fără erori, dar există avertismente”
roșu - „există erori”
Când faceți clic pe scurtătură, se va deschide o fereastră care conține codul sursă al paginii pe care o vizualizați, cu explicații și comentarii privind erorile și avertismentele, dacă există.
Ceva de genul acesta.
Efectuează mai multe verificări ale codului dvs. Principalele:
Rețineți că acestea sunt verificări logice și nu contează modul în care este implementat validatorul. Dacă cel puțin una dintre verificări eșuează, atunci codul HTML este considerat nevalid. Și aici constă problema Argumente Argumentul principal pentru validarea HTML este compatibilitatea între browsere. Fiecare browser are propriul parser, iar furnizarea lui ceea ce înțeleg toate browserele este singura modalitate de a fi sigur că codul tău va funcționa corect în toate browserele. Deoarece fiecare browser are propriul mecanism de corectare a erorilor HTML, nu vă puteți baza pe cod invalid.
Principalul argument împotriva validării este că este prea strictă și nu corespunde modului în care funcționează de fapt browserele. Da, HTML poate fi nevalid, dar toate browserele pot trata un cod nevalid în același mod. Dacă sunt dispus să îmi asum responsabilitatea pentru codul prost pe care îl scriu, atunci nu trebuie să-mi fac griji în privința verificării. Singurul lucru pentru care trebuie să-mi fac griji este că funcționează.În general, cea mai mare problemă a mea de validare este verificarea nr. 4 (pentru elemente străine). Sunt un susținător al utilizării atributelor personalizate în etichetele HTML pentru a stoca metadate suplimentare legate de un anumit element. După înțelegerea mea, aceasta este, de exemplu, adăugarea atributului foo atunci când am date (bară) pe care trebuie să le asociez cu un anumit element. Uneori, oamenii supraîncarcă atributele existente în aceste scopuri doar pentru a trece validarea, chiar dacă atributul va fi folosit în alte scopuri. Nu are sens pentru mine.
Secretul browserelor este că nu verifică niciodată dacă codul HTML corespunde DTD-ului specificat. Doctype pe care l-ați specificat în document comută parserul browserului într-un anumit mod, dar acesta nu încarcă doctype și nu verifică codul pentru conformitate cu acesta. Adică, analizatorul de browser procesează HTML cu unele ipoteze de invaliditate, cum ar fi etichete cu auto-închidere și elemente de blocare în interiorul elementelor inline (sunt sigur că există și altele).
În cazul atributelor personalizate, toate browserele analizează și recunosc atributele corecte din punct de vedere sintactic ca fiind valide. Acest lucru face posibilă accesarea unor astfel de atribute prin DOM folosind Javascript. Deci de ce ar trebui să-mi fac griji cu privire la valabilitate? Voi continua să-mi folosesc atributele și sunt foarte bucuros că HTML5 le oficializează.
Cel mai bun exemplu de tehnologie care are ca rezultat HTML nevalid, dar care face o diferență uriașă este ARIA. ARIA funcționează prin adăugarea de noi atribute la HTML 4. Aceste atribute oferă o semnificație semantică suplimentară elementelor HTML, iar browserul este capabil să transmită această semantică dispozitivelor de asistență pentru a ajuta persoanele cu dizabilități. Toate browserele majore acceptă acum marcajul ARIA. Cu toate acestea, dacă utilizați aceste atribute, veți avea HTML nevalid.
În ceea ce privește etichetele personalizate, cred că nu este nimic greșit în a adăuga etichete noi corecte din punct de vedere sintactic la o pagină, dar nu văd prea multă valoare practică în ea.
Pentru a-mi clarifica poziția: cred că verificările #1 și #2 sunt foarte importante și ar trebui făcute întotdeauna. De asemenea, consider că verificarea nr. 3 este importantă, dar nu la fel de importantă ca primele două. Verificarea #4 este foarte discutabilă pentru mine, deoarece afectează atributele personalizate. Consider că, la maximum, atributele personalizate ar trebui să fie marcate ca avertismente (nu erori) în rezultatele validării, astfel încât să pot verifica dacă am introdus incorect numele atributului. Marcarea etichetelor personalizate ca erori poate fi o idee bună, dar are și unele probleme, de exemplu la încorporarea conținutului în alte markupuri - SVG sau MathML.
Validare de dragul validării? Cred că validarea de dragul validării este extrem de stupidă. HTML valid înseamnă doar că toate cele 4 verificări au trecut fără erori. Există câteva lucruri importante pe care HTML valid nu le garantează:- HTML valid nu garantează accesibilitatea;
- HTML valid nu garantează o bună UX (experiență utilizator);
- HTML valid nu garantează un site web funcțional;
- HTML valid nu garantează afișarea corectă a site-ului.
Știu că acesta este un subiect controversat pentru mulți, așa că vă rugăm să vă abțineți de la declarații pur emoționale în comentarii.
UPD: multumesc pentru karma, am mutat-o la una tematica. Voi repeta cuvintele autoarei: înțeleg că acesta este un subiect controversat, dar vă rog să vă abțineți de la comentarii pur emoționale și să argumentați.
Validarea înseamnă a testa ceva în raport cu standardele (cerințe). În contextul webmasterilor, validarea site-ului înseamnă verificarea codului acestuia corectitudineŞi erori. Cu alte cuvinte: nu ar trebui să existe etichete sau structuri de neînțeles și, desigur, să nu existe erori html.
Ce afectează validarea?1. Validarea site-ului afectează în primul rând modul în care site-ul este afișat în browsere. Fiecare browser are propriile mecanisme de procesare a codului html. Dacă există erori în aspect (și aproape întotdeauna există), atunci browserul însuși le corectează și vedem site-ul afișat în forma corectă. Dar browserele nu au fost întotdeauna atât de capabile, iar anterior webmasterii au avut mai multe probleme cu corectitudinea aspectului. Validarea corectă afectează direct compatibilitatea între browsere.
2. Validarea poate afecta, de asemenea, încrederea site-ului pentru motoarele de căutare și, prin urmare, poziția site-ului. Cu toate acestea, nu se poate spune că codul HTML valid este un factor serios de clasare. Aspectul corect este doar unul dintre mulți factori care sunt luați în considerare numai în zone controversate.
Dar pentru motoarele de căutare, codul html este tot ceea ce vede robotul de căutare. Dacă există erori acolo, atunci pur și simplu interpretează greșit unele elemente, care uneori pot fi critice. De exemplu, dacă site-ul are etichete incorecte .. , (de exemplu, nu există nicio etichetă de închidere). Motorul de căutare nu va repara nimic, așa cum fac browserele. În consecință, poziția site-ului poate suferi foarte mult din cauza unor astfel de erori.
Exemplu din viațăVoi da un exemplu practic despre modul în care validarea poate avea un impact negativ asupra site-ului dvs. atât din punctul de vedere al SEO, cât și al utilizatorilor. Cândva, lucram pe site și am uitat din greșeală să închid o etichetă. După ce am verificat corectitudinea modificării în browserele populare, am făcut modificări site-ului.
După ceva timp, când am analizat traficul prin Yandex Metrica, am observat că timpul mediu de vizită în browserul Internet Explorer era mult mai scurt. După ce am deschis site-ul prin acest browser, mi-am dat seama ce se întâmplă. Întregul site a fost denaturat, era pur și simplu imposibil de citit conținutul. Și asta creează două probleme deodată. Prima problemă a fost că pierdeam tot traficul din IE, iar a doua problemă a fost că încurcam factorii comportamentali.
Cum să verificați un site pentru validitatea codului html 1. Validator html onlineExistă un serviciu gratuit pe Internet http://validator.w3.org/. Verifică validitatea codului html. Să aruncăm o privire mai atentă asupra modului în care funcționează acest serviciu.
Probabil, mulți designeri de layout și webmasteri au întâmpinat problema cum să verifice codul site-ului lor pentru erori. Desigur, majoritatea știe pentru validatori cunoscuți, dar sunt sigur că există un anumit procent care nu știu acest lucru și i-ar găsi util. Și astăzi am decis să scriu o listă scurtă de instrumente bune pentru designerii de layout.
.01 Serviciul de validare a markupurilor
Cel mai popular serviciu pentru verificarea codului. Cred că fiecare designer de layout ar trebui să știe despre asta. Acesta este un instrument foarte convenabil care oferă un serviciu flexibil pentru verificarea codului. Suporta diferite tipuri de limbaje: HTML (este deja posibil sa se verifice HTML5), XHTML, MathML, SVG, SMIL. Puteți verifica codul în 3 moduri:
ZY Apropo, „Verificare” trebuie apăsat în toate cele trei secțiuni
.02 Serviciul de validare CSS
O altă creație a w3.org. După ce verificați marcajul HTML, trebuie să verificați dacă codul din foaia de stil în cascadă CSS este corect. Acest instrument este identic cu „Markup Validation Service”, toate secțiunile sunt aceleași, doar că validează CSS-ul dvs.
.03 Serviciul de validare a furajelor
Da, da, ați înțeles bine, verificăm sintaxa fluxurilor Atom sau RSS. Interfața este aceeași ca în primele două servicii, deși există doar două secțiuni: „Validare prin URI” și „Validare prin intrare directă”.
.04 Verificator de legături
.05 W3C mobil OK Checker
Site-ul dvs. se afișează în mod normal pe dispozitivele mobile? Nu știu?) Să verificăm acum! Mergem la „W3C mobileOK Checker”, vedem cele 3 secțiuni de verificare familiare nouă, o selectăm pe cea mai potrivită și verificăm pagina web pentru afișarea corectă pe dispozitivele mobile.
.06 Analizor de pagini web
După nume, cred că înțelegeți deja ce face acest serviciu. Analizează dimensiunea paginii, timpul de încărcare și viteza, atât pentru pagina în ansamblu, cât și pentru fișiere, scripturi și imagini individuale. De asemenea, oferă recomandări pentru îmbunătățirea optimizării codului.
.07 Acces Culoare
Un instrument pentru a verifica contrastul și luminozitatea textului și a fundalului. Cu ajutorul acestuia, putem afla și vedea cum va fi percepută o pagină web de către persoanele cu deficiențe de vedere.
.08 Capturi din browser
Acest serviciu vă oferă posibilitatea de a vedea cum arată site-ul în diferite browsere. Are setări flexibile: poți alege diferite versiuni de browsere pentru Windows OS, Mac OS, Linux, BSD; rezoluția ecranului; adâncimea culorii; suport pentru Javascript, Java și Flash.
Adevărat, dacă ați ales aproape toate browserele, atunci va trebui să așteptați mult timp pentru capturi de ecran gata făcute. Acesta este probabil singurul negativ pe care l-am găsit în acest serviciu.
Cred că toți cei care sunt interesați să dezvolte și să promoveze site-uri web au întâlnit, într-un fel sau altul, conceptul de validitate a codului. Această expresie implică scrierea codului HTML al unui site în conformitate cu anumite standarde dezvoltate de World Wide Web Consortium (W3C). Respectarea regulilor prescrise de acest standard este o garanție a compatibilității între browsere, adică afișarea corectă a paginii create în toate browserele, precum și absența erorilor care afectează viteza de încărcare și alți parametri.
În internetul modern, criteriile pentru calitatea aspectului site-ului au început să joace un rol important, deoarece acum webmasterul trebuie să asigure afișarea corectă a resursei nu numai pe computere desktop și laptopuri, ci și pe multe dispozitive mobile cu o varietate a rezoluțiilor.
Cât de curat și structurat este făcut codul de către dezvoltatori face posibilă verificarea validității site-ului, care se realizează printr-un verificator special pe resursa oficială de la W3C. Iată un validator de cod HTML online disponibil gratuit, aflat la validator.w3.org
Cu ajutorul acestuia, puteți verifica validitatea codului HTML în trei moduri:
- Validare prin URI - verificare prin adresă
- Validare prin încărcare fișier - analiza fișierului încărcat
- Validare prin intrare directă - verificarea unei anumite piese de cod.
Selectarea metodei necesare se face prin trecerea la fila corespunzătoare: 
Să vedem ce se întâmplă dacă verificăm valabilitatea unui site cunoscut de pe Runet, de exemplu Habrahabr. Lipiți-l în câmpul de analiză și faceți clic pe butonul „Verifică”. După câteva secunde, validatorul W3C ne va oferi următorul rezultat: 
Un rezultat destul de bun, deoarece verificarea majorității resurselor va produce zeci și chiar sute de erori.
Dacă derulați puțin pagina în jos, puteți vedea exact unde a găsit verificatorul erorile și descrierea acestora, indicând rândurile. În plus, descrie în detaliu care este exact problema, ceea ce facilitează remedierea acesteia.
În orice caz, dacă s-au găsit erori pe site-ul dvs., nu vă supărați, pentru că, în primul rând, există de fapt foarte puține site-uri web care ar respecta pe deplin standardul W3C și, în al doilea rând, toate erorile pe care le-a găsit validatorul HTML -code pot fi corectat.
Verificarea unui site pentru validitatea codului său HTML vă permite să înțelegeți dacă are nevoie de corecții și optimizare a aspectului, deoarece curățenia și structura corectă a codului sunt o componentă importantă a optimizării interne. Aspectul semantic de înaltă calitate permite unui alt contractant să înțeleagă rapid codul altcuiva, precum și să mărească relevanța textului și să accelereze încărcarea paginii.
S-au scris multe articole despre oportunitatea și necesitatea căutării erorilor de validare, iar mai sus am scris deja principalele avantaje care pot fi obținute prin adaptarea codului site-ului dumneavoastră în conformitate cu standardele W3C. Mai mult, astfel de măsuri vor fi la fel de utile atât în cazul unui portal sau serviciu mare, cât și în legătură cu un blog mic sau site de carte de vizită.
