Metaetiquetas en HTML
Introducción
Las metaetiquetas, etiquetas meta o elementos meta (también conocidas por su nombre en inglés, metatags o meta tags) son etiquetas HTML que se incorporan en el encabezado de una página web y que resultan invisibles para un visitante, pero de gran utilidad para navegadores u otros programas que puedan valerse de esta información.
- La cabecera <head> contiene las etiquetas meta, que son leídas por los buscadores al rastrear información.
- Son una excelente manera para proporcionar a los motores de búsqueda información.
- Cada uno procesará las etiquetas meta que entienden, ignorando el resto.
Metaetiquetas en HTML
Atributos habituales
| Atributo | Descripción | Sintaxis |
|---|---|---|
| description | Descripción del contenido | <meta name="description" content="" /> |
| keywords | Palabras clave sobre qué trata el sitio | <meta name="keywords" content=", , ," /> |
| Charset | Indica la codificación de caracteres | <meta charset="UTF-8"/> |
Metaetiquetas en HTML
Scripts
-
En la cabecera del documento se pueden incluir scripts de diferentes lenguajes de programación. Ejemplos:
- JavaScript
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script> - CSS
<link rel="stylesheet" href="ruta/estilo.css" type="text/css" media="screen" />
Metaetiquetas en HTML
Otras etiquetas
| author | nombre | Indica el nombre del autor de la página. |
| language | idioma | Código ISO 639-1 del idioma del documento HTML. |
| generator | software | Indica el programa utilizado para crear la página web. |
| theme-color | color | Color en formato hexadecimal de la barra de navegación del navegador. . |
| viewport | parámetros | Comportamiento de la región visible del navegador. Ver Adaptable (responsive). |
Metaetiquetas en HTML
viewport
-
Indica al navegador cómo debe renderizarse la página
<meta name="viewport" content="
width = [pixeles | ancho-dispositivo ],
height = [pixeles | alto-dispositivo],
initial-scale = float,
minimum-scale = float,
maximum-scale = float,
user-scalable = [yes | no]
">
Metaetiquetas en HTML
Otras etiquetas
-
Google puede leer otros metadatos que le indican como realizar ciertas acciones:
| Atributo name | Atributo content | Descripción |
|---|---|---|
| nositelinkssearchbox | Indica a Google que no muestre el minibuscador en los sitios de enlaces. | |
| notranslate | Indica a Google que no debe traducir la página. | |
| robots | parámetros | Indica al robot de un buscador si debe indexar o no la página. |
Metaetiquetas en HTML
robots
La etiqueta
<meta name="robots"> puede tener varios parámetros para indicarle diferentes detalles:| Parámetros | Significado |
|---|---|
| index | Sugiere que se quiere indexar el contenido de la página en el buscador. |
| noindex | Indica que no debe indexar el contenido de la página en el buscador. |
| follow | Sugiere que siga los enlaces que encuentre en la página. |
| nofollow | Indica que no debe seguir los enlaces que encuentre en la página. |
| nosnippet | Indica que no muestre fragmentos (descripción, etc...). |
| noodp | Indica que no use la descripción alternativa de DMOZ. |
| noarchive | Indica que no almacene una versión en caché de la página. |
| unavailable_after:[fecha]: | Establece una fecha de caducidad para que no se rastree más la página. |
| noimageindex | Indica que no indexe la página en resultados de Imágenes. |
| none | Equivalente a indicar los parámetros noindex, nofollow. |
Metaetiquetas en HTML
SEO
-
SEO es el proceso de optimizar el contenido en línea, de manera que un motor de búsqueda prefiera mostrarlo entre los primeros resultados para búsquedas de una determinada palabra clave.
SEO se integra en la propia estrategia de negocio y comunicación de una empresa o institución. Las buenas posiciones en los buscadores por sí solas no valen de nada, si no aportan algo a los objetivos de negocio. Por tanto, es necesario integrar la estrategia SEO con el resto de actividades de marketing (mercadotecnia).
El término SEO hace referencia tanto a la propia actividad de optimización para los motores de búsqueda, como a los individuos y empresas que profesionalmente se dedican a tareas de SEO:
- SEO: Search Engine Optimizer: persona o empresa que realiza SEO.
- SEO: Search Engine Optimization: la práctica de optimizar para motores de búsqueda.
Metaetiquetas en HTML
Diferencias entre SEO y SEM
Los resultados de los buscadores son de dos tipos:
- Resultados patrocinados o de pago, SEM:
Los resultados se basan en un sistema de publicidad contextualizado referente a los criterios de búsqueda. Los anunciantes establecen una serie de términos que, cuando sean buscados por los usuarios, mostrarán su publicidad. El orden de los resultados depende de varios factores, entre los que se encuentra un sistema de pujas. El anunciante solo paga cuando se hace clic en uno de sus anuncios, a este sistema se le conoce también por sus siglas PPC (Pago Por Clic). Estos resultados están identificados como publicidad. - Resultados orgánicos, SEO:
Los resultados orgánicos son generados por el buscador en función de su índice de resultados y a un sistema para asignar la relevancia de los mismos mediante un algoritmo. En este caso no se paga nada por publicidad, y aparecer en los primeros resultados depende de seguir una serie de técnicas conocidas como SEO.
La diferencia más importante entre ambos radica en que un anunciante puede asegurarse, de manera aproximada, el estar en los resultados del buscador con sus campañas de Pago Por Clic, mientras que nadie puede asegurar estar en la primera posición en los resultados orgánicos, ya que depende del algoritmo del buscador, así como de los cambios y modificaciones que se van introduciendo en dicho algoritmo.
Es importante resaltar que no existe ninguna interrelación entre los resultados de los enlaces patrocinados y los resultados orgánicos.
Metaetiquetas en HTML
¿Qué hace un SEO?
El trabajo SEO se centra en tres áreas principales:
- Indexabilidad
Hace referencia a la capacidad de un sitio en internet de ser accedido en su totalidad y de forma adecuada por los robots de los buscadores, permitiendo que sea almacenado en los índices de dichos buscadores - Contenido
Una vez el buscador ha accedido e indexado los contenidos, se trata de hacerlos relevantes para determinadas búsquedas. Dichos contenidos han de contener los términos aposicionar en los lugares del documento más importantes y un número adecuado de veces. - Popularidad.
Hace referencia al número de veces que un sitio es enlazado, como la calidad y tipo de sitios que lo enlazan.
Metaetiquetas en HTML
SEO White Hat y SEO Black Hat
-
Una vez conocidos algunos aspectos que afectan al posicionamiento se ha llegado a situaciones de sobreoptimización para buscadores que acaban por mostrar a los usuarios páginas poco relevantes en los resultados. Los buscadores realizan labores de mejora y con ello eliminan algunas páginas que aplican ciertas prácticas, basadas en la optimización exclusivamente para los buscadores pero sin beneficio para el usuario.
Hay una práctica para lograr optimizar el tráfico de buscadores siguiendo las directrices de los motores de búsqueda, conocida como White Hat SEO.
También existen técnicas conocidas como Black Hat SEO, penalizadas por los buscadores al violar sus normas, como por ejemplo haber pagado por enlaces o mostrar contenido diferente a los buscadores que a los usuarios. Cada vez existen técnicas más avanzadas y pueden generar resultados a corto plazo, es una estrategia muy arriesgada que suele terminar en penalizaciones por parte de los buscadores.
Metaetiquetas en HTML
Optimización
Formas de optimizar el contenido:
| Meta Etiquetas | Los buscadores las utilizan para entender de qué trata el sitio y procesar su alta |
| Títulos | Tipos de etiquetas específicas para títulos (h1,...h6) |
| Meta Descripciones | No influye en el posicionamiento, al mostrarse en los resultados influye en las posibilidades de atraer clics hacia el sitio |
| Optimización de imágenes | No utilizar cualquier nombre de imagen, utilizar texto alternativo y titulo |
| URL | No usar direcciones URL que no representen el contenido de la página |
| Optimización del texto | Utilizar palabras clave una cierta cantidad de veces (pueden estar incluidas dentro de las etiquetas “strong”) |
| Enfoque semántico de palabras clave | El contenido debe satisfacer la expectativa de quienes buscan, la palabra clave debe ir conectada siempre a esa intención |
| Velocidad de carga de la página | Influye en el ranking de resultados de Google. Una herramienta útil es testmysite |
| Estructura de los datos | Schema.org es un sitio que muestra cuál es el esquema de datos correcto para posicionarse mejor |
| Google AMP | Recurso para acelerar la carga de una página web desde un dispositivo móvil |