Meta etiqueta HTML explicada con ejemplos
Las meta-etiquetas se declaran dentro de la etiqueta de la cabeza de un documento HTML y no son visibles en el diseño web de esa página. Sin embargo, las meta-etiquetas de cualquier página web se pueden verificar utilizando el atajo de teclado Ctrl+u o haga clic derecho en cualquier lugar de una página web y navegue a Ver código fuente opción.
Los siguientes son los resultados de aprendizaje de esta guía:
- La importancia de las meta-etiquetas
- Tipos de meta-etiquetas HTML
- Uso de meta-etiquetas en un documento HTML con ejemplos
Por qué las meta-etiquetas son importantes
Algunos de ustedes podrían estar explorando el propósito y la importancia de las meta-etiquetas. Esta sección proporciona una visión profunda de la importancia de las meta-etiquetas. Las meta-etiquetas son el reproductor clave en la optimización del motor de búsqueda de una página web. Los meta-etiquetas son utilizados por navegadores y motores de búsqueda para filtrar el contenido de acuerdo con la búsqueda realizada por cualquier usuario. Además, las palabras clave utilizadas en las meta-etiquetas permiten a los navegadores web para clasificar la página HTML específica.
Varios navegadores conocidos como Chrome, Firefox, Edge, Safari y Opera admiten meta-etiquetas. Al practicar meta-etiquetas adecuadas, uno puede obtener los siguientes resultados:
- Impacto positivo en el número de usuarios que visitan la página web
- El compromiso y el tráfico de una página web se pueden aumentar
Tipos de meta-etiquetas
Antes de entrar en el uso, echemos un vistazo a los diversos tipos de meta-etiquetas que podrían usarse en una página web.
- Título: La etiqueta de título de una página HTML se utiliza para mostrar el propósito de esa página en pocas palabras.
- Descripción: Como el nombre indica, proporciona una información breve y precisa sobre una página HTML. Un motor de búsqueda muestra la descripción de la página web bajo el título.
- Revisión: Se puede definir una fecha de revisión de una página específica para mostrar que está actualizando el contenido con el tiempo.
- Actualizar: Una página se puede volver a cargar automáticamente usando esta metaetiqueta.
- Redirección: Uno puede redirigir la página a otras páginas.
- Autor: El nombre del autor se puede especificar usando esta etiqueta.
- Charset: El navegador requiere el conjunto de caracteres y esta metaetiqueta se usa para definir el conjunto de caracteres que se utiliza en un documento HTML.
- Viewport: Esta metaetiqueta establece el tamaño y la escala de zoom de una página HTML.
Cómo se usan las meta-etiquetas
De la sección anterior, habría pasado por la información básica de las meta-etiquetas HTML. Aquí, hemos proporcionado algunos ejemplos que demuestran el uso de las meta-etiquetas indicadas anteriormente:
Título: El título de un documento HTML ofrece una visión general en pocas palabras. El título de un documento HTML se muestra en la parte superior del navegador web como se muestra en la imagen a continuación:
Se puede crear una meta-etiqueta de título dentro de la etiqueta de cabeza de un documento HTML. Por ejemplo, hemos creado una meta-etiqueta de título como se muestra en la siguiente imagen:
Descripción: Se proporciona una descripción breve y, al punto, sobre una página HTML utilizando la etiqueta de descripción. La siguiente imagen muestra el uso de etiquetas de descripción. Se recomienda escribir una descripción de hasta 160 caracteres.
Revisión: Esta meta-etiqueta se usa para denotar la fecha de actualización de la página. Se recomienda actualizar su contenido con frecuencia y usar esta etiqueta para mostrar la fecha de la actualización reciente. Esto ayudaría a clasificar su página HTML. La siguiente imagen muestra que, el 1/1/2022, se actualizó el contenido de esta página:
Actualizar: Para una refrescante automática, esta metaetiqueta se puede usar para especificar el límite de tiempo para una actualización automática. En la siguiente imagen, el tiempo de refresión automática se establece en 11 segundos:
Además, la misma metaetiqueta se puede usar para especificar la URL en el atributo de contenido. Su página será redirigida a esa URL después de alcanzar el límite de tiempo especificado. Por ejemplo, la siguiente imagen muestra que la página se redirigirá a www.Linuxhint.com después de 8 segundos:
Autor: Un sitio web comprende varias páginas HTML y estas páginas pueden ser construidas por varios autores. Para dar créditos, el nombre del autor se puede definir en la metaetiqueta. Por ejemplo, la siguiente imagen muestra que el autor de esta página es Mike Anroz:
Charset: La mayoría de los navegadores usan UTF-8 para codificar caracteres en una página web. Sin embargo, uno puede usar ASCII, pero ha sido reemplazado por UTF-8. Cada vez que se inicia una meta-etiqueta HTML en un editores HTML como el texto sublime y el código VS, verá que establece automáticamente el conjunto de caracteres en UTF-8:
Viewport: La funcionalidad de la vista le permite hacer que su página HTML sea compatible con varios dispositivos. A charlatán y visión Las meta-etiquetas se llaman de forma predeterminada en varios editores HTML como el texto sublime. El visión se usa aquí y la siguiente imagen muestra el tamaño y la escala de zoom de la imagen HTML:
Conclusión
Las metaetics ayudan a obtener el contenido de una manera fácil y eficiente. Aunque estas etiquetas no son visibles, sin embargo, actúan como jugadores fantasmas en SEO. Este artículo contiene la demostración de varias meta-etiquetas utilizadas en un documento HTML. Después de seguir esta guía, obtendrá una comprensión básica de varios tipos de meta-etiquetas, su importancia y cómo usarlas en una página HTML.