Ce sunt valabilitatea și validarea și de ce sunt necesare? Verificarea structurii link-urilor și a greutății paginilor interne
Această colecție conține o colecție minunată servicii on-line despre lucrul cu coduri CSS. Toate aceste servicii fac viața mult mai ușoară unui dezvoltator web. Cu ajutorul lor, puteți genera o grilă CSS pentru site, puteți verifica codul pentru erori, adapta codul pentru diferite browsere, genera Stiluri CSS pe baza stilurilor de straturi Photoshop, obțineți coduri de model pentru fundaluri și degrade, comprimați CSS pentru a crește viteza de încărcare a site-ului. Există multe servicii specializate în lucrul cu fonturile și prezentarea vizuală a acestora.
Grila CSS de 1 Kb
Prin setarea doar a trei parametri, este generată și o grilă CSS. Este indicată și lățimea în pixeli. 
Grid Designer
Servicii mai complexe. Grila CSS este personalizabilă în funcție de mai mulți parametri. Al doilea bloc generează text care va fi afișat în coloane. La ieșire avem gata CSSși șablon HTML. 
CSS Lint
Un serviciu pentru verificarea codului site-ului dvs. pentru erori. 
Primer CSS
Lipind codul HTML în caseta de dialog, puteți obține o listă cu toate clasele și ID-urile menționate care sunt menționate în CSS. 
PrefixMyCSS
Dacă introduceți codul CSS sursă, rezultatul pe care îl puteți obține este un cod adaptat pentru diferite browsere. 
Modernizr
Pe acest serviciu oferiți să descărcați și să instalați biblioteca JavaScript din sursa deschisa, care te va ajuta cumva la crearea unui site web. Nu pot spune mai precis, din moment ce nu am încercat ce este. 
Stiluri de straturi
Serviciu foarte util. Pe baza setărilor din caseta de dialog Stiluri de straturi a programului, Photoshop generează cod CSS. 
Ultimate generator de gradient CSS de la ColorZilla
Există un număr mare de gradienți din care să alegeți și ale acestora coduri CSS, adaptat pentru diferite browsere. 
Spritebox
Vă permite să creați rapid și ușor clase și identificatori dintr-o singură imagine 
Liner automat CSS
Convertește automat toate stilurile locale în CSS inline pentru a fi utilizate în campaniile de e-mail. 
Tester
Vă permite să comparați ortografii diverse fonturiși obțineți codul CSS al stilului de scriere selectat. 
Combinatorul de fonturi web
Serviciul vă permite să vedeți vizual cum vor arăta diferite combinații de fonturi în titluri, subtitluri și în textul principal.
Am menționat deja ce există din punct de vedere al validității cod html A. Acest lucru ar trebui făcut cel puțin din când în când, deoarece valabilitatea atât a html, cât și a css afectează foarte mult site-ul, adică afișarea identică a resursei dvs. în browsere diferite(un articol general despre browserele web populare și cele mai bune, care sper să vă ajute să faceți o alegere în favoarea unuia dintre ele).
De asemenea, așa cum am menționat deja, chiar dacă motoare de căutareîn această etapă, erorile de cod CSS și HTML nu sunt luate în considerare la clasarea site-urilor; în viitor, totul se poate schimba și puteți ajunge într-o situație în care un proiect frumos conceput pentru oameni poate pierde o parte din audiența potențială din cauza faptului că că nu a trecut validarea. Ei bine, acestea sunt toate versurile, aici fiecare decide singur cât de important este totul.
Cred că acum ești familiarizat cu părerea mea, deoarece scriu acest articol, ceea ce înseamnă că îl consider demn de atenție împreună cu, de exemplu, o parte atât de importantă optimizare seo cum ar fi blocarea link-urilor și a fragmentelor de text de la indexarea de către Google și Yandex sau utilizarea inteligentă.
Bine, după cum se spune, mai aproape de subiect. Mai întâi puțin despre CSS. CSS ( Foi de stil în cascadă- Cascading Style Sheets) este un limbaj de stil care definește afișajul documente HTML. Adică, dacă HTML descrie conținutul paginii, atunci CSS formatează acest conținut, cu alte cuvinte, îi oferă un aspect complet. Apropo, pentru a crește viteza site-ului, va fi util să efectuați fișierele tematice.
Validator W3C: verificarea validității codului CSSAcum să trecem la cum să verificăm validitatea unui document (paginile site-ului nostru web sau Blog WordPress). La fel ca și în cazul verificării codului HTML, vom folosi unul dintre instrumente. Să trecem la serviciul de validare CSS:
După cum puteți vedea, există trei opțiuni pentru verificarea validității CSS folosind validatorul W3C. Apropo, rețineți că în partea de jos a paginii de validare există o notă care indică necesitatea verificării codului HTML pentru valabilitate. Doar ambele coduri corecte garantează corectitudinea întregului document. Pentru a verifica, introduceți adresa URL. De exemplu, să verificăm pagina principală a blogului meu:
Rezultatul verificării validatorului W3C privind erorile de cod CSS nu poate fi numit dezamăgitor, deoarece au fost găsite doar 2 erori. Desigur, aceste erori sunt diferite, în fiecare caz specific ele provoacă consecințe diferite. Să vedem ce putem face pentru a le elimina. Totul este convenabil aici, deoarece validatorul W3C oferă nu numai un link către documentul care conține codul incorect, ci și numărul liniei pe care se află. Apropo, mai jos, după lista de avertismente și erori, va fi afișată o versiune a codului CSS corect, pe care o puteți folosi:
Pagina cu rezultatul verificării validității CSS conține un link către document css.ie, care se află în folderul cu teme. A fost creat pentru a obține compatibilitatea între browsere a blogului (același afișaj în browserele populare). Și special pentru diverse modificări Internet Explorer, care suferă de diverse „jambs” în ceea ce privește distorsionarea aspectului site-ului, în special versiunile sale mai vechi (IE9 este mult mai bun în acest sens). Compatibilitatea între browsere este foarte important pentru a avansa proiectul, dar la revizuire s-a dovedit că acest document conține proprietăți care nu respectă standardele W3C.
Așadar, obținem liniile 3 și 12, care conțin erori. Pentru a le remedia, ar trebui să eliminați eroarea de analiză html (filtru: expression(document.execCommand("BackgroundImageCache", false, true));) și proprietatea .zoom. Acum nu voi intra în complexitatea programării și a aspectului site-ului web, voi observa doar că proprietatea expresie Ajută la eliminarea efectului neplăcut de pâlpâire imagini de fundal ceea ce se întâmplă în IE6.
Adică, într-un browser a cărui utilizare încetează, iar în versiunile ulterioare acest „glitch” nu mai este observat. Voi spune imediat că voi continua să folosesc această „leac” pentru ceva timp, până când numărul de potențiali vizitatori care folosesc IE6 atinge un nivel minim. Cu toate acestea, din motive de claritate, pentru a vă arăta cum va răspunde validatorul W3C la acest lucru, îl voi elimina.
Proprietatea .zoom, care stabilește factorul de zoom al unui element, nu face parte din standardul internațional W3C, dar este acceptată de versiuni foarte vechi Browsere Opera, Safari, inclusiv IE8(Versiunea 9 este aproape complet „respectătoare a legii”, așa că în curând, sper, webmasterii vor fi eliberați de nevoia de a folosi hack-uri, adică coduri suplimentare care le permit să atingă compatibilitatea maximă între browsere). Acum să ne uităm la documentul care conține elemente nevalide și să-l corectăm:
Acest document se află în folderul meu cu tema Cloudy, elimin elementele de mai sus care nu au trecut verificarea validității. În plus, în rezultatele verificării validității, pe lângă erori, au existat și o mulțime de așa-numite avertismente:
Ca exemplu, voi încerca să arăt clar cum să scap de cele mai comune dintre ele și, în același timp, să le explic semnificațiile. După cum puteți vedea, validatorul W3C avertizează despre prezența acelorași culori pentru text și fundal. Trebuie spus că acest lucru este, în general, de nedorit în orice caz, deoarece motoarele de căutare pot considera această stare de fapt ca ascunderea informațiilor, care este plină de sancțiuni grave.
Desigur, acest lucru nu se întâmplă întotdeauna în acest fel, dar acest pericol nu poate fi subestimat. Deci, să trecem la corectarea situației. Cel mai bun pariu este să copiați fișierul style.css al temei în HTML și Editor PHP notepad++, despre care am vorbit și care face mai ușoară căutarea după numărul de rând:
Acum știm unde se află aceste linii în fișierul dvs. temă, ajustăm culoarea schimbând ușor nuanța. ÎN sistem hexazecimal culorile #ffffff corespunde culorii albe. O schimbam astfel: in locul ultimului f intram d, obtinand astfel o nuanta de alb putin diferita; Acum modificările nu vor fi vizibile pentru utilizatori, dar motoarele de căutare vor vedea diferența:
Aproximativ acesta este modul în care puteți corecta părți invalide ale codului CSS din paginile dvs. de resurse. La fel regăsim zonele rămase marcate cu avertismente și care trebuie corectate.În ceea ce privește atenționările privind linia 483 (apropo, au fost foarte multe, vreo 10). La verificare, am descoperit că cauza a fost pluginul WP Page Numbers, care oferă navigare prin paginare.
Acest lucru m-a determinat să dezactivez pluginul și a fost motivul pentru care l-am înlocuit în cele din urmă cu injectarea de cod, ceea ce a fost un pas către reducerea încărcării pe server. Imediat ce am făcut acest lucru, avertismentele privind încălcarea validității codului de către acest plugin au dispărut imediat după reverificare. După pașii descriși mai sus, verificăm din nou validitatea CSS folosind validatorul W3C:
Acum știi cum să verifici validitatea unui document CSS (pagina web a unui site web sau blog) folosind validatorul W3C. În sfârșit, aș dori să remarc că fiecare decide singur gradul și frecvența verificării validității codului CSS, totul depinde de circumstanțe, dar totuși, din când în când acest lucru trebuie făcut, în profundă convingere. Abonați-vă la actualizările blogului pentru a primi materiale noi prin e-mail. Prin urmare, permiteți-mi să-mi iau concediu, sper să nu ne despărțim pentru mult timp.
Verifică codul html, fie specificat folosind un link către o pagină, fie pur și simplu sub forma unui fișier încărcat sau a unui text copiat. Oferă o listă de comentarii cu recomandări pentru corectarea acestora.
http://validator.w3.org/
Verifică stilurile documentelor sau o foaie de stil aflată într-un fișier separat.
http://jigsaw.w3.org/css-validator/
Verifică funcționarea corectă feed-uri RSSși Atom.
http://validator.w3.org/feed/
Evidențiază erori la un anumit Adresele URL ale paginilor e.
http://webmaster.yandex.ru/spellcheck.xml
Afișează erori în textul copiat în fereastra de verificare.
http://api.yandex.ru/speller/
Afișează structura unei pagini web. Relevant pentru verificarea documentelor HTML5. Alfabetul chirilic nu este afișat corect (:.
http://gsnedders.html5.org/outliner/
ÎN versiune gratuită afișează până la 10 pagini pe Internet cu potriviri parțiale de text cu pagina dvs.
http://www.copyscape.com
Verifică unicitatea textului introdus în formular. În versiunea gratuită, puteți aștepta rezultatele.
http://www.miratools.ru/Promo.aspx
Verifică unicitatea atât a textului introdus, cât și a textului la adresa URL dată, arată nivelul de unicitate ca procent. Are propriul algoritm de verificare.
http://content-watch.ru
Programe desktop pentru verificarea unicității conținutului din schimburile de copywriting. Lucrează mult timp, dar de înaltă calitate. Etxt are versiuni pentru trei sisteme de operare: Mac, Linux și Windows.
http://advego.ru/plagiatus/
http://www.etxt.ru/antiplagiat/
Afișează site-uri cu conținut similar și structură internă similară.
http://similarsites.com
Verifică semnele celor mai cunoscute cms.
http://2ip.ru/cms/
Evaluează capacitatea de a vizualiza pagina de pe dispozitive mobile și afișează o listă de comentarii și erori.
http://validator.w3.org/mobile/
Verificarea gradului de utilizare a site-ului pentru telefoanele Google.
https://www.google.com/webmasters/tools/mobile-friendly/
Afișează viteza de încărcare a site-ului pe dispozitivele mobile.
https://testmysite.withgoogle.com/intl/ru-ru
Ieșiți din site-ul emulator cu telefon mobil. Afișează site-ul prin ochii modelului selectat.
http://www.mobilephoneemulator.com/
Serviciu de verificare a paginii pentru persoanele cu deficiențe de vedere. Disponibil online și ca plugin pentru Firefox.
http://wave.webaim.org/
Afișează textul site-ului aproape de ceea ce vede indexatorul de căutare.
http://www.seo-browser.com/
Distribuție de browser text Lynx pentru sistemele win32. Înainte de utilizare, trebuie să editați lynx.bat, indicând în el calea către directorul cu lynx.
http://www.fdisk.com/doslynx/lynxport.htm
Elimină toate markupurile și arată textul paginii, meta-etichete și etichete de titlu, numărul de link-uri externe și interne. Afișează o previzualizare a paginii în Google.
http://www.browseo.net
Afișează o listă de linkuri de ieșire pentru o adresă URL și verifică gradul de răspuns al acestora. Poate verifica recursiv, adică se poate trece de la un document la altul independent.
http://validator.w3.org/checklink
Instrument gratuit pentru verificarea linkurilor rupte. Pentru a funcționa, trebuie să îl instalați pe computer. Scanează recursiv site-ul, face rapoarte, poate fi util pentru crearea unei hărți a site-ului.
http://home.snafu.de/tilman/xenulink.html
Scanează până la 500 de pagini de site în versiunea gratuită. Verifică numărul de legături externe și interne. Afișează informații despre paginile scanate: imbricare, coduri de răspuns, titluri, meta informații și titluri.
http://www.screamingfrog.co.uk/seo-spider/
Programul scanează site-ul, construiește o matrice de link-uri interne, adaugă link-uri externe (de intrare) de la URL-uri date și, pe baza acestor date, calculează ponderile interne ale paginilor site-ului. Programul poate fi folosit pentru a găsi linkuri externe (de ieșire) pentru o listă de adrese URL a paginilor site-ului web.
Verifică codurile de răspuns ale serverului, prezice viteza de încărcare a paginii în funcție de volumul în octeți al datelor sale, arată conținutul etichetei html head, link-uri interne și externe pentru pagină și conținutul paginii prin ochii unui robot de căutare.
http://urivalet.com/
Verifică codurile de răspuns ale serverului. Face posibilă verificarea redirecționărilor (codurile de răspuns 301, 302), antetul Last-Modified etc.
http://www.rexswain.com/httpview.html
Afișează volumul și conținutul datelor transferate atunci când pagina este încărcată.
http://www.websiteoptimization.com/services/analyze/
Verifică redirecționările, utilizarea atributului canonic, metaetichetele și unele aspecte ale securității site-ului. Oferă recomandări pentru îmbunătățirea încărcării paginii.
http://www.seositecheckup.com
Serviciul WHOIS al centrului de înregistrare a domeniului centrului RU. Oferă informații despre adresele IP și domeniile din întreaga lume. Uneori îngheață.
https://www.nic.ru/whois/?wi=1
Serviciu Whois de la RosNIIROS (RIPN). Oferă informații pentru domeniile din zona RU și adresele IP din baza de date RIPE (Europa).
http://www.ripn.net:8080/nic/whois/
Stabilește unde găzduiește domeniul și arată, de asemenea, adresa IP a site-ului.
http://www.whoishostingthis.com
Verificarea dacă adresa IP este inclusă în lista neagră pentru trimiterea de e-mailuri.
http://whatismyipaddress.com/blacklist-check
http://ru.smart-ip.net/spam-check/
Verificarea înregistrărilor MX pentru un domeniu. Examinare Servere SMTP pentru domeniu. Verificarea IP-ului în listele de corespondență.
https://mxtoolbox.com/
Căutați în baza de date înregistrată mărciîn SUA.
http://tmsearch.uspto.gov/
Verifică disponibilitatea paginilor site-ului pentru indexare de către robotul Yandex.
http://webmaster.yandex.ru/robots.xml
Verifică corectitudinea fișierului robots.txt.
https://www.websiteplanet.com/webtools/robots-txt
Monitorizarea disponibilității site-ului. Vă permite să conectați gratuit un site web cu opțiuni minime de verificare.
http://www.siteuptime.com
Se verifică viteza de încărcare a site-ului. Trimite un raport prin e-mail. Dispune de servicii cu plată pentru monitorizarea disponibilității site-ului.
http://webo.in
Verificarea vitezei de încărcare a paginilor site-ului.
http://www.iwebtool.com/speed_test
Se afișează serviciul Cuvinte cheie pentru un site pentru care se află în TOP 20 (top douăzeci) rezultate Google de-a lungul timpului. Date privind traficul de căutare și publicitate.
http://www.semrush.com/
Poziție în TOP50 Yandex și Google. Site-ul Tits și PR pagina principala, prezenta in directoare importante, vizibilitate in top pentru interogari RF.
http://pr-cy.ru/
Verificarea credibilității site-ului. Un serviciu care susține că măsoară încrederea pentru Yandex (oricum nimeni nu o poate verifica :).
http://xtool.ru/
Verificarea suprapunerii filtrelor Panda și Penguin de la Google. Serviciul vă permite să determinați vizual dacă un site s-a prăbușit la datele actualizărilor Panda și Penguin.
http://feinternational.com/website-penalty-indicator/
Verificarea Page Rank-ului paginilor site-ului (când copiați o adresă URL în instrument, trebuie să ștergeți ultima literă și apoi să o scrieți din nou).
http://www.prchecker.net/
Afișează istoricul dezvoltării site-ului și face posibilă vizualizarea capturilor de ecran ale paginilor vechi.
http://www.archive.org/web/web.php
Istoricul pozițiilor site-urilor în TOP Google (expresii cheie, pagini, titluri), indicatori PR, TIC, Alexa Rank, numărul de backlink-uri pentru site-uri populare.
http://SavedHistory.com
SEO Doctor este un program de completare pentru Firefox. Afișează link-uri pe pagină și oferă o interfață convenabilă pentru diverse servicii SEO.
http://www.prelovac.com/vladimir/browser-addons/seo-doctor/
SeoQuake este un program de completare pentru Firefox. Afișează cele mai importante caracteristici ale site-ului: TIC, PR, backlink, Alexa Rank. Funcționează atât cu rezultatele Google, cât și cu cele Yandex. Oferă capacitatea de a analiza rapid concurenții.
http://www.seoquake.com/
IEContextHTML este un program de completare pentru Internet Explorer. Verifică indexarea link-urilor în Yandex și Google, arată o listă de link-uri externe și interne și vă permite să importați date din pagini web.
O listă actualizată de servere proxy gratuite, inclusiv cele rusești.
http://www.checker.freeproxy.ru/checker/last_checked_proxies.php
http://spys.ru/proxys/ru/
Un proxy gratuit anonim cu posibilitatea de a te prezenta din trei țări. Funcționează cu căutarea Google.
https://hide.me/en/proxy
Emulatori cautare Google V tari diferite, prin specificarea parametrilor de căutare.
http://searchlatte.com/
http://isearchfrom.com/
Serviciul permite o verificare profundă (până la 500) a poziției unui site în funcție de regiune în Yandex.
Analizează masa de link-uri a site-ului, generează slice-uri pe diverse criterii: tip link, ancore, pagini. Afișează greutatea backlink-urilor. Serviciul este disponibil numai pentru utilizatorii înregistrați.
http://ahrefs.com
Verifică prezența backlink-urilor către site în lista propusă de adrese URL (până la 100 de pagini).
http://webmasters.ru/tools/tracker
Afișează numărul de aprecieri (plus unu) pe Google+. Puteți introduce imediat o listă de adrese URL de verificat.
http://www.plusonechecker.net/
Afișează popularitate pe Twitter, Google+, Facebook, LinkedIn, Pinterest, Delicious, StumbleUpon, Diggs.
http://sharedcount.com
Afișează popularitatea primei pagini a site-ului pe Twitter, Google+, Facebook, Delicious, StumbleUpon. Pentru site-urile rusești, datele sunt uneori incorecte.
http://www.coolsocial.net
Scanează site-ul și generează rapoarte „Acțiuni” ale principalelor străine retele sociale pentru aceste pagini. Înregistrează utilizatorii printr-un cont Twitter. Puteți vedea rapoarte chiar a doua zi.
https://socialcrawlytics.com
Verifică adresa URL dată pentru cod suspect, arată scripturile încărcate și rezultatele verificării lor.
http://vms.drweb.com/online/
Verifică adresele URL pentru viruși cu 30 de scanere.
https://www.virustotal.com/#url
Sistem de protecție a site-ului împotriva virușilor. Scanează zilnic fișierele site-ului și trimite un raport cu privire la modificările acestora prin e-mail.
Validarea este procesul de verificare a codului CSS cu specificația CSS2.1 sau CSS3. În consecință, codul corect care nu conține erori este numit valid, iar codul care nu satisface specificația este numit invalid. Cea mai convenabilă modalitate de a verifica codul este prin intermediul site-ului web http://jigsaw.w3.org/css-validator/. Folosind acest serviciu, puteți specifica adresa unui document, puteți încărca un fișier sau verifica textul introdus. Un mare avantaj al serviciului este suportul pentru limbile rusă și ucraineană.
Verificați URI
Această filă vă permite să specificați adresa unei pagini aflate pe Internet. Nu trebuie să scrieți protocolul http://, acesta va fi adăugat automat (Fig. 1.42).
Orez. 1.42. Verificarea unui document după adresă
După ce ați introdus adresa, faceți clic pe butonul „Verifică” și va apărea una dintre cele două inscripții: „Felicitări! Nu s-au găsit erori” dacă a avut succes sau „Ne pare rău, am găsit următoarele erori” dacă codul este invalid. Mesajele de eroare sau de avertizare conțin un număr de linie, un selector și o descriere a erorii.
Verificați fișierul încărcat
Această filă vă permite să încărcați un fișier HTML sau CSS și să verificați dacă există erori (Figura 1.43).
Orez. 1.43. Verificarea unui fișier când îl descărcați
Serviciul recunoaște automat tipul de fișier și, dacă este specificat un document HTML, extrage stilul din acesta pentru validare.
Verificați textul tastat
Ultima filă este destinată introducerii directe a codului HTML sau CSS, în acest caz se va verifica doar stilul (Fig. 1.44).
Orez. 1.44. Verificarea codului introdus
Această opțiune pare a fi cea mai convenabilă pentru efectuarea diferitelor experimente pe cod sau verificare rapida fragmente mici.
Selectarea versiunii CSS
CSS3 adaugă multe proprietăți de stil noi în comparație cu versiunea anterioara, deci verificarea codului ar trebui făcută ținând cont de versiune. În mod implicit, serviciul specifică CSS2.1, așa că dacă doriți să verificați codul cu CSS3, ar trebui să specificați acest lucru în mod explicit. Pentru a face acest lucru, faceți clic pe textul " Caracteristici suplimentare" și în blocul care se deschide, selectați CSS3 din lista "Profil".
Orez. 1.45. Specificarea versiunii CSS de verificat
Din când în când, apare o dezbatere despre oportunitatea utilizării identificatorilor în aspect. Argumentul principal este că identificatorii sunt menționați să fie utilizați pentru a accesa și manipula elemente de pe o pagină web folosind scripturi, iar clasele ar trebui folosite exclusiv pentru a schimba stilurile elementelor. În realitate, nu are nicio diferență modul în care definiți stilurile, dar ar trebui să vă amintiți unele caracteristici ale identificatorilor și claselor, precum și capcanele, care poate aștepta dezvoltatori.
Mai întâi, să enumerăm trăsăturile caracteristice ale acestor selectoare.
Identificatori
În codul documentului, fiecare identificator este unic și trebuie inclus o singură dată.
Numele identificatorului face distincție între majuscule și minuscule.
Prin metoda getElementById puteți accesa un element prin ID-ul său și puteți modifica proprietățile elementului.
Stilul pentru un identificator are prioritate față de cel al claselor.
Clasele pot fi folosite de mai multe ori în cod.
Numele claselor țin cont de majuscule.
Clasele pot fi combinate între ele prin adăugarea mai multor clase la o etichetă.
Identificatori
Dacă, în timp ce o pagină web rulează, trebuie să schimbați stilul unor elemente din mers sau să afișați ceva text în interiorul lor, acest lucru este mult mai ușor cu identificatori. Un element este accesat prin metoda getElementById, al cărui parametru este numele identificatorului. În exemplul 1,70 k câmp de text formular, se adaugă un identificator numit userName, apoi se folosește o funcție JavaScript pentru a verifica dacă utilizatorul a introdus ceva text în acest câmp. Dacă nu există text, dar este apăsat butonul Trimite, în interiorul etichetei este afișat un mesaj cu identificatorul msg . Dacă totul este corect, datele formularului sunt trimise la adresa specificată de atributul acțiune.
Exemplul 1.70. Validarea datelor din formular XHTML 1.0 IE 7 IE 8 IE 9 Cr 8 Op 11 Sa 5 Fx 3.6
Validarea formularului
funcția validForm(f) (
utilizator = document.getElementById("nume utilizator"); dacă (user.value == "")
document.getElementById("msg").innerHTML = "Vă rugăm să introduceți un nume."; ) else f.submit();
Introdu numele tau:
Deoarece identificatorii sunt sensibile la majuscule și minuscule, ortografia lor este importantă. Numele userName este folosit în interiorul etichetei și ar trebui specificat și în metoda getElementById.
Dacă scrieți greșit, de exemplu, numele de utilizator , scriptul nu va mai funcționa după cum este necesar.
În exemplul de mai sus, stilurile nu au luat parte deloc; identificatorii înșiși erau necesari pentru ca scripturile să funcționeze. Când sunt utilizate în CSS, rețineți că identificatorii au prioritate față de clase. Să explicăm acest lucru folosind exemplul 1.71.
Exemplul 1.71. Combinație de stiluri |
|||||||||||||
xmlns="http://www.w3.org/1999/xhtml"> |
|||||||||||||
Stilul de identificare |
|||||||||||||
class="a b" > Stilul claselor a și b |
|||||||||||||
class="b" > stilul clasa b |
|||||||||||||
Primul paragraf este stilizat de identificatorul A și clasa b, ale căror proprietăți sunt în conflict între ele. În acest caz, stilul clasei va fi ignorat din cauza caracteristicilor de cascadă și specificitate. Pentru al doilea paragraf, stilul este stabilit prin clasele a și b simultan. Clasele au aceeași prioritate, ceea ce înseamnă că în caz de conflict se vor folosi acele proprietăți specificate în stilul de mai jos. Numai stilul din clasa b este aplicat ultimului paragraf. În fig. Figura 1.46 arată rezultatul aplicării stilurilor.
Orez. 1,46. Utilizarea stilurilor de text
Specificitatea în cascadă începe să joace un rol atunci când fișierul de stil crește din cauza creșterii numărului de selectoare, ceea ce este tipic pentru site-urile mari și complexe. Pentru ca stilul să fie aplicat corect, este necesar să se gestioneze în mod competent specificul selectorilor prin utilizarea identificatorilor, creșterea importanței prin !important , și ordinea proprietăților.
Deoarece la un element pot fi adăugate mai multe clase în același timp, acest lucru vă permite să creați
mai multe clase universale cu proprietăți de stil pentru toate cazurile și includeți-le în etichete dacă este necesar. Să presupunem că majoritatea blocurilor de pe pagină au colțuri rotunjite, unele blocuri având încă un chenar roșu, iar altele nu. În acest caz, putem scrie acest stil (exemplul 1.72).
Exemplul 1.72. Folosind clase
R, .b ( umplutură : 10 px ;
) fundal: #FCE3EE ;
raza-chenar: 8 px; -webkit-border-radius: 8 px ;
) -moz-border-radius: 8 px
B ( chenar : 1 px solid # ED1C24 ; )
N(chenar:niciuna;)
Specificând diferite clase în atributul class, putem combina un set de proprietăți de stil și astfel obținem blocuri cu cadru, blocuri fără cadru, cu colțuri rotunjite sau drepte. Aceasta este oarecum similară cu gruparea selectorului, dar are mai multă flexibilitate.
După crearea unui site web și completarea acestuia cu tot ce este necesar, site-ul trebuie verificat pentru erori. Pentru a găsi greșeli de ortografie în html și css, validatorul W3 vă va ajuta - World Wide Web Consortium, care se traduce prin: World Wide Web Consortium. Găsește toate erorile și indică unde sunt localizate și oferă, de asemenea, opțiuni pentru eliminarea acestora.
De ce să vă remediați codul cu Validatorul W3CDe fapt, nu există multe avantaje din asta și toate sunt condiționate, dar, din păcate, fiecare site ar trebui să aibă cantitate minimă ideal fara erori. Pentru a vă ajuta să decideți dacă aveți nevoie de el, iată avantajele sale:
- Viteza de încărcare a paginii va crește, dar doar puțin, nici măcar nu va fi vizibilă.
- Site-ul va apărea la fel în fiecare browser.
- Când adăugați un site în director, acordați atenție corectitudinii scrierii html și css.
Nu sunt multe avantaje, dar merită să remediați erorile html și css folosind validatorul W3C!
Cum să remediați erorile cu ValidatorPrincipiul corectării erorilor cu un validator nu este complicat și oricine îi poate face față! Urmăm linkul către, dacă este greu de înțeles limba engleză, vă sfătuiesc să folosiți un traducător, sau să folosiți acesta, care va arăta tipul de erori în limba rusă. Să ne uităm la un exemplu de corectare a validatorului:
1. Introduceți numele complet al site-ului dvs. în câmp. 
2. În listă, începem să vedem unde și care este eroarea și ce este necesar pentru a o elimina. 
După cum puteți vedea în imagini, eroarea mea este în link, am găsit această problemă în pluginul butoanelor de partajare. Adesea, trebuie să căutați prin toate fișierele pentru a găsi o eroare.
3.Adăugați un element la linia în care a fost găsită eroarea și verificați-l din nou cu validatorul.
Dacă eroarea este remediată, atunci este bine. Dacă nu, atunci va trebui să cauți mai departe.