Buenas prácticas en EPUB. Citas.

Como mencionamos en la Introducción a las Buenas prácticas en EPUB, un aspecto determinante de un eBook es el HTML/xHTML y la semántica aplicada a los elementos que componen el contenido.

Citas en eBooks

Usaremos una cita del libro La innovación pendiente de la sección Conclusiones que puede ser descargado gratis aquí:

Cita en 'La innovación pendiente'
Cita presente en el libro ‘La innovación pendiente’

La capacidad cognitiva (nos) permite identificar qué es cada elemento, asociarlos y darle un significado. Si tuviéramos que describir la imagen afirmaríamos que:

  • no está en español,
  • tiene un llamador a una nota,
  • la cita está en itálica y
  • que la misma corresponde a Roy Amara expresidente de una institución cuyo nombre está en inglés.

Nada nuevo ¿no? o si! Por el contrario, el dispositivo de lectura o la App de lectura interpreta que:

  • Hay dos párrafos,
  • el primero en itálica,
  • que estos dos párrafos están en español,
  • que el primero, contiene un link y texto elevado (superíndice).

Veamos la imagen nuevamente. Podríamos estar de acuerdo que es bastante diferente a lo que interpretamos pero por otra parte, la interpretación del dispositivo -aunque distinta- no esta mal tampoco.

¿Qué está pasando?

Existe una diferencia entre lo que se representa visualmente y lo que interpretamos nosotros ¿Qué está mal? ¿Cómo corregirlo para que sea adecuadamente interpretado? Veamos:

Primero veremos el código HTML del contenido que es lo que el dispositivo utiliza para representarlo visualmente:

Como referencia inicial, todo lo que está entre símbolos “<” y “>” corresponde a etiquetas, que  identifican, dan valor y sentido al contenido.

EJEMPLO:

<p><i>We tend to overestimate the effect of a technology in the short run and underestimate the effect in the long run</i><sup><a>33</a></sup>.</p>
<p>Roy Amara, expresidente del Institute for the Future</p>

NOTA:

  • <p> determina el inicio y </p> el fin de un párrafo.
  • <i> determina el inicio y </i> el fin de un contenido que se debe representar en itálica.
  • <sup> determina el inicio de texto en superíndice y </sup> el fin.
  • <a> indica un vinculo.

¿Cómo maquetar una cita?

Se debe hacer uso de las etiquetas apropiadas para definirla y darle valor a lo que luego se represente. Las etiquetas son contenedores que dan valor al contenido. Así, indican a los dispositivos con precisión qué tipo de contenido están representando y el valor del mismo dentro del documento y su relación con otros dentro del mismo.

Una cita entonces debe usar la etiqueta en bloque blockquote, que resumidamente, es un contenedor que indica con precisión que su contenido es una cita.

El texto de la misma debe ser etiquetado como un párrafo (<p>), pero se debe tener en cuenta que la firma de la cita debe estar contenida por la etiqueta <footer> que indica el pie de la cita y en vez de que el texto sea un párrafo, se debe utilizar la etiqueta <cite>.

Adicionalmente es relevante comentar que al párrafo que está en inglés se lo debe identificar con el atributo lang (si fuera XHTML, xml:lang) para indicar el idioma adecuado del contenido ya que para este documento, el idioma predeterminado está indicado como español ES (aunque podría ser por ejemplo, es-AR donde es, corresponde a Español, y AR, a Argentina si uno necesitara ser aún más específico seguramente comentemos esto en detalle en una  entrada futura).

De esta forma una cita adecuadamente desarrollada será:

<blockquote>
  <p><i>We tend to overestimate the effect of a technology in the short run and underestimate the effect in the long run</i><sup><a>33</a></sup>.</p>
  <footer>
    <cite>Roy Amara, expresidente del <span lang="en">Institute for the Future</span></cite>
  </footer>
<blockquote>

De hacerlo así, lo que estaremos indicando (al dispositivo) acerca del contenido y con adecuada precisión es que:

  1. hay un caja de bloque que contiene una cita (es decir, lo que está contenido en la etiqueta blockquote).
  2. Que el párrafo (entre etiquetas <p></p>) corresponde a la cita, que
    1. la cita está en inglés (lang="en"), que
    2. debe ser representada en itálica (<i></i>). Que
    3. hay una parte del texto (el llamador al pié de página) que necesitamos que visualmente esté elevado <sup></sup> -superindice- (será comentado en una entrada futura).
      1. que el texto elevado, tiene un vínculo.
  3. Dentro del <footer></footer> está el contenido del pie de la cita y con la etiqueta <cite>, quién firma la cita.
  4. a su vez, al nombre de la entidad a la que pertenece el autor de la cita, se le indica que está en otro idioma (inglés).

De esta forma le estaremos indicando al dispositivo con qué relación hay entre los diferentes elementos y la relevancia de estos para que la interpretación del contenido y su representación visual sea la adecuada.

Para futuras entradas:

Queda para futuras entrada:

  • Pies de página o notas al final adecuadamente.
  • Evitar que se separe en sílabas el contenido de la cita.
  • Definir idiomas adecuadamente (ISO 639-1).
  • Prefijo epub:type.

One Reply to “Buenas prácticas en EPUB. Citas.”

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *