. Nakon što sam provjerio ispravnost izmjene u popularnim pretraživačima, napravio sam izmjene na stranici.
Nakon nekog vremena, kada sam analizirao promet preko Yandex Metrica, primijetio sam da je prosječno vrijeme posjete u pretraživaču Internet Explorer mnogo manje. Otvorivši sajt preko ovog pretraživača, shvatio sam šta se dešava. Cijela stranica je bila iskrivljena, bilo je jednostavno nemoguće pročitati sadržaj. A to stvara dva problema odjednom. Prvi problem je bio taj što sam gubio sav saobraćaj iz IE-a, a drugi problem je bio što sam zabrljao faktore ponašanja.
Kako provjeriti ispravnost html koda na web lokaciji
1. Online html validator
Na internetu postoji besplatna usluga http://validator.w3.org/. Provjerava valjanost html koda. Pogledajmo detaljnije kako ova usluga funkcionira.
Postoji takva stvar kao validacija ili valjanost kod. Validacija je proces testiranja koda kako bi se osiguralo da nema grešaka. Poziva se kod koji ne sadrži greške validan. Nije čak ni ispravno reći „nema grešaka“; tačnije bi bilo reći „kod koji nije u suprotnosti sa trenutnim standardima W3C“. Možete provjeriti HTML ima li grešaka koristeći uslugu:
Možete provjeriti greške u CSS-u koristeći uslugu:
Prilikom implementacije izgleda, svakom webmasteru pada na pamet da provjeri ispravnost koda i valjanost svoje stranice. Ali većina stranica (čak i onih najpopularnijih), ako provjerite valjanost njihovog koda, sadrži greške. Hajde da shvatimo sa čime je ovo povezano.
Vrlo često se koncepti „važeće stranice“ i „ispravne stranice“ razlikuju. U većini slučajeva možete koristiti kod koji će pomoći da se stranica pravilno prikaže u svim pretraživačima, ali ipak neće biti valjana.
Valjanost i SEO
Valjanost koda ima veliki uticaj na promociju sajta na pretraživačima. Postoje informacije da pretraživači rangiraju nevažeće stranice niže od onih koje su apsolutno validne. Osim toga, nevaljanost podrazumijeva neispravan prikaz stranice u različitim pretraživačima, što će uplašiti posjetitelje, što znači da će utjecati na stopu posjeta i faktore ponašanja i kao rezultat toga može dovesti do gubitka pozicije stranice u pretragama. Valjanost sajta jedan je od pokazatelja njegovog kvaliteta.
Važeći-nevažeći kod
Ali, kao što je gore navedeno, dešava se ispravan nevažeći kod. Upečatljiv primjer za to su CSS hakovi(tj. svojstva koja mijenjaju prikaz željenog elementa u različitim pretraživačima). Vrlo često su nevažeći. Naravno, možete odbiti korištenje takvih hakova, ali će, po pravilu, važeći kod biti mnogo duži i složeniji, pa je u takvim slučajevima bolje izabrati korištenje hakova umjesto jurnjave za valjanošću. U pravilu, takav kod ne uzrokuje štetu i otkriva se samo kada se provjeri pomoću validatora.
Validacija je jedan od najvažnijih aspekata dobrog web dizajna. Pogledajmo šta je to i kako provjeriti valjanost HTML koda. Kao primjer, uzmimo najčešći sistem za upravljanje sadržajem (CMS) – WordPress. Nakon toga ćemo podijeliti listu grešaka na koje smo naišli u praksi i, što je najvažnije, ponuditi vlastite provjerene metode za njihovo otklanjanje.
Zašto je potrebno provjeriti valjanost web stranice?
Jednostavno rečeno, provjerom web stranice utvrdit će se da li ispunjava standarde koje je razvio World Wide Web Consortium (W3C). Ovo se obično radi provjeravanjem valjanosti pojedinačnih stranica pomoću W3C-ove online usluge validacije.
Kao što postoje gramatička pravila u različitim jezicima, postoje i pravila u programiranju. Provjera vam omogućava da vidite da li je stranica u skladu s ovim pravilima, a ako postoje greške ili upozorenja, bit će date preporuke za njihovo rješavanje. U nastavku ćemo detaljnije razgovarati o potrebi za takvom verifikacijom.
Šta utiče na validnost sajta?
Jeste li se ikada zapitali kako pretraživači "čitaju" web stranicu? Imaju "motore" za analizu koda i pretvaranje u vizualni oblik za ljude. Nažalost, svaki pretraživač ima svoj mehanizam za obradu koda i to može uzrokovati drugačije prikazivanje vaših stranica.
Preglednici mogu drugačije čitati pogrešnu web stranicu. Ovo će dovesti do toga da vaši posjetitelji možda neće čak ni moći vidjeti sadržaj stranice ispravno u svojim pretraživačima. Validacija će kasnije ispraviti gotovo sve glavne razlike i učiniti vašu web stranicu čitljivom za gotovo sve web pretraživače (najčešći izuzetak su starije verzije Internet Explorera). Odatle je došao pojam “cross-browser layout” – tj. raspored koji je podjednako dobar (kompatibilan) za sve popularne pretraživače.
Kako će to uticati na SEO? Važno je shvatiti da roboti pretraživača vole semantičke web stranice. Semantički raspored, prema Wikipediji, predstavlja pristup kreiranju web stranica u HTML-u, zasnovan na korištenju HTML oznaka u skladu sa njihovom semantikom (svrhom). Osim toga, strukturirana semantička web stranica omogućava roboti za pretragu preciznije odrediti značaj kako pojedinih elemenata web stranice tako i cijelog teksta u cjelini. Prema Google-u, važeći kod ni na koji način ne utiče na rangiranje stranice. Ali u isto vrijeme, prisutnost grešaka u kodu može negativno utjecati na skeniranje mikro oznaka i prilagođavanje mobilnim uređajima.
Alati za validaciju vaše web stranice
Razumijevajući potrebu za odsustvom grešaka u validaciji na stranicama web-mjesta, pogledajmo kako pretražiti ove greške.
Ima ih mnogo besplatne usluge za verifikaciju sajta, kao što su Markup Validation Service W3C, Web Page Analyzer, Browsershots i drugi.
Provjera valjanosti web koda je provjera usaglašenosti sa W3C standardima i certifikatima.
W3C (World Wide Web Consortium) su tehnički postavljači weba, koji razvijaju standarde i smjernice za pisanje koda. W3C sertifikati i standardi su obavezni za sve koji rade na Webu. Zajednički standardi u pravopisu koda su potrebni kako bi sve mrežne aplikacije komunicirale u jednom jezičkom prostoru, na standardnim jezicima, i razumjele jedna drugu kada rade s web dokumentima.
W3C ne samo da kreira web standarde, već i aktivno promoviše njihovu implementaciju.
W3C ima online usluge za provjeru valjanosti HTML/XHTML i CSS koda.
Provjera usaglašenosti vašeg koda sa W3C standardima korištenjem W3C validatora je najbolja opcija.
Besplatne internetske usluge W3C za provjeru valjanosti koda.
Validatori iz W3C imaju intuitivan pristup jasan interfejs. Rad s njima je lak i jednostavan.
Usluge omogućavaju obavljanje provjera u tri načina i, shodno tome, imaju samo tri gumba:
Provjerite URL
(da biste provjerili potrebno je navesti adresu bilo koje stranice stranice dostupne na Internetu)
Provjerite otpremljeni fajl
(da biste provjerili morate navesti putanju do datoteke koja se provjerava)
Provjerite otkucani tekst
(da biste provjerili, morate kopirati i zalijepiti kod koji se provjerava u prozor validatora)
Posljednje dvije metode su posebno korisne pri provjeravanju web dokumenata ili tekstova koji se nalaze na lokalnim računarima. To mogu biti web stranice ili one koje su već preuzete sa Interneta lokalni računar, ili generiran od strane motora smještenih na lokalni serveri, kao "Denver". U slučaju Denvera, potrebno je da sačuvate stranicu kroz pretraživač kao datoteku sa ekstenzijom .html i zatim proverite kako zaseban fajl, ili kopirajte izvor web stranice direktno iz pretraživača i provjerite kako je tekst upisan.
Kako koristiti online validatore iz W3C.
kontaktirajte validatora na:
(http://validator.w3.org/ - za provjeru valjanosti HTML-a ili XHTML-a
http://jigsaw.w3.org/css-validator/ - za provjeru CSS-a)
u prozoru validatora koji se otvori, izaberite jedan od tri načina verifikacije
(url adresa stranice stranice, lokalni fajl ili otkucani tekst)
idite na odgovarajuću karticu
naznačiti objekat koji treba provjeriti
(unesite URL web stranice koju provjeravate,
ili putanju do datoteke na lokalnom računaru,
ili ubacite kod koji treba provjeriti, odnosno)
Kliknite na dugme „Proveri“ i pogledajte rezultat testa
Usluge iz W3C provjeravaju ispravnost koda i odmah ukazuju na greške ako ih ima. Svaka greška će biti komentarisana. Komentari su, nažalost, na engleskom. Dakle, Google prevodilac može pomoći samo da ispravite kod, ako je potrebno, i ponovo ga provjerite.
Validatori iz W3C-a su potpuno besplatni i automatizirani. Stoga ih svojim radom na greškama možete nabijati dugo i nekažnjeno. Zbog toga su i stvorene ove usluge.
Normalna alternativa W3C validatorima.
Pored W3C online servera za provjeru web koda, HTML Validator ekstenzija za pretraživač daje vrlo dobre rezultate Mozilla Firefox. Prisustvo ovakvog dodatka u pretraživaču olakšava rad webmasteru i još jednom dokazuje da je Mozilla Firefox „upravljački“ pretraživač.
Možete preuzeti ekstenziju za mozilla ovdje: http://users.skynet.be/mgueury/mozilla/
Možete instalirati ekstenziju na sljedeći način:
- Pokrenite Firefox.
Sljedeće: Meni - Alati - Dodaci - Ekstenzije.
I jednostavno prevucite i ispustite preuzetu datoteku (xpi ekstenzija) u prozor koji se otvori.
Nakon toga, ekstenzija će se automatski instalirati.
ili (druga metoda):
- Pokrenite Firefox.
Dalje: Meni - Datoteka - Otvori datoteku - odredite putanju do preuzete datoteke.
Nakon toga, ekstenzija će se ponovo automatski instalirati.
Nakon završetka instalacije, morat ćete ponovo pokrenuti pretraživač.
Kada ponovo pokrenete, pojavit će se prozor u kojem će se tražiti da odaberete metodu za skeniranje web stranica:
"HTML Tidy" ili "SGML Parser" ili "Serial"
Mi biramo metodu “SGML Parser” kao najprikladniju i najprihvatljiviju opciju. Kliknite na odgovarajuće dugme Sada će se u prozoru pretraživača prikazati ikona prečice za dodatak, a pored nje je dugme za meni postavki dodatka.
Imam ga gore i desno:
HTML Validator za Mozilla pretraživač Firefox radi u potpunosti automatski način rada. Ne treba mu pokazivati šta da provjeri. Provjerava sve dokumente koji će biti otvoreni u Mozilla Firefox-u. Veoma je udoban. Dovoljno je pogledati boju oznake programa da biste shvatili da li postoje problemi u otvorenom dokumentu.
Ovisno o rezultatima testa, boja ikone može biti zelena, žuta ili crvena, što ukazuje na sljedeće:
zelena - "bez grešaka", sve je "OK"
žuta - "nema grešaka, ali ima upozorenja"
crveno - "postoje greške"
Kada kliknete na prečicu, otvoriće se prozor sa izvornim kodom stranice koju gledate sa objašnjenjima i komentarima grešaka i upozorenja, ako ih ima.
Ovako nešto.
Pozdrav svima, danas je završna lekcija kursa HTML/CSS izgleda.
Kao što sam obećao, u ovoj lekciji ćemo naučiti kako da validiramo stranicu. Hajde da shvatimo šta je to, za šta je potrebno i koji su alati i usluge dostupni za to.
Šta je validacija stranice
Počnimo od toga šta je zapravo validacija stranice. Validacija stranice— ovo je provjera njegovog HTML i CSS koda za usklađenost sa web standardima, kao i odabranog tipa dokumenta. Standarde o kojima je riječ propisuje W3C i to je to moderni pretraživači pokušajte ih pratiti.
Ako je provjera valjanosti uspješna, odnosno dokument je validan, tada će se s velikim stepenom vjerovatnoće jednako prikazati u svim pretraživačima).
Važeći izgled je obično "čist", lijep kod, koji se, između ostalog, "lajkuje" tražilice. Stoga je provjera ispravnosti koda obavezan korak prilikom kreiranja web stranica.
Provjera ispravnosti stranice
Kako provjeriti valjanost stranice? Najjednostavniji način Provjera usklađenosti web-stranice sa web standardima znači korištenje online validatora. Provjera ispravnosti html-a je moguća na: http://validator.w3.org/. Obavezno koristite ovu uslugu da pronađete greške u svom HTML kodu.
CSS validacija se vrši pomoću CSS validatora koji se nalazi na: http://jigsaw.w3.org/css-validator/.
Detaljnije sam pokazao kako raditi sa ovim servisima u videu ispod.
Također, provjera ispravnosti koda može se obaviti pomoću dodataka za provjeru valjanosti koda. Na primjer, meni je zgodnije da ih koristim, jer vam omogućavaju da provjerite valjanost u pokretu.
Evo video tutorijala:
Učitavanje...