Maestría en Diseño Web Responsive (para no programadores)
4.5 (32 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.
909 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Maestría en Diseño Web Responsive (para no programadores) to your Wishlist.

Add to Wishlist

Maestría en Diseño Web Responsive (para no programadores)

Aprender a crear sitios web capaces de adaptarse a cualquier dispositivo usando la técnica Responsive Web Design.
4.5 (32 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.
909 students enrolled
Created by Erick Mines
Last updated 11/2016
Spanish
Price: $160
30-Day Money-Back Guarantee
Includes:
  • 15.5 hours on-demand video
  • 1 Article
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • Utilizar el HTML5 y CSS3 para crear sitios web semánticamente bien estructurados.
  • Crear páginas web con los estándares actuales de HTML5.
  • Aprenderás a desarrollar un sitio web desde cero.
View Curriculum
Requirements
  • Usted necesita tener nociones básicas de informática.
  • Usted necesita tener nociones básicas de Html5 y CSS3.
Description

¿Las páginas web que realizas se muestran correctamente en móviles o tabletas?. Si tu respuesta es NO, entonces estas en graves problemas.

Pero tranquilo, hemos preparado un entrenamiento que te permitirá construir tus propios sitios web Responsive en cuestión de horas.

¿DE QUÉ SE TRATA EL CURSO

Te enseñaré la técnica llamada RESPONSIVE WEB DESIGN que nos permite construir  sitios web accesibles y legibles en todo tipo de dispositivos, desde pequeños móviles hasta grandes pantallas. 

Gracias a esta técnica tu sitio web  responderá y se adaptará automáticamente al tamaño y la resolución de cada dispositivo. ¿No es genial?.

¿PORQUE MI SITIO WEB DEBE VERSE BIEN EN MÚLTIPLES DISPOSITIVOS?

Simple: "Podrás llegar a muchas más personas con un único sitio web". Personas que suelen conectarse desde una Tablet o móvil, tendrán un mejor experiencia de navegación en sitio y estarán felices.

También y no menos importante: "Google así lo exige" y ama los sitios Responsive. Desde el 2015 Google anunció que el uso de la técnica Responsive web design  es tomada como un factor de clasificación dentro de los resultados de búsqueda (SEO).

Un sitio web que no se muestra correctamente en un dispositivo  móvil, corre el riesgo de deslizarse tristemente hasta las últimas posiciones en los buscadores, trayendo esto, consecuencias negativas en la visibilidad del sitio.

Recuerda: "La web móvil no es una moda, llegó para quedarse. Sólo nos queda adaptarnos."

¿CÓMO ESTÁ ESTRUCTURADO ESTE CURSO? 

Empezamos con un corto video introductorio en donde entenderás la Técnica Responsive Web Design de una forma clara y el por qué es la mejor solución para tus proyectos web. 

Luego seguimos con conceptos más técnicos pero sencillos, veremos  "Las Medias Queries" y "Los viewPort" que son las piezas claves para aplicar la técnica correctamente.

A continuación empezaremos a optimizar el contenido y te enseñaremos a crear Texto e imágenes Responsive, para así tener un contenido mucho más accesible.

Y por supuesto, no puede faltar la creación de "Menús Responsive", aquí te enseñaremos a crear 4 tipos de menús Responsive desde 0 basados únicamente en CSS3. 

Casi terminando el curso hablaremos sobre la "Carga condicional de recursos" es decir, si nuestros usuarios ven nuestra página desde un MOVIL mostrarles imágenes de menor tamaño, evitar que se carguen archivos JS o CSS innecesarios. La carga condicional de recursos es pieza clave para brindar una mejor experiencia a tus visitantes.

Y para concluir el curso te enseñaremos a dar soporte a navegadores obsoletos como INTERNET EXPLORER 9, también haremos las pruebas de compatibilidad  y subiremos nuestro proyecto a un servidor real.

Al final del curso abras creado el sitio web que siempre has soñado: Atractivo100% Responsive (PC, tablet, Smartphone) y totalmente personalizado.

¿QUE APRENDERÁS EN ESTE CURSO?

  • Lograrás Entender y Dominar la Técnica Responsive web Design:
    Y toda la tecnología relacionada en la creación de sitios adaptables a todas las pantallas (HTML5, CSS3 y JavaScript).
  • Conseguirás Planificar y Desarrollar Sitios web modernos:
    Compatibles con teléfonos, tabletas y otros dispositivos, 100% optimizados  al entorno en el que se visualice, garantizando así, un alto rendimiento.
  • Podrás Monetizar tus conocimientos:
    La creación de sitios web Adaptables a cualquier dispositivo implica el  aumento en el presupuesto de un sitio web, al mismo tiempo te abrirá nuevas posibilidades laborales.


¿QUIEN SOY? 

Me llamo Erick Mines CEO de Aulaideal.com y te llevaré de la mano a lo largo de este curso, te aseguro que no estarás solo. Tengo más de 10 años diseñando sitios web y más de 4 años aplicando exitósamente  la Técnica Responsive Web Design a mis proyectos.

Un abrazo y te veo dentro del curso.

-----------------------------------------------------------------------------------------------------------------------------------------------------
Te invito a que veas cualquiera de las clases que están gratuitas antes de comprar el curso y seguro que desearás ver el resto de este entrenamiento.
-----------------------------------------------------------------------------------------------------------------------------------------------------

Who is the target audience?
  • Quienes quieran crear su propia página web responsive.
  • Estudiantes de Diseño web.
  • Diseñadores y desarrolladores que web que necesitan aprender a crear páginas web que se adapten a cualquier dispositivo.
Compare to Other Web Design Courses
Curriculum For This Course
70 Lectures
15:32:58
+
Introducción al Responsive Web design
6 Lectures 51:25

Descargando archivos usados en este curso
00:04

¿Porqué tu Web debería ser Responsive?
07:32


Ingredientes del Responsive Web Design (parte 1)
16:51

Ingredientes del Responsive Web Design (parte 2)
13:38

Introducción al Responsive Web design
3 questions
+
Entendiendo y Configurando el VIEWPORT
3 Lectures 29:40

La meta etiqueta Viewport
10:20

Configurando el Viewport
06:52

Entendiendo y Configurando el VIEWPORT
3 questions
+
Entendiendo e Implementando las @Medias Queries
6 Lectures 42:08
Estructura de las @Media Queries
02:36

Definiendo los tipos de medios
09:18

Entendiendo width, min-width y max-width
07:29

Practicando el min-width y max-width
12:54

¿Donde definir los Medias Queries?
02:34

Creando puntos de corte (BreakPoints)
07:17

Entendiendo e Implementando las @Medias Queries
3 questions
+
Implementando Imágenes Responsive
7 Lectures 01:41:23
Imágenes Responsive con Max-width
14:31

Ventajas del uso de Max-width
11:11

Diferentes soluciones para la carga condicional de imágenes
07:30

Entendiendo la Dirección de Arte (Art Direction)
04:19

Sirviendo imágenes condicionales con Responsive-Images.js
21:50

Sirviendo imágenes condicionales con PictureFill
18:55

Sirviendo imágenes condicionales con CSS3
23:07

Implementando Imágenes Responsive
2 questions
+
Implementando fuentes Responsive
3 Lectures 44:11
Principios de la Tipografia Responsive
13:35

Tipografia fluida con EMs
22:38

Escalando el texto con Medias Queries
07:58

Implementando Fuentes Responsive
3 questions
+
Creando Menús Responsive
14 Lectures 03:16:22
¿Qué tipo de Menú Responsive debo usar?
04:54

Menú Responsive “Déjalo Fluir” parte 1
15:48

Menú Responsive “Déjalo Fluir” parte 2
16:14

Menú Responsive “Déjalo Fluir” parte 3
17:34

Menú Responsive “Déjalo Fluir” parte 4
04:11

Menú Responsive “Déjalo Fluir + Jquery” parte 1
15:13

Menú Responsive “Déjalo Fluir + Jquery” parte 2
15:29

Menú Responsive “Déjalo Fluir + Jquery” parte 3
09:10

Menú Responsive “En el Pié de página”
15:27

Menú Responsive "Lista Desplegable"
17:43

Menú Responsive “Deslizante Lateral” parte 1
18:19

Menú Responsive “Deslizante Lateral” parte 2
21:54

Menú Responsive “Desplegable” parte 1
15:42

Menú Responsive “Desplegable” parte 2
08:44
+
Creación de un Proyecto Web Responsive desde 0
24 Lectures 06:25:45
Descargando y personalizando HTML5 BoilerPlate
22:09

Analizando el Diseño en PSD
06:44

Escribiendo el HTML5 del encabezado
14:20

Escribiendo el HTML5 el Menú principal
07:43

Escribiendo el HTML5 del Slide de imagen
08:02

Escribiendo el HTML5 del bloque de Bienvenida
09:37

Escribiendo el HTML5 del contenido principal y del pie de página
12:47

Estilizando el Logo con CSS3
16:47

Implementando Íconos basados en Fuentes con Font Awesome
29:25

Estilizando la caja de búsqueda con CSS3
10:34

Estilizando los botones de redes Sociales con CSS3
14:50

Estilizando el Menú principal con CSS3
16:37

Estilizando la zona de Presentacion con CSS3 (parte 1)
16:12

Insertando fuentes Personalizadas
20:20

Estilizando la zona de Presentacion con CSS3 (parte 2)
17:52

Estilizando la Zona de Bienvenida con CSS3
20:34

Estilizando el contenido principal con CSS3
23:14

Estilizando el Pie de página con CSS3
02:27

Planificando la inserción de BreakPoints (Medias Queries)
22:25

Aplicando BreakPoint para pantallas medianas
20:20

Aplicando BreakPoint para pantallas medianas (parte 2)
23:52

Aplicando BreakPoint para pantallas pequeñas
21:38

Aplicando BreakPoint para pantallas enormes
17:05

Aplicando BreakPoint para pantallas enormes (parte 2)
10:11
+
Optimización de Recursos
4 Lectures 50:27
Carga condicional de imágenes con CSS3
23:22

Carga condicional de imagenes con JavaScript
14:02

Carga condicional de archivos basadas en el ViewPort
11:07

Comprimiendo nuestras hojas de estilo al máximo
01:56
+
Dando soporte a navegadores antiguos y Conclusiones
3 Lectures 31:38
HTML5Shiv, CSS3Pie y aplicación de estilos CSS solo para IE
18:41

Carga de Polyfills para implementar capacidades para navegadores obsoletos
11:03

Conclusiones finales
01:54
About the Instructor
Erick Mines
4.4 Average rating
2,550 Reviews
16,928 Students
9 Courses
WebMaster y CEO en Aulaideal.com

Erik Mines es un apasionado y experimentado diseñador web, desarrollador y apasionado por las últimas tecnologías provenientes Lima (Perú).

Llevo más de 8 años en del desarrollo web, específicamente en tecnologías HTML5, CSS3, jQuery, Responsive design y todo lo que tiene que ver en la web.

En la actualidad construye sitios web personalizados y ofrece soluciones de diseño para una amplia gama de clientes.