O arte de enlazar páxinas

Alegoría do enlace correcto (dúas mans enlazadas pintadas co mapa mundi).[D-416-1]

Nota: a xente gusta dos decálogos, e eu, ala! para seres diferente, irei por ducias. (Non vos asustedes que ao longo do artigo comprenderedes o xogo iste).

Se hai algo que caracteriza a Internet é ista cousa de poder viaxar, perdón, navegar dunha páxina a outra grazas aos enlaces* que hai nelas indo dun sitio para outro con vento en popa. Pero (sempre aparece algún pero) non somos tan bos grumetes como creemos e, ás veces, poderían chamarnos malos náufragos.

Non nos decatamos de que un mal deseño pode frustrar a navegación de moitos usuarios: por ter algunha discapacidade, pola súa inexperiencia, pola saturación do seu ancho de banda, ou porque (e isto é o terrible) o deseñamos tan mal que nin nós mesmos somos quen de saír do disparate. Así que hoxe toca pórse as pilas e repasar istas cousas que parecen evidentes pero que na práctica non o son tanto, ou que as temos desatendidas. Imos aló.

Alegoría da navegación coa foto dunha barca.[D-416-2]

Sobre cómo redactar e colocar os enlaces

O que nunca deberiamos facer

Todo o mundo cree que colocar istes enlaces é moi doado porque se poden colocar de calquera xeito, a esgallo e, como auténticos elefantes nunha cacharrería, esnaquizamos toda posibilidade de que o noso material poida ser accesible. Imaxina por un momento que tes os ollos vendados e que unha voz metálica vai ler para ti os seguintes enlaces dunha páxina de Internet nun ordenador que non ten rato e tes que gobernar co teclado:

  1. Pincha aquí para escoitar as noticias e, aquí para voltar á páxina principal.
  2. Fai clic co rato no botón azul para ver a nosa opinión.
  3. Pincha neste botón ou neste outro para ir á noticia.
  4. Pincha no número impar dun só díxito que ten raíz cadrada exacta.
  5. Cliquea na noticia sobre o desastre acontecido no día de onte no que morreron 89 persoas de accidente de tráfico por mor do mal estado do tráfico desta pasada fin de semana para ler a noticia.
  6. Temos varias sorpresas para ti.
  7. Cando o enlace se poña amarelo fai clic sobre el para darche unha pista do problema.
  8. Se non ves o noso menú de navegación, tes que instalar iste programa.
  9. Percorre toda a nosa web para acceder aos nosos enlaces.
  10. Fai clic na pelota saltarina para acceder ao noso menú.
  11. Alumn@s e profesor@s saúdanche nesta páxina.
  12. Dispós de 3 segundos para acceder á seguinte listaxe.

O que sempre debemos facer

¿Conclusións? É doado chegar a elas aquí as indicamos e engadimos algunhas máis:

  1. Para garantir a accesibilidade:
    1. Non pode haber varios enlaces con texto diferente para ir a mesma páxina.
    2. Non pode haber varios enlaces con texto igual para ir a páxinas diferentes.
    3. Non se pode usar a cor para discriminar uns enlaces doutros.
    4. Non pode haber dous enlaces consecutivos sen alomenos un carácter imprimible que os separe.
    5. Non se pode condicionar o funcionamento dos enlaces á preinstalación de programas adicionais.
    6. O enlace debe abrirse na mesma fiestra e non noutra. En caso contrario (desaconsellable) débese advertir.
    7. Comprobar antes de editar que todos os enlaces funcionan correctamente.
    8. Os enlaces ás partes máis significativas para axudar á navegación deben poder activarse con atallos de teclado.
    9. Verificar a ortografía de todo o texto, tamén do texto do enlace para unha correcta lectura automática.
    10. Evitar cousas como alumn@s impronunciables por un axente automático.
    11. Revise a sintaxe HTML para que sexa correctamente recoñecido por calquera axente automático.
    12. As cores e os brilos dos enlaces deben seguir uns mínimos para ser diferenciados. Non uses pestanexos.
  2. Para acadar usabilidade:
    1. Ni moitos nin poucos enlaces: só o que poder ser de utilidade e non o que che gustaría a ti.
    2. Débese redactar o artigo de xeito que os enlaces non entorpezan a lectura.
    3. Elixir textos: significativos, sinxelos e curtos para os textos dos enlaces.
    4. O lector debe coñecer a información á que vai acceder antes de saltar, así decidirá con liberdade.
    5. Os enlaces modifican a énfase da frase: evite distraer a atención.
    6. Sempre o mesmo estilo en toda a páxina e en toda a web (cores, deseños e aparencias dos enlaces).
    7. Non tomes decisións por ninguén, o usuario é quen debe decidir, dalle a información axeitada.
    8. É interesante xuntar os enlaces ao final do artigo (equivalente ás notas a pé de páxina).
    9. Se usas texto explicativo no lugar do enderezo como texto de enlace, non se vería impreso.
    10. Non atrapes ao usuario na túa web, estás para servir, non para ser admirado.
    11. Cando o enlace é a un documento que non é unha paxina web, senón outro formato, débelo advertir.
    12. Non é importante diferenciar que enlaces visitou e cales non. O que lle importa a el e se os lembra ou non.

Alegoría da fontanería das páxinas de internet, todos ises incómodos códigos.[D-416-3]

Sobre como é a fontanería dun enlace web

Xa sei que, chegado aquí, moitos tiran para atrás, por aquelo de que andar coa fontanería HTML para acadar unha correcta redacción dun enlace pode ser demasiado para o corpo. O normal é que os actuais editores de páxinas web e o das plataformas para servidores de contidos como as bitácoras, nos piden os datos necesarios e saben compoñer unha redacción correcta, pero non sempre é así, especialmente en cousas que se lles escapan a todos, como por exemplo cando a páxina á que se enlaza está escrita noutro idioma (cousa que debe ser advertida dende a nosa) e delicadezas semellantes que nos poden parecer iso, delicadezas, cando na realidade poden ser feitos fundamentais para certo tipo de usuarios. Así pois imos aló:

Un exemplo do código

Páxina web deste famoso congreso: <a href="http://congreso.tecnoneet.org" hreflang="es" lang="es" xml:lang= "es" title="Enlace a páxina web do congreso Tecnoneet.">congreso.tecnoneet.org</a>

Como se vería ise código

Páxina web deste famoso congreso: congreso.tecnoneet.org

Análise do exemplo anterior

  1. Páxina web deste famoso congreso:
    É a parte anunciadora do enlace: concisa, sinxela, directa, breve…
  2. <a href="http://congreso.tecnoneet.org"
    Comeza o código do enlace propiamente dito co enderezo.
  3. hreflang="es" lang="es" xml:lang= "es"
    Aquí anotamos cal é o código do idioma no que está escrita a páxina á que estamos facendo o enlace. Elemento imprescindible sempre que o noso idioma sexa distinto do idioma ao que apuntamos(**).
  4. title="Enlace a páxina web do congreso Tecnoneet."
    Mediante esta etiqueta explicamos brevemente ás visitas a qué páxina estamos enlazando. Elemento imprescindible.
  5. >congreso.tecnoneet.org</a>
    O texto aí pechado será o texto visible do noso enlace e o que aparecerá escrito se a visita imprime a páxina.

Epílogo

Se vos fixades, isto non é unha complexa e estrana compoñenda química de estranos procedementos. É xusto o contrario, seguir ao menos común de todos os sentidos: o sentido común.

Nalgún sitio vin escrito algo así como Sería imposible vivir lembrando todo canto nos acontece na vida. A habilidade está en elixir axeitadamente o que debemos esquecer. Non esquezamos aos de sempre, fagamos disto algo lúcido non engadindo anos á vida, senón vida aos anos.

Graciñas por aguantar a iste chumbo de Juan.

Enlaces e materiais de interese

  • (*) Eu nunca direi link prefiro enlace ou ligazón (É máis noso, máis natural, máis de seu).
  • (**) Para saber o código de idioma que corresponde a cada caso, pódese consultar na seguinte páxina: www.psicobyte.com/html/idiomas.html
  • Páxina web deste famoso congreso: congreso.tecnoneet.org
  • Este artigo en español: www.opentrad.org/tradurl.php…