I den første del af denne serie vi kiggede på de fejl, der fører til de strukturelle elementer, der er nye til HTML5; i den anden del af serien vi kiggede detaljeret på konsekvenserne af disse fejl; i denne sidste del vil vi lede efter en vej frem og trække nogle konklusioner om den aktuelle situation.
Dette er ikke et abstrakt problem: Folk skal faktisk lære disse ting. Den næste generation af webdesignere og udviklere vil blive undervist i HTML5 som udgangspunkt. Jeg er ked af det for enhver, der skal forsøge at forklare skitsering og snitning til den nuværende og fremtidige afgrøde af studerende. Måske holder de klogt fast i det enkle format, vi har, der stadig fungerer fint: brug divs med enten et ID eller en klasse.
Det er rimeligt at foreslå, at måske brugeragenter i fremtiden, som f.eks. Browsere og skærmlæsere, vil gøre mere med HTML5s strukturelle elementer, og det vil gøre dem mere velsignelige for os som forfattere.
Operaens Bruce Lawson foreslog netop det på WHATWG mailingliste i 2009 :
Jeg ved trods alt ingen brugeragenter, der kan bruge tid, sektion, footer, datagrid osv. Men vi regner for det meste med at være snart.
Og her er hvad Hickson, HTML5-redaktøren, sagde som svar:
Det gør jeg ikke. De fleste af de nye elementer er kun ment at gøre styling lettere, så vi ikke behøver at bruge klasser.
Alt dette, og redaktøren ser ikke brugeragenter nogensinde selv ved at bruge disse elementer. De er der, siger han, for at redde os fra at bruge klasser. På en anden måde virker skaberen af disse elementer usikker på, hvorfor de er lige i specifikationen, undgå at gøre styling lettere.
Der er en tankegang, der siger, at vi kun har brug for en håndfuld ny semantik alligevel. Når alt kommer til alt, vil specen blive oppustet, hvis der var flere eller flere hundrede flere nye vilkår.
Den ene side er jeg enig. Hvad angår strukturering af en grundlæggende webside, vil jeg sige, at vi ville være bedre uden HTML's sektionselementer helt og holdent. Hvad der engang var en simpel øvelse i at bruge divs er blevet et kompliceret rod i HTML5 uden nogen gevinst.
Men hvad angår semantik generelt er der tilfælde, hvor mere mening kan tilføjes oven på strukturen på vores webside (hvad enten det er HTML4, 5 eller hvad der kommer næste) ved at bruge yderligere attributter på vores eksisterende elementer.
En af de nemmeste ting at implementere på et eksisterende eller nyt websted er ARIA landemærker. (ARIA står for tilgængelige Rich Internet Applications og er en specifikation der definerer en måde at gøre webapplikationer og websider mere tilgængelige.)
ARIA-vartegn er en delmængde af den overordnede ARIA-specifikation og en simpel type metadata, der gør det muligt for blinde og synshæmmede brugere at bruge skærmlæsere til at hoppe rundt på de væsentlige dele af en side, dvs. "landmærkerne". Vi tilføjer blot role = "landmark-name" til et eksisterende element, ligesom vi vil tilføje class = "class-name" til et element. AIRA landemærker er diskuteret i sammenligning med HTML5 her .
ARIA landemærker er en meget bedre kamp for det, vi gør i øjeblikket. Navngivningen er lidt wonky, men i det mindste afspejler de faktisk webforfatterpraksis. For eksempel kan vi bruge:
(Husk, at banner-, hoved- og indholdsoplysninger kun skal bruges én gang pr. Dokument.)
ARIA-vartegn er en simpel løsning, der forbedrer navigationsmulighederne for brugerne af skærmlæsere uden at vade ind i det skumle område af HTML-dokumentet. De er hurtige og nemme at implementere, og bør virkelig være en del af din grundlæggende HTML-projektskabelon.
Så vi har mere semantik for tilgængelighed, men vi har også mere semantik til rådighed for søgemaskiner også.
Lad mig først være helt klar over, at HTML5-elementer ikke har nogen fordel for SEO overhovedet. Det er en myte, og vi skal lægge det i seng. Brug af et artikeltag vil ikke hjælpe dig eller din klientplacering højere end den næste fyr. Du kan stole på, at Google har fundet ud af, hvordan du finder og rangerer dit indhold nu.
Men søgemaskinerne er opsat på at forstå, hvordan man bedst kan vise (bemærk: ikke rang ) webindhold på en mere struktureret måde.
Derfor har de store søgemaskiner gennem årene fremlagt eller vedtaget eksisterende standardmetoder til at markere strukturerede data på en webside, så de kan udtrække de relevante oplysninger. For eksempel, når du søger efter anmeldelser, du måske har bemærket stjerneklassifikationer, vises i de øverste Google-resultater. Dette er tilfældet med, at søgemaskinerne er i stand til at udtrække bedømmelsesscore på en standardiseret måde og forbedre visningen af deres resultater. Opskrifter er et andet eksempel, hvor tilberedningstiden er angivet for hvert resultat. Selv om sådanne data ikke forbedrer et websteds rang, kan det mere detaljerede resultat tilskynde flere brugere til at klikke igennem, så der er en vis potentiel fordel der for et websted, og det er ofte nødvendigt i en våbenkonkurrence situation, hvor alle dine konkurrenter gør det alligevel.
Mens denne slags rige data har eksisteret i et stykke tid i forskellige guiser, er det kun sidste år, de største søgemaskiner lanceret Et stort nyt udvalg af standarder for denne slags strukturerede data. De kalder dem 'skemaer', og de er indkvarteret hos Schema.org . De bruger HTML's microdata standard og er allerede implementeret af eBay, IMDB, Rotten Tomater og meget mere.
Dette er det største spring til en mere semantisk web i år, og dog blev det gjort bag lukkede døre med lidt fanfare og ingen standardproces overhovedet. Det blev tabt på os uden advarsel, og har siden for det meste fløjet under webdesign samfundets radar. Der er også mange overlapninger med HTML5 semantik, for eksempel er der skemaer til artikler , web sider og web sideelementer , blandt langt flere skemaer, der omfatter alt fra Tv-episoder til medicinske forhold . Det er også den anbefalet måde at beskrive videoer på nettet.
Efter hele debatten om HTML's semantik (og mangel deraf) har søgemaskinerne gjort det klart, at de vil have langt mere semantiske data i vores markering, men det vil ske oven på eksisterende strukturer og ikke med nye elementer.
Men sikkert for os som et samfund, der er interesseret i semantik og webstandarder, er hverken HTML's begrænsede, fejlbehæftede tilgang til semantik eller den lukkede, bortfaldne tilgang af de store søgemaskiner den bedste vej fremad.
I nogle sanser har den HTML5 semantiske hest boltet; det er bare op til os at indeholde skaden. Hvad angår schema.org, er det en helt ny verden, og vi skal undersøge meget tæt, eller en anden lille gruppe skal bestemme, hvad der er i vores - og internettet - interesser for os. Faktisk er det måske allerede sket.
Lad os pakke op med nogle konklusioner.
Der er mange gode dele i HTML5-specifikationen, fra nye formularfunktioner til History API og Canvas implementering. Faktisk, uden WHATWG, som har været drivkraften bag HTML5, vil vi stadig sidde fast med HTML4 / XHTML 1.0, mens vi ventede på W3C at få deres handling sammen. Ikke desto mindre betyder det ikke, at vi skal acceptere alt, hvad vi får, fordi HTML5 og al den relaterede teknologi omkring den er ny og spændende.
Nogle gange er det værd at se, hvordan HTML-pølsen er lavet, så vi ved, hvad vi spiser. Og i tilfældet med HTML's strukturelle semantik, vil jeg hellere passere.
Sulten for mere? Luke's bog "The Truth About HTML5" er tilgængelig i begrænset tid via vores søsters websted MightyDeals.com med en fantastisk 50% rabat.
Har du brugt ARIA landemærker eller Schema.org? Kan du se en fremtid for HTML5s strukturelle elementer? Lad os vide i kommentarerne.
Fremhævet billede / miniaturebillede, anvendelser struktur billede via Shutterstock.