Literatura en dA.
Primeros pasos para gestión de textos.
Algunos apuntes para su personalización
y tratamiento estético.

     Hasta hace algún tiempo no había oído hablar del lenguaje HTLM ni sabía como subir, escribir y tratar una desviación literaria o un texto en deviantART. Os paso algunas consideraciones para quién, como yo, empieza de cero pero no le gusta la creación de páginas con el texto "amontonado".
     Me referiré a las etiquetas HTML para su uso en devs de contenido literario y textos en general. Otras etiquetas de uso más habitual, para elaboración de listados o indicación de links, users, avatares, etc. para Journals o comentarios podéis encontrarlas aquí: «Códigos HTML Básicos en dA»

---

Subiendo desviación de texto

     Accedemos a Submit Art - Titulamos - Categorizamos - Add text. Podemos comenzar a escribir. El título y el autor se generan automáticamente en el texto definitivo, no debemos repetirlo aquí.

Subtítulo:

     Sí puede ser interesante la inclusión de un subtítulo o coletilla explicativa. Para ello utilizaremos la etiqueta o tag para títulos (<h> </h>), recordando cerrarlo después. También es válido para elegir tamaños para el visionado del texto.
     Ejemplo: Escribiendo <h1>Literatura en dA</h1> deviantART lo mostrará como:

Literatura en dA

     Utilizaremos las etiquetas <hn> </hn> donde n= 1...6 indica el tamaño. Y debemos tener en cuenta que es una herramienta para títulos, así que generará nuevas líneas tanto al abrir, como al cerrar el tag y una línea en blanco también tras cerrarlo.
     Este es su efecto:

<h1>Literatura en dA</h1>

Literatura en dA

<h2>Literatura en dA</h2>

Literatura en dA

<h3>Literatura en dA</h3>

Literatura en dA

<h4>Literatura en dA</h4>

Literatura en dA

<h5>Literatura en dA</h5>

Literatura en dA

<h6>Literatura en dA</h6>

Literatura en dA

Tamaño de texto:

     De forma similar podemos habilitar la etiqueta para tamaño de texto. En este caso utilizaremos las etiquetas <font size="n"> </font> donde n= 1...7 indica el tamaño a visionar. La progresión es la contraria a la etiqueta de títulos (7 es el mayor tamaño), tiene más variantes y no genera nueva línea tras abrir o cerrar el tag como hace la etiqueta para títulos (aquí el cambio de línea lo hemos indicado mediante la tecla return):

deviantARTdeviantART
deviantARTdeviantART
deviantARTdeviantART
deviantARTdeviantART
deviantARTdeviantART
deviantARTdeviantART
deviantARTdeviantART

---

Las fuentes

     Si queremos trabajar con alguna fuente diferente a la suministrada por defecto (Verdana), deberemos utilizar las etiquetas <font face="..."> y, </font>, para cerrar; indicando entre las comillas la fuente elegida: Arial, Courier New, Stencil Std, Tahoma, etc.

     Estas deben ser fuentes comunes, las llamadas Safe Web Fonts. Nada impide utilizar otras, pero debéis tener en cuenta que los resultados variarán en función del navegador, el sistema operativo o la propia antigüedad del sistema de cada posible lector. Las fuentes que tenéis descargadas no serán visibles para otros lectores y verán la de defecto, distorsionando vuestra percepción "gráfica". Para evitarlo, y que todos los ordenadores visualicen el trabajo tal y como se presenta, se utilizan las Safe Web Fonts.

     Este es el listado completo y actualizado que podemos utilizar:

Arial
Arial Black
Arial Narrow
Book Antiqua
Century
Century Gothic
Comic Sans MS
Courier
Courier New
Franklin Gothic Medium
Garamond
Georgia
Haettenschweller
Impact
Lucida Console
Lucida Sans Unicode
Microsoft Sans Serif
Monotype Corsiva
Modern
MS, Reference, sans-Serif
Palatino Linotype
Sans Serif
Serif
Small fonts
Stencil Std
Sylfaen
Tahoma
Tempus Sans ITC
Terminal
Times New Roman
Trebuchet MS
Verdana
Viner Hand ITC
Vladimir Script

---

El resalte

    En trabajos literarios el uso combinado de diversas fuentes no tiene mucho sentido, pero pueden utilizarse otras opciones tipográficas para enfatizar o discriminar partes de un texto, indicando reflexiones, diálogos, etc. Estas son:

- Cursivas: se generan entre las etiquetas <i> e </i>
- Negritas: se generan entre las etiquetas <b> y </b>

     Otras etiquetas de resalte, aunque no literarias, son:

- Subrayado: entre las etiquetas <u> y </u>
- Teletipo: entre las etiquetas <tt> y </tt>
- Tachado: entre las etiquetas <s> y </s>

Todas ellas pueden combinarse entre sí.
(Aquí teletipo subrayado y en cursiva, sumando etiquetas: <i><u><tt>...</tt></u></i>)

     Comillas latinas: Otra opción de resalte de textos puede ser el uso de las «comillas anguladas o latinas», actualmente en desuso frente a las "comillas altas o inglesas", de utilización directa en teclado. Para habilitarlas deberemos gestionar o escribir la serie &laquo; («) para abrirlas y &raquo; (») para cerrarlas. También podéis utilizar la opción del copy&paste, claro, copiando directamente el símbolo. Por ejemplo, desde este mismo tutorial.

---

Gestión de espacios

      El lenguaje de hipertexto o HTML no siempre interpreta como nosotros el espacio de escritura. Para gestionarlo disponemos de varias opciones:

      - Las líneas: deviantART tiene habilitada la función habitual de la tecla "return" para escritura, no obstante, señalaremos las etiquetas de línea para creación Web que también están activas aquí. Estas son:

      - Cambio de línea: Simplemente, tecleamos el código <br> y la próxima palabra comenzará en la línea siguiente. (Obviamente he trampeado las etiquetas HTML para que se vean los códigos pero no su resultado)

      - Nuevo párrafo: Tecleando <p> la siguiente palabra comenzará en un nuevo párrafo dejando una línea en blanco entre ambos.

     - Sangrado de textos: La sangría es una especie de margen que creamos a ambos lados de un texto. En dA nos genera párrafos definidos e independientes del texto anterior y con una indicación gráfica en forma de línea vertical. Para el sangrado de textos utilizamos la etiqueta de citas o <blockquote> y su cierre </blockquote>. Aquí vemos su resultado:

    Acabando un párrafo con el tag <blockquote>, el HTML nos genera un nuevo párrafo alejado del margen y con una línea en blanco entre el anterior.

    Podemos repetirlo obteniendo un efecto de cascada. Tan sólo debemos recordar cerrar la etiqueta con </blockquote> tantas veces como la abrimos para volver a la línea de margen primitiva. En este caso escribiríamos la etiqueta de cierre en dos ocasiones al finalizar este párrafo. Las etiquetas de citas generan también una línea en blanco al abrir y al cerrar.
    Si no nos interesan esas líneas en blanco o las generadas por <hn>, etc., podemos desactivarlas mediante el tag </br>. Con él evitaremos la línea en blanco generada automáticamente.

     - Guión largo: Utilizado para una mejor diferenciación de los diálogos, el guión largo (—) lo obtenemos tecleando la serie &mdash;. Para la utilización de las etiquetas especiales del sistema HTML, siempre entre los símbolos (& ;), es recomendable la utilización de procedimientos nemotécnicos o hacerse con un listado de símbolos para copypastear. Puede resultar algo engorroso, pero su resultado es óptimo.


     - Línea horizontal: Otra función HTML relacionada con el espacio de escritura y que podemos usar es la línea horizontal que podéis observar en este tutorial. Para incluirla utilizamos el código <hr> que, precedido o seguido por el uso de la tecla retorno generará también líneas en blanco a nuestro criterio. No necesita etiqueta de cierre.

     En literatura <hr> podría ser utilizado, por ejemplo, para diferenciar trabajos en un compendio de poemas o en una selección de relatos cortos dentro de un mismo documento. Esto es <hr>:
↓

---

La portada

     Podemos personalizar nuestro texto colocando una fotografía, dibujo o rótulo alusivo al mismo a modo de "portada". Esto puede dar información a los lectores sobre lo tratado y animar a su lectura y/o hacer que tus desviaciones sean reconocidas entre las demás. Existen varias opciones para personalizar visualmente nuestros escritos:

     AUTHOR TAG:

     Al subir un texto HTML observamos que en la miniatura animada aparece una etiqueta general en la que leemos Literature. Es posible personalizar esta etiqueta para que se reconozcan nuestros trabajos entre otros muchos.

     Para ello debemos preparar una imagen, rótulo, etc. con unas dimensiones de 20 x 125 pixels. Por su pequeña extensión es recomendable sea un dibujo con bastante colorido o, al menos, contrastado. Una rotulación propia puede ser perfecta también. Lo más sencillo es tomar una imagen que nos agrade y recortarla en Photoshop con esas dimensiones o crear un logo con ese tamaño.

    Este Author tag funciona como un avatar; todas nuestras desviaciones en HTML lo llevarán.

     Para realizarlo acercamos el cursor a nuestro nombre en dA y activamos Settings - Public Identity. Una vez allí, en Literature Author Tag damos a Change Author Tag - Add a file, subimos la imagen que teníamos preparada y aceptamos: OK - Cambios salvados - OK.

     MINIATURA y/o ENCABEZAMIENTO:

     DeviantART permite acompañar los escritos HTML con una imagen. Para ello, cuando tengamos el texto listo y al aceptarlo nos envíe de nuevo a la página de Submit Art, accedemos al botón Choose de la opción Preview y elegimos una imagen de nuestro ordenador para acompañarlo.

     - El resultado será una miniatura de la imagen en la página general de las desviaciones y en nuestra página principal. Al abrirla aparecerá la miniatura como encabezamiento en la propia página de la desviación. Es el caso de este tutorial.

     - En el caso de que tengamos habilitado el author tag, la miniatura se mostrará únicamente en la página de la desviación, como encabezamiento.

     - Así pues, podemos optar por habilitar o no el author tag en función de los resultados deseados.

---

     La gran virtud de los escritos en HTML es que son documentos vivos, es decir, sujetos a revisión y mejora en cualquier momento. No dudéis en rectificarlos y mejorarlos cuando sea posible, sólo en esa forma podemos continuar aprendiendo.

---

Consejo:

     Abre una desviación de texto, dale como título Boceto, Proyecto, etc. Escribe tanto en el texto como en los comentarios "en construcción" y súbela en Scraps. Puedes tener varios bocetos abiertos en tu Scrapbook e ir trabajando en ellos. Tras la primera entrada en Scraps tus vigilantes-watchers no serán advertidos de los posibles cambios. De esa forma puedes ir escribiendo de forma directa sobre el HTML, e ir guardándolo y viendo el resultado real. Cuando la desviación esté realmente a tu gusto y veas su impacto visual, corregidas deficiencias ortográficas y de construcción, abrimos una nueva desviación, copiamos y pegamos el trabajo, lo titulamos, lo comentamos y lo subimos a la categoría correspondiente, dejando el boceto en Scrapbook para futuros trabajos.
     No es habitual que otros usuarios entren en el Scrapbook, salvo que los invitéis a ello para visionar o corregir un proyecto antes de su definitiva subida. No obstante, si queréis esconderlo totalmente o no deseáis molestar a vuestros watchers con desviaciones "en vacío"; inmediatamente después de subirlo a Scraps acercamos el cursor a Submit y activamos Manage Deviations. Allí seleccionamos nuestro "Borrador" y aplicando Store lo ocultamos del público y evitamos que llegue a nuestros watchers. Para trabajar en él deberemos acceder siempre a Manage Deviations - Storage. Podéis elegir; el Scrapbook es interesante para consultar, pedir consejos e incluso para hacer trabajos "en equipo" utilizando los comentarios. Como os digo, es muy poco usual que alguien ajeno a vuestra cuenta acceda a él.

     No olvidemos el medio en que nos movemos, intentad que el texto sea visualmente atractivo aprovechando las herramientas que nos proporciona el HTML. Definid párrafos, habilitad descansos visuales; un gran texto puede resultar indigerible en la Red, debemos animar a su lectura.

---

      Bueno, muchachs. Esto es lo que he aprendido de momento. Intentaré escribir algún relato de fundamento próximamente. Me preocupaba la visión de algunas desviaciones de texto que, pudiendo ser interesantes, no invitaban a su lectura. En mi opinión, debemos jugar con el espacio, la presentación y la tipografía para hacer la lectura más ligera y atractiva.
      Si aprendo algo más, lo comento por aquí.

      No dudeis en acercaros a las páginas de Ayu-dA para cualquier consulta.

Saludos. Mikel.