Ի՞նչ է վավերականությունը և վավերացումը և ինչու են դրանք անհրաժեշտ: html և css-ի շտկում W3C վավերացնողով Ինչպես ստուգել css ֆայլի վավերականությունը

Իմ նախորդ հոդվածներից մեկում ես խոսեցի . Այնուամենայնիվ, ոչ բոլորը գիտեն, որ բացի վավերացնող HTML-ի համար, Կա վավերացնող և CSS-ի համար.

Իմաստը CSS վավերականություննույնը, ինչ HTML. գրեթե անտեղի: Նման HTMLեթե գրես անվավեր CSS, ապա խնդիրներ չեն լինի (եթե, իհարկե, չկան կոպիտ սխալներ), այնուամենայնիվ, վավեր կոդը միշտ լավ է։ Նման ծածկագիրը պարզ է և կառուցվածքային, այն հեշտ է հասկանալ, ինչը նույնպես կարևոր է, հատկապես, երբ ուղղվում է, և հատկապես այլ մարդկանց կողմից: Նաև CSS վավերականությունարագացնում է մշակման գործընթացը և, հետևաբար, էջի բեռնման արագությունը:

Եվ, վերջապես, հաշվի առնելով վավերականության ընդհանուր հազվադեպ պահպանումը, վավեր ծածկագիրը միշտ հարգանք է պահանջում, ինչը կարևոր է, եթե դուք դա անում եք պրոֆեսիոնալ կերպով:

Դեպի ստուգեք CSS վավերականությունը, դուք պետք է օգտագործեք սա W3 ծառայություն http://jigsaw.w3.org/css-validator/:

Միանգամից կասեմ, որ, ի տարբերություն HTML, արա CSS վավեր էշատ ավելի հեշտ է, քանի որ հիմնականում լինում են միայն կոպիտ սխալներ, բացառությամբ, որոնցից ավելի լավ է խուսափել ընդհանրապես:

Ամփոփեմ. Կոդը վավեր դարձնելն ամենևին էլ անհրաժեշտ չէ, բայց ես խստորեն խորհուրդ եմ տալիս դա անել, քանի որ նման կայքը ավելի հեշտ կլինի ինդեքսավորել որոնման համակարգերով ( HTML վավերականություն), աշխատեք ավելի արագ, ավելի հեշտ է խմբագրել և հարգանք ձեռք բերել մասնագետների կողմից:

Վավերացում- սա էջերի կամ ամբողջ կայքի ստուգում է բոլոր վեբ ստանդարտների ճշգրտության և համապատասխանության համար: Բոլոր նման ստանդարտները գրված են W3C-ում, որը համապատասխանաբար վավերացնում է ձեր կայքը: Այս ծառայության միջոցով դուք կարող եք ստուգել HTML սխալներ և CSS սխալներ. Եթե ​​ռեսուրսի վրա սխալներ են հայտնաբերվել, ապա փաստ չէ, որ այն կցուցադրվի ցանկացած բրաուզերում ճիշտ այնպես, ինչպես ձերը: Կաղապարի դասավորությունը կազմելիս անհրաժեշտ է ստուգել կոդը վավերականության համար, քանի որ դա գեղեցիկ և մաքուր կոդ է, որը հավանում են որոնիչները և բրաուզերները: Եվ հիմա մենք կիմանանք, թե ինչպես է կատարվում ստուգումը:

HTML վավերացում

Դուք կարող եք ստուգել հետևյալ հասցեով.

Ռեսուրսին անցնելուց հետո պարզապես անհրաժեշտ է մուտքագրման տողում մուտքագրել ռեսուրսի հասցեն և արդյունքը կստանաք։ Եվ եթե ձեր էջը վավերացում անցնի, համակարգը կթողարկվի կանաչ ազդանշան«ճանապարհային լուսացույց». Եթե ​​նա գտնի մեկ կամ մի քանի սխալ, նա ձեզ կտա այս բոլոր սխալները և միևնույն ժամանակ կարմիր «երթևեկության լույսի» ազդանշան): Յուրաքանչյուր սխալի տակ վավերացնողը փորձում է հնարավորինս շատ տեղեկատվություն տալ, թե ինչպես շտկել խնդիրը: Եթե, իհարկե, հասկանում ես Անգլերեն Լեզուև հասկանալ կոդը, ապա առանց դժվարության կարող եք շտկել հայտնաբերված բոլոր սխալները:

Եվ ահա թե ինչ տեսք ունի զեկույցը կայքը ստուգելուց հետո.

Ինչպես տեսնում ենք, ծառայությունը հայտնաբերել է 20 սխալ և 3 վտանգավոր։ Նախկինում եղել է մոտ 150 սխալ): Շատերը չեն կարողանում ուղղել բոլոր սխալները կաղապարների պատճառով: Ինչպես ես կարդացի մեկ կայքում. «Կայքը դարձրեք վավեր և կորցրեք կայքի ողջ գեղեցկությունը»: Բայց դուք դեռ պետք է ձգտեք հնարավորինս նվազագույնի հասցնել կայքի սխալները:

CSS վավերացում

Բայց ոճի վավերացման դեպքում ամեն ինչ շատ ավելի հեշտ է, և շատ ավելի հեշտ է շտկել այն: Դա անելու համար գնացեք և ամեն ինչ նույն հաջորդականությամբ, ինչպես վերևում: Կայքի հասցեն մուտքագրելուց հետո W3C համակարգը կվերադարձնի արդյունքը։ Ինչ վերաբերում է իմ կայքին, ինձ հետ ամեն ինչ կարգին է): Բայց կային նաև բազմաթիվ սխալներ, և ես ստիպված էի ինքս փոխել ամեն ինչ։

Եվ հոդվածի վերջում ես ձեզ կասեմ՝ գրեթե բոլորը անվճար կաղապարներվավերացված չեն: Իսկ եթե գնում եք կաղապար կամ պատվիրում, անպայման առաջ քաշեք այն պայմանը, որը պետք է ունենա կայքը վավեր կոդըև ուրիշ ոչինչ։ Դուք վճարում եք այդ ամբողջ գումարը, և ամեն ինչ պետք է միացված լինի ամենաբարձր մակարդակը. Եվ կրճատելու այն ժամանակը, որը ծախսում եք մուտք գործելու և գրանցելու համար այս ծառայությունը, պարզապես տեղադրեք SEO հավելվածը ձեր բրաուզերի համար։ Որը կստուգի ռեսուրսի բոլոր պարամետրերը թռիչքի ժամանակ և միևնույն ժամանակ կստուգի կոդը սխալների համար: Ես օգտագործում եմ plugin-ը:

Այնպես որ, սիրելի ընկերներ, միշտ աշխատեք կայքը հնարավորինս լավը դարձնել թե՛ ներքին, թե՛ արտաքին:

Կայքը ստեղծելուց և անհրաժեշտ ամեն ինչով լրացնելուց հետո կայքը պետք է ստուգվի սխալների համար: HTML-ում և css-ում ուղղագրական սխալները գտնելու համար W3 վավերացուցիչը կօգնի ձեզ - World լայն ցանցԿոնսորցիում, որը թարգմանաբար՝ Կոնսորցիում Համաշխարհային ցանց. Այն գտնում է բոլոր սխալները և ցույց է տալիս, թե որտեղ են դրանք, ինչպես նաև առաջարկում է դրանց վերացման տարբերակներ:

Ինչու՞ շտկել կոդը W3C Validator-ով

Իրականում, դրանից շատ առավելություններ չկան, և դրանք բոլորը պայմանական են, բայց, ցավոք, յուրաքանչյուր կայք պետք է ունենա նվազագույն թվով սխալներ, իդեալականորեն ոչ մի սխալ: Ի՞նչ կորոշեք՝ արդյոք դրա կարիքն ունեք, ահա դրա առավելությունները.

  • Էջի բեռնման արագությունը կավելանա, բայց մի փոքր, նույնիսկ նկատելի չի լինի։
  • Կայքը կցուցադրի նույնը յուրաքանչյուր բրաուզերում:
  • Գրացուցակում կայք ավելացնելիս ուշադրություն դարձրեք html և css գրագիտությանը։

Ոչ շատ դրական կողմեր, բայց ուղղել html և css սխալներ W3C վավերացնողի օգտագործումն արժե այն:

Ինչպես ուղղել սխալները Validator-ով

Վալիդատորի միջոցով սխալները շտկելու սկզբունքը բարդ չէ, և բոլորը կարող են կարգավորել այն: Մենք հետևում ենք հղումներին, եթե անգլերենը դժվար է հասկանալ, խորհուրդ եմ տալիս օգտագործել թարգմանիչ կամ օգտագործել սա, որը ռուսերենում ցույց կտա սխալների տեսակը։ Դիտարկենք վավերացնողի կողմից ուղղման օրինակ.

1. Մուտքագրեք ձեր կայքի անվանումն ամբողջությամբ:


2. Ցանկում մենք սկսում ենք նայել, թե որտեղ և ինչ տեսակի սխալ կա և ինչ է անհրաժեշտ այն շտկելու համար:


Ինչպես տեսնում եք նկարներում, իմ սխալը հղումում է, այս խնդիրը գտել եմ share buttons փլագինում։ Հաճախ դուք պետք է փորփրեք բոլոր ֆայլերը՝ սխալ գտնելու համար:

3. Ավելացրեք տարր այն տողում, որտեղ հայտնաբերվել է սխալը և նորից ստուգեք վավերացնողի հետ:
Եթե ​​սխալը շտկված է, ապա դա լավ է: Եթե ​​ոչ, ապա դուք պետք է ավելի հեռուն փնտրեք:

Ողջույն բոլորին!

HTML կոդի վավերականությունը ստուգելու համար անհրաժեշտ է, քանի որ որոնիչ ռոբոտները տեսնում են միայն HTML կոդը: Այդ իսկ պատճառով ցանկալի է կայքի կոդը ամբողջական կարգով բերել։ Սա կօգնի մեզ հատուկ առցանց ծառայություններով, որոնք ստուգում են կոդը և հատուկ մատնանշում սխալները:

Այս ծառայություններից մեկը validator.w3.org վավերացնողն է, որը հավանաբար լավագույնն է: Այն ամբողջությամբ անգլերեն է, ուստի ոմանք կարող են խնդիրներ ունենալ աշխատելիս, բայց մի վախեցեք. վավերացնողը ձեզ ցույց կտա և՛ տողի համարը, և՛ սխալը:

Վավեր կոդը այն ծածկագիրն է, որը համապատասխանում է բոլոր չափանիշներին.

Դասի համար ձեզ անհրաժեշտ կլինի հետևյալ նյութը.

Վերոնշյալ առցանց ծառայությունը առցանց ստուգում է HTML կոդը ամբողջ կայքում։ Պարզապես պետք է նշեք ձեր կայքի տիրույթը և սեղմեք «Ստուգեք» կոճակը, այնպես որ դուք կսկսեք ստուգել կայքի HTML կոդը։

Վալիդատորը տրամադրում է նաև մեկ շատ հետաքրքիր հատկություն՝ կայքի ֆայլերի ստուգում տեղական համակարգիչ. Իմ կարծիքով այս գործիքը օգտակար է նրանց համար, ովքեր պատվերով կայքեր են պատրաստում։ Պատվեր ներկայացնելուց առաջ անհրաժեշտ է ամեն ինչ կրկնակի ստուգել, ​​քանի որ ցանկանում եք, որ ձեր աշխատանքը միշտ բավարարված լինի։ Դուք կարող եք ստուգել ֆայլերը՝ անցնելով «Վավերացնել ֆայլի վերբեռնմամբ» ներդիր.

Ինչպե՞ս ուղղել HTML կոդի սխալները:

Validator W3c ծառայությունն ինձ մատնանշեց երկու սխալ և 8 նախազգուշացում արեց: Ես կփորձեմ ուղղել դրանք և ցույց տալ ձեզ, թե ինչպես է դա արվում մեկում:

«Այս համատեքստում տարրի ոճը չի թույլատրվում որպես տարրի div զավակ» սխալի շտկում: (Այս ենթածառի հետագա սխալները ճնշելով:)»: Այս սխալն ինձ ասում է, որ HTML կոդում, մասնավորապես, թեգում

ոճերը պարտադիր չեն: Հետեւաբար, ոճերը, որոնք գրված են այս բլոկում
դուք պետք է տեղափոխեք style.css ֆայլ և վերջ:

Վալիդատորը նաև ցույց է տալիս, թե որտեղ է գտնվում սխալը.


Այս կերպ Դուք կարող եք գտնել և ուղղել HTML կոդի սխալները: Բայց կայքերը բաղկացած են ոչ միայն նշագրման կոդից, այլ նաև CSS-ից, այնպես որ մենք ստուգում ենք նաև վեբ ռեսուրսի կասկադային ոճերի թերթիկները։

CSS ծածկագրի վավերականության ստուգում

W3c վավերացնողում կարող եք նաև ստուգել CSS կոդը վավերականության համար: Դուք կարող եք դա անել՝ օգտագործելով այս հղումը: Գործողության սկզբունքը նույնն է՝ նշեք կայքի URL-ը կամ ընտրեք ֆայլ ձեր համակարգչում և սեղմեք «Ստուգել» կոճակը:

Ի տարբերություն նույն HTML վավերացնողի, CSS վավերացնողը ռուսերեն է:

CSS սխալներ և նախազգուշացումներ

CSS կոդը վավերականության ստուգման ժամանակ ծառայությունը առաջացնում է մեծ թվով սխալներ և նախազգուշացումներ: Ես ստացել եմ 23 սխալ և 281 նախազգուշացում: Առաջին հայացքից կարող է թվալ, որ սա շատ է և կարող է նույնիսկ վախեցնել, բայց մեծ մասը նշված սխալներըև զգուշացումները ցուցադրվում են միայն այն պատճառով, որ ծառայությունը չգիտի որոշակի հատկություններ, որոնք վերաբերում են տարբեր բրաուզերներին:

Իմ դեպքում, 281-ից զգուշացումների մեծ մասը CSS հատկություններ են տարբեր բրաուզերներում նորմալ ցուցադրման համար.

Ծառայությունը տեղադրում է այնպիսի պիտակներ, ինչպիսիք են «անհայտ վաճառողի ընդլայնում»: Հետևաբար, եթե ձեր CSS ֆայլերը ստուգելիս տեսնում եք մեծ թվով նման սխալներ, ապա մի անհանգստացեք: Ամեն ինչ լավ է.

Ես չեմ թվարկի ամենատարածված սխալները և ինչպես շտկել դրանք, քանի որ բոլորի լուծումները կարող են տարբեր լինել, և դուք պետք է նայեք հենց HTML կոդը՝ հասկանալու համար, թե ինչն է սխալ:

Եթե ​​չեք կարող շտկել ինչ-որ սխալ, ապա կիսվեք խնդիրը դասի մեկնաբանություններում, միգուցե մենք միասին լուծում գտնենք:

Հուսով եմ, որ այս շաբաթվա ընթացքում դուրս եկած դասերը օգտակար էին ձեզ համար և օգնեցին որոշակի խնդիրների լուծմանը։

Դե հիմա, ցտեսություն:

Նախորդ հոդվածը
Հաջորդ հոդվածը