Diseño Web Responsive (HTML5 y CSS3) – Clase N° 20

Diseño Web Responsive (HTML5 y CSS3) - Presentación

¡Sumérgete en el emocionante mundo del diseño web con nuestro curso! Aprende desde cero cómo registrar un dominio, crear páginas web con HTML y CSS, utilizar Flexbox y CSS3 avanzado, integrar multimedia y formularios HTML5, personalizar tipografías y añadir animación con CSS3, y garantizar que tus sitios sean responsivos. ¡Prepárate para destacar en el diseño web!

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 1

¿Qué es y cómo se registra un dominio?Dominios nacionales e internacionales.Nic Argentina

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 2

Servidores Web Online.Servidores pagos y gratuitos.

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 3

¿Qué es HTML?Características Básicas del lenguaje

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 4

Primer documento HTML.Creación de carpetas y archivos.Etiquetas principales.

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 5

Primer documento HTML.Etiquetas y atributos:- Elementos de texto: títulos, párrafos, listas- Enlaces

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 6

Etiquetas y atributos de HTML:- Enlaces con referencia relativa- Etiqueta de imagen. Formatos

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 7

Introducción a CSS. ¿Qué es CSS? ¿Para qué se utiliza? ¿Cómo se puede integrar a HTML? Vinculación de HTML y CSS.

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 8

Selectores CSS- Selector Universal- Selector de etiqueta- Selector de Clase- Selector de ID

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 9

Selectores CSS (parte 2)- Selector de clase (class)- Selector de idCreación y aplicación. Integración en HTML

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 10

Unidades de medida y colores.Color RGB - Hexadecimal

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 11

Modelo de cajas (model box) con HTML y CSS.Elementos semánticos de HTML5.

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 12

Modelo de cajas (model box). Cabecera, Secciones y Pie. Elementos semánticos y propiedades de CSS. Elementos de contenido: Etiqueta

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 13

Tipos de posicionamiento (parte 1)- Position estatic- Position relative- Position absolute- Position fixed- Position sticky

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 14

Tipos de posicionamiento (parte 2)Position absolutePosition fixed

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 15

Maquetación Web con Flexblox. Uso de display: flex

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 16

Nuevas propiedades CSS3- Optimizar el uso del código- Minimizar el uso de imágenes

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 17

Nuevas propiedades CSS3 - Optimización del código- Bordes redondos: border-radius- Sombras: box-shadow / text-shadow

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 18

Nuevas propiedades CSS3 - Optimización del código (parte 2)- Texto en columnas: column-count / column-width / column-gap / column-rule

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 19

Nuevas propiedades CSS3 - Reducción del uso de imágenes- Fondos múltiples con imágenes: background- Patrones con imágenes

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 21

Contenido multimedial en HTML. Etiqueta < video >< /video >. Formatos de video y audio: mp3 y mp4. Atributos de la etiqueta < video >: controls, loop

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 22

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 23

Elementos interactivos en HTML. Etiqueta < mark >. Etiqueta < progress >. Etiqueta < details >. Etiqueta < summary >. Interacción con CSS.

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 24

Formularios en HTML5. Etiqueta < form > < /form >. Atributo action="". Etiqueta < input >. Atributo type="". Atributo placeholder="". Atributo maxlenght="". Atributo minlenght="". Tipos de campos: alfanuméricos, numéricos enteros, contraseñas, fechas.

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 25

Formularios en HTML5. Etiqueta < select >. Etiqueta < option >. Botón de envío. Validación de datos. Atributo required. Integración con CSS.

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 26

Uso de tipografías externas- @font-face- Google Fonts

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 27

Íconos tipográficos. Librerías- Google íconos- Icomoon

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 28

Animación con CSS- @keyframes- animation-name- animation-duration- animation-iteration-count- animation-direction- rotate- scale

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 29

Responsive design. Adaptación del sitio a distintos tamaños de pantalla y diferentes dispositivos. Etiqueta < meta >. Atributo name="". Atributo content="".

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 30

Propiedad media (parte 1)- @media all- min-width- max-width

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 31

Propiedad @media (parte 2)- @media- min-width- max-width

Diseño Web Responsive (HTML5 y CSS3) - Clase N° 32

Breakpoints- @media- min-width- max-witdh- Tamaños relativos