Edicion 2.0
- CURSO ONLINE -

Diseño web: HTML y CSS desde cero

Aprende a convertir tus diseños en sitios web
funcionales y responsive.

Ver planes y precios Ver

En este completo curso aprenderás lo necesario para maquetar tus propios sitios web, usando técnicas creativas para sacar el máximo provecho de tus diseños y hacerlos adaptables a los dispositivos móviles de navegación.

Aprenderás HTML y CSS, los dos lenguajes que son la base para crear cualquier sitio web. Esto es más que un curso sobre las versiones HTML5 y CSS3: es un curso sobre el uso de estos lenguajes de un modo integral y completo.

Conocerás los fundamentos para poder escribir tus propios códigos desde cero, y compartiré contigo mis trucos personales para aumentar la productividad y optimizar el desarrollo.

Sólo necesitas un dispositivo conectado a internet

No necesitas tener conocimientos previos de desarrollo web o programación, pues partiremos desde lo más básico, con ejemplos sencillos, e iremos avanzando hasta desarrollar habilidades avanzadas que te permitan crear sitios web completos y responsive a partir de un diseño creado por ti mismo o proporcionado por otro diseñador.

Contenidos del curso

Módulo 1 • 1 clase

Introducción

Conoceremos qué es el diseño web, el rol que cumplen los lenguajes HTML y CSS en la construcción de sitios web y de qué manera puede ayudarte el manejarlos.

Módulo 2 • 15 clases

Las bases del maquetado web

Partiendo desde lo más esencial, comenzaremos a aprender las bases de HTML y CSS (incluyendo las últimas versiones HTML5 y CSS3) y a aplicarlos mediante ejercicios prácticos.

Módulo 3 • 4 clases

Ejemplo real (página sencilla)

Llegó el momento de llevar a la práctica, en una página completa, toda la teoría que hemos aprendido hasta el momento.

Módulo 4 • 6 clases

Responsive design (diseño adaptable)

Actualmente, es indispensable contar con un sitio web adaptable y que presente una óptima navegación desde dispositivos móviles. Aquí aprenderemos cómo hacerlo.

Módulo 5 • 10 clases

Técnicas avanzadas

Existen técnicas que nos permitirán sacar el máximo provecho a nuestros sitios web y aquí las conoceremos. Entre ellas destacan los sprites CSS, las fuentes de íconos, el envío de formularios de contacto y el uso de SVG entre otros.

Módulo 6 • 15 clases

Técnicas avanzadas

Ya con la teoría y la experiencia de los ejercicios prácticos realizados en cada clase, ha llegado el momento de aplicar todo lo aprendido en un sitio web completo y funcional.

Módulo adicional • 10 clases

Las bases de LESS

Disponible en plan estándar y plan completo

Los preprocesadores nos permiten tener mayor fluidez al escribir y procesar CSS. En este caso, aprenderemos a usar LESS y a sacar provecho de sus funcionalidades base.

Módulo adicional • 14 clases

Implementando Bootstrap 3

Disponible en plan completo

Bootstrap 3 es el framework front-end más popular a la fecha, y en este módulo aprenderemos a implementarlo en nuestros proyectos, para agilizar nuestro flujo de trabajo.

Francisco Aguilera G.

Yo seré tu instructor

Hola, soy Francisco Aguilera G., Diseñador web con más de 8 años de experiencia y director creativo de APK Estudio. Mi trabajo diario es diseñar y desarrollar sitios web para clientes de todo tipo; gracias a ello, he desarrollado un método efectivo y rápido para la creación de sitios web personalizados y lo compartiré contigo en este curso.

Me encanta enseñar y compartir mi conocimiento con el mundo, por eso, constantemente publico artículos y tutoriales en mi blog FranciscoAMK.com. Además, soy el autor del exitoso curso Creación de Temas WordPress Profesionales y Dominando WordPress sin Programación.

Estás a un minuto de comenzar a
aprender HTML y CSS

Membresía AMK Pro
Acceso instantáneo El curso Diseño web: HTML y CSS Desde Cero es parte de la biblioteca de cursos a la que tienen acceso los miembros de AMK Pro. Únete ahora y accede de inmediato.
Únete por sólo USD $12/mes Accede ahora

Preguntas frecuentes

¿Tienes alguna otra pregunta? Solo escríbeme

¿Cómo accederé a las clases?
Una vez finalizada la compra, tendrás acceso al área de alumnos, en donde podrás ver las clases en video y hacer las consultas que tengas al pie de cada uno de ellos.
No tengo el dinero ahora, ¿puedo inscribirme después?
Los registros al curso seguirán abiertos permanentemente, sin embargo, los precios por oferta de lanzamiento sólo estarán disponibles por tiempo limitado.
¿Qué tal si no me gusta el curso? ¿Hay devoluciones?
Bueno, aunque estoy seguro de que te gustará mucho, si llegaras a sentir que el curso no es lo tuyo, tienes 10 días desde realizada la compra para hacérmelo saber y te devolveré el dinero sin preguntas.
¿Qué plan debería tomar?
Es algo que depende principalmente de tu presupuesto. El plan base contiene los contenidos básicos para poder desarrollar tus sitios, pero los módulos adicionales son una gran ayuda para hacer que tu trabajo sea más rápido y efectivo.

Dale una mirada al contenido de cada uno de los módulos y te será más fácil decidir cuál es tu plan ideal.
¿Qué puedo hacer si no tengo PayPal?
Si no tienes una cuenta PayPal, al momento de realizar el pago puedes crear una, sólo necesitarás ingresar los datos de tu tarjeta de crédito y todo debería funcionar bien.

Si no tienes tarjeta de crédito en dólares, te recomendaría conseguirla con algún familiar o amigo. También puedes realizar el pago vía Western Union, aunque tendrías que invertir un poco más en los gastos de operación.

Si quieres tomar el curso y estás en Chile, tendrás la posibilidad de realizar el pago mediante transferencia bancaria.

Temario Curso "Diseño web: HTML y CSS desde cero"

Introducción a la maquetación web

  1. Introducción (qué es HTML/CSS)

Las bases del maquetado web

  1. Primera página HTML
  2. Introducción a CSS
  3. Etiquetas de contenido HTML
  4. El elemento div
  5. Identificadores, clases y selectores jerárquicos
  6. Etiquetas de formulario
  7. Etiquetas semánticas HTML 5
  8. Insertando Imágenes
  9. Estructura de proyecto
  10. Principales propiedades CSS
  11. El modelo de caja
  12. Unidades de medida
  13. Posicionamiento con CSS
  14. Selectores avanzados
  15. Efectos CS
  16. Mejora progresiva

Ejemplo real (página sencilla)

  1. Ejercicio página sencilla: Maquetado del proyecto
  2. Ejercicio página sencilla: Desarrollando estilos generales
  3. Ejercicio página sencilla: Definiendo el layout
  4. Ejercicio página sencilla: Toques finales de diseño

Responsive design (diseño adaptable)

  1. Qué es el responsive web design
  2. Simulador de dispositivos (Google Chrome)
  3. Conociendo los media query
  4. Ejercicio página sencilla: Aplicando responsive
  5. Ejercicio página sencilla: CSS menú responsive
  6. Ejercicio página sencilla: JS menú responsive

Técnicas avanzadas

  1. Validando nuestro código
  2. Usando sprites CSS
  3. Imágenes SVG / PNG / JPG
  4. Servicios de fuentes
  5. Fuentes personalizadas con @font-face
  6. Font-awesome
  7. Columnas
  8. Insertando un slider
  9. Videos responsive con FitVids
  10. Enviando un formulario

Proyecto final

  1. Proyecto final: Analizando diseño y guía de estilos
  2. Proyecto final: Maquetar pantalla estándar
  3. Proyecto final: Creando plantilla de estilos base
  4. Proyecto final: Layout general
  5. Proyecto final: Exportando imagenes de photoshop
  6. Proyecto final: Estilos cabecera
  7. Proyecto final: Estilos de menu
  8. Proyecto final: Estilos pie de página
  9. Proyecto final: Página de Inicio (Parte 1)
  10. Proyecto final: Página de Inicio (Parte 2)
  11. Proyecto final: Página de Servicios
  12. Proyecto final: Página de Portafolio
  13. Proyecto final: Página de Contacto
  14. Proyecto final: SEO
  15. Proyecto final: Subiendo el sitio por FTP
  16. Proyecto final: Verificando que no haya errores

Conclusión

  1. Comentarios finales

Módulo adicional: "Las Bases de LESS"

  1. ¿Qué es less y para que sirve?
  2. ¿Cómo Less y Koala?
  3. Usando variables
  4. Indentando selectores
  5. Clases reutilizables (mixins)
  6. Operadores de colores
  7. Separación de archivos
  8. Sistema de columnas
  9. Media queries en less
  10. Reflexión final

Módulo adicional: "Implementando Bootstrap 3"

  1. ¿Qué es Bootstrap y para que sirve?
  2. Integrar Bootstrap en tu proyecto
  3. Columnas base
  4. Estilos de tabla
  5. Formularios / input-groups
  6. Botones
  7. Alertas
  8. Tabs
  9. Modals
  10. Tooltips y popovers
  11. Collapse
  12. Carrusel
  13. Personalizar Bootstrap
  14. ¿Es Bootstrap para mi?