convenciones de lectura de este manual - estrategia … · y atributos cuando se citan en las...

3

Convenciones de lectura de este manual

Para distinguir con facilidad el cdigo fuente del cuerpo literario, el primero se muestra sombreado. Tambin he sombreado los elementos y atributos cuando se citan en las explicaciones.

Algunos fragmentos de cdigo no estn completos. Para que resulte obvio que falta un pedazo de programacin, uso []. Tambin, algunas veces, para no complicar la explicacin con atributos que aclarar ms adelante y en el mismo captulo, he decidido obviarlos. Tnganse estas advertencias en cuenta.

Los corchetes, por otra parte, sirven para enlazar con la bibliogra-fa. Los he preferido a los parntesis usuales para evitar colisiones all donde los uso para otras aclaraciones. La forma de citar las fuentes res-ponde al autor o editor y al orden en la lista alfabtica, si es necesario.

Tambin debes estar advertido de que el uso de las cursivas, en este manual, obedece a criterios poco convencionales. Si usara letras incli-nadas all donde las buenas costumbres nos imponen, la excepcin sera la redondilla. As que el cmulo de neologismos, extranjerismos y

HTML5 PARA PERIODISTAS4

argot pasan en este texto por palabros con acepcin de diccionario. Slo a veces la cursiva aparece donde toca.

Permteme, finalmente, recordar que las marcas que aqu cito son propiedad de sus respectivos dueos. Aparecen a ttulo informativo. Para ganar agilidad de lectura, los smbolos comerciales y han sido deliberadamente omitidos en aquellos momentos en los que la tica aconseja usarlos.

5

Introduccin

Fjate que el ttulo lo dice claramente: para periodistas. Aunque una legin de los denominados comunicadores, redactores, copywri-ters, publicistas, blogueros, foreros y community managers puedan ex-traer un buen provecho de lo que explica este manual, no entendern algunos de los conceptos y prcticas meramente periodsticas que se aprenden en la Facultad y en el da a da de una Redaccin y que aqu se citan. Por lo tanto, el destinatario final de esta gua prctica es el pe-riodista, aunque su trabajo se limite a comisariar textos en un blog, al refrito de notas de prensa, al cuidado de la imagen de algn cliente en una red social o a la edicin de un medio de comunicacin por Internet.

El periodista, de una u otra forma, siempre sacar el mximo partido del uso del lenguaje HTML5 que aqu recomiendo, logrando que sus textos y dems elementos informativos (fotografas, grafismos, vdeos, tablas, documentos anejos) tengan la mxima eficiencia.

La presente gua tampoco est pensada para programadores o disea-dores, porque las recomendaciones se circunscriben al rea de trabajo del periodista, un fragmento enorme y principal de la pgina, pero que, sin embargo, es slo una fraccin de un total que ha sido diseado y programado para que el redactor pueda trabajar y verter en l conteni-


dos. An as, programadores y diseadores tambin pueden aprender algo sobre las necesidades del periodista y contribuir a que el producto final sea ms eficiente.

El objetivo de este manual es establecer y comprender unos proce-dimientos sencillos y estandarizados que aprovechen todas las posibi-lidades que brinda el lenguaje HTML5 para obtener unos contenidos estratgicos, semnticos, accesibles y eficaces con el mnimo esfuerzo posible.

Alguno pensar que ya vuelven a cargarnos, a los periodistas, con tareas que antes pertenecan a otros puestos de trabajo. Como cuando se nos oblig a cubrir actos informativos con cmaras fotogrficas, aho-rrando a la empresa el sueldo de un fotoperiodista, o como cuando se fueron sustituyendo los tcnicos de sonido en los estudios radiofnicos e incluso en las unidades mviles. Nos dijeron que el periodista gana-ba control sobre la emisin de su mensaje, pero muchos muchos, muchos creemos que nunca haba perdido ese control y que lo que suceda era que las empresas queran ahorrar en el captulo de salarios.

Con el etiquetado eficiente y correcto en lenguaje HTML5 no sus-tituimos a nadie. Si se permite la comparacin, es una circunstancia similar a la llegada de las mquinas de escribir a la mesa del redactor, sustituyendo al plumn y al tintero. Algo que forma parte de la me-cnica de la escritura y que permite ganar en eficiencia. Y es un paso adelante ms, personal, obligado y necesario, para mantener la capaci-dad profesional en un alto nivel competitivo. Lograremos que nuestros mensajes tengan ms alcance en el presente y en el futuro. Afianzare-mos las caractersticas de agregacin y de diseminacin de los ncleos de nuestras piezas informativas. Podremos presentarlas en multitud de soportes actuales y futuros. Y nos aseguraremos de que el contenido tenga vigencia ms all de su caducidad natural.

Todo esto se conseguir etiquetando de nuevo y retocando algunas marcas del lenguaje HTML on the fly, es decir, mientras se escribe, o en un repaso final, antes de darlo por bueno y pasarlo al editor, redactor-jefe, supervisor, subdirector, director o el rango superior que exista en tu Redaccin.

INTRODUCCIN 7

Logrars un contenido estratgico desde el primer momento. Desde el instante en el que hayas decidido que aquel trmino o expresin necesita un etiquetado distinto dentro de la programacin HTML. Al hacerlo, obtendrs de un plumazo algunas ventajas:

Indexabilidad: Logrars que el texto, fotografa, grfico, aplicacin web, vdeo o presentacin tenga una mejor indizabilidad en los buscadores.

Posicionamiento semntico: Conseguirs que el contenido obten-ga mejores posiciones en los buscadores semnticos, como Siri, en los iPhone.

Accesibilidad: Facilitars la comprensibilidad de un contenido de forma unvoca e inequvoca a las personas con alguna discapaci-dad que utilizan navegadores de Internet adaptados a sus condi-ciones.

Versatilidad: Crears un contenido que sea adaptable,1 transmi-tiendo eficientemente los mensajes desde cualquier tipo de dispo-sitivo e independientemente de su capacidad de almacenamiento y transmisin.

Diseminabilidad / Agregabilidad: Manipulars con mayor facili-dad los contenidos creados, en los que se podrn usar tcnicas profesionales de diseminacin o agregacin de la informacin que mejor convengan en cada presentacin.

Referenciabilidad: En el futuro y desde nuevos contenidos ser ms fcil referirse al que hayas creado ahora y vincular el producto futuro al pasado.

Historiabilidad: Actualizars la informacin y realizars seguimien-tos secuenciales de acontecimientos sucesivos con mayor facilidad.

1 Por contenido adaptable se entiende el que ha sido estructurado en piezas informativas con valor propio. stas pueden aglutinarse o se puede prescindir de ellas en funcin de las caractersticas de uso y tamao del dispositivo de consumo, sin que pierdan su funcin bsica. Se opone a la escuela de diseo responsive, que emplea todo el contenido adaptndolo a la anchura de las pantallas de los dispositivos de consulta, lo que puede resultar ms caro e ineficiente.


Recuperabilidad:2 Obtendrs los textos informativos limpios s-lo texto de forma muy sencilla, eliminando las etiquetas HTML con una simple operacin informtica.

Esta ltima capacidad extractiva resulta muy til para la empresa que nos contrate. De hecho, el uso correcto de HTML5 en la produccin in-formativa es un paso ms en la industrializacin de los procesos. Afecta tanto a los medios de comunicacin como a cualquier otra actividad en la que se trabaja con contenidos tratados periodsticamente. La empresa se beneficia de reducciones de costes en el tratamiento post mortem de la informacin, en las posibles traducciones, en la exportacin a otros ca-nales y soportes, etctera. El medio, la agencia, la empresa que paga las nminas, consigue reducir los costes de recursos humanos y de tiempo aumentando su capacidad de reaccin y manteniendo siempre un estilo unificado de tratamiento informativo, de voz, de trato y de tono, que son el distintivo de su marca.

Para poder hacer todo esto con el mnimo esfuerzo, te presento este manual.

Como vers, este volumen tiene cuatro partes. Una primera que te sita en lo que es la semntica web y en la operativa de trabajo que pro-pongo. La segunda, en la que profundizaremos en los elementos clave de la redaccin para Internet. Y al final, un eplogo y los anexos, en los que encontrars informacin adicional til para el trabajo diario.

La segunda parte, la mayor, no tiene un orden fijo ni deliberado. Puedes leerla de principio a fin o saltar directamente a los captulos que ms te interesen. Si lo haces desde un ebook, te ser ms fcil realizar bsquedas por nombres de elementos y atributos HTML5.

Mi intencin ha sido que puedas encontrar siempre el fragmento de cdigo que mejor se avenga a tus necesidades informativas, sus ex-plicaciones correspondientes, las variaciones posibles y las fuentes en

2 La mayora de los trminos que encabezan esta lista no existen en espaol, aunque son de uso bastante frecuente en medios de creacin de contenidos en Internet. Tmalos como argot y acptalos escritos en redondilla.

INTRODUCCIN 9

las que puedes informarte con mayor detalle y profundidad sobre este lenguaje.

Recuerda que HTML5 es un lenguaje vivo, sometido a cambios e incorporado poco a poco por la totalidad de la industria. Esta vitali-dad puede suponer que etiquetas que hoy se usan, maana hayan sido abandonadas por la presin de los fabricantes de los navegadores, de los telfonos mviles o de los buscadores, que son quienes cortan el bacalao. Hay que estar atento.

11

Primera parte

Los tres captulos de esta primera parte aportan las claves de lo que se desarrollar en la siguiente. Por lo tanto, sigue mi recomendacin y lelas de cabo a rabo antes de adentrarte en la jungla de los ejemplos de cdigo.

El primero de los captulos recoge una visin global de qu es HTML5 y qu nos puede aportar como periodistas. El segundo, a riesgo de que los especialistas me corran a gorrazos, pretende ser una explicacin comprensible de qu es la semntica en el lenguaje para la web, cmo funciona y cmo nos podemos y debemos beneficiar de ella.

Finalmente, el tercero es la propuesta de trabajo para los periodistas. Se trata del material con el que nos enfrentamos en el quehacer diario y de cmo solventar los problemas de edicin de nuestros textos para superar las convenciones visuales y transmitir adecuadamente un valor comprensible y semntico que nos ahorre trabajo en el futuro.

13

Lo esencial del lenguaje HTML5

Vale la pena que recordemos cmo se construye una pgina web. Sabrs, con seguridad, que la casi totalidad de los sitios web que visitas estn creados con una clara separacin del diseo, los datos y conte-nidos que muestran, y la programacin que la hace posible. Son muy pocas las excepciones.

Generalmente todos los textos, mens, epgrafes, enlaces salientes, ubicaciones de fotografas, archivos de vdeo, archivos de sonido y do-cumentos que el usuario puede descargarse, y en general la referencia de todo el contenido, se guarda en bases de datos.

Los archivos y documentos que se mostrarn en pantalla, como las fotografas, los vdeos o los documentos MP3, cuando son propios, se encuentran ubicados en un directorio del servidor.

All tambin se encuentran las hojas de estilo CSS (Cascading Style Sheets), unas instrucciones que dan forma a la pgina web, y los do-cumentos con la programacin. Estos archivos se conectan a la base de datos, obtienen el contenido y las instrucciones de presentacin, y generan cada pgina HTML que despus los usuarios pueden ver con un navegador en un ordenador sobremesa, una tableta, un telfono in-teligente o un televisor.


Es decir, el cdigo HTML no existe antes de que el usuario haya llamado a una URL concreta. La programacin web genera de forma dinmica la pgina a partir de lenguajes de ejecucin en el servidor (PHP, ASP, JSP)3 que combinan fragmentos de lenguaje HTML con el contenido e instrucciones obtenidos de la base de datos.

La separacin de contenido, forma e instrucciones para su combi-nacin permite una ms rpida y fcil actualizacin de contenidos, re-diseo y modernizacin de la programacin. Pero, sobre todo, genera un documento en el nico lenguaje comprensible para el navegador: HTML (HyperText Markup Language).

HTML es un lenguaje de marcacin avanzado. Es decir, se compone de una serie de marcas que aportan un significado dentro del sistema de la pgina para que los navegadores lo interpreten de forma adecuada. Por ejemplo, un texto etiquetado con h1 ser mostrado siempre como un titular de primer nivel y cualquier mquina lo considerar ms rele-vante que un texto etiquetado con h2, que corresponde con un titular de segundo nivel.

Las etiquetas, salvo alguna excepcin como las imgenes (img), englo- ban los fragmentos de contenido. Antes de la frase que queremos en-fatizar se escribe la etiqueta de apertura, en este caso , y tras la frase, la de final, . Si lo miramos de otra forma, se trata de un sistema de cajones que guardan contenido: textos, vdeos, fotografas, enlaces A su vez, estos cajones pueden albergar otros cajones. Pero slo determinado tipo de cajones, en determinada cantidad y en deter-minada posicin.

Por ejemplo, el elemento figure, que est destinado a albergar todo aquel dato accesorio que ilustre la informacin principal (como foto-

3 Antes de que tengas un vahdo: CSS son las hojas de estilo en cascada (Cascading Style Sheets). MP3 es un formato de compresin de audio muy comn. URL es la direccin de un recurso en Internet (Uniform Resource Locator), frecuentemente utilizado para referirse a la direccin de una pgina web. PHP (acrnimo recursivo de Hypertext Pre-processor), ASP (Active Server Pages) y JSP (JavaServer Pages) son lenguajes de servidor. Se ejecutan en el servidor y generan las pginas HTML.

LO ESENCIAL DEL LENGUAJE HTML5 15

grafas, tablas o vdeos), nunca tendr un titular. Sin embargo, s tendr un elemento de titulacin comn a todo el contenido que albergue: figcaption. ste ser nico.

Valores semnticosLa gramtica del sistema de etiquetas aporta un valor semntico al

contenido que introduzcamos en ellas. Recordemos las clases de semi-tica en la Facultad y la definicin ms simple de la semntica como un sistema de correspondencias entre significantes y significados. Si dentro de una etiqueta destinada a un titular escribimos otra cosa, como un pie de fotografa, el lenguaje lo soportar, los navegadores lo aceptarn como un titular y las mquinas lo interpretarn como un titular.

Pero los buscadores no encontrarn nuestro titular real. En su lugar indexarn como tal el pie de fotografa. Nuestro contenido quedar en-terrado entre los millones de textos intiles de Internet y no habremos conseguido llegar a nuestra audiencia. Ergo, no habremos podido ven-der nuestro producto. Porque, recuerda, slo hay dos tipos de web: las que venden productos y las que se venden a s mismas.

Habremos fracasado.El escrupuloso respeto sintctico y morfolgico a la calidad semn-

tica de las etiquetas HTML, que es de lo que hablo en esta gua profe-sional, no es difcil. Te ahorrar mucho tiempo y dolores de cabeza y te facilitar, en el futuro, la reusabilidad y reciclabilidad de los textos que redactes ahora.

La semntica de HTML, por lo tanto, es un sistema de significados y significantes que entienden las mquinas. Pero tambin es un sistema jerrquico, en el que unos contenidos prevalecen sobre otros. Y esa categorizacin la debemos proporcionar haciendo coincidir nuestros intereses estratgicos como redactores con el funcionamiento de las mquinas que debemos comprender.

Un ordenador leer nuestra pgina HTML letra a letra, de arriba abajo y de izquierda a derecha. Ir localizando los elementos principales y los dibujar (renderizar) en pantalla. Y dentro de estos, los secundarios. De las partes de la pgina que no son comunes al resto del sitio web,


ir tomando aquello que hayamos escrito dentro de las etiquetas prin-cipales, y lo guardar y tratar. Lo mostrar como un snippet 4 en una pgina de resultados. Ser la respuesta que nos d el buscador Siri en el telfono mvil cuando le hagamos la consulta. Ser el fragmento de la portada de nuestro Flipboard, el titular en el Paper.li 5 de un seguidor, el tuit corporativo o cualquier otro automatismo que podamos utilizar.

Lenguaje tcnico-cientfico y no periodsticoHTML5 es la ltima evolucin del lenguaje inventado en el CERN 6

para que los cientficos pudieran compartir documentacin electrnica usando una red de comunicaciones que heredaba protocolos de los sis-temas del ejrcito estadounidense. Su caracterstica esencial es el enlace entre documentos. Al principio eran textos muy esquemticos titular, cuerpo de texto con sus enlaces correspondientes y listas que, poco a poco, fueron complicndose ms y ms. Hace unos meses se cumplie-ron los 20 aos de la primera fotografa en el sistema: el GIF 7 sexy de unas cientficas juerguistas que bajo el nombre de Les Horribles Cer-nettes amenizaban los jolgorios, guateques y festejos que los sesudos profesores se proporcionaban y proporcionan de vez en cuando.

4 Porcin de contenido estructurado y reusable. Por ejemplo, los datos de una tarjeta de visita, la ubicacin geogrfica de un establecimiento cultural, una receta de cocina o los datos bibliogrficos de un libro.

5 Flipboard es un agregador de contenidos en dispositivos mviles, capaz de organizarlos como si fueran una revista. Paper.li es una herramienta de comisariado de contenido que genera la portada de un peridico virtual sobre los intereses del usuario.

6 Siglas de la Organizacin Europea para la Investigacin Nuclear, con sede en Ginebra (http://cern.ch). La que se considera la primera pgina web de la historia, datada el 30 de abril de 1993, puede visitarse en: http://info.cern.ch/hypertext/WWW/TheProject.html. Si observas el cdigo fuente vers que algunos elementos iniciales se mantienen en la versin actual de HTML. Ms adelante se habla de Les Horribles Cernettes, an en activo: http://www.cernettes.com.

7 Formato de compresin de imgenes. Las siglas corresponden a Graphics Interchange Format. Produce un alto nivel de compresin para colores planos y admite pequeas animaciones.


La capacidad del lenguaje ha ido creciendo con el tiempo, pero vin-culndose siempre a las necesidades tcnico-cientficas y no a las perio-dsticas. Ha tenido etiquetas para escribir esquemas de manual univer-sitario, donde casi siempre las imgenes son una ilustracin descriptiva y no perentoria de aquello que se explica. Pero no ha tenido elementos para escribir despieces, mens de navegacin o secciones fijas. Y todo porque, simplemente, no se necesitaban para su objeto inicial: compar-tir informacin tcnica entre iguales.

En su evolucin histrica surgieron los lenguajes XHTML,8 que aa-dan etiquetas especiales ampliando su capacidad expresiva original. Estas marcas adicionales se han aprovechado intensamente en el comer-cio online y en la transmisin de datos bancarios.

Pese a estos intentos, las carencias originales y las subversiones ge-neradas obligaban a llevar a cabo una revisin profunda y urgente de HTML.

Fruto de esta revisin, tenemos hoy entre nosotros HTML5, que, para tu disgusto, es un lenguaje vivo. Su vitalidad proviene de que al-gunas de las etiquetas y procesos que aprenders en este libro pueden cambiar a lo largo del tiempo. Incluso, ya se ha visto, volver a cambiar una vez modificado para regresar al punto de partida.

La versin que hoy usamos es la CR (Candidate Release), que se entrega a la industria de Internet para su aprobacin definitiva como estndar tecnolgico. La CR se public el 17 de diciembre de 2012 y, sorprndete, simultneamente se presentaba la versin 5.1.

El calendario del consorcio de Internet responsable del estndar tec-nolgico establece para las ltimas semanas de 2014 la aprobacin de-finitiva del lenguaje HTML5, con las correcciones que se hayan podido hacer en la versin final CR. Entretanto, la industria estar trabajando ya en la versin 5.1, cuyo borrador de trabajo se aprobar a finales de 2016.

Las previsiones de cambios en este perodo de dos aos, antes de la

8 Siglas de eXtensible HyperText Markup Language.


aprobacin definitiva, alcanzan a pocos elementos que afecten a nuestro trabajo de redactores: hgroup, output, el atributo scoped en style, el atributo seamless en iframe o el atributo cite en blockquote y del.

HTML5.1 desarrollar algunas tecnologas previstas para la versin 5 que no llegaron a implementarse. Tendr dibujo vectorial, scripts que se ejecutan en segundo plano para evitar que el navegador se cuelgue (WebWorkers) y conexiones persistentes entre la pgina y el servidor sin que el usuario tenga que interactuar con ella (WebSockets). Adems mejorar la integracin de Microdata.

Pero faltan aos para ello.HTML5 aporta muchas novedades, la mayora vinculadas a la eje-

cucin del cdigo en los terminales del usuario y no en los servidores: geolocalizacin, reproductores nativos de vdeo y audio para prescindir de plug-ins de terceras empresas, almacenamiento y consulta offline de bases de datos, etctera. Pero, sobre todo, incluye una marcacin con elementos nuevos destinados a la comunicacin de algo ms que simple informacin tcnica.

Tampoco lancemos las campanas al vuelo, porque sigue lejos de atender satisfactoriamente todas las necesidades periodsticas, aunque se aproxima bastante. Ha sido diseado para que los autores de blogs tengan una buena cobertura tecnolgica, para que la presentacin codi-ficada del contenido sea lo ms estandarizada posible y para que tenga una excelente visibilidad en cualquier dispositivo de conexin a Inter-net: ordenadores de sobremesa, porttiles, tabletas, telfonos, televiso-res o navegadores de automvil.

Resulta ms fcil de utilizar y, en principio, ms fcil de programar. Tiene ms etiquetas y, por lo tanto, su nivel semntico ha aumentado. Un mismo contenido puede alcanzar mayor difusin en distintos tipos de dispositivo, de forma simultnea, y adems puede ser interpretado correctamente por mquinas.

Documentos reconociblesEl lenguaje HTML5 es fcil de reconocer. Si miras el cdigo fuente de

una pgina web, las primeras lneas deben ser o parecerse a:


La primera lnea es el tipo de documento. HTML5 slo tiene este texto, sin extras ni extensiones. Si incluye ms texto, o no es HTML5 o tiene alguna extensin desconocida en el momento en el que escribo este manual.

La segunda lnea es la marca del cdigo HTML. Es el gran cajn que engloba todos los cajones y marcas de la pgina. Si te fijas, al final del documento debe aparecer una etiqueta de cierre .

La etiqueta html, obsrvalo, tiene un atributo lang con un valor es. Significa que el idioma en el que se ha escrito el contenido de la pgina es espaol. En HTML5 el idioma de la pgina es fundamental. Con-diciona el diccionario terminolgico que utilizarn las mquinas para interpretar el contenido de cada cajn. En este caso es espaol, pero podra ser francs (fr), ingls (en), alemn (de), cataln (ca), gallego (gl) o swahili (sw).

Este atributo, adems, puede incluir la versin territorial del habla, aunque en la mayora de los casos es redundante y no aporta nada o casi nada a la difusin del contenido. Por ejemplo, para Espaa el atributo sera lang="es-ES"; para Mxico, lang="es-MX".

Entre la segunda y la tercera lnea, que indica el encabezamiento de la pgina web, no debera haber ningn otro cdigo. Debera ser tal y como se muestra en el ejemplo.

Si el cdigo fuente de la pgina en la que ests trabajando no se pare-ce al que he reproducido adicionalmente en la segunda lnea podra haber atributos id o class generados on the air, no utilices la mayo-ra de las etiquetas de este manual, porque no funcionarn y podran romper el diseo, mostrando elementos de contenido fuera de lugar.

Pero podras arriesgarte, porque una de las grandes ventajas de HTML5 es que los navegadores, cuando encuentran algn elemento irreconocible en la marcacin, simplemente lo ignoran. Otras versiones


de HTML, sin embargo, pueden detener el dibujado de la pgina en el punto que les causa confusin o entrar en el denominado modo quirk e inventarse una interpretacin de qu demonios quera hacer el pro-gramador cuando escribi aquella etiqueta que no conoce. En casos as, puede producirse en pantalla cualquier resultado inesperado.

Hasta aqu hemos visto, por lo tanto, unas cuantas caractersticas del lenguaje HTML5 y de la forma en la que vamos a trabajar para obtener el mximo provecho con el mnimo esfuerzo. Las resumo:

Elementos:El lenguaje est formado por elementos que etiquetan conteni-do, marcndolo antes y despus, a modo de grandes cajones. Por ejemplo, un prrafo:

Texto del prrafo.

. Recuerda, no obstante, que en algunos casos la etiqueta no tiene marca de cierre.

Atributos:Cada elemento puede tener atributos dentro de la marca. Por ejem-plo, un prrafo en alemn dentro de una pgina cuyo documento HTML se ha definido en otro idioma:

Texto en alemn

.

Para usar un elemento, nuestros programadores ya habrn previsto un instrumento simplificado de estilo WYSIWYG (What You See Is What You Get, lo que ves es lo que escribes) y un aire a los editores de texto tradicionales en ofimtica. Pero algunos deberemos escribirlos manual-mente y otros muchos nos llevarn a modificar o crear sus atributos. Para ello actuaremos directamente sobre el cdigo fuente, una vez ha-yamos escrito el contenido que queremos mostrar y antes de guardar o enviar a la base de datos nuestro trabajo.

Empezamos?

21

Hablando el lenguaje de las mquinas

Dicen que vivimos una nueva era de Internet, dominada por la se-mntica computacional. Probablemente tendr poco de era y mucho de etapa breve hacia lo prximo.

Muchos, como siempre, pasarn de la edad de piedra al futuro ms sofisticado saltndose esta fase.

El hecho es que las mquinas, las computadoras en red, comienzan a comunicarse con nosotros gracias a la aplicacin de conceptos semn-ticos. Y para obtener el mejor provecho de nuestros mensajes presentes y futuros tenemos que entender cmo funcionan sus mecanismos de comprensin.

La Real Academia Espaola refiere que el concepto semntica pro-viene del griego , que se traduce por significado [RAE-1]. Por lo tanto y como era lgico suponer, la semntica de redes o com-putacional est relacionada con los significados. Como todo acto co-municativo.

Un significado es la atribucin de un valor a un smbolo (palabra hablada o imagen icnica) y resulta esencial que el emisor y el receptor


coincidan en su misma interpretacin, o la comunicacin habr fra-casado.

Con las mquinas tenemos que poner en comn los conjuntos de significado y significante para que nos comprendan, interpreten y pue-dan servirnos de algo ahora y en el futuro.

En la bibliografa anexa descubrirs todo un mundo de servicios, lenguajes y estndares tecnolgicos que estn al servicio de la co-municacin semntica entre computadoras: XML, RDF, RIF, OWL, SPARQL [PASTOR] Pero slo hay uno que es realmente abierto, flexi-ble, multicultural, de uso sencillo y que conecta al humano con la m-quina: el lenguaje HTML en su versin 5, que, mira t por dnde, es el que todos usamos en nuestra prctica profesional cotidiana.

En otras palabras, escribiendo para personas y usando el lenguaje HTML5 de forma correcta, conseguimos que las mquinas entiendan de qu estamos hablando y lleguen a responder a otros humanos con nuestra informacin. Es el logro para el que, desde hace ms de 10 aos, el consorcio que gestiona los estndares tecnolgicos en Inter-net est trabajando desde la plataforma de la Web Semntica [W3C-3]. HTML5 es uno de sus frutos principales.

Los antiguos buscadores y los nuevos buscadores semnticosSe ha escrito tanto sobre las versiones de Internet que si la web

2.0, que si la 3.0 y sobre la web semntica, que a estas alturas o eres un experto o tienes un lo fenomenal.

Intentar no contribuir a la confusin.La semntica estudia la relacin entre significantes y significados. El

significante es el elemento del cdigo fuente que utilizamos cuando es-cribimos. Un prrafo p, una negrita b, una lista ordenada ol, una tabla table son significantes. Cuando los usamos para etiquetar, marcar o envolver algn texto, imagen u otro tipo de formato de contenido, estos se transforman en sus significados.

A cada significante-elemento slo puede corresponder un significa-do-tipo de contenido, al que se aplican unos atributos y que se atiene a unas reglas.

HABLANDO EL LENGUAJE DE LAS MQUINAS 23

Relacionarlos correctamente implica que un buscador avanzado po-dr encontrar contenido (significado) dentro de una etiqueta HTML determinada (significante), porque atenindose a las reglas del lenguaje sabr que dentro del elemento de cdigo slo cabr ese tipo de con-tenido. Un buscador semntico, adems, ser capaz de interpretar el contenido en su contexto y de operar con l.

Por lo tanto, nuestro contenido son datos puros y aspticos desde la perspectiva de las mquinas.

Este punto de vista robtico puede servirnos para comprender mejor su funcionamiento. En lugar de un prrafo de texto corrido, extraere-mos en un ejemplo los datos fros y los colocaremos en una tabla. Luego veremos cmo acta cada tipo de mquinas con ellos.

Imagina un desayuno hogareo de familia de anuncio. Padre, madre, dos hijos y una hija recin duchaditos, con cara de felicidad y sonrisas relucientes y tomando tazones de cereales en la cocina mientras el jefe de la familia fuma en pipa y hojea el peridico matutino.

Esto que has imaginado es el escenario de nuestro contenido de prueba. Procedemos a desglosarlo de la siguiente forma:

Padre Caf solo Engominado hacia atrs

Calcetines negros

Madre Yogur con fibra y extra de bacterias

Moo alto Panties

Hijo mayor Bol de cereales Raya a la derecha Calcetines azules

Hija mediana Bol de cereales Coletas Leotardos violeta

Hijo pequeo Bol de cereales No Calcetines azules

Las normas lingsticas de este ejemplo imponen que cada elemento slo puede corresponderse con un rol familiar. Y que cada rol familiar debe tener obligatoriamente estos atributos: desayuno, peinado y cal-cetines.

Si empleamos un buscador habitual, como Google, intentar locali-zar la expresin idntica de nuestro criterio de bsqueda en el conteni-do de las celdas. Si buscamos la palabra leotardos nos indicar que lo


ha encontrado en el registro Hija mediana. Si usamos parcialmente un criterio, buscar heursticamente su coincidencia exacta, aunque no se trate de una palabra ni tenga sentido por s mismo. Para la peticin de bsqueda acteri nos ensear el registro Madre.

En cambio, si utilizamos un buscador ms avanzado y establecemos como criterio de bsqueda desayuno del padre, pondr en relacin el atributo desayuno (segunda columna) para el elemento Padre (pri-mera lnea) y mostrar el resultado: Caf solo. La nica comprobacin que realiza el buscador es que el tipo de contenido se corresponde con las normas. Es decir, el trmino Padre es realmente un rol familiar que puede localizar en su diccionario interno y caf solo es, en todo o en parte (o caf solo o caf a secas), un trmino posible y de frecuencia recurrente en el mbito de los alimentos y la esfera de los desayunos.

Para que comprendas esto ltimo mejor, escribe alimentos en un crculo (Figura 1). El trmino aparece escrito con frecuencia elevada junto a otra terminologa fcilmente clasificable. Por tipo (verduras, carnes, pescados) o por consumo (desayuno, almuerzo, cena). Escrbelos alrededor, envulvelos cada uno en un crculo y traza lneas entre estos y alimentos. Ahora, escribe caf, leche cereales alre-dedor de desayuno y nuevamente envuelve cada trmino en un crcu-lo y vinclalo con una lnea a alimentos. Ahora tenemos caf dentro de la esfera desayuno de la esfera alimentos. Pero tambin podra estar vinculado a la esfera almuerzo, porque se puede tomar en la sobremesa. As que traza una lnea que los vincule. Y lo mismo sucede con leche, que puede estar vinculado tambin a la esfera cena.

Pero caf, adems, puede aparecer en otras esferas distintas: agri-cultura, comercio justo, Colombia, cadena de franquicias, quita-manchas, enfermedades del sueo As que iramos trazando lneas de vinculacin con las distintas esferas.

T y yo resolvemos estas vinculaciones porque como humanos co-nocemos el significado ontolgico de los trminos y somos capaces de establecer rpidas asociaciones naturales. Una mquina desconoce el significado, ms all de su coincidencia, letra por letra, en su dicciona-rio interno y de las variaciones lingsticas a las que pueda someter el


trmino. La mquina crea un grfico conceptual por frecuencia de apa-riciones en distintos entornos. Si una mayora de sus usuarios escribe caf en relacin al desayuno, asociar la palabra caf en la esfera desayuno.

Cuando se le exige una bsqueda, la mquina simplemente com-prueba que el tipo de significante posible, desayuno para el padre, alberga un significado que est en la esfera desayuno de su propio mapa conceptual (Figura 2). Si lo encuentra, lo dar por vlido y lo ofrecer como resultado.

Figura 1Mapa de las relaciones entre los trminos caf y desayuno, que permiten validar la respuesta


El corpus lingstico del buscador y lo que vieneLa capacidad de los buscadores semnticos de analizar las palabras

escritas o transcritas desde una reproduccin sonora sometindo-las a las derivaciones ortogrficas de cada lengua (diminutivos, aumen-tativos, cambio de gnero, cambio de nmero, conjugacin), a las variaciones gramaticales (puntuacin y tipos de oraciones) y a la es-tructura sintctica bsica (sujeto, verbo y complementos) es mecnica. Aplican unas reglas predeterminadas en un anlisis de lenguaje natural

Figura 2Grfico conceptual elaborado por la empresa especializada Gravity.com, creado como demostracin sobre diez artculos online ledos por una supuesta usuaria de Internet. Los trminos se interrelacionan con tres grandes ncleos de coincidencia: comidas y bebidas, bebidas alcohlicas y viajes.Un buscador elabora su propio mapa conceptual con las palabras captadas en el contenido y lo usa para dar validez a los resultados.


al corpus que van adquiriendo. Si el resultado de la aplicacin de las normas es positivo, la terminologa detectada pasa a su corpus lings-tico y se integra en su mapa conceptual.

El proceso no descansa, aunque es complejo y requiere continuas correcciones humanas de los algoritmos que emplean las mquinas. Cada idioma, adems, presenta sus particularidades, lo que aade com-plejidad al proceso. Cuanto ms extendido y rico es el lenguaje, mayor dificultad de implantacin tienen los buscadores semnticos.

Pero ya lo estamos usando, an sin darnos cuenta. E ir a ms.Como periodistas y comunicadores estamos en la vorgine semntica

y no podemos obviarla. Si queremos que nuestro trabajo tenga valor, debe ser influyente. Para que sea influyente tiene que tener alcance. Para que tenga alcance tiene que ser localizable con facilidad. Para que sea localizable, tiene que ser semntico. Para que sea semntico, tiene que estar escrito correctamente en HTML5.

De lo contrario, fracasaremos.Lo que tenemos a la vuelta de la esquina aportar todava ms valor

a nuestros mensajes. Ya tenemos ejemplos de lo que puede ser el re-sultado del lenguaje de las mquinas en Siri, el buscador del sistema iOS de Apple, Assistant (Majel) en los Android, o la sofisticacin de las capacidades del buscador que desarrolla Wolfram Alpha [Wolfram]. Es cuestin de tiempo que todos tengamos acceso a ellas.

A lo mejor cuando ests leyendo estas lneas ya puedes hacer estas otras preguntas en un ejemplo como el anterior y obtener estas res-puestas:

Quin usa calcetines azules?: El hijo mayor y el pequeo. Quin usa calcetines?: El padre, el hijo mayor y el pequeo. Cul es el desayuno preferido del hogar?: El bol de cereales De los que usan moo, qu tipo es el ms frecuente?: El moo alto. Cuntos hombres hay en la cocina?: Tres, porque sus roles co-

rresponden en el diccionario del sistema con el gnero masculino. Cuntos componentes tiene la familia?: Cinco.El buscador semntico no slo cruzar los datos de significados y

significantes, validndolos. Tambin los pondr en relacin con el con-


texto, lo que permite obtener resultados por superposicin de valores. Observando detenidamente las respuestas, son una mezcla de la coin-cidencia exacta del criterio de bsqueda y de la aplicacin de frmulas muy bsicas de estadsticas: frecuencias, medias, sumas, desviaciones todo lo que una mquina hace ms rpido.

Los inventores que estn detrs de estos buscadores de nueva ge-neracin nos prometen que el buscador ser capaz de aprender de las bsquedas del usuario. Ya lo han experimentado.

Google puso en marcha un buscador semntico sobre cuestiones de salud, Google Health, que estuvo operativo durante unos meses, a caballo entre 2011 y 2012, y al que se poda acceder desde Estados Unidos [EFRATI]. Su principal caracterstica era que proporcionaba pa-tologas coincidentes nunca diagnsticos, por cuestiones ticas y le-gales con sntomas. Pero, adems, aprenda del usuario. Era capaz de guardar y relacionar las bsquedas previas para mejorar sus respuestas.

Si alguien buscaba el sntoma dolor de cabeza, el buscador ofreca una lista extensa de las patologas posibles. Si el mismo usuario, en una segunda consulta, estableca como criterio estornudo, la lista de patologas combinaba dolor de cabeza, no planteado en ese momen-to, y estornudo, y produca una lista ms ajustada a estos sntomas: resfriado, gripe o rinitis.

29

Herramientas y procedimientos de trabajo

Echemos un vistazo a nuestro instrumental.Para crear contenidos HTML5 semnticos partiremos de tres facto-

res: conocer qu etiquetas de cdigo necesitaremos en cada caso, saber qu posibilidades de edicin nos ofrece el sistema y disponer de un buen editor WYSIWYG que acepte elementos en lenguaje HTML5 sin sabotear nuestro trabajo. O por lo menos que sea un editor lo sufi-cientemente flexible para que podamos manipular el cdigo a nuestro gusto.

De entrada, una mala noticia: los editores que existen cuando escribo estas lneas no soportan HTML5. Y, de los que anuncian lo contrario, resulta que slo utilizan la capacidad contentEditable que aporta el lenguaje. Desde un punto de vista prctico, estos ltimos pueden tra-bajar en modo air, directamente sobre el texto, tal y como lo ver el usuario final.

Pero todo tiene remedio. Vayamos por partes.Un editor WYSIWYG es una emulacin dentro de un formulario web

de los controles de un editor de textos tpico de un paquete de ofim-tica. Es decir, tiene una apariencia muy similar a Word de Microsoft, a Pages de Apple, etctera. WYSIWYG significa What You See Is What


You Get, es decir, lo que ves es lo que obtienes. De modo que el editor ofrece un control visual de la produccin. Las cursivas marcadas se ven como cursivas; las negritas, como negritas. Un clic en un botn sirve para escribir muchos caracteres de cdigo sin tener que conocer cmo se programa HTML.

Cada editor transforma un rea de texto de un formulario web una especie de gran casilla en un espacio de trabajo en el que se muestra el efecto del cdigo sobre el texto que se va escribiendo. En estos for-mularios se crean y se modifican los contenidos de una pgina.

Sobre el espacio de escritura, se muestran los controles del editor, una barra de herramientas a modo de botones y con una apariencia que intencionadamente imita a los editores de texto de ofimtica.

No se necesita gran explicacin sobre su uso habitual: se selecciona la palabra que se quiere transformar en una negrita, se pulsa el botn correspondiente en la parte superior y en pantalla se ve cmo ha cam-biado a negrilla. El usuario evita tener que escribir la etiqueta anterior y posterior a la palabra afectada: ejemplo. Si se desea escribir un enlace, se selecciona la expresin que actuar como gancho, se activa un botn en el editor y en la ventanilla emergente se escribe la direccin de destino y los dems atributos del elemento. Todo a la vista.

No olvides, sin embargo, que generalmente estars utilizando este editor en un back-end,9 una parte privada para los creadores de conte-nido que los usuarios finales no ven, y que aquello que aparece con una letra del cuerpo 16 y color negro, puede ser al final una letra del cuerpo 11, porcentualmente proporcional al diseo, y con otros colores o trans-formaciones: maysculas, minsculas, texto aadido antes o despus, colores de fondo y de la tipografa, subrayados, tachaduras, etctera.

Algunos gestores de contenido utilizan editores de tipo rich text texto enriquecido, que limitan las posibilidades de uso. Un editor

9 Back-end es la parte privada de administracin de un gestor de contenidos. Generalmente son pginas-aplicacin con formularios en los que se introduce el contenido que luego se muestra en el front-end, la interfaz pblica del sitio web.

convenciones de lectura de este manual - estrategia … · y atributos cuando se citan en las...

Documents