Convierte diseños hechos en Photoshop a HTML5 y CSS3

Aprende a pasar tus diseños web de photoshop de una manera fácil y efectiva a los lenguajes de código HTML5 y CSS3
0.0 (0 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.
13 students enrolled
$19
$20
5% off
Take This Course
  • Lectures 18
  • Length 2.5 hours
  • Skill Level Beginner Level
  • Languages Spanish
  • Includes Lifetime access
    30 day money back guarantee!
    Available on iOS and Android
    Certificate of Completion
Wishlisted Wishlist

How taking a course works

Discover

Find online courses made by experts from around the world.

Learn

Take your courses with you and learn anywhere, anytime.

Master

Learn and practice real-world skills and achieve your goals.

About This Course

Published 2/2016 Spanish

Course Description

¿DE QUÉ SE TRATA EL CURSO?

Cuando diseñas páginas web, debes crear tus diseños en programas gráficos como photoshop o illustrator. La pregunta es ¿Cómo paso mis diseños a un lenguaje de marcado HTML y a hojas de estilo CSS?. Si te has hecho esta pregunta, este curso es para ti. En este curso aprenderás a pasar tus diseños hechos en photoshop a lenguajes de maquetación web HTML5 y CSS3 de una manera fácil y efectiva.

¿CÓMO ES EL CURSO?

Utilizando el método de las ayudas visuales, la maquetación de cajas principales e internas para elaborar un correcto wireframe, y finalmente integrando los elementos gráficos realizaremos así la estructura del sitio web para internet en el lenguaje de marcado HTML5 y hojas de estilo CSS3.

En este curso podrás descargar una carpeta donde está todo el material necesario para la elaboración del mismo.

¿CUÁNTO SE TARDA EN COMPLETAR EL CURSO?

Depende de ti. Estimo que menos de una semana puedes completar el curso, pero dependerá de tu ritmo de trabajo y de tu disponibilidad.

¿CUÁLES SON LOS REQUISITOS?

Descargar el material que se encuentra en los recursos de la clase 1.

¿A QUIÉN VA DIRIGIDO ESTE CURSO?

Diseñadores gráficos, visuales, artistas, desarrolladores

Empresas y emprendedores

Cualquier persona que quiera tener una página web

What are the requirements?

  • Descargar el material de trabajo del curso, lo entregaremos en la clase 1. Ver los cursos gratuitos introductorios de HTML5 y CSS3 en Tutoriales a tu Alcance.

What am I going to get from this course?

  • Diseñar páginas web en HTML5 y CSS3 desde un diseño hecho en Photoshop.

What is the target audience?

  • Este curso va dirigido a todas las personas que diseñen páginas web en photoshop y las deseen pasar al lenguaje de código web HTML5 y CSS3.

What you get with this course?

Not for you? No problem.
30 day money back guarantee.

Forever yours.
Lifetime access.

Learn on the go.
Desktop, iOS and Android.

Get rewarded.
Certificate of completion.

Curriculum

Section 1: Maquetación Web
04:00

En esta clase te doy la bienvenida a este curso de Convierte diseños en Photoshop a HTML5 y CSS3, mostrándote el archivo base con el cual trabajaremos durante todo el curso. Recuerda descargar la carpeta comprimida de medios_maquetación_web_Tutoriales_a_tu_alcance.zip

07:26

Comenzaremos a maquetar nuestro sitio web gracias a las ayudas visuales que traeremos del archivo de photoshop.

06:39

Continuaremos editando los archivos html5 y css3 para la ubicación de nuestras ayudas visuales.

09:13

En esta clase comenzaremos a ubicar las cajas principales de acuerdo a las ayudas visuales que colocamos anteriormente en las hojas de estilo.

08:10

En esta clase finalizaremos la ubicación de las cajas principales para continuar con la ubicación de las cajas internas.

10:00

En esta clase, comenzaremos a ubicar las cajas internas que están dentro de cada caja principal en nuestra maquetación web.

09:18

En esta clase continuaremos agregando estilo a las cajas internas.

09:30

Continuamos con la ubicación de las cajas internas dentro de las cajas principales. Aprenderás varios trucos de maquetación en estas clases de creando las cajas internas.

07:19

Finalizamos las clases de crear las cajas internas, ahora, a integrar el diseño.

Section 2: Integración del Diseño
08:41

En las próximas clases a continuación, comenzaremos a integrar los elementos gráficos que compone nuestro diseño web hecho en photoshop.

08:50

Continuamos la integración del diseño de la sección de la página de inicio.

08:09

En esta clase finalizamos la integración del diseño de la página de inicio. En las próximas clases continuaremos con las otras secciones del sitio web.

Section 3: Terminando de integrar las otras secciones
09:01

Comenzaremos a organizar las secciones que quedan faltando de nuestro sitio web, comenzando por la sección de Quienes Somos.

09:19

Hemos aprendido a organizar estéticamente un artículo compuesto por título, imagen y párrafo con CSS3.

08:36

En esta clase aprenderemos a organizar una galería de imágenes con HTML5 y CSS3.

08:11

Gracias a las ayudas visuales nuevamente hemos logrado organizar la galería de imágenes.

09:28

En esta clase aprenderemos a organizar un formulario de envío de acuerdo a un diseño preestablecido.

04:13

Hemos culminado este curso de Convertir un diseño hecho en Photoshop a HTML5 y CSS3 exitosamente. Los invito a que vean más cursos gratuitos en la página web de Tutoriales a tu Alcance. También los invito a que vean el próximo curso de esta secuela de Desarrollo Web llamado "Aprende a crear Animaciones y Efectos Interactivos con CSS3" sin usar JavaScript. Feliz Diseño!

Students Who Viewed This Course Also Viewed

  • Loading
  • Loading
  • Loading

Instructor Biography

Docente Juan Fernando Urrego, Diseñador Visual y Desarrollador Web

Mi nombre es Juan Fernando Urrego, soy profesional en Diseño Visual y Especialista en Administración de la Informática Educativa. Dedicado tiempo completo a la docencia en Desarrollo Web, Diseño Interactivo, Animación 3D e Ilustración. Fundador del portal de cursos Tutoriales a tu Alcance. Soy un convencido de que la internet es la oportunidad del conocimiento, la educación y los empleos del futuro.

Ready to start learning?
Take This Course