viernes, 17 de enero de 2025

HOLA MUNDO

                                                             HOLA MUNDO

 

<!DOCTYPE html>

<html lang="es">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Mi Primera Web - ¡Hola Mundo!</title>

</head>

<body>

    <h1>¡Hola Mundo!</h1>

    <p>Esta es mi primera página web.</p>

</body>

</html>

 Actividad: copie y pegue en un archivo de texto y guardelo con la extension .html y ejecutelo, debe ver en pantalla algo similar a:



Transcriba en su cuaderno y prepare sustentación

1. <!DOCTYPE html>

Explicación: Esta línea no es una etiqueta HTML en sí misma, sino una declaración que le dice al navegador qué tipo de documento está a punto de leer.

html: le especifica al navegador que este es un documento HTML (la versión más reciente es HTML5).

 

2. <html lang="es">

<html>: Indica el comienzo del documento HTML

lang="es": Es un atributo que especifica que el idioma principal del contenido es el español.

 

3. <head>

<head> contiene información sobre la página que no es visible directamente en el contenido principal,

               pero es importante para el navegador, los motores de búsqueda y otras herramientas.

                             Tambien marca el inicio de la sección de "cabeza" o metadatos de la página.

 

4. <meta charset="UTF-8">

Esta etiqueta proporciona información sobre la codificación de caracteres que se utiliza en la página.

charset="UTF-8": Especifica que la codificación de caracteres es UTF-8. UTF-8 es un estándar muy

común que permite mostrar correctamente caracteres de casi todos los idiomas, incluidos los acentos y las eñes

 

5. <meta name="viewport" content="width=device-width, initial-scale=1.0">

Esta etiqueta es importante para que la página se vea bien en diferentes dispositivos, como computadoras,

tablets y teléfonos.

              name="viewport": Indica que este meta tag es para la configuración de la "viewport" (el área visible)

content="width=device-width, initial-scale=1.0": width=device-width: Establece que el ancho de la página

debe ser el mismo que el ancho del dispositivo.

initial-scale=1.0: Establece el nivel de zoom inicial a 1 (sin zoom).

 

En pocas palabras: Hace que la página se vea bien en todos los dispositivos y evita que se vea muy pequeña o con zoom en teléfonos móviles.

 

6. <title>Mi Primera Web - ¡Hola Mundo!</title>

<title>: Marca el inicio del título de la página.

 

Mi Primera Web - ¡Hola Mundo!: Es el texto que se muestra como el título.

              Es el nombre de la página web que se ve en la parte superior del navegador.

 

7. </head>

</head>: Marca el fin de la sección de la "cabeza".

 

8. <body>

<body>: Indica el inicio del "cuerpo" o contenido principal de la página.

Es como el interior de un libro: aquí está todo el texto, las imágenes, los videos...

 

9. <h1>¡Hola Mundo!</h1>

 Marca el inicio del encabezado principal.

</h1>: Marca el final del encabezado principal.

 

10. <p>Esta es mi primera página web.</p>

Esta es la etiqueta para un párrafo (paragraph) de texto. Se usa para mostrar texto normal.

       <p>: Marca el inicio de un párrafo.

       </p>: Marca el fin del párrafo.

 

11. </body>

</body>: Marca el fin del "cuerpo" de la página.

 

12. </html>

</html>: Marca el fin del documento HTML.

 

 

Cada página web tiene un esqueleto de etiquetas HTML.

 

<!DOCTYPE html>: Es una instrucción para el navegador.

 

<html>: La etiqueta principal de la página.

 

<head>: Contiene información para el navegador, no visible en el contenido principal.

 

<body>: Contiene todo el contenido visible en la página.

 

<h1>: Título principal.

 

<p>: Párrafos de texto.


No hay comentarios:

Publicar un comentario

TABLAS EN HTML

 TABLAS EN HTML Conceptos Clave de las Tablas HTML Las tablas HTML se construyen con varios elementos clave: <table> : Es el con...