paginas web html

Presentation

•

Other

•

Professional Development

•

Practice Problem

•

Hard

Alexis Caratar

Used 4+ times

FREE Resource

14 Slides • 0 Questions

Introducción al Desarrollo
de Páginas Web

Esta presentación ofrece una visión general del desarrollo web.

Exploraremos HTML, CSS y JavaScript. Aprenderemos sobre la

estructura, el estilo y la interactividad. Prepárense para un viaje al mundo

del diseño web.

Ing. Alexis Caratar

Introducción a HTML, CSS
y JavaScript

Descubre los pilares del desarrollo web moderno. Aprende cómo HTML

estructura el contenido. Explora cómo CSS da estilo y diseño. Sumérgete

en cómo JavaScript añade interactividad. Esta presentación te guiará

por los conceptos básicos.

Estructura básica de un
documento HTML

Un documento HTML comienza con la etiqueta <!DOCTYPE html>.

Contiene las etiquetas <html>, <head> y <body>. El <head> incluye

metadatos y el <body> el contenido visible.

1 <!DOCTYPE html>

Define el tipo de documento.

2 <html>

Elemento raíz del documento.

3 <head>

Metadatos y configuración.

4 <body>

Contenido visible de la página.

Etiquetas HTML
Fundamentales

<div>

Define una división o sección en el documento. Es un contenedor

genérico.

<span>

Es un contenedor en línea para texto o elementos. Se usa para

estilos específicos.

<a>

Crea un enlace a otra página o recurso. Usa el atributo "href" para

la URL.

<img>

Inserta una imagen en la página. Usa el atributo "src" para la ruta

de la imagen.

Encabezados y Párrafos

Definen encabezados de

diferentes niveles. <h1> es el

más importante.

<p>

Representa un párrafo de

texto. Se utiliza para contenido

textual extenso.

Anidamiento

Los encabezados no deben anidarse directamente. Usar la jerarquía

correctamente.

Enlaces y Listas

Enlaces

Crean hipervínculos a otros documentos o ubicaciones.

Usar el atributo href.

Listas Ordenadas

Muestran elementos en un orden específico. Se usa la

etiqueta <ol>.

Listas No Ordenadas

Presentan elementos sin un orden particular. Se usa la

etiqueta <ul>.

Imágenes y Multimedia

<img>

Muestra imágenes en

la página web. El

atributo src

especifica la fuente.

<video>

Inserta videos en la

página. Controlar con

atributos como

controls.

<audio>

Integra audio en la

página. Similar a

video, usa el atributo

controls.

¿Qué es CSS?

CSS (Cascading Style Sheets) controla la presentación visual de una

página web. Define colores, fuentes, márgenes y diseños. Separa el

estilo del contenido, facilitando el mantenimiento.

Estilo visual

Define la apariencia de los elementos HTML.

Diseño

Controla la disposición de los elementos en la página.

Estilos con CSS

CSS (Cascading Style Sheets) se usa para dar estilo y formato a las páginas web. Separar la presentación del contenido

mejora la mantenibilidad. Se aplica mediante selectores, propiedades y valores.

Selectores

Apuntan a los elementos HTML que

se van a estilizar.

Propiedades

Determinan el aspecto del elemento,

como color, fuente, etc.

Valores

Especifican la configuración para

cada propiedad.

¿Qué es JavaScript?

JavaScript es un lenguaje de programación que añade interactividad a

las páginas web. Permite crear efectos dinámicos, animaciones y

respuestas a las acciones del usuario.

Interactividad

Añade dinamismo a las páginas web.

Funcionalidad

Permite responder a las acciones del usuario.

Interacción con JavaScript

Eventos

Funciones

DOM

JavaScript añade interactividad a las páginas web. Permite modificar el DOM (Document Object Model). Se usan eventos y

funciones para crear experiencias dinámicas. Los frameworks como React simplifican el desarrollo.

Integración de los tres lenguajes

HTML proporciona la estructura, CSS el estilo y JavaScript la interactividad. Los tres lenguajes trabajan juntos para crear una

experiencia web completa y atractiva. Una buena integración es clave para el éxito.

1 Experiencia web

JavaScript

CSS

HTML

Introducción al Desarrollo
de Páginas Web

Esta presentación ofrece una visión general del desarrollo web.

Exploraremos HTML, CSS y JavaScript. Aprenderemos sobre la

estructura, el estilo y la interactividad. Prepárense para un viaje al mundo

del diseño web.

Ing. Alexis Caratar

Show answer

Auto Play

Slide 1 / 14

SLIDE

Similar Resources on Wayground

10 questions

La música andina del Perú

Lesson

•

1st Grade

10 questions

Regatul Unit Marea Britanie și Irlanda de Nord

Lesson

•

1st - 10th Grade

10 questions

Les accords du participe passé

Lesson

•

7th - 10th Grade

11 questions

GOKU

Lesson

•

1st Grade

10 questions

La famille et les adjectifs possessives

Lesson

•

6th Grade

11 questions

Economía: Módulo II - Elasticidades. Teoría del consumidor.

Lesson

•

University

11 questions

La exposición

Lesson

•

University

10 questions

La oración

Lesson

•

2nd Grade

Popular Resources on Wayground

15 questions

Fractions on a Number Line

Quiz

•

3rd Grade

10 questions

Probability Practice

Quiz

•

4th Grade

15 questions

Probability on Number LIne

Quiz

•

4th Grade

20 questions

Equivalent Fractions

Quiz

•

3rd Grade

25 questions

Multiplication Facts

Quiz

•

5th Grade

$fractions$

22 questions

fractions

Quiz

•

3rd Grade

6 questions

Appropriate Chromebook Usage

Lesson

•

7th Grade

10 questions

Greek Bases tele and phon

Quiz

•

6th - 8th Grade

Discover more resources for Other

20 questions

Black History Month Trivia Game #1

Quiz

•

Professional Development

20 questions

90s Cartoons

Quiz

•

Professional Development

12 questions

Mardi Gras Trivia

Quiz

•

Professional Development

7 questions

Copy of G5_U5_L14_22-23

Lesson

•

KG - Professional Dev...

12 questions

Unit 5: Puerto Rico W1

Quiz

•

Professional Development

42 questions

LOTE_SPN2 5WEEK2 Day 4 We They Actividad 3

Quiz

•

Professional Development

15 questions

Balance Equations Hangers

Quiz

•

Professional Development

31 questions

Servsafe Food Manager Practice Test 2021- Part 1

Quiz

•

9th Grade - Professio...