[semantiek] dl voor plaatjes met onderschrift

[Verwijderd]

Ik kreeg deze site als voorbeeld van een img in een dl

hierdoor wordt de img (in de dt) en de caption (in de dd) semantisch met elkaar verbonden.

Eventueel kan je meerdere dingen in verschillende dd's kwijt (zoals dimensies, bytesize enzo, van die dingen die je in een gallery wel eens tegenkomt).

Wat vinden m'n medetweakers hiervan? is dit verstandig? Is het voor een hele gallery (als in verzameling thumbs met hun description, dus zeg maar zoiets wat je op google img search terugkrijgt) handiger als een tabel (hier twijfel ik over), en is het voor in een text een betere oplossing dan:

code:

<p>
<img />
beschrijving van een plaatje
</p>

Hier wordt op zich door de omhullende p beschrijving wel aan het plaatje gekoppeld, maar de boel "voelt" niet echt als een paragraaf.

code:

<dl>
<dt><img /></dt>
<dd>beschrijving van een plaatje</dd>
</dl>

jullie mening?

[André]

Het is wel makellijk om zo meerdere dingen in je onderschrift te plaatsen. Ook als je dan met een textbrowser gaat surfen blijft het duidelijk welke omschrijving bij welke alt tekst hoort.

Maar of het handiger is, tja, ik denk het wel. Het werkt overzichtelijker en gestructureerder dan een tabel.

[Rickets]

Verwijderd schreef op woensdag 24 november 2004 @ 11:27:
Is het voor een hele gallery (als in verzameling thumbs met hun description, dus zeg maar zoiets wat je op google img search terugkrijgt) handiger als een tabel (hier twijfel ik over)

Waarom twijfel je of het handiger is dan een tabel?

[Verwijderd]

Het geeft structureel de relatie het beste aan. Semantisch valt te betwijfelen aangezien het niet echt gaat om een definitie, maar aangezien er niet echt een semantisch betere oplossing is lijkt me toch dat je hiervoor moet gaan.

Met een tabel zou je de informatie wel kunnen groeperen, maar het is dan onduidelijk dat de beschrijving bij het plaatje hoort. Die structuur heb je (alleen) bij DL.

[Verwijderd]

Rickets schreef op woensdag 24 november 2004 @ 11:46:
[...]

Waarom twijfel je of het handiger is dan een tabel?

omdat als je veel plaatjes hebt en veel verschillende bijhorende dingen (beschrijvingen zeg maar) de data meer een tabelstructuur krijgt.

ik omschrijf het aan andere mensen vaak als volgt:

ul,ol:
dit,
dit,
dit,

dl:
dit
dat,
dit
dat,

table:
dit: dat en dat en dat en dat
dit: dat en dat en dat en dat

(beetje cryptisch, magoe)


edit:
eigenlijk zou

code:

<img>
  <caption>beschrijving van het plaatje</caption>
</img>

een veel betere oplossing zijn denk ik, of niet?

[ Voor 14% gewijzigd door Verwijderd op 24-11-2004 12:44 ]

[Verwijderd]

even een kick, want ik bedacht me het volgende:

code:

<label>
  <img />
  image description
</label>

of

code:

<img id="eenId" />
<label for="eenId">image description</label>

(jullie hoeven niet meteen in de dtd te duiken: het mag)

is dit niet eigenlijk de oplossing hiervoor?

met meerdere labels ergens in de tekst kan je zo ook referenties aangeven

(ok het rendert niet zo super zonder styles, maar het is semantisch een heel stuk netter denk ik. Ik zit nog te twijfelen of die rendering zonder styles nog betjes te verbeteren is met wat <br>'s hier en daar)

[ Voor 79% gewijzigd door Verwijderd op 02-12-2004 11:29 ]

[Genoil]

hmm volgens de specs zegt een label iets over een form control, maar het valideert wel. je mag ook meerdere labels aan een element refereren. het probleem is alleen, dat label alleen inline content mag bevatten, dus als jij van je img dus de dimensions wilt opgeven, zoals je in voorbeeld met de dl, dan kom je met een label in de problemen.

[Verwijderd]

nee, %special; valt binnen %inline; en img zit in %special;

het gaat idd over controls, en een img is niet direct een control te noemen, maar da's idd het enige bezwaar wat ik een beetje heb kunnen vinden

[ Voor 24% gewijzigd door Verwijderd op 02-12-2004 11:37 ]

[André]

Tja, die laatste is misschien nog wel de beste oplossing omdat je geen andere elementen gebruikt om de onderlinge binding aan te geven. Alleen qua positionering heb je dan weer meer problemen volgens mij.

[Genoil]

Verwijderd schreef op donderdag 02 december 2004 @ 11:36:
nee, %special; valt binnen %inline; en img zit in %special;

het gaat idd over controls, en een img is niet direct een control te noemen, maar da's idd het enige bezwaar wat ik een beetje heb kunnen vinden

ik bedoel dat label inline is. stel dat je bijvoorbeeld de dimensions van de img aan wilt geven, dan wil je die semantisch gezien het lieftst in een geneste dl. maar dat mag dus niet in een label.

[creative8500]

Als je het mij vraagt is het meest semantisch verantwoord vastleggen van een foto met onderschrift deze wijze:

code:

[img]"DC000234.JPG"[/img]

[Verwijderd]

dan is longdesc eerder op z'n plaats, maar attributen blijven imho metadata, terwijl een onderschrift wezenlijk onderdeel is van je content

Genoil schreef op donderdag 02 december 2004 @ 11:45:
[...]
ik bedoel dat label inline is. stel dat je bijvoorbeeld de dimensions van de img aan wilt geven, dan wil je die semantisch gezien het lieftst in een geneste dl. maar dat mag dus niet in een label.

een img is toch ook inline? (replaced that is)

edit:
het hele verhaal: http://www.rikkertkoppes.com/?thoughts/2004/12/02

[ Voor 66% gewijzigd door Verwijderd op 02-12-2004 12:20 ]

[Genoil]

Verwijderd schreef op donderdag 02 december 2004 @ 11:59:
dan is longdesc eerder op z'n plaats, maar attributen blijven imho metadata, terwijl een onderschrift wezenlijk onderdeel is van je content
[...]

een img is toch ook inline? (replaced that is)

edit:
het hele verhaal: http://www.rikkertkoppes.com/?thoughts/2004/12/02

ja een img is wel inline dus die mag idd in een label. maar stel dat je een label wilt toevoegen waar de dimensions zijn opgeslagen. Dimensions is een begrip dat je het beste in een geneste dl kwijt kunt. Maar dl is een block-level element dus die mag niet in je label.

on a sidenote: een img in een label plaatsen is semantisch gezien wat anders dan een label aan een img refereren met "for":

code:

            <label id="fotoOnderschrift" for="groteFoto">
                [img]"handschrift23.gif"[/img]
            </label>
            [img]"eiffeltoren.gif"[/img]

Stel dat ik dus alle onderschriften van m'n vakantie met de hand schrijf en inscan, om onder m'n online fotoboek af te beelden bij de foto's. Dan is een img in een label dus iets anders dan een label die refereert aan een img. Op zich kun je uit de code wel opmaken dat de label niets zegt over de img die erin zit maar over degene met de id in z'n for attribuut, maar het is op z'n minst verwarrend dat een img in een label enerzijds iets kan zeggen over een andere img, maar ook juist het onderwerp zijn waarover iets gezegd wordt.

[Verwijderd]

LABEL mag je niet verkrachten. Is hetzelfde als "<a><strong><a/></strong></a>" gebruiken omdat het mag.

[Verwijderd]

aha, ik begin te begrijpen wat jij probeert te bedoelen
1:

code:

<label>
  <img />
  <dl>
    <dt>width</dt>
    <dd>200px</dd>
    <dt>height</dt>
    <dd>100px</dd>
  </dl>
</label>

bedoel je? dat mag dus idd niet

2: over je sidenote. Zit op zich wel wat in, ik heb m'n code gebaseerd op de 2 manieren die voor inputs zijn aangegeven op w3c over impliciete (genest) en expliciete (met for attribuut) associatie

@Anne, waarom vind je dit verkrachten? ik vind van niet, dus ik zou wel wat argumenten willen zien als je het feit dat het in de specs alleen over form controls gaat doorslaggevend vind, kan, dat vind ik dus niet, maar verder geeft dit een bijschrift bij een element, net zoals het bij form elementen gepast is, imho

(en ik doe toch geen <label><strong><label /></strong></label>, ik doe precies hetzelfde als gebruikelijk bij form elementen, alleen nu toegepast op een img)

[ Voor 54% gewijzigd door Verwijderd op 02-12-2004 13:25 ]

[Verwijderd]

Het element staat in hoofdstuk 17 (Forms). Doorslaggevend genoeg naar mijn mening. De semantisch waarde van het element staat ook beschreven in relatie tot een "control" niet in relatie tot een algemeen object welke toevallig een ID attribuut heeft met dezelfde waarde als die van het FOR attribuut van het LABEL element.

[ Voor 9% gewijzigd door Verwijderd op 02-12-2004 13:36 ]

[Verwijderd]

Verwijderd schreef op donderdag 02 december 2004 @ 13:17:

@Anne, waarom vind je dit verkrachten? ik vind van niet, dus ik zou wel wat argumenten willen zien als je het feit dat het in de specs alleen over form controls gaat doorslaggevend vind, kan, dat vind ik dus niet, maar verder geeft dit een bijschrift bij een element, net zoals het bij form elementen gepast is, imho

Verkrachten vind ik een groot woord, maar ik ben het inderdaad met Anne eens. Op deze manier hoor je volgens mij het label element niet te gebruiken. Die hoor je te gebruiken bij "controls". In de standaard staat ook duidelijk in hoofdstuk 17.2.1 dat images geen controls zijn.

[ Voor 6% gewijzigd door Verwijderd op 02-12-2004 19:24 ]

[Verwijderd]

dus als ik ipv die img een <input type="image"> gebruik is het beter? da's pas verkrachten imho:P

ik ben het er op zich wel mee eens dat het raar aanvoelt, maar ik weet niet of het zo'n slecht gebruik van label is. Het is niet zoals we het altijd hebben gedaan, ok, en het staat ook niet letterlijk zo in de specs, maar is het echt zo vreemd?

misschien is het iets wat juist in de specs zou moeten horen (niet te letterlijk nemen)

Vooral de 2e optie in mijn voorbeeld (<label /><img />) vind ik wel hout snijden, de eerste is vreemd zoals Genoil al aangaf en ook volgens de accessibility guidelines niet te prefereren

hier staat overigens ook niet echt iets over image descriptions, behalve dat het longdesc attribuut hier bijzonder geschikt voor is.

Imho heeft longdesc 2 nadelen: 1e is dat het niet gerendered wordt (wat op te lossen is met generated content, behalve in IE), 2e is dat het een attribuut is, dus meta, dus geen wezenlijk deel van je content, wat een beschrijving mijns inziens wel zou moeten zijn.

[ Voor 36% gewijzigd door Verwijderd op 02-12-2004 20:29 ]

[Verwijderd]

Ik ben het met Anne eens. LABELs zijn hier niet voor bedoeld. (net zomin als DLs, overigens -- maar dat vind ik toch verreweg de beste optie.)

[Verwijderd]

Als we over IMG en LONGDESC gaan discussieren... Ze kunnen in combinatie beter niet gebruikt worden. Mocht je echt die functionaliteit nodig hebben, gebruik dan OBJECT.

[Verwijderd]

heb je een oplossing die wel bedoelt is om een onderschrift aan een image te koppelen? Want da's het hele punt hier namelijk. Ik gooi wat opties in de groep, maar echt een consensus is er nog niet volgens mij. Om eerlijk te zijn weet ik het zelf ook niet zo goed, maar de <label> variant vind ik eigenlijk nog steeds de meest veelzeggende.

@Anne: wat is er mis met img en longdesc (dit is wel interessante leesstof veer mensen die denken: huh?)? hoort prima bij elkaar, alleen doet geen enkele UA er iets mee. En object wordt helemaal slecht ondersteund ([rml][ html] <object> ipv <img> is er een oplossing?[/rml]).

[ Voor 42% gewijzigd door Verwijderd op 02-12-2004 21:14 ]