Los 3 Proyectos Principales de este curso
  • El Proyecto Final de Este Curso - Sitio Web Completo con Pagos en PayPal y Admin
  • UpTask - Administrador de Proyectos hecho en HTML5, CSS3, JS, Ajax, PHP y MySQL
  • Agenda de Contactos con PHP, MySQL y Ajax, ES6, CSS Grid y Flexbox
Introducción al Desarrollo y Diseño Web Web
  • Introducción al Curso
  • Distintas Áreas del Diseño Web
  • Estructura básica de un sitio web
  • El rol de HTML
  • El rol de CSS
  • El rol de JavaScript
  • El rol de PHP y MySQL
  • Plan para el Curso
Editores de Texto
  • Porque instalar un Editor de Texto
  • Instalando Sublime Text 3 en Windows 10
  • Instalando Microsoft Visual Studio Code en Windows
  • Instalando ATOM en Ubuntu
  • Instalando y Como Utilizar Adobe Brackets
Introducción a HTML - Textos - Creando un Proyecto de Bienes Raices
  • Lo que Vamos a Construir en los Próximos Videos
  • Primeros pasos con HTML, crear archivos y las distintas partes de HTML
  • Textos en HTML - Encabezados
  • Textos en HTML - Parrafos
  • Creando el Texto HTML del proyecto Bienes Raices (Parte 1 de 2)
  • Creando el Texto HTML del proyecto Bienes Raices (Parte 2 de 2)
  • Enlaces en HTML
Introducción a HTML - Imágenes - Creando un Proyecto de Bienes Raices
  • Agregando el Logotipo e Iconos Principales
  • Agregando las imágenes de los anuncios
Introducción a HTML - Estructurar Contenido - Proyecto de Bienes Raices
  • Primeros Pasos Estructurando el Contenido
  • Definiendo el Contenido Principal con HTML
  • Creando el Footer y otras secciones del proyecto
Introducción a CSS - Primeros Pasos con CSS
  • CSS, donde colocarlo, primeros pasos y estilos
  • Seleccionando Etiquetas, Classes y ID's
Introducción a CSS - Creando el Header del Proyecto de Bienes Raices
  • Definiendo el Header con Imagen de Fondo
  • Creando un Contenedor Principal
  • Posicionando el Menú, Colores a los enlaces y alineando el Logotipo
  • Agregando una fuente de Google Fonts
  • Normalize para Resetear el CSS por default
  • Reemplazando medidas en Pixeles con Rems
  • Posicionando el Nombre del Sitio Web y CSS a los Headings
Introducción a CSS - Creando la Sección Nosotros del Proyecto de Bienes Raices
  • Mostrando el Contenido en 3 columnas
  • Creando algunas utilidades para las secciones y textos
Introducción a CSS - Creando los Anuncios del Proyecto de Bienes Raices
  • Primeros pasos en la sección de Anuncios e imágenes Responsive
  • CSS al contenido de los Anuncios
  • Estilos a los Botones, Precios en los Anuncios
  • Continuando con los Estilos de los Botones y Box Sizing
  • Finalizando los Botones
  • Creando la Imagen de Contacto
  • Ajustando los Iconos de los Anuncios
Introducción a CSS - Finalizando la Página Principal del Proyecto Bienes Raices
  • Primeros pasos en el CSS del Blog
  • Finalizando el Blog
  • Estilos al Testimonial
  • Finalizando la página Principal
HTML y CSS - Creando el Proyecto de Bienes Raices - Página de Nosotros
  • Agregando el HTML de la página de Nosotros
  • CSS A la página de Nosotros
HTML y CSS - Creando el Proyecto de Bienes Raices - Página de Propiedades
  • Creando el HTML y ajustando el CSS
  • Creando la Página para Mostrar Una Propiedad
HTML y CSS - Creando el Proyecto de Bienes Raices - Página de Blog
  • Creando la página de Blog
HTML y CSS - Creando el Proyecto de Bienes Raices - Página de Contacto
  • Creando la Página de Contacto y Formularios, Textos y Labels
  • Agregando más Campos - Tipo Email y Submit
  • Creando un área de texto y agrupando los campos
  • Creando un campo para seleccionar opciones (Select) y Cantidades
  • Radio Buttons y checkbox
  • Inputs de Fecha y Hora y otros tipos de campos
HTML y CSS - Creando el Proyecto de Bienes Raices- CSS al Formulario de Contacto
  • Primeros Estilos a los Inputs y Selector de Atributo
  • Finalizando el CSS del formulario
HTML y CSS - Deployment del Proyecto
  • Deployment a Netlify Gratis
Responsive Web Design y Media Queries
  • Qué es Responsive web design
  • Sitio Responsive sin Media Queries
  • Introducción a Media Queries
  • Media Queries Desktop First
  • Media Queries Mobile First
Patrones de Diseño Responsive Web Design con CSS Grid y Flexbox
  • 2 Columnas Iguales - CSS Grid
  • 2 Columnas Iguales - Flexbox
  • 3 Columnas Iguales - CSS Grid
  • 3 Columnas Iguales - Flexbox
  • Cómo agregar más elementos al diseño
  • 3 Columnas (Una mas grande) - CSS Grid
  • 3 Columnas (Una mas grande) - Flexbox
  • Column Drop - CSS Grid
  • Column Drop - Flexbox
  • Contenido Principal y Sidebar - CSS Grid
  • Contenido Principal y Sidebar - Flexbox
  • Layout Shifter - CSS Grid