Ik heb een klein probleem met het huisdier dat ik met je ga delen. Op de avonden dat ik een nieuwe CSS3-tutorial voor Nettuts + klaar ben - meestal tijdens het luisteren naar mijn favoriete Biebster-nummers - klik ik op publiceren en wacht ik tot ik weet hoe lang het duurt voordat een lezer een opmerking achterlaat met de zin, "Maar het valideert niet."
Hier gaat het om validatie: het is een hulpmiddel. Niets meer; niets minder; slechts een hulpmiddel.
Dus hier gaat het om validatie: het is een hulpmiddel. Niets meer; niets minder; slechts een hulpmiddel. Op het eerste gezicht lijkt het echter logisch, nietwaar? We stellen validatie gelijk aan best practices, net zoals JavaScript en JSLint. Waarom zouden we volgens die redenering geen perfecte 100% score willen? Nou dat is het ding: we doen; problemen ontstaan echter wanneer de score voorrang heeft boven onze eigen logica.
Als u uw opmaak- en stijlpagina's wilt testen, gaat u naar:
U kunt ook de behulpzame Firefox-add-on, Web-ontwikkelaar, die onder andere de handig-dandy "Validate HTML" en "Validate CSS" -links biedt, installeren, evenals de optie om zelfs uw lokale bestanden te valideren..
Op dit punt wordt een rapport gegenereerd dat een lijst bevat fouten dat de validator tegenkomt. Maar hierin ligt de wrijving.
Absoluut niet. Ik kan me voorstellen dat, met name voor degenen die deze sector betreden, de zin: "websites hoeven niet te worden gevalideerd", hen uit de war brengt..
"Validatie is uw systeem voor vroegtijdige waarschuwing over het introduceren van fouten in uw pagina's die zich kunnen manifesteren op interessante en moeilijk te bepalen manieren. Wanneer een browser ongeldige HTML aantreft, moet deze een gefundeerde schatting maken van wat u wilde doen - en verschillende browsers kunnen met verschillende antwoorden komen. "
- Opera Developer Community
Dat gezegd hebbende, de uiteindelijke score is eigenlijk, irrelevant.
Denk aan de dagen dat wij (of op zijn minst sommigen van ons) die validatieknoppen hebben geplakt in de footer
van onze websites? Hoe grappig; voor wie waren ze? De bezoekers van de site? haha; Ik hoop het niet! Maar dit is het punt: toen was validatie niet echt een standaard-. Nee; in feite, als je de moeite nam om je HTML en CSS te valideren, was je een standaarden omhelzen, geavanceerde kerel! Soms is het gemakkelijk om te vergeten dat webstandaarden een relatief nieuw concept is.
Jaren geleden, toen ik vroeger deelnam aan CSS-forums, faalde het nooit: telkens wanneer een nieuw lid om hulp vroeg om een vreemde lay-outprobleem, was onze eerste reactie meestal iets in de trant van: "Yonze website valideert niet. Los de fouten op en kom dan bij ons terug als er nog steeds problemen zijn."Vaak zijn oneven lay-outproblemen het gevolg van niet-afgesloten elementen, zoals a div
. In deze gevallen kan validatie van enorme hulp zijn.
Dus wat is er veranderd? Is validatie niet langer nodig? Staat HTML5 ons toe om vreselijke mark-ups te schrijven zonder een tweede gedachte? Is het nieuwe HTML5-doctype magic-infused? Helemaal niet. Validatie is een handig hulpmiddel waarmee we gemiste gesloten tags, extra puntkomma's, enz. Kunnen lokaliseren. Dat gezegd hebbende, de eindscore is, in feite niet relevant. Het is geen magisch getal - dat, 100%, contact opneemt met The Architect achter de schermen, en hem opdraagt bonuspunten toe te passen op uw website. Deze score heeft geen hoger doel dan om u feedback te geven. Het draagt noch bij aan de toegankelijkheid, noch wijst het op beste praktijken. In feite kan de validator misleidend zijn, zoals het signaleert fouten dat zijn geen fouten, door een stuk van de verbeelding. De HTML4-validator is snel verouderd, maar gelukkig heeft de W3C een nieuwe HTML5-validator (nog steeds experimenteel) die veel is verbeterd.
Houd er nu rekening mee dat dit goed opgemaakt is kan boost SEO; er is echter geen specifieke correlatie tussen SEO en een validatiescore.
HTML5 standaardiseert veel van de functies die sommige browsers jarenlang hebben ondersteund, zoals aangepaste kenmerken (via de gegevens-
voorvoegsel) en ARIA-kenmerken, die niet voldoen aan de HTML4-validator van de W3C.
Wanneer u nieuwe ontwerpen test, moet u het experimenteel controleren HTML5-validator keuze. Met deze optieset kunt u de ondersteunde CSS3-eigenschappen gebruiken, aangepast gegevens-
attributen en meer.
Maak nooit gebruik van de nieuwste CSS3-technieken en -selectoren omwille van de validatie.
Wat als we streven naar een score van minstens 75%? Ik begrijp het denken, zoals ik dat ook op een bepaald moment dacht; hoewel, nogmaals, het is niet relevant. Bij het valideren moet je in de eerste plaats bepalen waar je fouten hebt gemaakt. Validatie is geen spel, en hoewel het leuk kan zijn om je vaardigheden te testen om te bepalen hoe hoog je score kan zijn, houd dan altijd in gedachten: het maakt niet uit. En compromis nooit het gebruik van het nieuwste doctype, CSS3 technieken en selectors omwille van de validatie.
Het vuile geheim van browsers is dat ze nooit HTML-validatie uitvoeren tegen een DTD. Het doctype dat u bovenaan het document plaatst, schakelt de parser in een bepaalde werkmodus, maar er zijn geen bewerkingen waarbij het doctype wordt gedownload en gecontroleerd of de code overeenkomt. Wat betekent dit? Het betekent dat een basissyntaxis-parser HTML verwerkt, met uitzonderingen die zijn opgegeven voor zelfsluitende tags en blok- versus inline-elementen (en ik ben er zeker van dat ook andere situaties).
- Nicholas Zakas
Afhankelijk van de opties die u opgeeft voordat u uw ontwerpen controleert (HTML4 vs. HTML5), schreeuwt de validator als een baby wanneer deze wordt gevonden:
Ahh, hackers in de browser ... moet je ze gebruiken? Het antwoord op die vraag is tot de dood besproken en overtreft zeker de reikwijdte van deze tutorial; Houd er echter rekening mee dat bijvoorbeeld het gebruik van de IE6-underscore-hack validatie mislukt.
Om deze reden geven veel ontwerpers de voorkeur aan gebruik non-breaking technieken in plaats daarvan.
Zo:
/ * Fails validation * / #myElement _position: relative; / * target alleen IE6 * /
Wordt:
/ * Gaat door validatie * / * html #myElement position: relative; / * doelen IE6 * /
De reden achter deze redenering is, wat als in de toekomst, in Internet Explorer 10, ook eigenschappen worden weergegeven die zijn voorafgegaan door een onderstrepingsteken? In gevallen zoals die, zal je IE6-only (dus je dacht) styling ook worden toegepast op IE10 en hoger, vermoedelijk. De waarheid is dat dit nooit zou gebeuren, omdat het een groot aantal websites zou breken. Dat gezegd hebbende, deze methode van browsertargeting is inderdaad een hack. Behalve in kleinere of zeldzame gevallen, is het beter om een voorwaardelijke stylesheet te gebruiken of een vorm van functiedetectie om specifieke browsers te targeten.
Hoewel we het allemaal eens kunnen zijn dat het toepassen van meerdere voorvoegsels van leveranciers op eigenschappen, allemaal omwille van het bereiken van, bijvoorbeeld, afgeronde hoeken, ongelooflijk vervelend is, zou je je gelukkige sterren moeten bedanken dat de browserverkopers met deze technologieën hebben geëxperimenteerd voordat ze officieel werden aanbevolen.
had
webkit
niet geëxperimenteerd met CSS-gradiënten, en had Mozilla niet verbeterd op basis van de gesuggereerde syntaxis, gradiënten zouden niet zo breed worden ondersteund in de huidige generatie moderne browsers als ze nu zijn. U ziet dat browsers een grote rol spelen bij het vormgeven van de toekomst van internet.
.vak background: # 666; achtergrond: -moz-lineair verloop (boven, zwart, wit); achtergrond: - webkit-gradiënt (lineair, linksboven, linksonder, van (zwart), tot (wit)); achtergrond: lineair verloop (boven, zwart, wit);
Met dit alles zal het gebruik van deze leveranciersvoorvoegsels ervoor zorgen dat uw stijlbladen niet worden gevalideerd. Maar dat is oke; laat je daar geen zorgen over maken.
Leer de regels zodat je weet hoe je ze moet overtreden.
Helaas kiezen veel ontwerpers er nu al voor om in ons voorbeeld hierboven afbeeldingen te gebruiken om gradiënten te maken - al was het maar om hun validatiescore terug te brengen tot 100%. Als je in dit kamp valt: je doet het verkeerd.
Als u maar één ding uit dit artikel haalt, onthoud dan dat validatie eenvoudigweg een hulpmiddel is. Zodra je je eigen logica en technieken compromitteert omwille van het tevredenstellen van een validator en het behalen van een zinloze score, is het niet langer een hulpmiddel. Dat gezegd hebbende, gebruik het en gebruik het vaak!