Pioneros y Hacedores 📖: parte 2

Aquí va la segunda parte de los apuntes sobre el libro "Pioneros y Hacedores" (2013) de Lorena Paz (Compiladora) y Víctor Malumián (editor). La idea de este post es poder tomar nota de los puntos más interesantes de esta lectura con los que desde ya les cuento que he aprendido varias cosas y su importancia :)

Accesibilidad web y SEO

La accesibilidad web tiene que ver con el garantizar que el sitio web pueda ser visitado y utilizado por la mayor cantidad de personas (independientemente de sus limitaciones o las de su entorno). Mientras que el SEO (Search Engine Optimization-posicionamiento orgánico en buscadores), es el conjunto de técnicas para mejorar la visibilidad de un sitio web en los motores de búsqueda (Google, Yahho!, Bing) con el objetivo de aparecer en las primera posiciones con lo cual se incrementaría la probabilidad de que el usuario visite nuestro sitio web. 

Google utiliza más de 200 factores para determinar la relevancia de nuestra página en relación a los términos de búsqueda utilizados por los usuarios, pero lo más fundamental, por lo que debemos comenzar, es: 

• Facilitar el rastreo por parte de los robots de Google para su indexación
• Hacer que Google considere que nuestra página es relevante (cada url es considerada de forma independiente) teniendo en cuenta algunos aspectos como: la autoridad y temática de las páginas que enlazan a la nuestra, velocidad de carga, contar con contenido propio y actualizado 
• Otro factor importante que debemos cuidar es el "black SEO".  

Técnicas comunes

• Texto para los elementos que no son texto: añadir el texto alternativo para las imágenes y subtítulos o transcripciones para elementos como los videos o audios.
• Además, le brinda la alternativa de acceder a la información a quienes no pudieran percibirlo por alguna discapacidad personal (visual, auditiva, etc.)
• Si añades las palabras claves para que sean aún más relevantes con lo que busca el usuario, mucho mejor. 
• Títulos: descriptivos, claros, breves y únicos para cada página del sitio.
• Así será identificable, ya sea que el usuario la guarde en sus favoritos o la comparta en redes sociales. 
• Les dirá a los robots de Google (y otros motores de búsqueda) de qué trata la página y será la primera línea mostrada al aparecer en los resultados de búsqueda. 

Semántica y estructura

La imagen de arriba es un ejemplo de lo que se suele ver cuando "tocamos" el código de una web. No soy programadora, pero a veces trato de hacer mejoras o insertar de una mejor manera elementos que no puedo con la herramienta del blog (lo que supongo que a veces debe pasar también cuando uno suele gestionar los contenidos de una web en general). Es importante tomar en cuenta que los contenidos deben responder a una estructura que "leerán" los robots. En ese sentido, algunos elementos básicos son: 

<h1>-<h6>: para encabezados

<p>: para párrafos

<ol>, <ul>, <dl>: para listas

<em> y <strong>: para enfatizar 

En realidad, estas etiquetas aparecen en el código automáticamente con forme vamos escribiéndolo en la plataforma de la gestión de contenidos. Pero responderán a una estructura en la medida que así lo detallemos. Es decir, lo mejor es que le brindemos el formato deseado con las opciones que tenemos y no simplemente copiar y pegar el texto desde algún otro lado (como un documento en Word u otro programa). Por ejemplo: si vamos a colocar una lista, tendríamos que marcar la opción de lista  o viñetas, y si vamos a colocar un encabezado o sub-título, marcarlo así. 

Relevancia del contenido

Se refiere a la interpretación que hacer Google con la disposición de las palabras en el contenido de nuestra web. Es decir, no solo importa la cantidad de palabras utilizadas o su recurrencia; sino que también se considera en qué parte del texto están colocadas, el nivel (encabezado, subtítulos, etc.) y si se han marcado como negritas, justamente para enfatizarlas.

Por otro lado, la relevancia también es algo que puede abarcar lo que se entendería como la coherencia entre las palabras clave que busca el usuario y el contenido de nuestra página, con lo cual los buscadores harían que esta aparezca en la medida que sea lo más relevante posible. 

" Los requisitos para mejorar la navegabilidad nos benefician a todos, pero especialmente a las personas con discapacidad visual, con problemas cognitivos o con déficit de atención" (Pág. 94)

Sitemap

Crear y enviar el sitemap (mapa de sitio) de nuestra web, facilitará a los robots de Google encontrarla y conocerla, y con ello mejorar su posicionamiento. 

Legibilidad

Que el contenido sea legible; es decir, que sea claro y comprensible, beneficia a todos, sobre todo a las personas que pudieran tener discapacidad cognitiva, de lenguaje, quizá algunos problemas de memoria, o si se tratara de personas de una cultura distinta. Una forma de hacerlo legible es clarificar algunos significados de palabras inusuales o jergas a través de un glosario o definiciones breves en el mismo texto.

También es importante explicar el significado de acrónimos o abreviaturas. Podría ser con un glosario o utilizando el atributo TITTLE y las etiquetas <abbr> y <acronym>

Otra ventaja de tener en cuenta la legibilidad del contenido es que mientras más claro y apropiado sea el contenido con referencia al tema que toca, más cerca estaremos a los términos de búsqueda relacionados al mismo.

TIP: colocar un resumen al inicio con las palabras clave, responde al modelo de "Pirámide invertida" que le indica a Google que lo más importante es aquello que está arriba.

LO QUE NO SABEMOS QUE SABEMOS 😱

Sobre accesibilidad y usabilidad, hay una serie de elementos que se podría decir que ya conocemos en tanto estemos habituados con la creación de documentos de texto. Aquí algunos de ellos y su importancia como parte de un sitio web:

• Encabezado: aquí hay una serie de elementos que son muy importantes para Google y los robots de búsqueda
• Idioma de la página: es importante indicar con el atributo "lang" en qué idioma estará el contenido. Actualmente los editores de contenido (CMS) facilitan esto. Así los robots podrán indizar correctamente la página teniendo en cuenta el idioma principal indicado.
• Título: como cualquier obra o creación, el título de las mismas es un elemento distintivo. Personalmente, lo definiría como lo que refleja la huella del autor.
• Elementos meta: son aquellos que transmiten información sobre la información de cada página (por ahí su nombre no? 😆). Así como cuando en un documento de Word o algún otro editor de textos, agregamos la info sobre el autor o de qué trata el texto en sí, palabras clave y demás propiedades del documento, los elementos <meta> no necesariamente son los mismos en cada página. Por ejemplo podría indicar el tipo de caracteres que hay en la página o cuánto tiempo deben repasar el contenido los robots a fin de indizar nuevos contenidos.😲
• Elementos link: este sí que no lo conocía, pero por lo que comentan en el texto, es bastante útil para indicar dónde está la hoja de estilos y los Javascript, diferenciando así el contenido de los efectos visuales. 🎨
• Cabecera visual: si bien aquí se sitúan contenidos distintivos como el logo, nombre del sitio, nombre de la institución o empresa, enlaces al mapa de sitio o página de contacto, también corresponden a bloques que se podrían "saltar" al identificarlo como un elemento común en todas las páginas del sitio, de manera que los robots vayan directamente al contenido principal.
• Mapa de sitio: se podría decir que el mapa de sitio es el equivalente a un índice o una tabla de contenidos de un documento de texto, con lo cual se cumple con el criterio de brindar "múltiples vías" y "ubicación". También para abarcar otros criterios como el de legibilidad, se recomienda tener un apartado con los datos de contacto para poder justamente contactar a los responsables del sitio web.
• Logo y nombre: tal como en los documentos se suele poner un membrete que identifique a la empresa o institución. Aquí es importante indicar con una alternativa textual (propiedad ALT en las imágenes) qué significa cada imagen, como la del logotipo colocado en la web.
• Buscador: se trata de un mecanismo que debe brindarse ajustándolo a las necesidades y preferencias del usuario. Esto implica que también los resultados de búsqueda sean accesibles y bien estructurados.
• Contenido principal: 
• "Migas de pan": son los "rastros" que le indican al usuario dónde se encuentra respecto al árbol de navegación de todo el sitio. Crearlas mediante listas brindará no solo accesibilidad, sino también facilidad de ubicación y relaciones.
• Encabezados de sección: como en cualquier documento de información, es importante estructurar el contenido y para facilitar su comprensión se utilizan secciones, ya que la información es más fácil de consumir así, a través de títulos y subtítulos.
• Nivel de lectura: se refiere al nivel de lectura necesario para comprender nuestros contenidos y que hay que tener muy en cuenta si se trata de una audiencia muy amplia, como la ciudadanía en general (lo que creo que aplicaría a los sitios web del estado). Por ejemplo, brindando soportes comunicacionales diversos como las ilustraciones, infografías, videos, no usando solamente el blanco como fondo para los textos o la posibilidad de que el usuario lo modifique, entre otros.
• Párrafos, listas, negritas, cursivas: se trata de elementos que quienes hemos elaborado textos en cualquier programa como Word, o similares, ya conocemos, pero que es importante utilizar de manera adecuada: para destacar o marcar ciertas porciones del texto.

• Citas y textos citados: como suele pasar con los documentos en general, es importante destacar tanto visual y estructuralmente aquello que estamos citando

"(...) lamentablemente encontramos muchos sitios en los que los textos aparecen sin marcar apropiadamente, muchas veces puestos directamente dentro de una capa y tan sólo, separados por el elemento <br> que no transmite suficiente información sobre dónde empieza un párrafo y termina otro" (pág. 121) 

• Abreviaturas y palabras inusuales: ya sea que utilicemos un glosario o una nota al pie de página, no debemos olvidar hacer este tipo de aclaraciones cuando se utilizan términos de forma poco usual o en otros contextos.
• Enlaces o hipervínculos: aquí lo indispensable es que se distingan del resto del contenido pues en un sitio web los enlaces son esenciales y el uso del color, por ejemplo, le aportará a la usabilidad, así como también es importante que se comprenda fácilmente su propósito.
• Tablas: aquí hay una serie de atributos que deben utilizarse para que se identifique bien el contenido como el que efectivamente pertenece a una tabla. Por ejemplo: "atributo “caption”, para asociar la tabla con su título, el atributo “summary”, para dar una visión general de la disposición de su contenido, y los atributos “scope”, “id” y “headers” para asociar los datos en celdas con las celdas de encabezado" (pág. 124)
• Sintaxis: no solo es importante la ortografía y gramáticas de los contenidos, sino también la coherencia del contenido en sí, su construcción. Y aquí en específico se refieren a la construcción del código fuente (aquello que procesan los ordenadores o que interpretan los navegadores). Sí esa sábana de códigos que aparecen cuando le das clic derecho a una web y pinchas en "ver código fuente" :) 

Y como esto ya se hizo muy extenso, volveré con otro post para la última parte 😃