<meta> en HTML5El elemento <meta> en HTML5 es un elemento vacío (no tiene contenido ni una etiqueta de cierre) que se utiliza para representar metadatos sobre el documento HTML. Los metadatos ayudan a proporcionar información básica sobre el documento, como la descripción, palabras clave, autor, y más. Este elemento suele colocarse en la sección <head> del documento.
<meta>charset:
<meta charset="UTF-8">name:
content.description, keywords, author, viewport.<meta name="description" content="Una breve descripción de la página.">http-equiv:
content-type, expires, refresh, set-cookie.<meta http-equiv="refresh" content="30">content:
name o http-equiv.<meta name="author" content="Jane Doe">scheme:
content. Este atributo es poco común y no se usa frecuentemente.property:
<meta property="og:title" content="The Rock"><meta> en HTML5 con EjemplosDefinir la codificación de caracteres es crucial para garantizar que se muestren correctamente los caracteres especiales.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<title>Ejemplo de Codificación</title>
</head>
<body>
<p>¡Hola mundo!</p>
</body>
</html>Esto es útil para mejorar la optimización del motor de búsqueda (SEO).
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="description" content="Esta es una página de ejemplo para demostrar el uso del elemento meta.">
<title>Ejemplo de Descripción</title>
</head>
<body>
<p>Contenido de la página.</p>
</body>
</html>Las palabras clave pueden ayudar en la indexación de motores de búsqueda.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="keywords" content="HTML, ejemplo, meta, SEO">
<title>Ejemplo de Palabras Clave</title>
</head>
<body>
<p>Contenido de la página.</p>
</body>
</html>Esto proporciona información sobre quién creó el documento.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="author" content="Juan Pérez">
<title>Ejemplo de Autor</title>
</head>
<body>
<p>Contenido de la página.</p>
</body>
</html>El atributo viewport se utiliza para controlar cómo se muestra una página web en dispositivos móviles.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ejemplo de Viewport</title>
</head>
<body>
<p>Contenido de la página.</p>
</body>
</html>Utilizando el atributo http-equiv, puedes redirigir automáticamente a otra página.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta http-equiv="refresh" content="10;url=https://www.ejemplo.com">
<title>Ejemplo de Redirección</title>
</head>
<body>
<p>Serás redirigido en 10 segundos.</p>
</body>
</html>Estos son solo algunos ejemplos y usos comunes del elemento <meta> en HTML5, destacando su importancia para SEO , accesibilidad, y correcta representación del contenido web.