10 ejemplos del uso de la Etiqueta <meta>

Ejemplo 1: Descripción del Sitio

La etiqueta <meta> con el atributo name="description" se utiliza para proporcionar una descripción breve y precisa del contenido del sitio web. Esta descripción suele mostrarse en los resultados de búsqueda y es importante para mejorar el SEO (Optimización para Motores de Búsqueda). En la descripción o meta description podemos describir brevemente el contenido de la página web. Esta información se muestra como snippet (una síntesis en dos líneas del tema de una página que aparece bajo la URL) en los buscadores de uso más generalizado como Google o Bing, por lo que se recomienda cuidar su redacción. Por su papel central en tanto que influye de manera decisiva en la elección del usuario del mejor resultado acorde con su búsqueda, este meta tag es considerado uno de los más importantes en cuanto a la optimización para los buscadores. La descripción no debe sobrepasar los 160 caracteres de longitud, ya que se corre el riesgo de que esta aparezca incompleta en la lista de resultados.

Descripción del Sitio

Ejemplo 2: Palabras Clave

Con la etiqueta <meta> y el atributo name="keywords" se pueden especificar las palabras clave que describen el contenido del sitio web. Estas palabras clave ayudan a los motores de búsqueda a indexar y clasificar el contenido de manera más precisa. Con esta etiqueta meta los administradores tienen la posibilidad de definir palabras clave para el buscador. Las keywords son aquellos criterios a los que responde un buscador para ofrecerle al usuario páginas HTML como respuesta, donde tales palabras clave son parte de los meta tags. Anteriormente, esta etiqueta era considerada como el factor SEO más importante, ya que los buscadores primitivos recurrían a este atributo como característica central para el posicionamiento en las listas de resultados. a elección de las palabras clave requiere de cierta sutileza: hay que evitar su uso abusivo, fenómeno conocido como keyword stuffing, así como aquellas sin relación con el contenido de las páginas en una web. A consecuencia de que los archivos locales de búsqueda y los metabuscadores acuden a la información en los meta tags de las palabras clave, se recomienda introducir términos relevantes.

Palabras Clave

Ejemplo 3: Autor del Sitio

El atributo name="author" dentro de la etiqueta <meta> se utiliza para especificar el autor del sitio web. Esto puede ser útil para dar crédito al creador del contenido y proporcionar información sobre la autoría del sitio. Estos dos meta tags, de uso opcional desde el punto legal, permiten hacer referencia al diseñador de una página web y al propietario de los derechos del código fuente de una página HTML. En algunos sistemas de gestión de contenido (CMS), las etiquetas de autor se generan automáticamente y en ellas se nombra a la persona que ha trabajado la página en último lugar. De esta forma, los administradores pueden extraer del directorio quién gestiona cada página.

Autor del Sitio

Ejemplo 4: Redireccionamiento Automático

Usando la etiqueta <meta> con el atributo http-equiv="refresh", podemos redirigir automáticamente a los usuarios a otra página después de cierto tiempo. Por ejemplo: <meta http-equiv="refresh" content="5; url=http://www.ejemplo.com"> redirigirá a los usuarios a http://www.ejemplo.com después de 5 segundos. Con los meta tags “http-equiv” es posible configurar también una transferencia sencilla. De forma parecida a como funciona la etiqueta “expires”, con este atributo también se define una fecha de vencimiento, a partir de la cual los navegadores o los motores de búsqueda serán dirigidos a una URL establecida previamente. Sin embargo, puede ocurrir que esta etiqueta no funcione en caso de ajustes especiales en el navegador, por lo que, en lugar de indicar un reenvío con meta tags, el W3C (World Wide Web Consortium), dedicado a la estandarización de técnicas y usos en Internet, recomienda usar el código de estado de HTTP 301, por medio del cual un servidor informa de si el archivo buscado ha cambiado de ubicación.

Redireccionamiento Automático

Ejemplo 5: Compatibilidad con Internet Explorer

Con la metaetiqueta http-equiv="X-UA-Compatible", podemos especificar la versión de Internet Explorer que debe usar el navegador para renderizar la página correctamente. Por ejemplo: <meta http-equiv="X-UA-Compatible" content="IE=edge"> indica al navegador que utilice la última versión disponible de Internet Explorer. Las páginas web que cuentan con este meta tag se cargan nuevamente desde el servidor web cada vez que se accede a ellas. Esto puede ralentizar la navegación, pero puede ser conveniente en el caso de páginas que actualizan su contenido diariamente.

Compatibilidad con Internet Explorer

Ejemplo 6: Especificación de Tipo de Contenido

La metaetiqueta http-equiv="Content-Type" se utiliza para especificar el tipo de contenido del documento. Por lo general, se establece en text/html; charset=UTF-8 para documentos HTML con codificación UTF-8. El atributo “http-equiv” se utiliza para simular una respuesta HTTP. Algunos de los valores comunes para este atributo incluyen “Content-Type”, “X-UA-Compatible” y “refresh”. El atributo “content” se utiliza junto con “http-equiv” para proporcionar información adicional.

Especificación de Tipo de Contenido

Ejemplo 7: Control de Caché del Navegador

Mediante la metaetiqueta http-equiv="cache-control", podemos controlar cómo el navegador debe almacenar en caché el contenido de la página. Por ejemplo: <meta http-equiv="cache-control" content="no-cache"> indica al navegador que no almacene en caché la página. El encabezado HTTP Cache-Controlcontiene directivas (instrucciones), tanto en solicitudes como en respuestas, para controlar el almacenamiento temporal (caching) en navegadores y cachés compartidos (p. ej. Proxies, CDN).

Control de Caché del Navegador

Ejemplo 8: Especificación de Robots

La metaetiqueta name="robots" se utiliza para controlar el comportamiento de los robots de los motores de búsqueda en la página. Por ejemplo: <meta name="robots" content="index, follow"> permite que los motores de búsqueda indexen y sigan los enlaces de la página. Se tiene que indicar expresamente si una página no debe ser incluida en el índice. Este tag prohíbe al buscador transferir contenidos de una página HTML a su base de datos. El atributo “robots” se dirige a todos los buscadores, y “noindex” indica que no se permite la indexación. Si queremos impedirle el proceso solo a un buscador, podemos indicarlo con un atributo alternativo como, por ejemplo, “googlebot”.

Especificación de Robots

Ejemplo 9: Redirección Segura

Con la metaetiqueta http-equiv="refresh" y el atributo content="0;URL=https://www.ejemplo.com", podemos redirigir automáticamente a los usuarios a una página segura. Por ejemplo: <meta http-equiv="refresh" content="0;URL=https://www.ejemplo.com"> redirigirá instantáneamente a los usuarios a https://www.ejemplo.com. Con los meta tags “http-equiv” es posible configurar también una transferencia sencilla. De forma parecida a como funciona la etiqueta “expires”, con este atributo también se define una fecha de vencimiento, a partir de la cual los navegadores o los motores de búsqueda serán dirigidos a una URL establecida previamente.

Redirección Segura

Ejemplo 10: Noindex

Mediante la metaetiqueta name="robots" y el valor noindex, podemos indicar a los motores de búsqueda que no indexen la página. Por ejemplo: <meta name="robots" content="noindex"> instruye a los motores de búsqueda a no indexar la página en los resultados de búsqueda. Una de las principales funciones de los meta tags es proporcionar instrucciones para la indexación a los crawlers (robots o googlebots). Esto se logra con la etiqueta meta “robots”. Con los siguientes meta tags es posible estipular si una página será indexada y, en consecuencia, si estará disponible para la búsqueda. También se puede establecer si los robots han de seguir los enlaces salientes o si, por el contrario, han de ignorarlos. Esta información se cuenta entre los metadatos más relevantes para el SEO. Se tiene que indicar expresamente si una página no debe ser incluida en el índice. Este tag prohíbe al buscador transferir contenidos de una página HTML a su base de datos.

Noindex