Fronteers — vakvereniging voor front-end developers

Webrichtlijn 36: Volgorde van belangrijkheid

Zet de inhoud van de pagina in de HTML broncode op volgorde van belangrijkheid. (R-pd.6.2)

Discussiëren maar! Ik zeg 'ns niets voor een keer :)

Reacties

1 Kor Dwarshuis op 28-05-2008 om 09:27 uur:
Ik wilde hier graag 3 dingen over zeggen:

1: Ik heb in een situatie gezeten waar een combinatie van de wens van een opdrachtgever, en het design van de grafisch ontwerpers het niet toelieten om een source ordered constructie te verkrijgen. Ik heb ze geloof ik allemaal geprobeerd: http://css-discuss.incutio.com/?page=ThreeColumnLayouts

2: Ik las ergens een artikel (kan link niet meer vinden) waarin gesteld wordt dat juist omdat de meeste screenreader-gebruikers inmiddels verwachten dat het menu het eerst voorgelezen wordt, je juist niet meer de hoofdcontent als eerste zou moeten plaatsen.

3: Wat is eigenlijk "belangrijk"?
2 Raph de Rooij op 28-05-2008 om 12:12 uur:
Op dit moment wordt zelfs in het normdocument webrichtlijnen (zie www.drempelvrij.nl/webrichtlijnen) niet expliciet gemaakt wat 'volgorde van belangrijkheid' precies inhoudt.
Bij de beschrijving staat:
"When setting up the content of a page, it is advisable to place the content in order of importance in the HTML. This means important content first and the least important content (such as navigation) at the bottom of the page. Placing content on the page displayed is done using CSS; the visual layout need not be the same as the structure. Structuring the content in this way increases the traceability, accessibility and usability of the information."

Er wordt vanuit gegaan dat content die op (vrijwel) elke pagina op de site voorkomt de minst belangrijke content is. Doorgaans zal dit wel waar zijn, maar als je een goed argument hebt om ervan af te wijken, dan kan dat m.i. niet zonder meer fout worden gerekend. Sterker nog: op veel homepages is de navigatie toch echt de belangrijkste content...

Ik ben bekend met het argument dat gebruikers van screenreaders verwachten dat de navigatie op een site bovenaan staat je de navigatie om die reden bovenaan moet zetten. Met dat argument ben ik het niet eens: je verheft daarmee middelmaat tot norm. Wel is van belang, zeker voor gebruikers van screenreasders, om op de juiste plaatsen in een HTML-pagina skiplinks te gebruiken. Er is geen webrichtlijn waarin het expliciet wordt voorgeschreven; richtlijn 8.12 gaat er deels over.

Wanneer je bovenaan de pagina een skiplink opneemt die naar het navigatiemenu leidt, dan is het naar mijn mening geen enkel probleem om de navigatie op een pagina onderaan te zetten, zelfs niet voor gebruikers van screenreaders.

Overigens zijn skiplinks ook een uitkomst voor gebruikers die niet met een muis, maar met de TAB-toets navigeren. Die gebruikers worden nu vaak niet geholpen omdat de skiplinks in de CSS (@screen) als waarde

visibility:hidden;
display:none

toebedeeld krijgen.
Wanneer je dat vervangt door

position:absolute;
left:-999em;

en ze binnen het venster 'trekt' als ze de focus krijgen, dan is ook deze groep geholpen. Want met name voor de TAB-gebruikers kan het heel verwarrend zijn om niet bij het menu uit te kunnen komen, terwijl ze zien dat het gewoon bovenaan staat. Probeer het zelf maar eens uit...

Uiteraard is het ook mogelijk om hiervoor het tabindex attribuut te gebruiken, maar persoonlijk vermijd ik dit attribuut liever, omdat het te gemakkelijk tot complicaties kan leiden.
3 Jorik op 28-05-2008 om 12:18 uur:
Ik vind het een raar punt, wanneer je slechtziend bent en je een pagina laat voorlezen terwijl je zelf mee kijkt, dan wordt het dus helemaal anders voorgelezen dan dat het op het scherm getoont wordt.

Ook is het in strijd met de regels van drempelvrij geloof ik, omdat zij dus het bovenstaande punt stellen, dat je de inhoud zelfde als presentatie moet hebben.
4 Kor Dwarshuis op 28-05-2008 om 13:16 uur:
@Raph: ik was aanwezig bij het verhaal van Linda Nieuwenhijzen en Kamiel Wanrooij van Everyweb Solutions, waar gesteld werd dat het gebruik van left:-999em; juist een slechte praktijk is.

Ik dacht dat ik toen de logica daarachter begreep, maar nu ben ik die weer kwijt :-(

Misschien dat er iemand is die nog weet hoe dit precies zat, want de afgelopen dagen zat ik hierover na te denken, en ik kwam er niet uit.
5 Krijn op 28-05-2008 om 13:37 uur:
@Kor: dat ging over hema.nl en het feit je met de tab toets door alle 'verborgen' items moet lopen. Zodra één van de hoofditems de focus krijgt, moet eigenlijk het onderliggende menu getoond worden (hoewel je er dan nog doorheen moet tabben, maar dan zie je in ieder geval wat er gebeurt).

Ze gebruiken nu .h-topnav li:hover div, .h-topnav li.over div { left: -1px; }. Aangezien de li geen focus kan krijgen, moet hier dus, om het toegankelijk te maken, JavaScript toegevoegd worden.. Best apart eigenlijk..

Commentaarregels in http://www.hema.nl/css/hema.css zijn trouwens wel grappig :p
6 Kor Dwarshuis op 28-05-2008 om 13:54 uur:
@Krijn: ik ga even #bos {left:-999em;) zodat ik de bomen weer kan zien :-)

Ik herinner me dat het over de Visio website ging, maar ik begin dingen door elkaar te halen vermoed ik en ik ga die HEMA site eens even bekijken.

Eerst een fietstochtje, dat zal helpen denk ik.
7 Krijn op 28-05-2008 om 14:01 uur:
Bij Visio NL was het probleem dat met een skiplink het eventuele submenu wordt overgeslagen. Er is geen skiplink naar het submenu, en er wordt verder ook nergens gemeld dat er überhaupt een submenu is. Kun je alleen 'zien' als je het hoofdmenu weer doorloopt.
8 Sander A op 28-05-2008 om 15:31 uur:
Na meerdere malen -999px hier te hebben gelezen wil ik toch iedereen aanraden om daar -9999px van te maken. Met de huidige resoluties wil -999px namelijk nog weleens te weinig zijn, zeker als het referentiepunt zich ergens aan rechts in de site bevindt.
9 Sander A op 28-05-2008 om 15:32 uur:
hmm, beetje kromme zin...
10 Krijn op 28-05-2008 om 15:33 uur:
@Sander A: jij bent de eerste die over -999px begint hoor ;)
11 Blaise Kal op 28-05-2008 om 16:56 uur:
-999em kan ook nog.

Ik ben het verder eens met Raph, en hou ongeveer dezelfde werkwijze aan.

Tabindex gebruik ik nooit, dat leidt tot rare situaties en maakt je site moeilijk up te daten.
12 Kor Dwarshuis op 28-05-2008 om 18:18 uur:
@krijn: dank! Ik heb het op een rijtje.
13 Koen Willems op 28-05-2008 om 20:27 uur:
De resultaten van een onderzoek over deze materue is hier te vinden: http://www.usability.com.au/resources/source-order.cfm
De conclusies zijn op zich helder, wat overigens niet weg neemt, - dat ben ik met Raph eens-, dat je daarom NIET je navigatiemenu maar als eerste op je pagina moet zetten.

Overigens vind ik het vermijden van de tabindex geen optie. Sterker nog: die zou je juist moeten gebruiken, tenzij je kiest voor een design met kolommen en je je navigatie in de rechterkolom stopt (zie bijvoorbeeld http://www.accessites.org)

Het lijkt mij tenminste voor de hand te liggen dat de tabindices het design van de pagina volgen. Andere meningen daarover hoor ik graag.

Overigens, ik zie dat hier eenzijdig de aanduiding 'skiplink' wordt gebruikt.
Graag maak ik onderscheid tussen een 'skiplink', waarmee een bepaald gedeelte overgeslagen kan worden en een 'jumplink', waarmee naar een bepaald onderdeel toe gesprongen kan worden.
14 Krijn op 29-05-2008 om 00:00 uur:
Skiplinks, jumplinks, Koenlinks, whatever. Volgens mij komt het allemaal op hetzelfde neer: dat je van een bepaalde plek in een document naar een andere plek in dat document springt :)

Overigens ben ik een Opera gebruiker en is spatial navigation echt een prettige uitvinding. Tegen problemen met tabben loop ik dus niet zo snel aan. Maar volgens mij werkt het hier op fronteers.nl ook niet zo lekker als je tabt. Is de volgorde van belangrijk hier wel okay gedaan? En is het logisch dat het 'rechtermenu' in de bron boven het hoofdmenu staat? En hoe is dit, indien nodig, met tabindex="" netjes op te lossen?

En volgende week ga ik weer gewoon een lege post online zetten. Stukken beter voor de discussie! ;)
15 Sander A op 29-05-2008 om 02:12 uur:
@Krijn: zie nu inderdaad pas dat het em was i.p.v. px ;-)
16 Kor Dwarshuis op 29-05-2008 om 12:21 uur:
@krijn: ik zou voorzichtig willen stellen dat het feit dat het submenu in de bron boven het hoofdmenu staat juist het probleem zoals je in reactie #7 beschrijft voorkomt.
17 Nick op 07-12-2009 om 15:37 uur:
Ikzelf probeer altijd te bouwen op basis van belangrijkheid, en waar nodig gebruiken we skiplinks.

Wat we me alleen een beetje zorgen geeft is het positioneren van elementen buiten het scherm. Ik ben benieuwd hoe de zoekmachines er tegenwoordig mee om gaan en/of ze dit niet als spam zien tegenwoordig?? Denk hieraan aan structural labels, skiplinks enz. Meestal probeer ik dit zelf zoveel mogenlijk te vermijden. Kwa usability is dit toch fijn voor mensen met screenreaders.
18 Nick op 01-04-2010 om 00:48 uur:
Ik begin het de latste tijd toch wat minder belangrijk vinden en wat achterhaald...

Zit met de vraag waarom? wat is nou echt het nut, zouden mensen met screenreaders nou echt de content direct bovenaan verwachten?

Ik heb hier een daar wel gehoord dat het SEO wise ook beter zou zijn maar of dit waar is? Google enz is natuurlijk een black box en SEO is helemaal achterhaald... iedereen gokt maar iets volgens mij.
Plaats een reactie