Sisään tämän sarjan ensimmäinen osa tarkastelimme puutteita, jotka johtavat HTML5: n uusiin rakenteellisiin elementteihin; sisään sarjan toinen osa tarkastelimme yksityiskohtaisesti näiden puutteiden seurauksia; tässä viimeisessä osassa etsimme tietä eteenpäin ja teemme johtopäätöksiä nykytilanteesta.

Tämä ei ole abstrakti ongelma: ihmisten täytyy itse opettaa tätä tavaraa. Seuraavan sukupolven web-suunnittelijat ja kehittäjät opetetaan HTML5: llä lähtökohtana. Olen pahoillani siitä, kuka yrittää selittää ja jakaa nykyisen ja tulevan opiskelijakasvatuksen. Ehkä he pitävät viisaasti yksinkertaiseen muotoonsa, joka toimii edelleen hyvin: käytä divs joko ID: llä tai luokalla.

On järkevää ehdottaa, että tulevaisuudessa käyttäjäagentit, kuten selaimet ja näytönlukijat, tekevät entistä enemmän HTML5: n rakenteellisilla elementeillä, mikä tekee niistä entistä miellyttävämmän meille kirjoittajina.

Opera's Bruce Lawson ehdotti juuri sitä WHATWG-postituslista vuonna 2009 :

Loppujen lopuksi tiedän käyttäjiltä, ​​jotka voivat käyttää aikaa, osaa, alatunnistetta, datagridia jne. Mutta odotamme lähinnä pian olevansa.

Ja tässä se, mitä Hickson, HTML5-toimittaja, sanoi vastauksessaan:

Minä en. Suurin osa uusista elementeistä on tarkoitettu vain helpottamaan muotoilua, joten meidän ei tarvitse käyttää luokkia.

Kaikki tämä ja toimittaja ei näe käyttäjäagentteja koskaan käyttäessään näitä elementtejä. He ovat siellä, hän sanoo, pelastaakseen meidät käyttämästä luokkia. Toinen tapa, näiden elementtien luoja tuntuu epävarmalta, miksi hekin ovat mukana spec: ssa, paitsi "helpottamaan muotoilua".

Tarvitsemmeko HTML-semantiikkaa?

On ajatuskoulu, joka sanoo, että tarvitsemme vain kourallinen uutta semantiikkaa. Loppujen lopuksi spec jäisi paisutetuksi, jos lisättiin kymmeniä tai satoja uusia termejä.

Toisaalta, olen samaa mieltä. Perus-verkkosivun jäsentämisen kannalta sanoisin, että olisimme parempia ilman HTML: n leikkauselementtejä kokonaan. Mikä oli kerran yksinkertainen käyttää divs on tullut monimutkainen sotku HTML5 ilman nettovoittoa.

Yleisesti semantiikan kannalta on kuitenkin olemassa tapauksia, joissa verkkosivun rakenteen yläpuolella voidaan lisätä merkitystä (kuten HTML4, 5 tai mikä tahansa seuraavasta) käyttämällä olemassa olevia elementtejä lisäominaisuuksia.

ARIA esteettömyyteen

Yksi helpoimmista asioista olemassa tai uudelle sivustolle on ARIA-maamerkkejä. (ARIA tarkoittaa Accessible Rich Internet Applications -ohjelmaa ja se on määritelmä, joka määrittää tapaa, jolla verkkosovellukset ja verkkosivut ovat helpommin saatavilla.)

ARIA-maamerkit ovat ARIA-määrityksen osajoukko ja yksinkertainen metatieto, joka sallii sokeiden ja näkövammaisten käyttäjien, joilla näytönlukijat voivat siirtyä sivun merkittäviin osiin eli maamerkkeihin. Lisätään vain rooli = "maamerkki-nimi" olemassa olevalle elementille samalla tavoin kuin lisäämme luokan = "class-name" elementtiin. AIRAn maamerkit ovat keskusteltu HTML5: n kanssa tässä .

ARIA-maamerkit ovat paljon parempi ottelu tällä hetkellä. Nimeäminen on vähäpätöinen, mutta ainakin ne heijastavat todellista web-kirjoittamisen käytäntöä. Voimme esimerkiksi käyttää:

  • banneri koko sivun otsikkoon.
  • navigointi navigointiin.
  • täydentävät sivupalkit.
  • sisällön tiedot alatunnisteelle.
  • tärkein sisältöalue.

(Muista, että banneri-, pää- ja sisältötietoa tulee käyttää vain kerran asiakirjaa kohti.)

ARIA-maamerkit ovat yksinkertainen ratkaisu, joka parantaa näytönlukuohjelmien käyttäjille suunnattuja navigointivaihtoehtoja ilman, että navigoit HTML-asiakirjan hahmottuneelle alueelle. Ne ovat nopeita ja helppoja toteuttaa, ja ne pitäisi olla osa HTML-projektimallipohjasi.

Hakukoneet

Joten meillä on enemmän semantiikkaa saavutettavuus, mutta meillä on myös enemmän semantiikkaa saatavilla hakukoneita myös.

Ensinnäkin haluan olla täysin selvää, että HTML5-elementeillä ei ole minkäänlaista hyötyä SEO: lle. Se on myytti, ja meidän on pantava se nukkumaan. Artikkelitunnuksen käyttäminen ei auta sinua tai asiakkaasi sijoitusta korkeammalle kuin seuraava kaveri. Voit luottaa siihen, että Google on selvittänyt, miten löytää ja sijoittaa sisältösi tähän mennessä.

Hakukoneet kuitenkin haluavat ymmärtää, miten parhaiten näytetään (huom: ei sijoitus ) verkkosisältöä jäsennellyn tavoin.

Siksi suuret hakukoneet ovat vuosien kuluessa esittäneet tai hyväksyneet olemassa olevat tavanomaiset tavat jäsenneltyjen tietojen merkitsemiseen verkkosivuilla, jotta he voivat hankkia asianmukaiset tiedot. Esimerkiksi, kun haet arvosteluja, saatat huomata, että tähtiluokitukset näkyvät Google-hakutuloksissa. Tämä on tapaus, jossa hakukoneet pystyvät poimimaan arvioinnin pisteet standardoituna ja parantamaan tulostensa näyttöä. Reseptit ovat toinen esimerkki, jossa kutakin tulosta varten on listattu kypsennysaika. Vaikka tällainen tieto ei paranna sivuston sijoitusta, yksityiskohtaisempi tulos voi kannustaa useampia käyttäjiä napsauttamaan, joten sivustolle on olemassa joitain mahdollisia hyötyjä, ja se on usein välttämätöntä kilpapotilanteessa, jossa kaikki kilpailijat tekevät sitä joka tapauksessa.

Vaikka tällainen rikas tieto on ollut jonkin aikaa eri muodoissa, viime vuonna suurimmat hakukoneet käynnistettiin valtava uusi standardien joukko tällaisia ​​jäsenneltyjä tietoja varten. He kutsuvat heille "kaavioita", ja heidät on sijoitettu Schema.org . He käyttävät HTML: n mikrotason standardia, ja eBay, IMDB, Rotten Tomatoes ja monet muut ovat ottaneet sen käyttöön.

Tämä on suurin askeleen kohti enemmän semanttista verkkoa vuosina, mutta silti se toteutettiin suljettujen ovien takana, jossa oli vähän fanfareja eikä minkäänlaista standardiprosessia. Se pudotettiin meille ilman varoitusta, ja siitä lähtien se on enimmäkseen lentänyt web-suunnitteluyhteisön tutkan alla. Myös HTML5-semantiikkaa on liian päällekkäisiä, esimerkiksi skeemoja artikkeleita , web sivut ja web sivuelementtejä , paljon kaavoja, jotka sisältävät kaiken TV-jaksot että sairauksia . Se on myös suositeltava tapa kuvata videoita verkossa.

HTML-semantiikan (ja sen puutteen) keskustelun jälkeen hakukoneet ovat tehneet selväksi, että he haluavat paljon enemmän semanttisia tietoja merkinnöissämme, mutta sen tulee tapahtua nykyisten rakenteiden lisäksi eikä uusilla elementeillä.

Mutta varmasti meille yhteisömme, joka on kiinnostunut semantiikka- ja webstandardeista, ei HTML: n rajoitettu, puutteellinen lähestymistapa semantiikkaan tai suurten hakukoneiden suljettu, pudotus pois lähestymistapa on paras polku eteenpäin.

Joissakin aisteissa HTML5-semanttinen hevonen on pultattu; se on meille vain, että se sisältää vahingot. Kuten schema.org, se on kokonaan uusi maailma, ja yksi meidän pitäisi tutkia tarkasti, tai toinen pieni ryhmä aikoo määrittää, mikä on meidän - ja verkon - etujen mukaista meitä. Itse asiassa se voi olla jo tapahtunut.

johtopäätökset

Lopuksi päädytään joihinkin johtopäätöksiin.

  • Otsakkeet ovat tärkeitä: ensinnäkin meidän on todella huolehdittava sivusi otsikkorakenteesta auttaaksemme sokeita ja näkökykyisiä käyttäjiä, jotka yrittävät kiertää näytönlukijoita. Arvotut h1-h6-elementit saattavat olla rajoitettuja, mutta näytön lukija käyttäjiä tukeutuvat niihin voimakkaasti.
  • HTML5-rakenne on sotku: meidän pitäisi luultavasti sivuuttaa HTML-rakenneosat kokonaan. He ovat olleet hieman katastrofi - meillä on olennaisilta osiltaan sidottu spec, luonut runsaasti katkoviivoja ja hukkaan liikaa aikaa jo yrittäessä saada päämme pohjimmiltaan rikkoutuneelta järjestelmältä. Eläköön divs.
  • Harkitse ARIA-maamerkkejä: ARIA-maamerkkien lisääminen sivustoosi on toinen yksinkertainen ja tehokas tapa auttaa näytön lukijaa käyttäjiä.
  • Harkitse schema.org ja semantiikan tulevaisuus: schema.org on tärkeimpien hakukoneiden tausta, ja vaikka se on varmasti sekalaista tällä hetkellä, se näyttää olevan tulevaisuutta jäsenneltyjen tietojen verkossa.

HTML5-spesifikaatiossa on paljon hyviä osia, uusia muotoja ominaisuuksista Historia API- ja Canvas-sovelluksiin. Itse asiassa ilman WHATWG: ää, jotka ovat olleet HTML5: n liikkeellepaneva voima, olisimme vielä jumissa HTML4 / XHTML 1.0: n kanssa, kun odottelimme W3C: n toimivan yhdessä. Kuitenkin vain siksi, että HTML5 ja kaikki sen ympärillä oleva teknologia ovat uusia ja jännittäviä, se ei tarkoita sitä, että meidän on hyväksyttävä kaikki, mitä meille annetaan.

Joskus on syytä nähdä, miten HTML-makkara on tehty, joten tiedämme, mitä syömme. Ja jos kyseessä on HTML: n rakenteellinen semanttinen, kannatan mieluummin.

Hungry lisää? Lukijan kirja "The Truth About HTML5" on saatavilla rajoitetun ajan sisko-sivuston kautta MightyDeals.com hämmästyttävällä 50%: lla.

Oletko käyttänyt ARIA: n maamerkkejä tai Schema.orgia? Näetkö tulevaisuuden HTML5: n rakenteellisille elementeille? Kerro meille kommentit.

Esitetty kuva / pikkukuva, käyttää rakennekuva kautta Shutterstock.