PDD Tuning #4
PDD Tuning

¡Estamos aquí de nuevo, PDD tuneros! La semana pasada tenía planeado hacer imágenes e hipervínculos hoy. Sin embargo, cuando he terminado el artículo he pensado "mejor dejamos las imágenes para la próxima entrega...". Lo digo porque me ha quedad un poco denso, pero es que ya os dije que eran dos etiquetas con chicha. Así que nada, despacito y buena letra.

Usando el HTML III

Hipervínculos

En los tiempos que corren, todo el mundo sabe lo que es un hipervínculo puesto que es algo que forma parte de nuestra vida cotidiana. Sin embargo, si nos referimos al HTML, esconden bastantes secretos. Pues bien, la etiqueta requiere finalizador y admite varios parámetros:

  • href: Significa "Referencia HTML o Referncia URL". Es el más importante. Sin él el enlace jamás funcionará. El valor que toma es la dirección URL de la página, imagen,... o cualquier tipo de archivo que queremos linkear. Para saber la URL de aquello que queremos poner en nuestro link, pulsamos encima de la página, imagen,... con el botón derecho del ratón y seleccionamos "propiedades (si usas IE) o "Ver información de la página" (si usas Firefox). Ahí ya aparece la dirección y la podemos copiar normalmente.
    Con href tambin se pueden poner enlaces a direcciones de correro electrónico, y la PDD lo admite sin problemas. Tan sólo hay que poner como valor mailto:dirección_email@loquesea.com, poniendo, claro está la dirección que nosotros queramos.
    Otra utilidad de href son los vnculos internos o "a un marcador". El ejemplo más típico son los famosos links de "volver arriba" o abajo, o a donde sea. Para poder usar los enlaces de esta manera, deberos usar marcadores (más abajo explico su sintaxis y su forma de uso).
  • title: este parámetro sirve para añadir una descripción o un comentario sobre el enlace. Funciona de manera similar al texto substitutivo de una imagen (dentro de un rato veremos qué es eso), de manera que cuando uno deja el raton sobre el enlace durante unos instantes, aparece un recuadro flotante con el valor que le hayamos dado. El valor no es más que el texto que queremos que se lea.
  • target: es una parámetro que muy pocos conocen pero que es muy útil. Sirve para elegir el destino donde se va a abrir la página enlazada. Se utiliza sobretodo para abrir páginas en una nueva ventana. Seguro que os ha ocurrido más de una vez que, pinchando en un enlace de alguna PDD, la página se os abre en la misma ventana donde teníais abierto Managerzone, y luego todo son líos de volver atrás y volverse a loguear y cosas por el estilo. Con target podemos evitar esto. Los valores que admite son varios, pero tan sólo nos será útil "_blank", con la barra baja incluida para que funcione. El resto de valores están destinados para el uso de frames en páginas web (esto sólo como curiosidad :P).
  • id ó name: Ambos se usan de la misma manera (pese a que no son lo mismo, aunque poco nos importa para la PDD) y sirven para crear marcadores en el documento. Los maracdores son como un punto de libro y nos señalan un punto concreto. Usan la misma etiqueta que los enlaces pero sin href. Además, son invisibles; el navegador no los muestra por pantalla, por lo que se pueden poner en cualquier parte del código sin importar como quedaría si se viera.
    Cuando pulsamos sobre un vínculo interno, el navegador nos llevará hasta el lugar de la página donde hemos colocado el marcador.

En el HTML convencional, la etiqueta <a> admite otros tantos parámetros, pero para la PDD no tienen ninguna utilidad.

Los típicos ejemplos los haremos hoy diferenciando entre los tipos de enlaces que hemos visto:

Enlaces "convencionales"

<a href="http://miarroba.com/libros/leer.php?id=156409" title="Deja aquí tus dudas y comentarios" target="_blank">El Guestbook de PDD Tuning</a>

El Guestbook de PDD Tuning

Enlaces de correo electrónico

<a href="mailto:dj_wisy@managerzone.com" title="Mándame tus dudas y comentarios">e-mail de dudas</a>

e-mail de dudas

Enlaces internos y marcadores

Para usar enlaces internos necesitaremos dos elementos: el enlace, semejante al "convencional", y el marcador. El marcador, puesto que es invisible, os digo que yo lo he colocado al principio del articulo, de manera que haré un enlace de esos de "volver arriba".

Etiqueta del marcador (aquí no necesita finalizador):

<a name="top">

Etiqueta del enlace que apunta al marcador (¡no olvides la almohadilla!):

<a href="#top">Volver Arriba</a>

Volver Arriba


En fin, nada más por hoy. Nos vemos la semana que viene hablando sobre las imágenes. Algo que para muchos es la clave en una buena PDD.

Artículos anteriores: #1 #2 #3

Escribir en el Guestbook         Mandar un mail

¡FELIZ NAVIDAD !

1 2 3 4 5 6 7 8 9