HTML5 y CSS3 para principiantes: la guía definitiva
4.3 (3 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
12 students enrolled
Wishlisted Wishlist

Please confirm that you want to add HTML5 y CSS3 para principiantes: la guía definitiva to your Wishlist.

Add to Wishlist

HTML5 y CSS3 para principiantes: la guía definitiva

Aprende HTML5 y CSS3 para crear modernas y dinámicas páginas web con animaciones y transiciones sin apenas esfuerzo.
4.3 (3 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
12 students enrolled
Created by Grupo SYNCROM
Last updated 7/2016
Spanish
Current price: $10 Original price: $80 Discount: 88% off
1 day left at this price!
30-Day Money-Back Guarantee
Includes:
  • 6.5 hours on-demand video
  • 1 Article
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Have a coupon?
What Will I Learn?
Proporcionar a los alumnos un conocimiento del nuevo estándar de Internet: HTML 5 y CSS 3.
View Curriculum
Requirements
  • Para realizar este curso se necesitan conocimientos previos de HTML 4 y de CSS 2.1.
Description

Aprende los conceptos y herramientas básicas para desarrollar una web con los nuevos estándares HTML5 y CSS3.

Obtén unos conocimientos sólidos en HTML5 y CSS3 con este curso para principiantes.

  • Sintáxis, etiquetas semánticas, layouts, etiquetas nuevas, modificadas y obsoletas, soporte de los navegadores
  • Selectores, pseudo-elementos, media queries
  • Web Fonts, propiedades de caja, sombras y fondos múltiples
  • Transparencias y gradientes de colores
  • Transformaciones, transiciones y animaciones


Todo el poder de la maquetación con HTML 5 y CSS 3 ahora a tu alcance, con nuestra guía definitiva y en vídeo.

HTML 5 y CSS 3 son los nuevos estándares de la web. Mediante HTML 5 obtenemos una mayor sofisticación de código que con HTML 4, y podremos construir las estructuras de formas nuevas y óptimas.

En cuanto a las hojas de estilo con CSS 3, tendremos disponibles gran variedad de opciones para hacer cosas que antes eran impensables sin mucho código. Tendremos opciones como sombreados y redondeados, pero también funciones avanzadas de movimiento y transformación.

Este es un curso únicamente en vídeo. Verás la imagen de nuestra pantalla y escucharás al profesor hablando mientras ves lo que hace en su pantalla. Muy útil y didáctico.

Además, te enseñaremos a utilizar herramientas fundamentales para hacer la vida mucho más fácil al programador, como generadores de código que harán las delicias de quién los use.

Al finalizar el curso serás capaz de crear páginas web utilizando HTML 5 y darles vida con transformaciones, animaciones e incorporando increíbles efectos gráficos con CSS 3 y sin apenas esfuerzo.


Who is the target audience?
  • Este curso está dirigido a todas aquellas personas que deseen actualizar sus conocimiento de HTML 4 y CSS 2.1 hacia el nuevo estándar de la red.
  • También tenemos alumnos que desean conocer qué cosas se pueden hacer con HTML 5 y con CSS 3, porque son jefes de proyecto por ejemplo, pero no van a codificar ya más. Este curso está preparado también para que esas personas puedan tener una idea general de HTML 5 y CSS 3 sin necesidad de hacer ninguna línea de código.
Students Who Viewed This Course Also Viewed
Curriculum For This Course
Expand All 29 Lectures Collapse All 29 Lectures 06:29:32
+
HTML 5
11 Lectures 02:27:15
  • Introducción al HTML 5 haciendo un repaso a todos los puntos que vamos a ver en este módulo.
  • Comienzo del curso.
  • Sintaxis de HTML 5
  • Doctype
  • Head
Preview 06:43

  • Etiquetas semánticas
  • Header
  • Nav
  • Ejemplo
Tema 2 (parte 1)
19:30

  • Examinamos un ejemplo real donde se usa Header y Nav. En este ejemplo vemos como los desarrolladores de la web han optado por una mezcla entre etiquetas HTML 5 y etiquetas DIV.
Tema 2 (parte 2)
03:42

  • Footer
  • Ejemplo
  • Evaluamos una página web real viendo su código fuente
Tema 3 (parte 1)
12:53

  • Section
  • Ejemplo
  • Evaluamos una web real
Tema 3 (parte 2)
08:51

  • Article
  • A través de una web real, se ilustra el significado de Article
  • Ejemplo
  • A través de otra web real, identificamos los elementos vistos hasta este momento
  • Aside
  • Ilustramos el uso de Aside dentro de las dos webs reales que hemos vista antes
Preview 19:44

  • Ejemplos de Aside
  • Evitando los "fat footers"
  • ¿Qué etiqueta semántica debemos escoger en cada momento?
  • Layouts
Tema 4 (parte 2)
16:18

  • Estructura del documento: Secciones, encabezados y outline
  • Fuera del outline: <hgroup>
  • Encabezados: conclusiones
Tema 5
19:55

  • Nuevas etiquetas
  • <figure>
  • <time>
  • <details>
  • <mark>
  • <meter>
  • <progress>
Tema 6 (parte 1)
16:40

  • Etiquetas redefinidas
  • Etiquetas obsoletas
Tema 6 (parte 2)
12:37

  • Soporte en los navegadores
  • Validando el código
  • HTML5 Boilerplate
Tema 6 (parte 3)
10:22
+
CSS 3
17 Lectures 04:01:34
  • Dónde encontrar documentación gratuita sobre CSS 2.1 y también otras materias, como HTML 4.
  • Repaso a los contenidos del módulo
  • Introducción a CSS 3
  • Selectores: selector de atributos en CSS 2.1
Tema 7
07:53

  • Selectores: selector de atributos en CSS 2.1 (continuación del vídeo anterior)
  • Selectores: selector de atributos en CSS 3
  • Selectores: selector de hermanos
Tema 8 (parte 1)
05:58

  • Pseudo-clases
  • Pseudo-elementos
Tema 8 (parte 2)
13:29

  • Selectores CSS 3: soporte y especificación
  • Media Queries: Introducción
  • Media Queries: Sintaxis
  • Media Queries: logic
  • Media Queries: media
  • Media Queries: expression
  • Media Queries: media features
  • Media Queries: Condiciones múltiples
Tema 8 (parte 3)
23:52

  • Ejemplo de uso de las media queries
  • Web Fonts: introducción y sintaxis
  • Web Fonts: src
  • Web Fonts: formatos
  • Web Fonts: formatos y generador
  • Web Fonts: soporte y especificación
Tema 9 (parte 1)
14:49

  • Propiedades de texto: text-shadow
  • Ejemplos de text-shadow
  • Generador de text-shadow
  • Soporte y especificación de text-shadow
  • Propiedades de texto: Múltiples columnas
Tema 9 (parte 2)
12:54

  • Múltiples columnas: otras propiedades
  • Múltiples columnas: elementos internos y comportamiento
  • Múltiples columnas: Soporte y especificación
  • Propiedades de caja: box-shadow
  • Ejemplos de box-shadow
  • Generador de box-shadow
  • Soporte y especificación de box-shadow
Tema 9 (parte 3)
16:09

Propiedades de caja (seguimos viendo propiedades de caja)

  • border-radius
  • Ejemplos de border-radius
  • Generador de border-radius
  • Soporte y especificación de border-radius
  • Múltiples fondos
  • Ejemplos de múltiples fondos
  • Soporte y especificación de múltiples fondos
Tema 9 (parte 4)
14:59

Propiedades de caja (continuamos con estos elementos)

  • Nuevas opciones para fondos
  • Soporte y especificación de las nuevas opciones para fondos
  • Imágenes en los bordes
  • Ejemplo de bordes con imágenes
  • Soporte y especificación de las imágenes en los bordes
Tema 9 (parte 5)
11:49

  • Color, opacidad y transparencia
  • Ejemplo
  • Color: RGBA y HSLA
  • Generadores de RGBA y HSLA
  • RGBA y HSLA: Soporte y especificación
Tema 10 (parte 1)
13:06

  • Gradientes
  • Gradientes lineales
  • Ejemplos de gradientes lineales
  • Gradientes radiales
  • Ejemplos de gradientes radiales
  • Generadores de gradientes
  • Gradientes: Soporte y especificación
Tema 10 (parte 2)
12:30

  • Transformaciones
  • Transformaciones 2D: rotate
  • Ejemplos de rotate
  • Transformaciones 2D: translate
  • Ejemplos de translate
  • Transformaciones 2D: skew
  • Ejemplos de skew
  • Transformaciones 2D: scale
  • Ejemplos de scale
  • Transformaciones 2D: Múltiples transformaciones
  • Transformaciones 2D: Soporte y especificación
Tema 11 (parte 1)
19:01

Transformaciones 3D

  • Rotación respecto a los ejes
  • Ejemplos
  • Rotaciones y backface-visibility
Tema 11 (parte 2)
16:42

Transformaciones 3D

  • Desplazamiento
  • Ejemplos
  • Escalado


Soporte y especificación de las transformaciones 3D

Tema 11 (parte 3)
12:12

Transiciones

  • Las transiciones con CSS 3
  • transition-property y transition-duration
  • Ejemplos
  • transition-timig-function
  • Ejemplos
  • Curvas bezier para timing-function
Tema 11 (parte 4)
16:56

Transiciones

  • transition-delay
  • transition
  • Ejemplos
  • Transiciones y transformaciones
  • Soporte y especificación
  • Ejemplos de animaciones usando transiciones y transformaciones
Tema 11 (parte 5)
13:36

Animaciones

  • CSS 3 y las animaciones
  • Propiedades
  • Ejemplo
  • Soporte y especificación
  • Más información sobre las animaciones
  • Analizamos varias animaciones
Preview 15:39
+
Consideraciones finales
1 Lecture 00:43

Consideraciones finales

Consideraciones finales
00:43
About the Instructor
Grupo SYNCROM
4.3 Average rating
41 Reviews
205 Students
5 Courses
25 años formando futuros. 25 años ayudando a personas.

Con más de 25 años de experiencia en formación, nuestros cursos están diseñados para que te sean útiles. No engordamos las horas de curso por el hecho de tener más horas. De hecho, nos gusta lo contrario, es decir, explicamos los conceptos de forma clara y concisa y utilizando el mínimo tiempo posible para ello. Porque el tiempo es oro, y es un recurso precioso al que la gente tiene que aprender a darle el gran valor que posee.

Nuestros profesores tienen sobrada experiencia en las materias que imparten. No son teóricos. Antes que patrones, hemos sido marineros. 

Con Udemy, hemos descubierto una puerta que utilizamos para acercar formación de calidad a precios asequibles a todo el mundo.

Nuestros temarios están diseñados para hacer sencillo el aprendizaje. Aunque la materia que tratemos parezca complicada, te la haremos lo más sencilla posible. Somos gente normal, con ganas de enseñar lo que sabemos, y lo que nos ha costado años aprender, y que hemos resumido en unas horas de conocimiento intensivo.

No te olvides de valorar nuestros cursos. Es la forma en que tú nos puedes agradecer el esfuerzo enorme que hemos puesto en la creación de cada uno de los cursos que tenemos, y en los que todavía no han visto la luz pero en los que estamos trabajando.