Poner citas en HTML

19/Dic/2006 HTML 3 Comentarios

En HTML tenemos dos formas de poner citas. Es decir, hacer referencia a textos que se han dicho por otros. Para ello el lenguaje HTML nos ofrece los elementos Q y BLOCKQUOTE.

La principal diferencia entre estos elementos es que Q nos sirve para citas pequeñas y que van en la propia línea de texto, mientras que BLOCKQUOTE se utiliza para citas largas, las cuales requieren de un salto de parrafo.

Su uso es muy sencillo, ya que nos bastará con poner la cita entre los elementos de inicio y fin. De esta forma una cita corta nos quedará de la siguiente forma:

  1. El ponente se refirio a Internet como <q>una red de redes</q>.

Su resultado será:
El ponente se refirio a Internet como una red de redes.

Mientras que para el caso de las citas largas se utilizará de la siguiente forma:

  1. <blockquote>Y es que hoy en día conocemos a Internet como la red de redes, en la cual podemos encontrar...<blockquote>

Su resultado será (los estilos de mi theme de WorPress lo van a cambiar):

Y es que hoy en día conocemos a Internet como la red de redes, en la cual podemos encontrar...

En cuanto a los atributos de estas etiquetas, a parte de los estandares (id, class, lang,...), tenemos el atributo cite, el cual espera una URI con la dirección donde se encuentra la cita. De esta forma la línea e código quedará de la siguiente forma:

  1. El ponente se refirio a Internet como <q cite="http://www.lineadecodigo.com/ponentes/ldc/">una red de redes</q>;.

o

  1. <blockquote cite="http://www.lineadecodigo.com/ponentes/ldc/">Y es que hoy en día conocemos a Internet como la red de redes, en la cual podemos encontrar...</blockquote>.

Renderizando los elementos...
Los agentes renderizan estos elementos de diferente forma. Pero, a grandes rasgos, podemos decir que el elemento <Q> lo renderizan incluyendo comillas al principio y final de la cita. Es por ello que no necesitamos ponerlas en nuestro texto.

Por otro lado el elemento BLOCKQUOTE suele ser presentado en un bloque identado.

Veamos como queda esto en FireFox, Internet Explorer y Opera:

Quote en FireFox

Quote en Internet Explorer

Quote en Opera

Como podemos ver Internet Explorer (en nuestro caso el 6), no pone las comillas a la cita del elemento <Q>. 🙁

El problema del BLOCKQUOTE...
Uno de los problemas que nos encontramos con el elemento BLOCKQUOTE es que históricamente ha sido utilizado para identar texto. Sobre todo antes de que apareciesen las hojas de estilo. Es por ello que los agentes no insertan comillas. De una forma u otra hay que asegurar la compatibilidad.

En estos casos podemos apoyarnos en las hojas de estilos CSS para corregir este "defecto".

Vídeos sobre HTML


Difunde el Conocimiento

Si te ha gustado el artículo o te ha sido de utilidad, no dejes de compartirlo con tus amigos en las redes sociales... Te estaremos muy agradecidos. :-D

3 comentarios en “Poner citas en HTML”

Víctor Cuervo

Antonio

Buena información no recordaba como citar en html y quería evitar que las frases celebres o los libros de un autor se consideren contenido duplicado. Si te apetece puedes visitar uno de mis sitios referente a libros donde empleo las etiquetas aquí descriptas.

Víctor Cuervo

Samael

Tengo un blog en WordPress desde hace tiempo, comenzaré a usar Citas, ¡gracias por esto!

Víctor Cuervo

antonio

si me gusta el sistema

¿Algo que nos quieras comentar?

Déjanos tu comentario, no te preocupes que tu email no será publicado

*

*