Ja kun käyttää ARTICLE, ASIDE ja DIV
Uusi HTML5 SECTION -elementti voi olla hieman hämmentävä. Jos olet rakentanut HTML- asiakirjoja ennen HTML5: aa, on mahdollista, että käytät jo elementtiä luomaan rakenteellisia jakoja sivuillesi ja muotoile sitten sivuja heidän kanssaan. Joten voi tuntua luonnolliselta yksinkertaiselta korvata nykyiset DIV-elementit SECTION-elementteillä. Mutta tämä on teknisesti väärä. Joten jos et vain korvaa DIV-elementtejä SECTION-elementeillä, miten käytät niitä oikein?
SECTION-elementti on semanttinen elementti
Ensimmäinen asia on ymmärtää, että SECTION-elementti on semanttinen elementti. Tämä tarkoittaa sitä, että se antaa käyttäjälle ja ihmisille merkityksen siitä, mitä suljettu sisältö on - nimenomaan osa asiakirjaa.
Tämä voi tuntua hyvin yleiseseltä semanttiselta kuvaukselta, ja se johtuu siitä. On olemassa muita HTML5-elementtejä, jotka tarjoavat enemmän semanttisia eroja sisältöön, jota sinun tulisi käyttää ensin ennen kuin käytät SECTION-elementtiä:
- ARTIKLA
- TAKAISINSAANTI
- NAV
Milloin SECTION-elementtiä käytetään
Käytä ARTICLE-elementtiä, kun sisältö on riippumaton osa sivustoa, joka voi olla yksin ja syndikoida kuten artikkeli tai blogikirjoitus. Käytä ASIDE-elementtiä, kun sisältö liittyy tangentiaalisesti sivun tai sivuston sisältöön, kuten sivupalkkeihin, merkintöihin, alaviitteisiin tai niihin liittyviin sivustotietoihin. Käytä NAV-elementtiä navigointia varten.
SECTION-elementti on yleinen semanttinen elementti. Käytät sitä, kun mikään muusta semanttisesta säiliöelementistä ei ole sopiva. Käytät sitä yhdistääkseen asiakirjan osia yhteen erillisinä yksiköinä, joita voit kuvata liittyviksi jollakin tavalla. Jos et voi kuvata elementtejä jaksossa yhdestä tai kahdesta lauseesta, luultavasti ei pitäisi käyttää elementtiä.
Sen sijaan sinun tulisi käyttää DIV-elementtiä. HTML5: n DIV-elementti on ei-semanttinen konttialus. Jos sisällöstä, jota yrität yhdistää, ei ole semanttista merkitystä, mutta sinun on vielä yhdistettävä se muotoiluun, niin DIV-elementti on asianmukainen elementti käytettäväksi.
Miten SECTION-elementti toimii
Asiakirjan osa voi näkyä artikkelien ja ASIDE-elementtien ulkosäiliöksi. Se voi myös sisältää sisältöä, joka ei ole osa ARTICLE tai ASIDE. SECTION-elementti löytyy myös ARTICLE-, NAV- tai ASIDE-sivujen sisällä. Voit jopa peittää osioita, jotka osoittavat, että yksi sisältöryhmä on toisen tietoryhmän osa, joka on artikkelin tai koko sivun osa.
SECTION-elementti luo asiakirjan ääriviivoja. Ja sellaisena, sinun tulisi aina olla otsikkoelementti (H1: stä H6: een) osana osiota. Jos et voi laatia nimikkeen otsikkoa, niin taas DIV-elementti on luultavasti sopivampi. Muista, että jos et halua osion otsikon näkyvän sivulla, voit aina peittää sen CSS: llä.
Kun et käytä SECTION-elementtiä
Edellä mainittujen ohjeiden lisäksi, kun käytät täsmällisempää semanttista elementtiä, on olemassa yksi määritelty alue, jota ei pidä käyttää SECTION-elementissä: vain tyyliä varten.
Toisin sanoen, jos ainoa syy, johon laitat elementtiä kyseiseen paikkaan, on kiinnittää CSS-tyyppiset ominaisuudet, sinun ei tule käyttää SECTION-elementtiä. Etsi semanttinen elementti tai käytä DIV-elementtiä sen sijaan.
Viime kädessä se ei voi olla väliä
Semanttisen HTML-koodin kirjoittamisen vaikeus on se, että minulle semanttinen sisältö saattaa olla äärimmäisen hölynpölyä sinulle. Jos tunnet, että voit käyttää asiakirjasi SECTION-elementtiä, käytä sitä. Useimmat käyttäjäagentit eivät välitä ja näyttävät sivun, koska saatat odottaa, että olet tyylikäs DIV tai SECTION.
Suunnittelijoille, jotka haluavat olla semanttisesti oikein, käyttämällä SECTION-elementtiä semanttisesti pätevästi on tärkeää. Niille suunnittelijoille, jotka haluavat vain sivujensa toimivuuden, tämä ei ole yhtä tärkeää. Uskon, että kirjallisesti puolueettomasti kelvollinen HTML on hyvä käytäntö ja pitää sivut entistä paremmin tulevaisuudessa. Mutta lopulta se riippuu sinulle.