Qué son los metas.

Tal como indica la W3C World Wide Web Consortium, los Meta Data sirven para describir de manera inequívoca una página web, pondríamos decir que se su cometido es similar al de un código de barras. Los META ofrecen por tanto información relevante sobre una página web: Quién es el autor, con qué frecuencia se actualiza, sobre qué trata la página, etc.

Cómo utilizo los META.

Los META son tags HTML que se deben situar siempre en la cabecera de la página, dentro de HEAD del documento. Es un tag que no requiere cierre, por lo que no es necesario incluir la cadena </meta> para finalizar. El atributo name especifica qué información ofrece el META tag y en el atributo content se incluye la información. Por ejemplo:

<meta name="Author" content="oscar Wilde"/>

El atributo lang se utiliza para indicar en que idioma está escrito el contenido del atributo content. Esto permite que los sintetizadores de voz apliquen al texto la entonación correspondiente al idioma.

<META name="Author" lang="en" content="oscar Wilde">

El atributo Scheme permite ofrecer un contexto para interpretar correctamente la información de un meta, que de otra manera podría ser ambigua. En el siguiente ejemplo el atributo schema especificaría el formato de una fecha. Sin él podríamos dudar entre el 10 de Septiembre o el 9 de Octubre:

<META scheme="Mes-Dia-Año" name="date" content="10-9-97">

El atributo http-equiv sirve para que los servidores HTTP preparen una cabecera de respuesta determinada. Se utiliza por ejemplo para indicar a los servidores cache cada cuanto tiempo debe actualizarse con una versión nueva del documento.

<META HTTP-EQUIV="Cache-Control" CONTENT ="no-cache">

También se utiliza para indicar el charset de un documento. El "charset" identifica una codificación de caracteres, que es el mecanismo que se utiliza en Internet para convertir una secuencia de bytes en una secuencia de caracteres. Los servidores envían los documentos HTML a los navegadores como un flujo de bytes y estos los deben interpretan como un flujo de caracteres. El charset depende de cada idioma, país o región.

<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=ISO-8859-1">

Mi intención no es hablarle de todos los META que existen, sino profundizar en aquellos que tienen una relación más directa con el rendimiento de su web corporativa en Internet. Si lo desea, puede encontrar toda la información que necesite sobre los META en la siguiente dirección http://www.w3.org/TR/html4/struct/global.html#adef-http-equiv

Los META KEYWORD y DESCRIPTION: Mitos y leyendas.

El meta KEYWORD permite asociar a la página web una serie de términos de búsqueda separados por comas. Tenga en cuenta que los buscadores no son sensibles a las mayúsculas y minúsculas.

<meta name="keywords" content="la importancia de llamarse Ernesto,obra de teatro,comedia,Oscar Wilde,Jack Worthing,Cecily" >

Cuando los webmasters y las empresas SEO comenzaron a utilizar indiscriminadamente las virtudes del META KEYWORD acabaron por matar a la gallina de los huevos de oro. Era muy habitual encontrar mastodónticas cabeceras de METAs con el objetivo de alcanzar las primeras posiciones de manera rápida:

<meta content="inmobiliarias, inmobiliaria, apartamentos, aticos, casas, casas de campo, chalets adosados, chalets pareados, dúplex, edificios, estudios, garajes, hoteles, locales comerciales, naves industriales, oficinas, parcelas rústicas, parcelas urbanas, parcelas urbanizables, pisos, trasteros, villas, España,...

Hoy en día los principales buscadores detectan este tipo de técnicas y penalizan su práctica. De los 5 principales buscadores - Google, Yahoo,AltaVista, FAST, e Inktomi - sólo Inktomi tiene en cuenta el META KEYWORD en su algoritmo de indexación. Así que mi recomendación es que no dedique demasiado tiempo a escribir KEYWORDS para los buscadores y, en caso de hacerlo, que sea muy conciso y evite repeticiones.

El meta DESCRIPTION se utiliza para ofrecer a los buscadores una descripción de la página web.

<meta name="description" content="En esta página podrá encontrar información actualizada sobre la obra de teatro de Oscar Wilde"/>

Debemos ofrecer una información que describa el contenido de la página de manera precisa. Podemos incluir slogans pero debemos huir de las frases demasiado agresivas que puedan generar desconfianza a los usuarios.

Los buscadores extraen de este META la información que muestra en los resultados de las búsquedas. Sólo se indexan los 150 primeros caracteres que introduzcamos, por lo que es importante evitar las repeticiones y ser conciso.

Se debe utilizar el lenguaje apropiado para el público al que nos estamos dirigiendo. Debemos tutear a particulares y utilizar el usted para pymes y empresas.

Hay que tener claro que los META no posicionarán mi página más rápido ni mejor en los buscadores, pero si nos permiten ofrecer un contenido de mayor calidad a nuestros visitantes.

Los peligros del META REFRESH

El meta REFRESH permite recargar automáticamente una página en un intervalo de tiempo. Para ello simplemente debemos indicar en el atributo CONTENT el intervalo de tiempo expresado en segundos.

<meta http-equiv="refresh" content="10">

También permite realizar una redirección a otra página.

<meta http-equiv="refresh" content="10;url=http://www.wikipedia.org/">

Sin embargo este método de redirección es muy poco recomendable. La W3c alerta sobre su bajo nivel de accesibilidad al no ofrecer información al usuario sobre la página origen y destino. Además realizar una redirección de esta manera puede ser peligroso para la indexación de la página web pues los motores de búsqueda pueden considerar que estamos utilizando una técnica prohibida en sus directrices para webmasters. Las páginas "puerta", back-doors, o cloaking es una técnica agresiva que busca posicionar un Site utilizando varias páginas de entrada creadas exclusivamente para los buscadores. Estas páginas contienen un contenido absurdo para una persona pero muy relevante para los buscadores (repeticiones de criterios de búsqueda, frases y titulares incongruentes, etc). Cuando encontramos una página de este tipo como resultado de una búsqueda e intentamos acceder, somos redireccionados a otra página diferente preparada para su correcta visualización.

Los motores de búsqueda detectan esta técnica y pueden penalizar nuestra página o desindexarnos definitivamente.

El META ROBOTS y la privacidad de nuestras páginas.

El META Robots se utiliza para indicar a los motores de búsqueda de tipo araña (Google y la mayoría de buscadores) si debe o no indexar el contenido de la página (index-noindex) y si queremos que acceda a los enlaces (follow-nofollow). Las directivas que podemos indicar son:

<meta name="robots" content="index,follow">
<meta name="robots" content="noindex,follow">
<meta name="robots" content="index,nofollow">
<meta name="robots" content="noindex,nofollow">

Los valores por defecto son index y follow, así que no es necesario indicar nada par que los buscadores indexen el contenido de nuestras páginas.

En cambio si la información de la página es de carácter confidencial y no queremos que sea indexada debemos asegurarnos de incluir la directiva noindex,nofollow. Debemos tener en cuenta que los motores de búsqueda son capaces de indexar páginas dinámicas como fichas con datos personales de clientes o listados de facturas. ¿Ha probado a buscar su dni en Google?

No es del todo cierto decir que no se  indexará el contenido de nuestra página si incluimos la directiva noindex. Google siempre accederá e indexará todas las páginas a las que acceda independientemente del contenido del meta ROBOTS, pero sólo mostrará en sus resultados (SERPs) aquellas que hayan sido declaradas como indexables. Esto es así porque necesita conocer los cambios que se puedan producir en la página y para poder acceder a sus links.

Si no queremos que el contenido de la página sea indexado pero sí necesitamos que los buscadores accedan a los enlaces de la página deberemos incluir:

<meta name="robots" content="noindex,follow">

o símplemente:

<meta name="robots" content="noindex">

En este punto me gustaría hacer una observación y es que mucha gente ha venido reportando en diversos foros que en ocasiones Google no hace caso a esta directiva y muestra en sus resultados páginas que incluían la directiva noindex. Se trata de un bug del algotimo de indexación de Google que se espera que pronto sea subsanado. Como dijo aquel, nadie es perfecto.

Por tanto es muy importante que protejamos la privacidad de nuestros clientes incluyendo noindex,nofollow en todas aquellas páginas que no queremos que sean indexadas.

¿Le ha gustado este artículo?, ayúdeme a compartirlo.

El tiempo pasa muy rápido y nuestra web corporativa, la misma que hace tan pocos años nos parecía moderna y bonita, hoy la vemos fea y anticuada. Pensamos, “Es el momento de renovarse”.

¿Cómo necesitan mis clientes que sea nuestra web? Para algunos parecera una cuestión trivial y de fácil respuesta pero en la práctica determina de manera definitiva el éxito o fracaso de nuestra empresa en Internet, pues ellos serán los que la utilizarán a diario, los que accederan a nuestra tienda en busca de la nueva gama de productos y los que hablarán sobre ella a sus amistades.

Antes de comenzar ningún desarrollo web deberíamos tener una respuesta para las siguientes cuestiones:

• ¿Por qué voy a desarrollar una web corporativa?
• ¿Quién accederá a nuesta web? 
• ¿Qué buscarán nuestros visitantes?

En las reuniones iniciales o workshops se juntan todos los responsables directos del proyecto: gerente, directores de división, diseñadores, comerciales, responsables de marketing y comunicación, etc. Cuando todo el mundo quiere opinar y opina, es fácil dejarse influenciar por valoraciones personales y perder de vista a los usuarios finales. De nada nos servirá desarrollar el Site que el director general quiere si a nuestros clientes les resulta irritablemente difícil completar con éxito el proceso de compra de un producto. Tampoco sería razonable dejar en el departamento de diseño la responsabilidad de crear una nueva imagen corporativa sin habernos asegurado antes de que conocen con suficiente profundidad al público objetivo al que nos dirigiremos.

Este tipo de reuniones son una muy buena oportunidad para identificar las necesidades de nuestra empresa pero no estamos identificando las necesidades reales de nuestros clientes. Por tanto, podemos encontrarnos con que los requisitos y especificaciones iniciales sobre los que vamos a construir nuestra web corporativa pueden ser incompletos o incluso erróneos.

Existen diversas técnicas que nos permiten conocer las necesidades de nuestros clientes como las encuestas, los grupos de opinión, o el card sorting. Todas ellas requieren de una planificación y preparación previa para que las conclusiones que obtengamos sean relevantes.

Sin embargo existe dos conceptos, previos a cualquier análisis, que deben tenerse siempre prensente: la sencillez y la simplicidad. Estos dos conceptos forman el eje sobre el que orbitan todos los elementos de la web 2.0. Una web moderna es sencilla, una web atractiva es simple.

¿Le ha gustado este artículo?, ayúdeme a compartirlo.

Hemos preparado para usted un resumen de los principales aspectos que debe cuidar a la hora de desarollar su Site corporativo.

1. Aspectos de maquetación

1.1 Estilos css

Deben seguir los recomendaciones definidas por la w3 para los hojas de estilo - css2 ( Cascading Style Sheets, level 2, CSS2 Specification http://www.w3.org/TR/REC-CSS2/) La web debe estar preparada para una óptima visualización en diferentes soportes: monitores, impresoras, pdas, navegadores textuales, reconocedores braille, etc.@media print

@media screen

@media handheld

@media braile

Los estilos deben definirse exclusivamente en hojas de estilo externas para modularizar diseño y contenido.

Las hojas de estilo actuales deben refinarse:

• Eliminando estilos obsoletos.
• Agrupando y simplificando estilos.
• Optimizando los estilos existentes.
• La web debe quedar preparada para poder beneficiarse de las ventajas que aportará la inminente llegada de los CSS3.

1.2 Javascript

Todas las funciones Javascript deben definirse e implementarse en archivos externos siempre que sea posible.

Es necesario refinar todas las librerías actuales:

• Eliminando funciones obsoletas
• Unificando funciones homólogas.
• Debemos evitar utilizar Javascript para realizar redirecciones y definir títulos en las páginas.

1.3 Código html

Las nuevas maquetas deben definirse en base al estándar XHTML. EL motivo de utilizar XHTML es avanzar en el proyecto del World Wide Web Consortium de lograr una web semántica , donde la info rmación, y la forma de presentarla estén claramente separadas. En este sentido, XHTML serviría únicamente para transmitir la info rmación que contiene un documento, dejando para hojas de estilo (como las hojas de estilo en cascada ) y JavaScript su aspecto y diseño en distintos medios ( ordenadores , PDAs , teléfonos móviles , impresoras …).

Las principales ventajas del XHTML sobre otros formatos son:

• Compatibilidad parcial con navegadores antiguos: la info rmación se visualiza, aunque sin formato. Apuntar que el XHTML 1.0 fue diseñado expresamente para ser mostrado en navegadores que soportan HTML de base.
• Un mismo documento puede adoptar diseños radicalmente distintos en diferentes aparatos, pudiendo incluso escogerse entre varios diseños para un mismo medio.
• Facilidad de edición directa del código y de mantenimiento.
• Formato abierto, compatible con los nuevos estándares que actualmente está desarrollando el W3C como recomendación para futuros agentes de usuario o navegadores .
• Los documentos escritos conforme a XHTML 1.0 pueden potencialmente presentar mejor rendimiento en las actuales herramientas web que aquellos escritos conforme a HTML.

1.4 Cross Browser

Debemos buscar la compatibilidad de la web en los siguientes navegadores:

• Mozilla Firefox.
• Internet Explorer 5.x 6.0 7.0 (Próximamente)
• Amaya
• Safari (Mac)

2. Pautas de usabilidad y accesibilidad

2.1 Nomenclatura

Es necesario definir una estructura de directorios y archivos óptima.

Los nombres de los directorios deben ser descriptivos. Los buscadores dan más relevancia a los nombres de los directorios que a los nombres de los archivos.

Todas las imágenes deben incluir un atributo alt, explicando con palabras la funcionalidad de la imagen.

Los enlaces deben incluir un atributo title especificando lo que ocurre al ser activados.

2.2 Directrices de posicionamiento en buscadores

2.2.1 Aspectos de maquetación

Es importante crear un sitio con una jerarquía y vínculos de texto claros. Se debe poder acceder a todas las páginas desde al menos un vínculo de texto estático.

Es necesario ofrecer a los usuarios un mapa del sitio con vínculos que apunten a las secciones importantes del sitio. Si el mapa del sitio contiene más de 100 vínculos, conviene dividirse en varias páginas.

Conviene mantener una web útil con mucha info rmación y escriba páginas que describan su contenido con claridad y exactitud.

En cada página es importante determinar las palabras que los usuarios escribirían para encontrarla y asegurarse de que realmente las incluye.

Es fundamental utilizar texto en lugar de imágenes para mostrar nombres, contenido o vínculos importantes. El rastreador de Google no reconoce texto incorporado dentro de las imágenes.

Debemos asegurarnos de que los códigos TITLE y ALT sean descriptivos y precisos.

Hay que asegurarse periódicamente que no haya vínculos rotos o código HTML incorrecto.

Para páginas dinámicas, (por ejemplo, una URL que contenga un carácter “?”), hay que tener en cuenta que no todos los motores de búsqueda rastrean páginas dinámicas, además de páginas estáticas. Se recomienda que los parámetros sean cortos y escasos.

El número de vínculos en una página determinada no debería superar los 100.

2.2.2 Aspectos técnicos

Debemos Permitir que los robots de búsqueda rastreen la web sin ID de sesión o argumentos que hacen un seguimiento de su ruta por el sitio. Estas técnicas son de gran utilidad para el seguimiento del comportamiento de un usuario individual, pero el patrón de acceso de los robots es completamente distinto. El uso de estas técnicas puede llevar a una indexación incompleta de su sitio, ya que es posible que los robots no puedan eliminar las URL que tengan un aspecto distinto pero que en realidad apuntan a la misma página.

Debemos asegurarnos que el servidor web acepta la cabecera HTTP If-Modified-Since. Esta funcionalidad permite que el servidor web avise a Google si el contenido de su sitio ha cambiado desde la última vez que rastreamos su sitio. La compatibilidad con esta funcionalidad ahorra ancho de banda y gastos generales.

Es importante que utilicemos el archivo robots.txt en su servidor web. Este archivo comunica a los rastreadores qué directorios pueden o no rastrearse. Asegúrese de que el archivo está actualizado para su sitio de modo que no bloquee accidentalmente el rastreador Googlebot. Para ver más info rmación acerca de cómo configurar los robots que visitan un sitio: http://www.robotstxt.org/wc/faq.html.

Debemos asegurarnos que el CMS puede exportar el contenido de modo que las arañas de los motores de búsqueda puedan rastrear el sitio.

Hay que evitar utilizar “&id=” como parámetro en sus URL, puesto que no incluimos este tipo de páginas en nuestro índice.

2.3 Pautas de accesibilidad

2.3.1 Aspectos a tener en cuenta

Utilizar una herramienta automatizada de validación de la accesibilidad y la navegación. Es necesario tener en cuenta que las herramientas o programas de revisión no contemplan todos los problemas de accesibilidad, tales como la comprensibilidad de un enlace de texto, o la funcionalidad de un texto equivalente, etc.

Validar la sintaxis XHTML, XML, etc.

Validar las hojas de estilo CSS.

Chequear la web con un emulador o navegador solo-texto.

Utilizar varios navegadores gráficos, con:

• sonidos y gráficos cargados,
• gráficos no cargados,
• sonidos no cargados,
• sin ratón,
• marcos, scripts, hojas de estilo, y applets sin cargar

Validar la web con varios navegadores, antiguos y nuevos.

Navegador con conversión texto-voz, un lector de pantalla, un programa de magnificación, una pantalla pequeña, etc.

Utilizar un revisor gramatical y ortográfico. Una persona que lee una página con un sintetizador de voz puede no ser capaz de descifrar la predicción que hace el sintetizador de una palabra que tiene un error ortográfico. Eliminando los problemas gramaticales se incrementa la comprensión.

Revisar el documento en cuanto a su claridad y simplicidad. Las estadísticas de legibilidad, como las que generan algunos procesadores de texto, pueden ser útiles indicadores de la claridad y simplicidad. Es importante contar un editor (humano) experimentado para revisar el contenido escrito en cuanto a su claridad. Los editores pueden también mejorar la usabilidad de los documentos al identificar problemas potenciales de sensibilidad cultural que pueden presentarse debido al uso del lenguaje o de los iconos.

Es aconsejable invitar a personas con discapacidad a revisar los documentos. Los usuarios con discapacidad, noveles o expertos, proporcionaran valiosa info rmación sobre problemas de accesibilidad o usabilidad y sobre su severidad.

2.3.2 Directrices y normas de accesibilidad web

Directrices europeas para facilitar la lectura de una web:

http://www.sidar.org/recur/desdi/pau/directriceseuropeas%20para%20facilitar%20la%20lectura.pdf

Directrices  de accesibilidad para el contenido web:

http://www.w3.org/TR/WAI-WEBCONTENT/

Para facilitar la verificación manual de la aplicación de las pautas de accesibilidad cuando se ha creado una página Web, el WAI ha creado una lista de verificación de los puntos de control de las Directrices de Accesibilidad para el Contenido Web :

ha creado una lista de verificación de los puntos de control de las Directrices de Accesibilidad para el Contenido Web :http://www.sidar.org/recur/desdi/traduc/es/wcag/checker.htm

Niveles de accesibilidad de una página web:

La conformidad con las WCAG 1.0 está definida en la sección 5 de la especificación. Aquí se extracta el texto que define los niveles de conformidad:

Nivel “A” de Conformidad: Se han satisfecho todos los puntos de verificación de Prioridad 1;

Nivel “Doble-A” de Conformidad: Se han satisfecho todos los puntos de verificación de Prioridad 1 y 2;

Nivel “Triple-A” de Conformidad: Se han satisfecho todos los puntos de verificación de Prioridad 1, 2, y 3.

nivel A

Doble-A

Triple-A

*Por omisión, un icono de conformidad se refiere a una única página. Si la declaración pretende aplicarse o incluir más de una página, el icono de conformidad debe ir acompañado de info rmación explícita del alcance, explicando qué páginas cubre la declaración.

*Los proveedores de contenidos son los únicos responsables del uso de estos logos.

3 Nuevas funcionalidades.

3.1 Ajax (Asynchronous JavaScript And XML)

Es una técnica de desarrollo web muy actual para crear aplicaciones interactivas mediante la combinación de tres tecnologías ya existentes:

HTML (o XHTML ) y Hojas de Estilo en Cascada (CSS) para presentar la info rmación;

Document Object Model (DOM) y JavaScript, para interactuar dinámicamente con los datos, y XML y XSLT , para intercambiar y manipular datos de manera desincronizada con un servidor web (aunque las aplicaciones AJAX pueden usar otro tipo de tecnologías, incluyendo texto plano, para realizar esta labor).

En las aplicaciones web tradicionales los usuarios interactúan mediante formularios, que al enviarse, realizan una petición al servidor web. El servidor se comporta según lo enviado en el formulario y contesta enviando una nueva página web. Se desperdicia mucho ancho de banda, ya que gran parte del HTML enviado en la segunda página web, ya estaba presente en la primera. Además, de esta manera no es posible crear aplicaciones con un grado de interacción similar al de las aplicaciones habituales.

En aplicaciones AJAX se pueden enviar peticiones al servidor web para obtener únicamente la info rmación necesaria, empleando SOAP o algún otro lenguaje para servicios web basado en XML, y usando JavaScript en el cliente para procesar la respuesta del servidor web. Esto redunda en una mayor interacción gracias a la reducción de info rmación intercambiada entre servidor y cliente y a que parte del proceso de la info rmación lo hace el propio cliente, liberando al servidor de ese trabajo. La contrapartida es que la descarga inicial de la página es más lenta al tenerse que bajar todo el código JavaScript.

Ejemplos:

· Gmail y Google maps.

• A9, buscador de Amazon
• Flickr, Álbumes de fotos online.
• Oddpost, servicio avanzado de webmail de Yahoo!
• Basecamp, servicio de gestión de proyectos diseñado por 37Signals sobre plataforma Rails.
• 24SevenOffice, ERP/CRM
• Panoramio.com, Comunidad de fotos sobre Google Maps
• meebo, Mensajería Instantánea desde tu navegador

3.2 Sindicación RSS

RSS es parte de la familia de los formatos XML desarrollado específicamente para todo tipo de sitios que se actualicen con frecuencia y por medio del cual se puede compartir la info rmación y usarla en otros sitios web o programas. A esto se le conoce como sindicación .

Lo verdaderamente importante es que a partir de este formato se está desarrollando una cadena de valor nueva en el sector de los contenidos que está cambiando las formas de relación con la info rmación tanto de los profesionales y empresas del sector como de los usuarios. Bloglines, Feedster, Plazoo, Feedness, Retronimo, YourFeeds, Amazon, AllConsuming, NewsIsFree, sindic8, Blogdigger, y un largo etcétera de empresas están explorando nuevas formas de uso y distribución de la info rmación.

¿Le ha gustado este artículo?, ayúdeme a compartirlo.