NOVENO GRADO


APRENDIZAJE:

Conocer y usar los elementos básicos y necesarios en el diseño gráfico de una web utilizando software especializado para la creación de páginas web personales. 

Conducta de entrada:

  1. ¿Qué es una página web?
  2. ¿Para qué se utilizan las páginas web?
  3. ¿Cuál es la diferencia entre una página web y un sitio web?
  4. ¿Qué componentes básicos debe tener una página web?
  5. ¿Qué es HTML y cuál es su función en una página web?
  6. ¿Qué es un dominio web y por qué es importante?
  7. ¿Qué es el hosting web y por qué es importante?
  8. ¿Qué entiendes por diseño responsivo en el contexto de páginas web?
  9. ¿Cuál es la importancia de la accesibilidad en las páginas web?
  10. ¿Cómo se puede medir el rendimiento de una página web?

Una página web es un documento digital accesible a través de Internet mediante un navegador web. Está compuesta por elementos como texto, imágenes, videos y enlaces que permiten la navegación a otras páginas. Las páginas web se crean utilizando lenguajes de marcado como HTML, y pueden incorporar estilos y funcionalidades adicionales mediante CSS y JavaScript. Sirven diversos propósitos, desde proporcionar información hasta ofrecer servicios interactivos, y son una parte fundamental de la presencia en línea de individuos y organizaciones.

¿Qué es HTML?,  (HyperText Markup Language) es el lenguaje estándar para crear páginas web, definiendo su estructura y contenido mediante etiquetas y atributos

Etiquetas del html.
Claro, aquí tienes una lista de las etiquetas HTML más comunes:

1. <html> Define el documento HTML.
2.<head> Contiene metadatos y enlaces a recursos externos.
3. <title>`: Define el título de la página, mostrado en la barra del navegador.
4.<body>`: Contiene el contenido principal de la página.
5.<h1>` a `<h6>`: Encabezados, donde `<h1>` es el más importante y `<h6>` el menos importante.
6.<p>`: Define un párrafo.
7.<a>`: Define un enlace (hipervínculo).
8.<img>`: Inserta una imagen.
9.<ul>`: Define una lista desordenada (bullet points).
10.<ol>`: Define una lista ordenada (numerada).
11.<li>`: Define un elemento de una lista.
12.<div>`: Define una división o sección en el documento.
13.<span>`: Define una sección en línea, utilizada para agrupar elementos en línea.
14.<table>`: Define una tabla.
15.<tr>`: Define una fila de la tabla.
16.<td>`: Define una celda de la tabla.
17.<th>`: Define una celda de encabezado en una tabla.
18.<form>`: Define un formulario.
19.<input>`: Define un campo de entrada en un formulario.
20.<button>`: Define un botón interactivo.

Estas etiquetas nos permiten ponerle movimiento al texto:
<marquee>éste texto se moverá de derecha a izquierda</marquee>

<marquee width="60%" direction="down" height="100px">
éste texto se moverá de arriba hacia abajo
</marquee>

<marquee width="60%" direction="right" height="100px">
éste texto se moverá de izquierda a derecha
</marquee>

<marquee behavior="scroll" direction="up" scrollamount="1">éste texto sube suavecito</marquee>

<marquee behavior="scroll" direction="right" scrollamount="12">éste texto va de izquierda a derecha rapidito</marquee>

<marquee behavior="scroll" direction="left" scrollamount="20">éste texto se moverá de derecha a izquierda rapidito</marquee>

<marquee behavior="scroll" direction="right" scrollamount="50">Véste texto se moverá de izquierda a derecha muy rápido</marquee>
CLIC PARA ENTRAR AL EDITOR HTML



Entra al editor y escribe el siguiente código:



copia y pega este código
1

<img src="https://hosting.profekadi.com/estudiante/kadi/c.png">

2

<img src="https://hosting.profekadi.com/estudiante/kadi/duck.gif">





Tipos de letras

<html>
<head>
    <style>
        body {
            font-family: Trebuchet MS, sans-serif;
        }
    </style>
</head>
<body>
    <h1>Este es un título</h1>
    <p>Este es un párrafo con la fuente Trebuchet.</p>
</body>
</html>