Mi az érvényesség és az érvényesítés, és miért van rájuk szükség? A belső oldalak linkszerkezetének és súlyának ellenőrzése

03.04.2021 Vélemények

Ez a gyűjtemény csodálatos gyűjteményt tartalmaz. online szolgáltatások CSS kódokkal való munkavégzéshez. Mindezek a szolgáltatások jelentősen megkönnyítik a webfejlesztők életét. Segítségükkel létrehozhat egy CSS rácsot a webhelyhez, ellenőrizheti a kódot a hibákért, adaptálhatja a kódot a különböző böngészőkhöz, CSS-stílusokat generálhat Photoshop rétegstílusok alapján, mintakódokat kaphat a hátterekhez és színátmenetekhez, tömörítheti a CSS-t a webhely betöltésének növelése érdekében. sebesség. Számos szolgáltatás szakosodott a betűtípusokkal és azok vizuális megjelenítésével.

Az 1 Kb-os CSS-rács
Mindössze három paraméter beállításával egy CSS-rács is létrejön. A szélességet is megadja pixelben.

Rácstervező
összetettebb szolgáltatás. A CSS-rács többféleképpen konfigurálható. A második blokk generálja az oszlopokban megjelenő szöveget. A kimeneten van kész cssés HTML sablon.

CSS Lint
A webhely kódjának hibáinak ellenőrzésére szolgáló szolgáltatás.

Primer CSS
Ha beilleszti a HTML kódot a párbeszédpanelbe, akkor listát kaphat a CSS-ben említett összes osztályról és azonosítóról.

PrefixMyCSS
Ha megadja a forrás CSS kódot, akkor a kimeneten különböző böngészőkre adaptált kódot kaphat.

Modernizr
A ezt a szolgáltatást felajánlja a JavaScript-könyvtár letöltését és telepítését innen nyílt forráskód, ami valamilyen módon segít a webhely létrehozásában. Biztosat nem tudok mondani, mert magam nem próbáltam.

Rétegstílusok
Nagyon segítőkész szolgáltatás. A Rétegstílusok párbeszédpanel beállításai alapján a Photoshop CSS-kódot állít elő.

Az Ultimate CSS Gradient Generator a ColorZilla-tól
Számos színátmenet közül lehet választani és ezek közül lehet választani CSS kódok különböző böngészőkhöz igazítva.

spritebox
Lehetővé teszi osztályok és azonosítók gyors és egyszerű létrehozását egyetlen képből

automatikus css inliner
Automatikusan konvertálja az összes helyi stílust soron belüli CSS-vé a levelezési listákon való használatra.

típusvizsgáló
Lehetővé teszi a helyesírás összehasonlítását különféle betűtípusokés megkapja a kiválasztott írási stílus CSS kódját.

A webes betűtípus-kombinátor
A szolgáltatás lehetővé teszi, hogy vizuálisan megtekinthesse, hogyan fognak kinézni a betűtípusok különböző kombinációi a címsorokban, alcímekben és a fő szövegben.

Már említettem, hogy mi létezik az érvényesség szempontjából html kódot a. Ezt legalább időnként meg kell tenni, mert érvényesség html és css erősen befolyásolja a webhelyet, vagyis az erőforrás azonos megjelenítését különböző böngészők(egy összefoglaló cikk a népszerű és legjobb webböngészőkről, ami, remélem, segít a választásban).

Illetve, mint már említettem, annak ellenére kereső motorok ebben a szakaszban a CSS és HTML kódhibákat nem veszik figyelembe az oldalak rangsorolásánál, a jövőben minden megváltozhat, és olyan helyzet adódhat, hogy egy szépen megtervezett és emberek számára készült projekt elveszítheti potenciális közönsége egy részét az a tény, hogy nem ment át az érvényesítésen. Nos, ez mind dalszöveg, itt mindenki maga dönti el, mennyire fontos minden.

Azt hiszem, most már ismeri a véleményemet, mivel én írom ezt a cikket, ami azt jelenti, hogy figyelmet érdemlőnek tartom, például egy ilyen fontos résszel együtt SEO optimalizálás mint záró linkek és szövegtöredékek a Google és a Yandex indexeléséből vagy a .

Oké, ahogy mondják, inkább a lényegre. Először egy kicsit a CSS-ről. css( Lépcsőzetes stíluslapok- Cascading Style Sheets) egy stílusnyelv, amely meghatározza a megjelenítést HTML dokumentumok. Vagyis ha a HTML leírja az oldal tartalmát, akkor a CSS formázza ezt a tartalmat, vagyis teljes megjelenést ad neki. Mellesleg, a webhely sebességének növelése érdekében hasznos lesz elhúzni a témafájlokat.

W3C Validator: A CSS-kód érvényességének ellenőrzése

Most térjünk át egy adott dokumentum érvényességének ellenőrzésére (webhelyünk oldalai ill WordPress blog). Csakúgy, mint a HTML-kód ellenőrzése esetén, az egyiket fogjuk használni. Lépjünk a CSS-érvényesítési szolgáltatáshoz:


Amint láthatja, háromféleképpen ellenőrizheti a CSS-t a W3C validátorral. Egyébként vegye figyelembe, hogy az érvényesítő oldal alján van egy megjegyzés, amely jelzi, hogy ellenőrizni kell a HTML-kód érvényességét. Csak mindkét helyes kód garantálja a teljes dokumentum helyességét. Írja be az URL-t az ellenőrzéshez. Például nézzük meg a blogom főoldalát:


A W3C validátor CSS kód hibáit ellenőrző eredménye nem nevezhető kiábrándítónak, hiszen mindössze 2 hibát találtunk. Természetesen ezek a hibák különbözőek, minden esetben más következményekkel járnak. Lássuk, mit tehetünk ezek kiküszöbölésére. Itt minden kényelmes, mivel a W3C validátor nem csak hivatkozást ad egy helytelen kódot tartalmazó dokumentumhoz, hanem a sorszámot is, amelyen található. Alul egyébként a figyelmeztetések és hibák listája után megjelenik a helyes CSS-kód egy változata, amelyet használhat:


A dokumentumra mutató hivatkozás található a CSS-ellenőrzés eredményoldalán css.ie, amely a téma mappában található. Böngészőkön átívelő blog létrehozására hozták létre (ugyanaz a megjelenítés a népszerű böngészőkben). Sőt, különféle módosításokhoz való internet böngésző, ami különféle "jambákkal" vétkezik az oldal kinézetének eltorzítása terén, főleg a régebbi verziói (ebben a tekintetben az IE9 sokkal jobb). A crossbrowser kompatibilitás nagyon jó fontosságát a projekt népszerűsítése érdekében azonban az áttekintés során kiderült, hogy ez a dokumentum olyan tulajdonságokat tartalmaz, amelyek nem felelnek meg a W3C szabványoknak.

Tehát megkapjuk a 3. és 12. sort, amelyek hibákat tartalmaznak. A javításhoz távolítsa el az elemzési hibát html (szűrő: kifejezés(document.execCommand("BackgroundImageCache", false, true));)és tulajdon .zoomolás. Most nem megyek bele a programozás és a webhelyek elrendezésének bonyolultságába, csak megjegyzem, hogy a tulajdonság kifejezés segít megszabadulni az IE6-ban előforduló bosszantó háttérkép villogó hatásától.

Vagyis a böngészőben, amelynek használata semmivé válik, és ennek a „hibának” a következő verzióiban már nem figyelhető meg. Azonnal el kell mondanom, hogy egy ideig még használom ezt a „kúrát”, amíg az IE6-ot használó potenciális látogatók száma el nem éri a minimális szintet. Az egyértelműség kedvéért azonban eltávolítom, hogy megmutassam, hogyan reagál erre a W3C validátor.

Az elem méretezési tényezőjét beállító .zoom tulajdonság nem része a W3C nemzetközi szabványnak, de csak a nagyon régi verziókban támogatott. Opera böngészők, Safari, beleértve IE8(A 9-es verzió szinte teljesen „törvénytisztelő”, így hamarosan, remélem, a webmesterek megszabadulnak a hackek használatától, vagyis további kódok használatától a maximális böngészők közötti kompatibilitás elérése érdekében). Most nézzük meg az érvénytelen elemeket tartalmazó dokumentumot, és javítsuk ki:


Ez a dokumentum a Cloudy téma mappámban található, törlöm a fenti elemeket, amelyek nem mentek át az érvényesítési ellenőrzésen. Továbbá az érvényességi ellenőrzés eredményeiben a hibákon túl sok ún. figyelmeztetés is szerepelt:


Például megpróbálom világosan megmutatni, hogyan lehet megszabadulni a leggyakoribbaktól, és közben elmagyarázom a jelentésüket. Amint láthatja, a W3C validátor figyelmeztet arra, hogy a szövegben és a háttérben ugyanazok a színek jelennek meg. Azt kell mondanom, hogy ez általában nem kívánatos, mivel a keresőmotorok ezt az állapotot információk elrejtésének tekinthetik, ami komoly szankciókkal jár.

Természetesen ez nem mindig van így, de ezt a veszélyt nem szabad alábecsülni. Tehát folytassuk a helyzet javítását. A legjobb, ha másolja a fájlt stílus.css a témát HTML-ben és PHP szerkesztő jegyzettömb++, amiről beszéltem, ami megkönnyíti a sorszám szerinti keresést:

Most már tudjuk, hogy ezek a vonalak hol helyezkednek el a témafájlban, a színt az árnyalat enyhe megváltoztatásával javítjuk. NÁL NÉL hexadecimális rendszer színek #ffffff a fehér színnek felel meg. A következőképpen változtatjuk meg: az utolsó f helyett d-t írunk be, így egy kicsit más árnyalatú fehéret kapunk; most a felhasználók számára nem lesznek észrevehetők a változások, de a keresőmotorok látni fogják a különbséget:


Így javíthatja ki az erőforrásoldalak CSS-kódjának érvénytelen részeit. Ugyanígy megtaláljuk a többi, figyelmeztetésekkel megjelölt és javítandó szakaszt, ami a 483-as sorra vonatkozó figyelmeztetéseket illeti (egyébként elég sok volt, kb 10). Az ellenőrzés során megállapítottam, hogy az oka a WP Page Numbers bővítmény, amely oldalszámozást biztosít.

Ez arra késztetett, hogy deaktiváljam ezt a bővítményt, és ez volt az oka annak, hogy végül kódbefecskendezésre cseréltem, ami egy lépés volt a szerverterhelés csökkentése felé. Amint ezt megtettem, az újbóli ellenőrzés után azonnal eltűntek a figyelmeztetések, amelyek arra vonatkoztak, hogy az adott plugin megsértette a kód érvényességét. A fenti gesztusok után újra ellenőrizzük a CSS érvényességét a W3C validátor segítségével:


Most már tudja, hogyan ellenőrizheti egy CSS-dokumentum (egy webhely vagy blog weboldala) érvényességét a W3C érvényesítő segítségével. Végezetül szeretném megjegyezni, hogy mindenki maga dönti el a CSS kód érvényességének ellenőrzésének mértékét és gyakoriságát, minden a körülményektől függ, de ennek ellenére mély meggyőződésem szerint ezt időről időre meg kell tenni. Iratkozzon fel a blogfrissítésekre, hogy friss anyagokat kapjon e-mailben. Ezért engedje meg, hogy kivegyem a szabadságomat, remélem egy időre elválunk.

Ellenőrzi a html kódot, amelyet az oldalra mutató hivatkozás adja, vagy egyszerűen feltöltött fájlként vagy másolt szövegként. Listát ad a megjegyzésekről, és javaslatokat tesz a javításukra.
http://validator.w3.org/

css érvényesítés (css validátor)

Ellenőrzi a dokumentumstílusokat vagy egy külön fájlban található stíluslapot.
http://jigsaw.w3.org/css-validator/

Feedek ellenőrzése (feed) RSS és Atom

Ellenőrzi a helyes működést RSS csatornaés Atom.
http://validator.w3.org/feed/

Helyesírás-ellenőrzés egy weboldalon

Kiemeli a hibákat az adott oldal URL-jén.
http://webmaster.yandex.ru/spellcheck.xml

A próbaablakba másolt szöveg hibáit mutatja.
http://api.yandex.ru/speller/

Weboldal szerkezetének ellenőrzése

Egy weboldal szerkezetét mutatja. A html5 dokumentumok ellenőrzéséhez szükséges. A cirill karakterek helytelen megjelenítése (:.
http://gsnedders.html5.org/outliner/

A tartalom egyediségének ellenőrzése

NÁL NÉL ingyenes verzió legfeljebb 10 oldalt jelenít meg az interneten olyan szöveggel, amely részben megegyezik az Ön oldalával.
http://www.copyscape.com

Ellenőrzi az űrlapba beírt szöveg egyediségét. Az ingyenes verzióban megvárhatja az eredményeket.
http://www.miratools.ru/Promo.aspx

Ellenőrzi mind a beírt szöveg, mind a megadott URL-en lévő szöveg egyediségét, százalékban mutatja az egyediségi szintet. Saját ellenőrző algoritmusa van.
http://content-watch.ru

Asztali programok a szövegírói csereprogramokból származó tartalom egyediségének ellenőrzésére. Hosszú ideig dolgoznak, de kiváló minőségben. Az Etxt-nek három verziója van operációs rendszer: Mac, Linux és Windows.
http://advego.ru/plagiatus/
http://www.etxt.ru/antiplagiat/

Hasonló tartalmú és hasonló belső szerkezetű webhelyeket jelenít meg.
http://similarsites.com

Weboldal cms ellenőrzés

Ellenőrzi a legismertebb cm-ek jellemzőit.
http://2ip.ru/cms/

Weboldal használhatóságának ellenőrzése különböző felhasználói csoportok számára

A hozzáférhetőség ellenőrzése mobileszközökről

Felméri az oldal megtekintésének képességét mobil eszközökés felsorolja a megjegyzéseket és a hibákat.
http://validator.w3.org/mobile/

A webhely kényelmének ellenőrzése a Google telefonjai számára.
https://www.google.com/webmasters/tools/mobile-friendly/

Megmutatja a webhely betöltési sebességét mobileszközökön.
https://testmysite.withgoogle.com/intl/ru-ru

Weboldal emulátor kilépés a következővel: mobiltelefon. A webhelyet a kiválasztott modell szemével mutatja.
http://www.mobilephoneemulator.com/

A fogyatékkal élők akadálymentességének ellenőrzése

Oldalellenőrző szolgáltatás látássérültek számára. Elérhető online és bővítményként a Firefoxhoz.
http://wave.webaim.org/

Az oldal tartalmának megtekintése egy keresőrobot szemével

A webhely szövegét a keresési indexelő által látottakhoz közel jeleníti meg.
http://www.seo-browser.com/

A lynx szöveges böngésző disztribúciója win32 rendszerekhez. Használat előtt szerkesztenie kell a lynx.bat fájlt, megadva a lynxet tartalmazó könyvtár elérési útját.
http://www.fdisk.com/doslynx/lynxport.htm

Eltávolítja az összes jelölést, és megjeleníti az oldal szövegét, a meta- és címcímkéket, valamint a külső és belső hivatkozások számát. Megjeleníti az oldal előnézetét a google-ban.
http://www.browseo.net

Az oldal linkszerkezetének ellenőrzése

Hibás linkek ellenőrzése

Megjeleníti az URL kimenő hivatkozásainak listáját, és ellenőrzi a válaszukat. Rekurzívan tud ellenőrizni, azaz önállóan mozog egyik dokumentumból a másikba.
http://validator.w3.org/checklink

Ingyenes eszköz a hibás hivatkozások ellenőrzésére. A működéshez telepítenie kell a számítógépére. Rekurzívan feltérképezi az oldalt, jelentéseket készít, hasznos lehet az oldaltérképezéshez.
http://home.snafu.de/tilman/xenulink.html

Hivatkozások és oldalcímek ellenőrzése

Akár 500 webhelyoldalt is beolvas az ingyenes verzióban. Ellenőrzi a külső és belső hivatkozások számát. Információkat jelenít meg a beolvasott oldalakkal kapcsolatban: egymásba ágyazás, válaszkódok, címek, metainformációk és címek.
http://www.screamingfrog.co.uk/seo-spider/

A belső oldalak linkszerkezetének és súlyának ellenőrzése

A program átvizsgálja az oldalt, belső hivatkozásokból mátrixot készít, külső (bejövő) hivatkozásokat ad hozzá a megadott URL-ekről, és ezen adatok alapján kiszámítja a webhely oldalainak belső súlyát. A program segítségével külső (kimenő) hivatkozásokat találhat egy webhely oldalainak URL-listájához.

Szerver válaszkódok ellenőrzése, a webhely keresőrobotok általi láthatósága, a webhely műszaki jellemzői

HTTP-fejlécek és szerver válasz, oldalláthatóság ellenőrzése a robotok számára

Ellenőrzi a szerver válaszkódjait, előrejelzi az oldal betöltési sebességét az adatok bájtokban mért méretétől függően, megjeleníti a tartalmat html tag fej, ​​az oldal belső és külső hivatkozásai, az oldal tartalma egy keresőrobot szemével.
http://urivalet.com/

Ellenőrzi a szerver válaszkódjait. Lehetővé teszi az átirányítások (301-es, 302-es válaszkódok), a Last-Modified fejléc stb. ellenőrzését.
http://www.rexswain.com/httpview.html

Az oldal betöltésekor átvitt adatok mennyiségét és tartalmát mutatja.
http://www.websiteoptimization.com/services/analyze/

Ellenőrzi az átirányításokat, a kanonikus attribútum használatát, a metacímkéket, a webhely biztonságának néhány szempontját. Javaslatokat ad az oldalbetöltés javítására.
http://www.seosicheckup.com

Domain és IP-cím információk ellenőrzése

A domain regisztrációs központ RU központ WHOIS szolgáltatása. Információkat ad az IP-címekről és tartományokról szerte a világon. Néha lefagy.
https://www.nic.ru/whois/?wi=1

Whois szolgáltatás a RosNIIROS-tól (RIPN). Információkat ad a RU zónában lévő tartományokról és IP-címekről a RIPE adatbázisból (Európa).
http://www.ripn.net:8080/nic/whois/

Meghatározza, hogy hol található a tartomány, és megjeleníti a webhely IP-címét is.
http://www.whoishhostingthis.com

Annak ellenőrzése, hogy az IP-cím szerepel-e a tiltólistán az e-mail küldéshez.
http://whatismyipaddress.com/blacklist-check
http://ru.smart-ip.net/spam-check/

Domain MX rekordjainak ellenőrzése. Vizsgálat SMTP szerverek a domain számára. Az IP ellenőrzése a feketelistákon a levelezéshez.
https://mxtoolbox.com/

Keresés a regisztráltak adatbázisában védjegyek az USA-ban.
http://tmsearch.uspto.gov/

A robots.txt fájlok ellenőrzése

Ellenőrzi a webhely oldalainak elérhetőségét a Yandex robot általi indexeléshez.
http://webmaster.yandex.ru/robots.xml

Ellenőrzi a robots.txt fájl helyességét.
https://www.websiteplanet.com/webtools/robots-txt

helyszíni szemle

A webhely elérhetőségének figyelése. Lehetővé teszi egy webhely ingyenes csatlakoztatását minimális ellenőrzési lehetőséggel.
http://www.siteuptime.com

Weboldal betöltési sebesség ellenőrzése. Jelentést küld e-mailben. Fizetős szolgáltatásokkal figyeli az oldal elérhetőségét.
http://webo.in

Az oldal oldalbetöltési sebességének ellenőrzése.
http://www.iwebtool.com/speed_test

A webhely indexelésének és megjelenítésének ellenőrzése a keresőmotorok által

Az oldal láthatósága a keresőmotorokban

szolgáltatás bemutatása kulcsszavakat arra az oldalra, amelyre vonatkozóan időben a Google keresési eredményeinek TOP 20-ában (első húszban) szerepel. Adatok a keresési és hirdetési forgalomról.
http://www.semrush.com/

Pozíció a Yandex és a Google TOP50-ben. Site ticker és PR kezdőlap, jelenlét a fontos könyvtárakban, láthatóság a tetején az RF lekérdezésekhez.
http://pr-cy.ru/

A kitiltások és a webhely iránti bizalom szintjének ellenőrzése

A webhely megbízhatóságának ellenőrzése. Egy szolgáltatás, amely azt állítja, hogy a Yandex bizalmát méri (senki sem tudja ellenőrizni :).
http://xtool.ru/

A Google Panda és Penguin fedvényszűrőinek ellenőrzése. A szolgáltatás lehetővé teszi, hogy vizuálisan megállapítsa, hogy a webhely összeomlott-e a Panda és a Penguin frissítéseinek időpontjában.
http://feinternational.com/website-penalty-indicator/

A webhely oldalainak Page Rank ellenőrzése (az URL-címnek az eszközbe másolásakor törölnie kell az utolsó betűt, majd újra kell írnia).
http://www.prchecker.net/

Az oldal történetének ellenőrzése

Megmutatja a webhely fejlődésének történetét, és lehetővé teszi a régi oldalak képernyőképeinek megtekintését.
http://www.archive.org/web/web.php

Az oldal pozícióinak története a Google TOP-ban (kulcskifejezések, oldalak, címek), PR indikátorok, TIC, Alexa Rank, a népszerű oldalak visszamutatóinak száma.
http://SavedHistory.com

SEO bővítmények a webhelyek ellenőrzéséhez

A SEO Doctor egy kiegészítő a Firefoxhoz. Hivatkozásokat jelenít meg az oldalon, és kényelmes felületet biztosít a különféle SEO szolgáltatásokhoz.
http://www.prelovac.com/vladimir/browser-addons/seo-doctor/

A SeoQuake a Firefox kiegészítője. Megmutatja az oldal legfontosabb jellemzőit: TIC, PR, backlinks, Alexa Rank. A Google és a Yandex keresési eredményeivel is működik. Lehetővé teszi a versenytársak gyors elemzését.
http://www.seoquake.com/

Az IEContextHTML az Internet Explorer bővítménye. Ellenőrzi a linkek indexelését a Yandexben és a Google-ban, megjeleníti a külső és belső hivatkozások listáját, lehetővé teszi az adatok importálását weboldalakról.

Az oldal láthatósága a keresőkben a helytől függ

Az ingyenes proxyszerverek frissített listája, beleértve az oroszokat is.
http://www.checker.freeproxy.ru/checker/last_checked_proxies.php
http://spys.ru/proxys/ru/

Anonim ingyenes proxy, amely bemutatkozhat három országból. Működik a Google keresővel.
https://hide.me/en/proxy

Emulátorok Google kereső ban ben különböző országok, keresési paraméterek megadásával.
http://searchlatte.com/
http://isearchfrom.com/

Pozíciók ellenőrzése a Yandexben és a Google-ban

A szolgáltatás lehetővé teszi a webhely helyzetének mélyreható (legfeljebb 500) ellenőrzését régiónként a Yandexben.

Az oldal hálózati elemzése, backlinkek ellenőrzése

Backlink elemzés

Elemzi az oldal linktömegét, szakaszokat alakít ki különböző kritériumok szerint: link típusa, horgonyok, oldalak. A visszamutató hivatkozások súlyát mutatja. A szolgáltatás csak regisztrált felhasználók számára érhető el.
http://ahrefs.com

Az oldalra mutató linkek ellenőrzése

Ellenőrzi, hogy a javasolt URL-listában (legfeljebb 100 oldal) vannak-e visszamutató hivatkozások a webhelyre.
http://webmasters.ru/tools/tracker

Egy webhely népszerűségének ellenőrzése a közösségi médiában

PlusOneChecker

Megmutatja a kedvelések számát (pluszone) a Google+-on. Azonnal megadhatja az ellenőrzött URL-ek listáját.
http://www.plusonechecker.net/

Facebook Graph API Explorer

SharedCount

Népszerűséget mutat a Twitteren, a Google+-on, a Facebookon, a LinkedIn-en, a Pinteresten, a Delicious-on, a StumbleUpon-on és a Diggs-en.
http://sharedcount.com

menő közösségi

Az oldal első oldalának népszerűségét mutatja a Twitteren, Google+-on, Facebookon, Deliciouson, StumbleUponon. Az orosz oldalak esetében az adatok néha hibásak.
http://www.coolsocial.net

társadalmi népszerűség

Social Crawlytics

Átvizsgálja a webhelyet, és jelentéseket készít a fő külföldi „Részvények”-ről közösségi hálózatok ezekhez az oldalakhoz. Regisztrálja a felhasználókat Twitter fiókon keresztül. A beszámolók már másnap megtekinthetők.
https://socialcrawlytics.com

A webhely vírusellenőrzése

Dr. Web

Ellenőrzések adott URL-t gyanús kód esetén megjeleníti a betöltött szkripteket és azok ellenőrzésének eredményét.
http://vms.drweb.com/online/

VirusTotal

30 szkennerrel ellenőrzi az URL-eket vírusok szempontjából.
https://www.virustotal.com/#url

Riasztó

Webhelyvédelmi rendszer a vírusoktól. Naponta ellenőrzi a webhely fájljait, és e-mailben jelentést küld a változásokról.



Az érvényesítés a CSS-kód CSS2.1 vagy CSS3 specifikációval való összehasonlítását jelenti. Ennek megfelelően a hibát nem tartalmazó helyes kódot érvényesnek, a specifikációnak nem megfelelőt pedig érvénytelennek nevezzük. A legkényelmesebb a kód ellenőrzése a webhelyen keresztül http://jigsaw.w3.org/css-validator/, ennek a szolgáltatásnak a segítségével megadhatja a dokumentum címét, feltölthet fájlt vagy ellenőrizheti a begépelt szöveget. A szolgáltatás nagy előnye az orosz és az ukrán nyelv támogatása.

Ellenőrizze az URI-t

Ezen a lapon adhatja meg az interneten tárolt oldal címét. A http:// protokoll elhagyható, automatikusan hozzáadódik (1.42. ábra).

Rizs. 1.42. Iratellenőrzés cím szerint

A cím megadása után kattintson a „Check” gombra, és megjelenik a két felirat egyike: „Gratulálunk! Nem található hiba" sikeresség esetén, vagy "Sajnos a következő hibákat találtuk" érvénytelen kód esetén. A hiba- vagy figyelmeztető üzenetek sorszámot, választót és a hiba leírását tartalmazzák.

Ellenőrizze a feltöltött fájlt

Ezen a lapon HTML- vagy CSS-fájlt tölthet be, és ellenőrizheti a hibákat (1.43. ábra).

Rizs. 1.43. Fájl ellenőrzése feltöltéskor

A szolgáltatás automatikusan felismeri a fájltípust, és ha HTML-dokumentum van megadva, kivonja belőle a stílust érvényesítés céljából.

Ellenőrizze a beírt szöveget

Az utolsó fül a HTML vagy CSS kód közvetlen bevitelére szolgál, és csak a stílus kerül ellenőrzésre (1.44. ábra).

Rizs. 1.44. A beírt kód ellenőrzése

Ez az opció tűnik a legkényelmesebbnek különféle kísérletek végrehajtásához a kódon ill gyors ellenőrzés apró töredékek.

CSS verzió kiválasztása

A CSS3 számos új stílus tulajdonsággal rendelkezik a előző verzió, ezért érdemes ellenőrizni a kódot a verzió figyelembevételével. A szolgáltatás alapértelmezés szerint a CSS2.1-et adja meg, így ha a kódot a CSS3-mal szeretné ellenőrizni, akkor azt kifejezetten meg kell adnia. Ehhez kattintson a szövegre További jellemzők"és a megnyíló blokkban a "Profil" listából válassza a CSS3 lehetőséget

Rizs. 1.45. Az ellenőrizni kívánt CSS-verzió megadása

Azonosítók és osztályok

Időnként vita vetődik fel az azonosítók elrendezésben való használatának célszerűségéről. A fő érv az, hogy az azonosítók a weboldal elemeinek szkriptekkel való elérésére és manipulálására szolgálnak, és csak osztályokat szabad használni az elemstílusok megváltoztatásához. Nem igazán számít, hogy milyen stílust használ, de tisztában kell lennie az azonosítók és osztályok néhány sajátosságával, valamint buktatók, ami várhat a fejlesztőkre.

Először is felsoroljuk ezeknek a szelektoroknak a jellemzőit.

Azonosítók

A dokumentum kódjában minden azonosító egyedi, és csak egyszer szerepelhet.

Az azonosító neve megkülönbözteti a kis- és nagybetűket.

Keresztül getElementById metódus egy elemet az azonosítójával érhet el, és módosíthatja az elem tulajdonságait.

Az azonosító stílusa elsőbbséget élvez az osztályokkal szemben.

Az osztályok többször használhatók a kódban.

Az osztálynevek megkülönböztetik a kis- és nagybetűket.

Az osztályok úgy kombinálhatók egymással, hogy egy címkéhez több osztályt adunk.

Azonosítók

Ha az egyes elemek stílusát menet közben szeretnénk megváltoztatni, vagy szöveget akarunk megjeleníteni bennük a weboldal futása közben, az azonosítókkal ez sokkal egyszerűbb. Az elem elérése a getElementById metóduson keresztül történik, melynek paramétere az azonosító neve. A példában 1,70-ig szövegmezőűrlapon hozzáadunk egy userName nevű azonosítót, majd egy JavaScript függvény segítségével ellenőrizzük, hogy a felhasználó beírt-e valamilyen szöveget ebbe a mezőbe. Ha nincs szöveg, de a Küldés gombra kattint, a címkén belül megjelenik egy üzenet az azonosító üzenettel. Ha minden helyes, akkor az űrlapadatokat a rendszer az action attribútum által megadott címre küldi.

1.70. példa. Űrlapadatok érvényesítése XHTML 1.0 IE 7 IE 8 IE 9 Cr 8 Op 11 Sa 5 Fx 3.6

Űrlap érvényesítése