[semantiek] klikpad in html

[Vinzzz243]

Ik heb een vraag mbt structurering van html code.
Stel ik heb een klikpad op een website:
home - dienst1 - productgroepA - product1

Hoe zou dit semantisch het best opgezet kunnen worden?
Als een lijst van hyperlinks? En dus:

code:

<ul>
  <li>home</li>
  <li>dienst1</li>
  <li>productgroepA</li>
  <li>product1</li>
</ul>

Of bv als een structuurlaag met parents en child, dus bv:

code:

<ul>
  <li>home
    <ul>
      <li>dienst1
        <ul>
          <li>productgroepA
            <ul>
              <li>product1
              </li>
            </ul>
          </li>
        </ul>
      </li>
    </ul>
  </li>
</ul>

of wellicht nog een andere optie?

[frickY]

In eerste instantie zou ik willen zeggen je 2de voorbeeld. De klikpad omschrijft geneste pagina's, welke je dus ook genest zou 'moeten' tonen.
Ikzelf gebruik echtetr altijd je eerste voorbeeld. Ik toon een lijst met de bezochte pagina's, welke toevallig in elkaar genest zijn.

[Verwijderd]

Als je de eerste variant gebruikt zou ik er sowieso een <ol> (Ordered List) van maken, aangezien de volgorde in deze wat zegt over de verschillende items (namelijk het nesting-niveau).

[BtM909]

Een klikpad lijkt me afhankelijk van de volgorde (de lijst is immers bepaald door op een volgorde te klikken)... Dus gewoon één ol gebruiken.

[Rickets]

Het is natuurlijk niet het echte klikpad

Een P met de links daarin is nog een optie, één die ook goed werkt zonder stylesheet:

code:

<p><a href="home">Home</a> &gt; Page 1

[:murb:]

het voegt dan wel niet heel veel aan semantiek in, maar ik denk dat de (vooral het tweede voorstel) ul structurering van breadcrumbs een beetje doorgeslagen is, en zou het ook oplossen op een manier ala Rickets. Mogelijk zou je wel ietwat structuur aan kunnen geven, aangezien er idd wel relaties zijn tussen de objecten. HTML heeft daar volgens mij echter niet echt een semantisch correcte term voor. Dus mocht je toch ietwat semantiek mee willen geven, voor wie er dan ook maar wat aan heeft:

code:

<p>
 <span class="sitelevel"><a href="#">Main</a>
  <span class="sitelevel"><a href="#">Sub</a>
    <span class="sitelevel"><a href="#">SubSub</a>
    </span>
  </span>
 </span>
</p>

[ Voor 17% gewijzigd door :murb: op 16-01-2006 16:25 ]

[Vinzzz243]

murb schreef op maandag 16 januari 2006 @ 16:25:
het voegt dan wel niet heel veel aan semantiek in, maar ik denk dat de (vooral het tweede voorstel) ul structurering van breadcrumbs een beetje doorgeslagen is, en zou het ook oplossen op een manier ala Rickets. Mogelijk zou je wel ietwat structuur aan kunnen geven, aangezien er idd wel relaties zijn tussen de objecten. HTML heeft daar volgens mij echter niet echt een semantisch correcte term voor. Dus mocht je toch ietwat semantiek mee willen geven, voor wie er dan ook maar wat aan heeft:

code:

<p>
 <span class="sitelevel"><a href="#">Main</a>
  <span class="sitelevel"><a href="#">Sub</a>
    <span class="sitelevel"><a href="#">SubSub</a>
    </span>
  </span>
 </span>
</p>

Dit ben ik niet met je eens. De vorm van ul's in ul's is toch net de structuur?
Ik wil er net semantiek aan toevoegen om de minder-valide bezoekers wat meer betekenis te geven van dit klikpad, lees: non-css browsers ed. vandaar dat ik het in HTML wil oplossen.

[Clay]

Op simplebits hebben ze er ook al eens over nagedacht.

* Clay is voor een p met a's

[André]

Dat de pagina's in een klikpath onder elkaar hangen wil nog niet zeggen dat je de schematische representatie daarvan ook zo moet maken. Ik zou gewoon heel simpel de 4 links achter elkaar plakken met bijvoorbeeld een > er tussen. Of in jouw geval voorbeeld 1.

[:murb:]

Vinzzz schreef op maandag 16 januari 2006 @ 16:31:
[...]
Dit ben ik niet met je eens. De vorm van ul's in ul's is toch net de structuur?
Ik wil er net semantiek aan toevoegen om de minder-valide bezoekers wat meer betekenis te geven van dit klikpad, lees: non-css browsers ed. vandaar dat ik het in HTML wil oplossen.

Als je de verkeerde betekenis mee geeft werkt het zelfs averechts is mijn mening. Tja, je kunt alles beargumenteren. 2 nadelen van jouw nested ul methode:
- semantisch niet echt een meerwaarde, omdat dit geen standaard gebruik is van de ul
- enorm veel onoverzichtelijke code
Het enige wat het doet is structuur geven, maar dan wel op een erg vreemde manier met een element dat volgens mij zo niet toegepast hoort te worden (maar dat is misschien dan ook meer een mening). Span is een in principe betekenisloos element, maar kan dus wel gebruikt worden om structuur aan te geven, die je vervolgens gebruikt om mee te stijlen zonder dat de inhoud daar voor verstoort wordt. Voor de daadwerkelijke betekenis voor de mens zul je het denk ik dan maar moeten doen met een title attribuut die zegt wat het is.

[MTWZZ]

Ik ga met murb mee, semantisch zou je evt iets in de <link> kunnen doen maar dat is ook vrij gelimiteerd omdat je alleen hierarchie aan kunt geven en niet zozeer het klikpad.
Voor de gebruiker is het alleen van belang dat het er "leuk" uitziet.

[Verwijderd]

André schreef op maandag 16 januari 2006 @ 16:39:
Dat de pagina's in een klikpath onder elkaar hangen wil nog niet zeggen dat je de schematische representatie daarvan ook zo moet maken. Ik zou gewoon heel simpel de 4 links achter elkaar plakken met bijvoorbeeld een > er tussen. Of in jouw geval voorbeeld 1.

Precies, hier schiet je veel meer mee op. Je moet semantiek zien als duidelijkheid op een pagina zonder opmaak, zonder stylesheet. Hoe ziet je pagina er dan (semantisch) op zijn best uit?

Volgens mij bereik je dus meer semantiek door simpelweg linkjes naast elkaar te plaatsen. Dus ook niet de nutteloze <span> elementen om elkaar heen, in elkaar genest. Slaat toch nergens op, aangezien bijvoorbeeld spraakbrowsers er toch ook helemaal niets extra's mee kunnen!?

Je pagina mag dan nóg zo semantisch verantwoord zijn, er is natuurlijk een grens.

[:murb:]

Verwijderd schreef op maandag 16 januari 2006 @ 18:52:
[...]
Volgens mij bereik je dus meer semantiek door simpelweg linkjes naast elkaar te plaatsen. Dus ook niet de nutteloze <span> elementen om elkaar heen, in elkaar genest. Slaat toch nergens op, aangezien bijvoorbeeld spraakbrowsers er toch ook helemaal niets extra's mee kunnen!?

Spraak browsers kunnen er dan wel niets mee, maar het geeft wel ietwat structuur aan die gebruikt kan worden door een ieder die deze regel begrijpt. Het voegt wel degelijk wat toe waarmee iets gedaan kan worden. Betekenis is pas betekenis als het begrepen wordt. UL is ook onbegrepen voor breadcrumbs, maar dragen een andere presentatie (dus intepretatie, dus betekenis) met zich mee.

Dat spraakbrowsers er niets mee kunnen is geen argument om dat te verwerpen. Het zou idd leuk zijn als deze er wat meer mee zouden kunnen doen, maar geen van de hier genoemde oplossingen bieden iets extra's voor een spraakbrowser, ik ben zelfs bang dat zo'n nested ul b.v. de gebruiker alleen maar zal opzadelen met onnodige uitleg over de structuur van de lijst (dit is waar ik ook in de vorige alinea op doelde).