a.css

esbudellant estàndards


Fil d'Ariadna

23/04/05

He afegit un fil d'Ariadna —en anglès Bread crumb— per tal d'intentar millorar la usabilitat d'a.css.

Per fer-ho he usat el connector Bread Crumb Trail Generator.

Això m'ha fet tornar-me a plantejar una qüestió de la que, ara per ara, no he trobat una solució satisfactoria.

Quin marcat, semanticament parlant, ha de tenir un fil d'Ariadna?

De moment hi he deixat el marcat original del connector, és a dir, un div amb enllaços separats per un caràcter (en aquest cas un »).

Seria millor un llistat ordenat (ol), o potser millor un llistat desordenat on cada ítem sigui un llistat ubicat dins de l'anterior per tal de mostrar la dependència?

Què n'opineu?

Actualment no s'usa cap fil d'ariadna en aquest blog.

  1. Comentat per torresburriel el 23/04/05

    La verdad es que yo he visto opiniones para todos los gustos. Desde la vertiente semántica el argumento que más me convence es que el breadcrumb ('migas de pan' en castellano) sería una lista desordenada anidada de forma recursiva. Es decir, un li dentro de otro, y de otro, etc, etc.

  2. Comentat per BenKo el 23/04/05

    Jo també pense el mateix. Crec que és millor posar els elements a una llista ul, anidats al "pare".

  3. Comentat per suy el 24/04/05

    La llista desordenada, està clar que no. El fil té un sentit, i un ordre, per tant no pots fer servir un element que ha de permetre canviar l'ordre.

    La llista amb ordre, o l'anidament de llistes, per mi totes dues són correctes, i pot ser dependria del cas concret. L'ordre de la llista, indicaria les pases que cal seguir desde la plana inicial per arribar a on ets.

    Les llistes anidades, donen una mica més de feina, però també tenen sentit. Jo les veig com si hagués agafat el marcat del mapa del lloc, i hagués tallat només el tros de marcat que té sentit en aquesta plana.

    Bé, tot això, segons la meva humil opinió, i tal. ;-)

  4. Comentat per are el 24/04/05

    La proposta d'una llista desordenada recursiva em sembla també la més interessant semanticament parlant però té el defecte de la quantitat de codi necessari.

    En canvi el codi de la llista ordenada és molt més comprimit tot i ser, des del meu punt de vista, tant semàntic.

    De moment usaré una llista ordenada ja que usar ul recursivament m'obliga a reprogramar el connector.

  5. Comentat per mini-d el 24/04/05

    Fer servir una llista ordenada seria algo aixis com: ol li pel primer pas, despres dintre del li començas amb un nou ol li. Una llista dintre d'una et quedaria algo aixi com: ol li ol li ol li i em semble molt horrible per formatejar

  6. Comentat per are el 25/04/05

    No, aquesta és la idea que comentava amb llistes desordenades (ul).
    Per les ordenades el codi quedaria ol li li. És a dir, una sola llista però ordenada.

  7. Comentat per torresburriel el 25/04/05

    Pero la cuestión, independientemente del trabajo que genere la anidacion de listas, es que lo semánticamente más adecuado es una lista anidada, ya que los elementos de nivel 1 contienen a los de nivel 2, de los que en el breadcrum mostramos sól uno, el activo (en el que nos encontramos)... y así sucesivamente, ¿no?

    Otra cosa es que, efectivamente, dan ganas de no hacer nada sólo de pensar en formatear esa lista ;-)

  8. Comentat per Albert el 25/04/05

    El problema es que actualment no tením una forma definida per a indicar aixó, i crec que es tindría que definir, ja que tenim un link rel="" per a mil coses, es tindría que treure alguna cosa semblant. I per simple coherencia tindría que ferse servir ol, no ul, i sense ser anidades, ja que en realitat tens una sola llista, on el mateix ordre de la llista (ol) et marca la "prioritat" de l'enlaç dos, respecte a al tres. No te sentit definir llistes anidades per a una jerarquia "plana", ya que aixo mateix es per al que serveix una ol.

    I perdo per les faltes, pero ja son molts anys fora de "casa" i sense practicar :(

  9. Comentat per Oriol el 25/04/05

    Abans de discutir com s'ha de codificar sintàcticament crec que s'hauria de discutir com ha d'actuar el fil.

    Actualment si entro a llegir un post el fil diu 'Portada - Títol post', si entro a una categoria apareix un 'Portada - Arxius - Títol categoria' (i el vincle a 'Arxius' em retorna un 404). Però a més, si dins d'un llistat de posts d'una categoria decideixo llegir un, el fil torna a dir-me 'Portada - títol post', quan entenc que hauria de retornar 'Portada - arxius - títol categoria - títol post', perquè entenc que el post està contingut dins d'una categoria a la que he accedit, no?

    Un cop dit això, crec que com que estem parlant d'elements continguts en d'altres elements el millor seria codificar-la mitjançant una llista desordenada amb subllistes recursives. On l'únic element de la primera llista (llista-pare) seria la portada.

  10. Comentat per mini-d el 25/04/05

    Creo que hi ha un malentès. Un breadcrum semànticament és una cadena d'herències, passos que un usuari deixa. Si ho representes amb una sola llista han de ser ordenada: 1, 2, 3, 4 passos. Ara aquesta forma linea potser no s'adapti semànticament, per això el plantejo quedaria: ol li d'aquest li s'hereta el següent pas.

  11. Comentat per are el 25/04/05

    @Oriol: Efectivament hi ha un error a l'hora de pintar la jerarquia del seti a.css. Això espero solucionar-ho aviat.

  12. Comentat per Oriol el 25/04/05

    mini-d, estic d'acord amb que la definició de breadcrumb és seguir el rastre de tot el que ha fet l'usuari, però amb coherència, no? Vull dir, si un usuari fa un recorregut:
    'Portada' - 'Lectura del post 1' -'Acces al post 2 a través de "llegir següent post' - 'Accés a informació sobre el web' - 'Accés a contactar' - i finalment 'Torna a portada' i 'accedeix a una categoria'. Tot i que l'usuari ha fet 'tropocientos' passo per accedir per exemple a l'informació sobre el web, no és necessari mostrar-los tots.

    Cal entendre el 'BreadCrumb' com un arbre del contingut d'un lloc web ('portada' - 'categoria' - 'post' ) o bé com un 'log' dels accesos de l'usuari ('portada'-'post1'-'post2'-'categoria' (per exemple))?


© Arnau Siches. a.css està sota Llicència Creative Commons.