Pogreška validatora: Nedostajeoznačiti

Obrazloženje: stavke moraju biti zatvorene obrnutim redoslijedom otvaranja

Pravo:
< li >...

DOCTYPE osjetljivost na velika i mala slova

Primjer:

Pogreška validatora: Nedostaje DOCTYPE

Obrazloženje: DOCTYPE razlikuje velika i mala slova

Pravo:

Zatvaranje "/" nije registrirano

Primjer:
… Style.css "type =" text / css "media =" screen " >

Obrazloženje: "Prazni elementi" poput img ili br, mora završiti s "/" s razmakom ispred

Pravo:
… Style.css "type =" text / css "media =" screen " />

Oznake se pišu velikim slovima

Primjer:

Pogreška validatora: Ne postoji takav element ...

Obrazloženje: u dokumentima XHTML svi elementi i atributi moraju biti malim slovima, od ovaj jezik razlikuje mala i velika slova i za njega

Pravo:

Vrijednosti atributa pišu se bez navodnika

Primjer:

Pogreška validatora: Nedostaje ""

Obrazloženje: vrijednosti atributa zapisuju se zajedno s navodnicima

Pravo:

Img nema alt atribut

Primjer:

Pogreška validatora: potrebni atribut "alt" nije naveden

Obrazloženje: tag img atribut alt uvijek treba biti, vrijednost se može ostaviti prazna ako se slika koristi za ukrašavanje

Pravo:

Kao rezultat toga, moći ćete ispraviti pogreške na web mjestu i učiniti ga valjanim.

Mislim da su svi koji su zainteresirani za razvoj i promociju web stranica, na ovaj ili onaj način, naišli na takav koncept kao valjanost koda. Ovaj izraz podrazumijeva pisanje HTML koda web stranice u skladu s određenim standardima koje je razvio World Wide Web Consortium (W3C). Poštivanje pravila propisanih ovim standardom jamstvo je kompatibilnosti među preglednicima, odnosno ispravnog prikaza stvorene stranice u svim preglednicima, kao i nepostojanja pogrešaka koje utječu na brzinu učitavanja i druge parametre.

U suvremenom Internetu kriteriji kvalitete izgleda web stranice počeli su igrati važnu ulogu, jer sada webmaster mora postići ispravan prikaz resursa ne samo na stacionarnim računalima i prijenosnim računalima, već i na mnogim Mobilni uredaji s raznim rezolucijama.

Kako su programeri čisti i strukturirani, može se otkriti provjerom valjanosti web stranice, što se provodi putem posebne provjere na službenom resursu iz W3C. Na mreži validator.w3.org postoji besplatni mrežni HTML validator

Može se koristiti za provjeru valjanosti HTML koda na tri načina:

• Potvrda putem URI -ja - potvrda prema adresi
• Validate by File Upload - analiza učitane datoteke
• Validate by Direct Input - potvrda određenog dijela koda.

Odabir potrebne metode provodi se prelaskom na odgovarajuću karticu:

Pogledajmo što će se dogoditi ako provjerimo valjanost neke poznate web stranice na Runetu, na primjer Habrahabra. Zalijepite ga u polje za analizu i pritisnite gumb "Provjeri". Nakon nekoliko sekundi, W3C validator će nam dati sljedeće rezultate:

Dosta dobar rezultat, jer će provjera većine resursa dati desetke, pa čak i stotine grešaka.

Pomaknete li se malo prema dolje na stranici, možete vidjeti gdje je provjeravač točno pronašao greške i njihove opise, ukazujući na retke. Osim toga, detaljno opisuje u čemu je problem, što ga čini lakim za rješavanje.

U svakom slučaju, ako su na vašoj web stranici pronađene pogreške, nemojte se uzrujavati, jer, prvo, postoji vrlo malo web stranica koje su u potpunosti u skladu sa standardom W3C, a drugo, sve pogreške koje je HTML validator pronašao -kod se mogu ispraviti .

Provjera valjanosti HTML koda na web mjestu omogućuje vam da shvatite trebaju li ispravke i optimizaciju izgleda, jer su čistoća i kompetentna struktura koda važna komponenta interne optimizacije. Dobro napravljen semantički izgled omogućuje drugom izvođaču da brzo shvati tuđi kod, kao i poveća relevantnost teksta i ubrza učitavanje stranica.

Napisano je mnogo članaka o izvedivosti i nužnosti traženja pogrešaka provjere valjanosti, a gore smo već napisali glavne prednosti koje se mogu postići prilagodbom koda vaše web stranice u skladu sa standardima W3C. Štoviše, takve će mjere biti jednako korisne i u slučaju velikog portala ili usluge, i u odnosu na mali blog ili stranicu s posjetnicama.

Validacija- Ovo je provjera usklađenosti standarda sa standardima (zahtjevima). U kontekstu webmastera, provjera valjanosti web stranice znači provjera njenog koda ispravnost i pogreške... Drugim riječima: ne bi trebalo biti nerazumljivih oznaka, konstrukcija i prirodno ne bi trebalo biti html pogrešaka.

Na što utječe validacija

1. Provjera valjanosti web mjesta prvenstveno utječe na prikaz web mjesta u preglednicima. Svaki preglednik ima svoje mehanizme za obradu html koda. Ako postoje pogreške u izgledu (a one su gotovo uvijek), tada ih preglednik sam uklanja i vidimo prikaz web mjesta u ispravnom obliku. No, preglednici nisu uvijek bili tako sposobni, a raniji webmasteri imali su više problema s ispravnošću izgleda. Ispravna provjera valjanosti izravno utječe na kompatibilnost među preglednicima.

2. Validacija također može utjecati na povjerenje web stranice za tražilice, a samim time i na položaj web stranice. Međutim, nemoguće je reći da je valjani html kôd ozbiljan faktor rangiranja. Ispravan raspored samo je jedan od mnogih čimbenika koji se uzima u obzir samo u kontroverznim trenucima.

No, za tražilice, html kôd je sve što robot za pretraživanje vidi. Ako postoje pogreške, on jednostavno pogrešno tumači neke elemente koji ponekad mogu biti kritični. Na primjer, ako web lokacija ima netočne oznake

..

, (na primjer, nema završne oznake). Sustav pretraživanja neće popraviti ništa poput preglednika. Zbog toga pozicije web -mjesta mogu jako patiti zbog takvih pogrešaka.

Primjer iz stvarnog života

Evo praktičnog primjera kako provjera valjanosti može loše utjecati na vašu web stranicu u smislu SEO -a i korisnika. Jednom davno radio sam reviziju na web mjestu i slučajno zaboravio zatvoriti jednu oznaku

... Nakon što sam provjerio ispravnost revizije u popularnim preglednicima, napravio sam izmjene na web mjestu.

Nakon nekog vremena, kada sam analizirao promet kroz Yandex Metricu, primijetio sam da je prosječno vrijeme posjeta u pregledniku Internet Explorer mnogo manje. Otvorivši web stranicu putem ovog preglednika, shvatio sam o čemu se radi. Cijela je stranica bila iskrivljena, jednostavno je bilo nemoguće pročitati sadržaj. A to stvara dva problema odjednom. Prvi problem - gubio sam sav promet od IE -a, a drugi - kvario sam čimbenike ponašanja.

Kako provjeriti valjanost html koda na web stranici

1. Mrežni html validator

Na internetu postoji besplatna usluga http://validator.w3.org/. Preko njega se provjerava valjanost html koda. Razmotrimo detaljnije rad ove usluge.

Suvremeni trendovi i web aplikacije dramatično su promijenile mogućnosti programera. Nema sumnje da im je potrebna neka vrsta IDE -a za kodiranje novih datoteka i njihovo spremanje za kasnije postavljanje. Ali što ako samo provjerite fragmente koda? Srećom, u današnje vrijeme postoji toliko različitih alata za to!

U ovom ćemo članku podijeliti 15 web aplikacija za testiranje koda na mreži. Svi oni rade pod uvjetom internetske veze; neki od njih nude profesionalne planove za dodatni paket nekretnina. Većina njih bit će korisna kada pokušate pronaći i ispravljati pogreške javascripta ili PHP -a.

1. Kodiranje

Izradio Stephen Hazel, jedinstvena je web aplikacija s kojom možete kodirati sintaksu na cijelom webu. Osim otklanjanja pogrešaka, Codepad svojim korisnicima omogućuje kopiranje / lijepljenje važnih dijelova koda i njihovo dijeljenje na mreži.

Izlazni zaslon prikazuje poruke o greškama vezanim uz vaš kôd. Pomoću gumba na lijevom izborniku možete promijeniti jezik (C / C ++, Perl, PHP, Python, Ruby itd.). Codepad je više za programere softver koji trebaju surađivati ​​i otklanjati greške u najproblematičnijim programima.

2. Napišite kod na mreži

Glavna web stranica preusmjerit će vas na uređivač Java Script. Možete birati između JS, PHP i kodiranja osnovnog URL -a. Aplikacija nije samo sigurna i pouzdana, već je i prilično jednostavna za korištenje.

Zanimljivo je da ćete rezultate svog rada vidjeti odmah ispod tekstualnog polja. Dakle, ako kliknete "pokrenite kôd", rezultat će se prikazati. Otklanjanje grešaka veliko PHP skripte može biti teže jer zahtijeva uključivanje drugih datoteka.

Ipak, aplikacija će vam pružiti nezamjenjivu pomoć u testiranju nove ideje za snagu.

3.Tinkerbin

Mogu ga nazvati svojim omiljenim internetskim resursom za uređivanje kodova. Podržava HTML5 / CSS3 / JS i ispisuje rezultat izravno na zaslon. Aplikacija je još uvijek u alfa razvoju, ali većina alata odlično radi i brzo pronalazi greške u programima.

Stroj za iscrtavanje podržava jezike poput Coffeescript i Sass unutar CSS -a. Hvale se naprednim sustavom upravljanja i podrškom za mnoge robne marke web dizajna koje biste radije koristili za svoj budući rad.

Ne može se zanemariti činjenica da postoje hotkeys za najpopularnije opcije. Ta se funkcionalnost ne nalazi u svim web aplikacijama, a da ne spominjemo ugrađene uređivače koda u pregledniku. Kad unesete nove oznake, IDE automatski dodaje nove retke. Tinkerbin je prednji alat koji bi definitivno trebao biti među vašim alatima za razvoj weba.

4.JS Bin

Za početnike rad s sučeljem može uzrokovati određene poteškoće. Kako bi to izbjegli, mogu iskoristiti prednosti. JS Bin nudi veliki izbor knjižnica na izbor - jQuery, jQuery UI, jQM Prototype, MooTools i još mnogo toga.

Ako kodirate različite elemente, projekti će se automatski spremiti. Osim toga, imate priliku preuzeti konačni rezultat svog rada ili spremiti izvor na mreži. Ovaj sustav prikladniji je za izvoz i spremanje vašeg koda od običnog predloška.

5.JsFiddle

Svatko tko je posjetio Stack Overflow trebao bi znati za. Njihovo sučelje razlikuje se od JSBina po tome što nudi više mogućnosti.

Također podržava knjižnice poput Prototype i jQuery. Štoviše, možete uključiti dodatne vanjske izvore za JS / CSS datoteke u bilo koji dokument koji se testira. Nevjerojatno, aplikacija čak podržava XHP Ajax, gdje možete proslijediti informacije sa poslužitelja u prozor preglednika klijenta i obrnuto.

6.CSSDesk

Prelazak sa skripti na jezik stilova i. Sve izgleda slično prethodnim alatima: izvorni tekst nalazi se s lijeve strane, završna web stranica s desne strane. Ova web aplikacija savršena je za izradu predložaka web stranica i testiranje svojstava CSS3.

7.Jsdo.It

Neke su aplikacije na japanskom, zbog čega mislim da su stvorene negdje u Aziji. Ono što mi se najviše sviđa u njihovom sučelju je učitavanje novonastalih datoteka i njihovo spremanje u projekt. Možete jednostavno pohraniti čitave izglede web stranica na mreži te im pristupiti i urediti ih s bilo kojeg računala.

8.Google Code Playground

Bio sam iznenađen koliko programera nije svjesno postojanja. Vi dobivate puni pristup na njihov API, a u istom prozoru možete ispravljati sve svoje kodove.

Pod API -jem želim reći da možete dobiti podatke iz najvećih Googleovih proizvoda: postove s Bloggera, znamenitosti s Google karata, pa čak i videozapise izravno s YouTubea. Kada kliknete na razne opcije, podaci u prozoru pretpregled se također ažuriraju.

Savjetovao bih vam da ovaj alat držite samo kao resurs, jer daleko od toga da je prikladan za sve što napišete. Međutim, Google je velika tvrtka s mnogo API -ja za podatke izvornog koda. Ako vam ikada zatreba materijal s YouTubea ili google tražilicu, ovaj alat će vam zasigurno dobro doći.

9.IDEOne

- još jedan alat za "duboko" programiranje i razvoj softvera. Njihov mrežni uređivač podržava isticanje sintakse za brojne važne jezike, uključujući Objective-C, Java, C #, VB.NET, SQL i druge. dr.

10. Viper7 Codepad

Ova web aplikacija, poznata i kao, nalazi se na web mjestu gdje se preusmjerava na isti mrežni uređivač. Njihovi alati postavljeni su na ispravljanje pogrešaka PHP varijabla koje ovisno o vašem izboru mogu varirati između PHP5 i PHP4.

Stvaranjem računa, Codepad se može koristiti kao osobni sustav za pohranu. Ovdje, kao i u drugim urednicima na mreži, možete nazvati svakog PHP projekt i pohranite ga besplatno na mreži. Ovaj uređivač koda razlikuje se po tome što korisnici ne moraju instalirati nikakav softver na svoje računalo. Tijekom tumačenja svake od skripti, uređivač će ponuditi dodatne meta-detalje, poput pozivanja preglednika ili zaglavlja odgovora.

11.JSLint

To je samo po sebi čudno, dok uređivač koda radi prema potpuno standardnoj shemi.

Ponuđene opcije mogu vas zbuniti ako prije niste naišli na ovakav predložak. S nizom posebnih vještina možete raditi s otvorenim kodom. Međutim, mnogi izvori čak ne podržavaju isticanje sintakse, što je jasan nadzor s obzirom na tako širok raspon mogućnosti. Preporučio bih vam suradnju ako imate slobodnog vremena, ali nema jamstva da će to postati vaš omiljeni alat za ispravljanje pogrešaka u javascriptu.

12.SQL Gusle

Ranije smo pogledali web aplikaciju pod nazivom jsFiddle. Sada je vrijeme za razgovor o tome što radi na isti način, osim SQL baze podataka sintaksni podaci. Uspio sam pronaći pristojnu alternativu za testiranje koda baze podataka.

Sav izlaz iz vašeg SQL koda pojavit će se u tablici ispod uređivača. Možete napisati novi kôd za primjenu podataka s desne strane i generiranje sheme s lijeve strane. Ova shema baze podataka je SQL kôd koji možete spremiti za izvoz trenutne baze podataka i ponovnu instalaciju svega na novom poslužitelju.

Ako niste upoznati s bazama podataka ili SQL jezik tada vam ova aplikacija vjerojatno neće biti od koristi. No, za programere zainteresirane za upoznavanje SQL -a, ovaj je alat savršen!

13. IDE oblaka9

Po mom mišljenju, to je najbolji izvorni uređivač dostupan na internetu. To nije samo urednik, već čitav sustav alata i resursa; na njihove poslužitelje možete pohraniti sva spremišta izvornog koda.

Registracija je besplatna za sve projekte zajednice. Ako vam je potreban osobni prostor prije razvoja, tada će to koštati 15 USD mjesečno ili 180 USD godišnje. Možete dijeliti privatna spremišta koda sa bilo kojim korisnikom po vašem izboru. Ova opcija omogućuje programerima implementaciju zajednički rad preko raznih projekata.

Svaki novi projekt pohranjen je u podmapi u kojoj možete stvoriti stvarne fizičke datoteke. HTMl, CSS, JS, PHP i sve što vam je potrebno za kodiranje bit će na vašem računu. S vremenom ćete te datoteke moći poslati kao cijeli projekt ili ih preuzeti na računalo.

Raspon mogućnosti koje nudi Cloud9 vrlo je širok. Preporučujem 10-15 minuta da pogledate okolo u besplatnom računu i odmah ćete se zaljubiti u rad korisničkog sučelja. Tvrtka nastavlja učvršćivati ​​pa se veselim dodavanju novih korisnih opcija u sljedećih nekoliko godina.

14.CodeRun

Mrežni je uređivač za bilo koju dinamičku web aplikaciju. Uređivač teksta vrlo sličan Microsoft Visual Studiju; možete čak i kodirati u C # za ASP.NET. Njihove knjižnice uključuju izvore trećih strana poput Facebook Connect i Silverlight.

Osim Microsoftovih web aplikacija, možete kodirati izravno u javascript ili PHP. Način rada CodeRuna ne razlikuje se mnogo od Visual Studija: stvaranje novog projekta web stranice i rad na pojedinačnim datotekama. Pri dnu zaslona nalaze se alati za ispravljanje pogrešaka i rezultati iz prozora konzole.

Neizostavan ako imate iskustva s Visual Studiom. Sučelje je približno isto, pa čak možete preuzeti / učitati projektne datoteke na svoje računalo. Ovo je još jedan alat koji iskusni web programeri mogu uzeti u obzir.

15.Sastavljač

Predložak je vrlo sličan predlošku Windows aplikacije... Možete raditi s otvorene dokumente i uređivati ​​datoteke u pokretu. No, prije nego što počnete stvarati nove projekte, morat ćete se registrirati.

Budući da izgled stranice nalikuje redovitoj aplikaciji za stolna računala, s njom je dovoljno lako raditi čak i za početnike. Alati podržavaju tehnike programiranja kao što su C ++, C #i Visual Basic. Sve u svemu, Compilr bi trebao biti zamjenska aplikacija za testiranje i ispravljanje pogrešaka izvornog koda.

Konačno

Broj međusobno povezanih računala raste pa programerima postaje lakše raditi zajedno u pregledniku. Nove tehnologije pojavljuju se kao dio lokalnih aplikacija, a tko zna dokle će to ići.

Nadamo se da će vas ova zbirka alata za testiranje koda potaknuti na razmišljanje o modernom razvojnom prostoru. Danas ništa ne košta u nekoliko minuta sastaviti HTML / CSS web projekt i dobiti kratki demo video. Imajte na umu da vam ovi alati služe samo kao pomoć u procesu stvaranja konačnog proizvoda.