Verificați erorile de validare. Valabilitatea codului - ce este și cum se verifică? Folosind HTML Validator

Validare- aceasta este verificarea ceva pentru conformitatea 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 situații 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, făceam îmbunătățiri site-ului ș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; a fost 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 online

Există 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.

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 realizat codul de către dezvoltatori poate fi detectat prin 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 decât atât, 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ă.

Buna ziua. Îți voi răspunde imediat la întrebare: merită să-ți citești această lecție? Accesați un serviciu foarte util și gratuit, introduceți acolo adresa site-ului dvs. și dacă vedeți că sunt erori pe site, atunci lecția merită citită. Exemple de afișare a erorilor folosind acest validator online:

Nu există astfel de erori pe blogul meu acum, am scăpat de ele (în total au fost peste 70 de erori și peste 80 de avertismente). Pentru a clarifica, vă voi spune ce este codul valid și de ce avem nevoie de el.

Codul valid este un cod care respectă standardele.

Puteți verifica HTML, CSS, tot felul de micro-markup și multe altele pentru valabilitate. Astăzi voi vorbi despre valabilitate în HTML.

  • Nu este necesar un cod valid, dar numărul de erori ar trebui să fie minim, altfel site-ul dvs. nu va fi compatibil între browsere. Valabilitatea codului este necesară în primul rând pentru a vă asigura că site-ul dvs. se afișează corect în toate browserele.
  • Roboții de căutare „vorbesc” cu site-ul dvs. în HTML, așa că este important să prezentați conținutul de pe site clar și clar cu toate „etichetele închise” și așa mai departe.
  • Valabilitatea HTML afectează SEO, dar destul de nesemnificativ (cu excepția cazului în care, desigur, aveți sute, sau chiar mii de erori). Vă recomand să citiți observațiile interesante ale lui Devaki, „Impactul calității HTML asupra clasamentului lor”.
  • Când am făcut codul valid pe site-ul meu, am găsit și corectat greșelile mele stupide (etichete repetate, literă lipsă etc.).
  • Nu ar trebui să vă „spărgeți fundul” dacă o eroare este dificil de remediat, sau corectarea acesteia va afecta funcționalitatea site-ului. Principalul lucru este să îl faceți convenabil pentru utilizator.

Mai jos voi analiza principalele erori semnalate de validator. Dacă dintr-o dată greșeala ta nu este în lista de mai jos, scrie-o în comentarii, vom încerca să o descoperim împreună și voi adăuga o soluție la această problemă în această lecție. Apropo, da, erorile semnalate de validatorul w3c pot fi găsite aici:

Fiecare eroare are un indiciu - acesta este numărul liniei din codul sursă al paginii și din acesta puteți determina deja aproximativ în ce fișier temă se află această linie. Ne uităm la codul sursă al paginii folosind CTRL+U (în browserele majore).

Înainte de a începe, faceți o copie de rezervă a șablonului site-ului dvs.

De asemenea, pentru a facilita găsirea erorilor în codul sursă, puteți utiliza validatorul HTML pentru Mozilla Firefox. După ce îl instalezi și mergi la codul sursă al paginii, vei vedea aceleași erori pe care le indică serviciul validator.w3.org. Făcând clic pe numele erorii (în colțul din stânga jos), veți fi redirecționat automat către linia în care se află acest cod invalid.

Găsirea erorilor în HTML folosind validatorul w3c și remedierea lor

Căutați eroarea dvs. în lista de mai jos și faceți clic pe ea, vă va „defila” automat la locul potrivit.

1. Fără spațiu între atribute.

…rel="pictogramă scurtătură" href="http://arbero.ru/favicon.ico" ; type="image/x-icon" Eliminați doar punctul și virgulă.

2. Atributul width de pe elementul td este învechit. Folosiți în schimb CSS.

td valign="center" width="80" height="80" >

Să transformăm așa ceva în formă

td style="align:center; width:80; height: 80;">

3. Un element img trebuie să aibă un atribut alt, cu excepția anumitor condiții. Pentru detalii, consultați îndrumările privind furnizarea de alternative de text pentru imagini.

Una dintre cele mai frecvente greșeli. Pur și simplu nu există suficient text alternativ pentru imagine. Scriem eticheta alt.

4. Secțiunea nu are titlu. Luați în considerare utilizarea elementelor h2-h6 pentru a adăuga titluri de identificare la toate secțiunile.

secțiune id="comentarii" >

Blocul de secțiuni ar trebui să conțină unele dintre etichetele h2-h6, dacă nu, doar redenumiți secțiunea de cuvinte în div

5. Elementul hgroup este învechit. Pentru a marca subtitlurile, luați în considerare fie să puneți subtitlul într-un element p după elementul h1-h6 care conține titlul principal,

sau altfel introducerea subtitlului direct în elementul h1-h6 care conține titlul principal, dar separat de titlul principal prin punctuație și/sau în, de exemplu, un element span class="subtitlu" cu stil diferențiat. Pentru a grupa titluri și subtitluri, titluri alternative sau sloganuri, luați în considerare utilizarea elementelor antet sau div.

Similar punctului anterior. Doar schimbați expresia hgroup în div. Puteți utiliza instrumentul Găsește/Înlocuiește toate din editorul de text pentru a accelera astfel de procese.

6. Element „noindex” nedefinit

Pentru ca eticheta noindex să fie valabilă, o scriem ca comentariu, adică astfel:

Neindexabil

7. Etichetă finală pentru elementul „div” care nu este deschis

Eticheta div de închidere este redundantă. Să-l scoatem.

8. Tipul documentului nu permite elementul „li” aici; lipsește unul dintre etichetele de pornire „ul”, „ol”, „meniu”, „dir”.

Utilizarea incorectă a etichetei „li”: lipsesc etichetele „ul”, „ol”, etc. Verificați.

9. Eticheta de sfârșit pentru „div” a fost omisă, dar a fost specificat OMITTAG NO

Eticheta div de închidere lipsește.

10. Nu există atribut „border”

alt="" width="1" height="1" border=" 0"/>

Pur și simplu eliminăm expresia border="0".

11.Personaj"<" is the first character of a delimiter but occurred as data

Nu folosiți eticheta „<" перед обычными словами, используйте лучше разные кавычки.

12. Saw " când se așteaptă un nume de atribut. Cauza probabilă: = lipsește imediat înainte.

Citat suplimentar, eliminați-l.

13. Atributul align de pe elementul img este învechit. Folosiți în schimb CSS.

Nu utilizați valoarea de aliniere în interiorul unei etichete img. Notează-l separat, sub această formă:

aici este poza (img src)

14. Valoare greșită pentru atributul href pe linkul elementului: caracter ilegal în segmentul de cale: nu este un punct de cod URL.

Concluzie

Dacă aveți vreo eroare pe site-ul dvs. care nu se află în această listă, scrieți-o în comentarii. Să ne dăm seama și voi adăuga la articol. Repet, dacă vreo eroare nu poate fi corectată, nu vă deranjați.

Mai am o eroare pe blogul meu (deși ieri, din anumite motive, codul a fost fără erori):

Conținutul text al scriptului elementului nu a fost în formatul necesar: spațiu așteptat, tabulație, linie nouă sau bară oblică, dar a fost găsit< instead.

Dacă știți cum să o remediați, v-aș fi recunoscător. Sunt un pic perfecționist. 🙂

Veți face codul HTML al site-ului valid?

Vă doresc să primiți un cod HTML valid pe site-ul dvs. web, a cărui notificare arată astfel:

P.s. Îți supraîncarci adesea corpul? Atunci ai nevoie de un program de detoxifiere. Restabiliți puterea și echilibrul energetic.

Salutare tuturor! Astăzi vă voi spune despre ce este vorba valabilitatea codului site-ului, de ce este necesar și cum să îl verificați și să îl remediați folosind diverse servicii de validare online W3C (html, CSS). Deci, să începem cu teorii. Care este mai exact acest termen?

Valabilitatea codului este gradul în care codul site-ului dvs. web respectă standardele internaționale acceptate, prescurtat ca W3C. Cu alte cuvinte, cu mult timp în urmă, au fost adoptate o serie de reguli generale de scriere a codului, care, dacă nu sunt conforme cu standardele W3C, pot duce la afișarea incorectă a site-ului dvs. în diferite browsere de computer și mobile. De asemenea, în unele cazuri deosebit de rare, acest lucru poate duce la sancțiuni din partea motoarelor de căutare, precum și la impunerea diferitelor filtre care pot încetini dezvoltarea proiectului dumneavoastră. Dar acest lucru se întâmplă foarte rar, deoarece chiar și Yandex și Google înșiși au cod care nu este 100% valid, adică conține erori.

De fapt, probabil că ai o întrebare: de ce trebuie să-mi petrec timpul editând codul site-ului meu, astfel încât să devină valid, dacă oricum nu afectează nimic? După cum am scris mai sus, acest lucru este necesar pentru a vă asigura că site-ul dvs. se afișează corect (fără erori și erori) în diferite browsere. Astăzi, după cum știți, diverse tipuri de modele de telefoane devin din ce în ce mai populare: iPhone, Android, Smartphone și altele, care sunt deja folosite de întreaga populație a pământului. Astăzi, fiecare a treia persoană are propriul său telefon mobil, prin care poate intra online și vă poate vizita site-ul. Este de aproximativ 20-30 de ori mai mult decât cei care au propriul computer, laptop, tabletă.

Adică înțelegi ideea. Publicul de oameni care folosesc dispozitive mobile este cel mai mare, ceea ce trebuie să țintăm. Și dacă vă amintiți câte dispozitive mobile au fost lansate în ultimii 10 ani și câte modele noi continuă să fie lansate la fiecare șase luni, atunci devine clar că ar fi foarte stupid să pierdeți un astfel de trafic (vizitatori). În plus, noile tehnologii nu stau pe loc și, odată cu apariția limbajului html5 actualizat, vechiul dvs. site web creat în 200 se poate dovedi a fi, ca să spunem așa, un mare zgomot pe fundalul rețelei globale.

Cum să verifici validitatea codului html și CSS al site-ului tău?

Există o mulțime de astfel de servicii pe Internet, cu toate acestea, aproape toate sunt strâmbe și chiar și în engleză, unde nu va fi foarte ușor de înțeles ce se spune. Dar totuși, există unul dintre ele care este mai normal, care nu numai că oferă o explicație, dar arată și în ce linie de cod se află eroarea. Deci, faceți cunoștință - jigsaw.w3.org.

Vizitând acest site, puteți verifica validitatea codului site-ului dvs. în trei moduri. În fila „Verificare URI”, introduceți adresa site-ului dvs., iar serviciul vă va oferi întreaga listă de erori găsite în coduri doar pe pagina principală! Dacă, la fel ca mine, nu cunoașteți foarte bine codurile și când vizualizați codul site-ului dvs. nu găsiți linia care trebuie corectată, atunci puteți pur și simplu să încărcați fișierul de stiluri CSS (designul site-ului) în „verificați fișierul încărcat fila ” .

În acest caz, veți ști deja în ce fișier trebuie să introduceți codul. Apropo, o poți face și mai ușor. Dacă site-ul dvs. rulează pe un motor, de exemplu, atunci va trebui să mergeți doar la panoul de administrare al blogului din „aspect” „editor”, selectați un fișier, de exemplu, antet (header.php), copiați codul și lipiți-l în serviciu fila „verificarea textului tastat”. Așa mi-am verificat personal blogul.

Deci, pe site-ul meu personal au fost 44 de erori, ceea ce este foarte puține în comparație cu alte site-uri. Apropo, unchiul Yandex are până la 155 de erori, ah-ah-ah. Ei bine, bine, să nu vorbim despre lucruri triste.

Pentru a vă fi mai ușor să corectați aceste inexactități în coduri, permiteți-mi să vă arăt personal câteva exemple pe blogul meu. Mai întâi, acordați atenție inscripției Linia 26. Aceasta indică o linie de cod. Pentru a-l găsi rapid, plasați acest cod pe care l-ați introdus în serviciul jigsaw.w3.org în orice editor html, vor fi afișate etichetele liniilor.

Observați că unele etichete sunt întotdeauna evidențiate cu roșu în cod. Acesta este locul în care trebuie să căutați și să editați codul. Cel mai adesea, trebuie eliminat complet sau etichetele lipsă trebuie adăugate la el. De asemenea, în titlu și în partea de jos a inscripției există sfaturi în limba engleză despre ce trebuie făcut pentru a corecta eroarea.

Exemplul 1. Aici trebuie să eliminați ghilimele evidențiate cu roșu <> . Ele nu ar trebui să fie în interiorul codului, acolo unde există deja la început și la sfârșit.

Exemplul 2. Lipsește o etichetă de închidere la sfârșitul codului /> . Rețineți că dacă în partea de sus a codului există o altă linie, tot cu o etichetă neînchisă, atunci trebuie să fie și închisă, altfel eroarea nu va dispărea.

Exemplul 3. Aici trebuie doar să eliminați linia repetată: „ href=""> .

Apropo, ar trebui să corectați erorile în primul rând, cele marcate cu o cruce, și nu cu un semn de exclamare, deoarece aceste erori nu sunt atât de importante. De asemenea, înainte de a repara ceva, faceți acest lucru, deoarece există o mare probabilitate să îl rupeți. După ce curățați complet codul, vă recomand să vă uitați la modul în care site-ul dvs. este afișat în diferite browsere pe diferite platforme de computer și telefon. Serviciul online gratuit browsershots.org vă poate ajuta în acest sens.

Cum altfel poți verifica rapid validitatea codului html și CSS al site-ului tău?

Dacă jigsaw.w3.org nu a fost suficient pentru dvs., atunci iată câteva servicii suplimentare pentru verificarea validității codului html al unui site: www.validome.org, watson.addy.com,

În concluzie, vreau să spun că dacă găsești câteva erori în tine, atunci nu trebuie să-ți faci griji, deoarece nu este atât de important astăzi. În general, au fost efectuate experimente pe această temă de mult timp, din care a devenit clar că codul prost valid nu afectează rezultatele căutării unui site. Dar, din păcate, internetul este un mediu în care totul se schimbă rapid. Astăzi poate că nu contează, dar mâine Yandex va adăuga acest algoritm suplimentar și pozițiile de căutare se pot lăsa (scădea). Deci, dacă aveți timp suplimentar pentru a modifica codul site-ului dvs., este mai bine să o faceți acum.

Există așa ceva ca validare sau valabilitate cod. Validarea este procesul de testare a codului pentru a se asigura că nu există erori. Se apelează codul care nu conține erori valabil. Nici măcar nu este corect să spui „nu are erori”; ar fi mai corect să spui „cod care nu contrazice standardele W3C actuale”. Puteți verifica HTML pentru erori utilizând serviciul:

Puteți verifica CSS pentru erori utilizând serviciul:

Atunci când implementează aspectul, fiecare webmaster îi trece prin cap să verifice site-ul său pentru corectitudinea codului și validitatea. Dar cele mai multe site-uri (chiar și cele mai populare), dacă le verificați validitatea codului, conțin erori. Să ne dăm seama cu ce are legătură.

Foarte des conceptele de „site valid” și „site corect” sunt diferite. În cele mai multe cazuri, puteți utiliza un cod care va ajuta site-ul să se afișeze corect în toate browserele, dar, cu toate acestea, nu va fi valabil.

Valabilitate și SEO

Valabilitatea codului are o mare influență asupra promovării site-ului în motoarele de căutare. Există informații că motoarele de căutare clasifică site-urile invalide mai jos decât cele absolut valide. În plus, invaliditatea implică afișarea incorectă a site-ului în diferite browsere, ceea ce va speria vizitatorii, ceea ce înseamnă că va afecta rata de respingere și factorii comportamentali și, ca urmare, poate duce la pierderea poziției site-ului în căutări. Valabilitatea unui site este unul dintre indicatorii calității acestuia.

Cod valid-invalid

Dar, după cum am menționat mai sus, se întâmplă corect invalid cod. Un exemplu izbitor în acest sens este Hack-uri CSS(adică proprietăți care modifică afișarea elementului dorit în diferite browsere). Ele sunt foarte adesea invalide. Desigur, puteți refuza să folosiți astfel de hack-uri, dar, de regulă, codul valid va fi mult mai lung și mai complex, așa că în astfel de cazuri este mai bine să alegeți să utilizați hack-uri în loc să urmăriți validitatea. De regulă, un astfel de cod nu dăunează și este detectat numai atunci când este verificat folosind un validator.