Etiqueta meta html

meta descripción

La cabecera de un documento HTML es la parte que no se muestra en el navegador web cuando se carga la página. Contiene información como el <título> de la página, enlaces a CSS (si decides dar estilo a tu contenido HTML con CSS), enlaces a favicons personalizados, y otros metadatos (datos sobre el HTML, como el autor, y palabras clave importantes que describen el documento). En este artículo cubriremos todo lo anterior y más, con el fin de darle una buena base para trabajar con el marcado.

La cabeza HTML es el contenido del elemento <head> – a diferencia del contenido del elemento <body> (que se muestra en la página cuando se carga en un navegador), el contenido de la cabeza no se muestra en la página. En cambio, la función de la cabeza es contener metadatos sobre el documento. En el ejemplo anterior, la cabecera es bastante pequeña:

Sin embargo, en páginas más grandes, la cabeza puede llenarse bastante.  Pruebe a ir a algunos de sus sitios web favoritos y utilice las herramientas de desarrollo para comprobar el contenido de sus cabeceras. Nuestro objetivo aquí no es mostrarte cómo usar todo lo que se puede poner en la cabecera, sino enseñarte a usar los principales elementos que querrás incluir en la cabecera, y darte cierta familiaridad. Comencemos.Añadir un títuloYa hemos visto el elemento <title> en acción – este puede ser usado para añadir un título al documento. Sin embargo, esto puede confundirse con el elemento <h1>, que se utiliza para añadir un título de nivel superior a su contenido del cuerpo – esto también se refiere a veces como el título de la página. Pero son cosas diferentes.

->  Diseñando pagina web

lista de etiquetas meta

Las etiquetas <meta> suelen utilizarse para proporcionar metadatos estructurados, como las palabras clave, la descripción, el nombre del autor, la codificación de caracteres y otros metadatos de un documento. Se puede colocar cualquier número de etiquetas meta dentro de la sección head de un documento HTML o XHTML.

Nota: El atributo name de la etiqueta meta define el nombre de un elemento de metadatos a nivel de documento, mientras que el atributo content da el valor correspondiente. El valor del atributo content puede contener texto y entidades, pero no puede contener etiquetas HTML.

Algunos motores de búsqueda utilizan los metadatos, especialmente las palabras clave y las descripciones, para indexar las páginas web; sin embargo, esto no es necesariamente cierto. Las palabras clave dan un peso extra a las palabras clave de un documento y la descripción proporciona una breve sinopsis de la página. He aquí un ejemplo:

Sin una metaetiqueta viewport, los navegadores de los móviles renderizan las páginas web a la anchura típica de las pantallas de los ordenadores de sobremesa, y luego las reducen para que se ajusten a la pantalla del móvil. Como resultado, es necesario pellizcar y hacer zoom para ver la página web correctamente en los dispositivos móviles, lo cual es muy incómodo.

generador de metaetiquetas

Forman parte de la sección head de una página web. En una misma página se pueden utilizar varios elementos Meta con diferentes atributos. Los metaelementos pueden utilizarse para especificar la descripción de la página, las palabras clave y cualquier otro metadato que no se proporcione a través de los demás elementos y atributos de la cabecera[1].

->  Campañas publicitarias famosas

Con HTML hasta HTML 4.01 y XHTML inclusive, había cuatro atributos válidos: content, http-equiv, name y scheme. En HTML 5, se ha añadido charset y se ha eliminado scheme. http-equiv se utiliza para emular una cabecera HTTP, y name para incrustar metadatos. El valor de la declaración, en cualquier caso, está contenido en el atributo content, que es el único atributo obligatorio a menos que se indique charset. charset se utiliza para indicar el conjunto de caracteres del documento, y está disponible en HTML5.

El atributo language indica a los motores de búsqueda en qué idioma natural está escrito el sitio web (por ejemplo, inglés, español o francés), a diferencia del lenguaje de codificación (por ejemplo, HTML). Normalmente se trata de una etiqueta IETF para el nombre del idioma. Es muy útil cuando un sitio web está escrito en varios idiomas y puede incluirse en cada página para indicar a los motores de búsqueda en qué idioma está escrita una página concreta. Los agentes de usuario pueden (y de hecho lo hacen) utilizar la información sobre el idioma para seleccionar las fuentes apropiadas para el mismo, lo que mejora la experiencia general del usuario de la página.

noindex

Si tienes algunos conocimientos de códigos y HTML podrás escribir las metaetiquetas en el código fuente de tu página. Si no tienes experiencia, empieza con los siguientes ejemplos. Estos ejemplos de HTML están hechos para ayudarte a entender el HTML.

Las metaetiquetas deben colocarse en la parte llamada HEAD en el código fuente de la página web. Empezamos de forma muy sencilla añadiendo las etiquetas más importantes, un título y una descripción. Mira el ejemplo de abajo.

En nuestro ejemplo empezamos con el HTML más simple. El título y un poco de texto. Si miras en el código fuente de cada página web encontrarás estos códigos HTML básicos. Usamos letras de colores en este ejemplo para que sea más fácil leer el HTML. Los colores no tienen ningún efecto o influencia en los resultados en un motor de búsqueda.

->  Para que sirve el encabezado

Paso 1 – Ajustar el título en la fuente – Etiqueta de título HTMLLa primera frase que se verá y en la que se hará clic como resultado en los motores de búsqueda es el título. Asegúrese de que su título es eficaz y atractivo.

Paso 3 – Asegúrese de que su página funciona en dispositivos móvilesEn los últimos años, se ha hecho evidente que la web multipantalla será el futuro (es decir, el internauta medio utilizará varios dispositivos para completar un objetivo). Las aplicaciones móviles son populares, pero muchos usuarios navegan por los sitios en sus teléfonos móviles y tabletas. Asegúrese de que su sitio web es adaptativo o, como mínimo, responsivo. Y no olvides asegurarte de que tu página funciona desde diferentes lugares. Utiliza los mejores proveedores de VPN de Cooltechzone.com y elige el más adecuado para ti.

Esta web utiliza cookies propias para su correcto funcionamiento. Al hacer clic en el botón Aceptar, acepta el uso de estas tecnologías y el procesamiento de tus datos para estos propósitos. Más información
Privacidad